@charset "utf-8";
/*
Template Name: Chillaid
Author: <a href="https://www.os-templates.com/">OS Templates</a>
Author URI: https://www.os-templates.com/
Copyright: OS-Templates.com
Licence: Free to use under our free template licence terms
Licence URI: https://www.os-templates.com/template-terms
File: Layout CSS
*/


@import url("fontawesome-free/css/fontawesome-all.min.css");
@import url("framework.css");

/*@media screen and (max-width: 479px) {
#introblocks {
    display: none;
}
#pageintro {
        display: none;
    }
}*/

.formtext img {
    padding: 59px 0px 0px 50px;
}
.privacy {
    padding: 10%;
}
#math {
  margin: auto;
    margin-top: auto;
  margin-top: 10px;
}
@media screen and (max-width: 538px) {
.container.flex.footimg span {
    display: none;
}}

.footimg img {
    max-height: 50px;
    padding-bottom: 0 !important;
}
.container.flex.footimg {
    justify-content: space-between;
}

.well {
  border: 2px blue dotted !important;
}

#problema {
  border: 1px solid #d6d6d6 !important;
}

.menu__bottom li {
  padding: 1px 0;
}

.bybit a.col .img-box img:hover {
  opacity: 0.7;
}
.bottom-text:hover {
  color: #469fed;
}

.heading2 {
  text-align: center;
  padding: 1.5em;
  font-size: 200%;
  font-weight: bold;
}
.heading span {
  text-transform: uppercase !important;
}
.rayonss a {
  color: white;
}
.rayonss a:hover {
  color: #c9c6c6;
}
.rayon {
  width: 23%;
  float: left;
  background: #4560e7;
  text-align: center;
  margin: 1%;
  padding: 10px;
  border-radius: 10px;
  font-weight: bold;
  font-family: Georgia, "Times New Roman", Times, serif;
}
@media (max-width: 730px) {
    .rayon {
  width: 48%;
}}

@media (max-width: 380px) {
 .rayon {
    width: 90%;
    margin: 1% 5%;
  }}

.kolenfoto {
  width: 49%;
  float: left;
  margin: 0.5% !important;
}

@media (max-width: 470px) {
.kolenfoto {
  width: 98%;
  float: none;
  margin: 2% !important;
}}

.facheck {
  padding-bottom: 10px;
  font-size: 170% !important;
  font-weight: bold;
}
.facheck::before {
  color: #000;
  content: '\f14a';
  font-family: FontAwesome;
  margin-right: 5px;
}

.delivery h2 {
  font-size: 200%;
  text-align: center;
  padding-bottom: 30px;
  font-weight: bold;
}

.delivery p {
  font-size: 120%;
  line-height: 1.5;
}

.callback>.container {
    display: flex;
    align-items: center;
    height: 100%;
}

.callback {
    height: 350px;
}

.callback .col__left .title {
    font-weight: 600;
    color: #ffffff;
    line-height: 1;
    margin: 0 0 10px 0;
    padding-right: 50px;
}

.callback .col__right {
    width: 50%;
    height: 195px;
    position: relative;
    padding-left: 75px;
}

.callback .col__left .btn-box .subtext-btn {
    margin-left: 18px;
}

.callback .col__right .title {
    font-weight: 600;
    color: #ffffff;
    line-height: 1;
    margin: 0 0 15px 0;
}

.callback .col__left {
    width: 50%;
    height: 195px;
    position: relative;
    border-right: 1px solid #D4DCE5;
}
.callback .col__left .subtext {
    color: #9F9F9F;
    line-height: 1.4;
    padding-top: 20px;
}
.callback .col__left .btn-box {
    margin: 20px 0 0 0;
    display: flex;
    align-items: center;
}


.contacts__phone-line.container-b {
  background: #4560e7;
    background-size: auto;
  background-size: auto;
  background-size: cover;
}

.col__left.call_phone_2 {
  width: 100%;
}

.contacts__phone-line > .container {
  display: flex;
  align-items: center;
  height: 152px;
}
.contacts__phone-line a {
  font-weight: 600;
  font-size: 55px;
  color: #fff;
  display: block;
}
.contacts__phone-line .col__right {
  width: 50%;
}

.contacts__phone-line .col__right .text {
  font-size: var(--normal-text-fs);
  color: #D4D0D0;
  line-height: 1.4;
  position: relative;
  padding-top: 18px;
}

.contacts__phone-line .col__right .text::before {
  content: '';
  position: absolute;
  top: 0;
  display: block;
  width: 50px;
  height: 2px;
  background: #54b6fe;
}


@media (max-width: 770px) {
.contacts__phone-line > .container {
    flex-wrap: wrap;
    justify-content: center;
}

.contacts__phone-line a {
    font-size: 160%;
}

.contacts__phone-line .col__right {
    width: 70%;
}
.col__left.call_phone_2 {
    width: 70%;
}

.callback > .container {
  display: block;
}

.callback .col__left {
  width: 100%;
  border-right: none;
  height: auto;
}

.callback .col__right {
  width: 100%;
  padding-left: 0;
  border-top: 1px solid #D4DCE5;
  margin: 35px 0;
  height: auto;
}
.callback .col__left .title {
  margin: 0;
  padding: 20px 0;
}

.callback .col__right .title {
  margin: 0;
  padding: 30px 0;
}
.callback {
  height: auto;
}

}


img.logotips {
    max-width: 150px;
    padding-bottom: 20px;
}

.logointro {
  font-size: 150%;
  line-height: 1.6;
}

.backnewtext img {
    display: block;
  position: absolute;
  bottom: 0;
  left: 0%;
  color: white;
  top: 4%;
  width: 20%;
}
@media (max-width: 550px) {
.backnewtext img {
  position: relative;
}
}

.backnewtext h1 {
    padding-bottom: 10px;
}

.modalboxs {
  color: black !important;
  max-width: 100% !important;
}

.container1 {
    margin: 0 6%;
}

@media (max-width: 1024px) {
.container1 {
  margin: 0 2%;

}}


.tab-container{
  background-color: #4560e7;
  border-radius: 3px;
  overflow: hidden;
}
.tab-title{
    color: #fff;
    margin: 10px auto;
    text-align: center;
    padding: 20px 0px;
}
.tab-wrapper{
    width: 96%;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    margin: auto;
}
.tab-wrapper .tab-item,
.tab-wrapper input{display: none;}
.tab-wrapper .tab-item{
    width: 90%;
    max-width: 100%;
    padding: 20px;
    order: 1;
    color: white;
    margin: auto;
  }
.tab-wrapper label{
    /*height: 35px;*/
    line-height: 35px;
    min-width: 50px;
    padding: 0px 20px;
    text-align: center;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    cursor: pointer;
}
.no-select{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.tab-wrapper input:checked + label{
    background: white;
    color: black !important;
}
.tab-wrapper input:checked + label + .tab-item{display: block;}

.tab-h3 {
    padding: 20px 0px;
}




.footermail a::before {
  color: #FFF;
  content: '\f0e0';
  font-family: FontAwesome;
  font-size: var(--mini-text-fs);
  margin-right: 3px;
}
.footermail a {
  color: white;
}
.footermail a:hover {
  color: #fadfdf;
}
.footermail {
  padding-top: 10px;
}

.section-howto {
    padding-top: 0;
}
.section-bgwhite {
    background-color: #fff;
}
.sectionp {
    padding: 50px 0;
    position: relative;
}
.row-howto {
    background: #4f5d75;
    border-radius: 1rem;
    padding: 25px;
    -webkit-transition: .2s;
    transition: .2s;
    box-shadow: 1px 4px 9px rgb(48 66 117 / 13%);
}
.row-howto .section-titletext {
    text-align: center;
    color: #fff;
    margin-bottom: 25px;
}
.row-howto .section-titletext .section-title {
    color: #fff;
}
.section-title {
    font-size: 36px;
    color: var(--text);
    font-weight: 700;
    line-height: 1.25;
}
.howtpelement {
    background: #fff;
    border-radius: 1rem;
    padding: 15px;
    margin-bottom: 20px;
    box-shadow: 1px 4px 9px rgb(48 66 117 / 13%);
    display: flex;
    flex-direction: row;
    align-items: center;
}
.howtpelement img {
    width: 55px;
    margin-right: 15px;
}
.howtpelement p {
    margin-bottom: 0;
    line-height: 1.4em;
}

@media (min-width: 1142px) {
    .col-lg-z {
        flex: 0 0 auto;
        width: 25%;
    }
}

@media (max-width: 1142px) {
    .col-lg-z {
        width: 100%;
    }
}

.row-howto .section-titletext {
    text-align: center;
    color: #fff;
    margin-bottom: 25px;
}

@media (min-width: 1142px) {
    .col-lg-12 {
        flex: 0 0 auto;
        width: 100%;
    }
}
.row-howto {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1* var(--bs-gutter-y));
  margin-right: calc(-.5* var(--bs-gutter-x));
  margin-left: calc(-.5* var(--bs-gutter-x));
}

.col-lg-z {
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x)* .5);
  padding-left: calc(var(--bs-gutter-x)* .5);
  margin-top: var(--bs-gutter-y);
}






.breadcrumbs a::after {
  content: '';
  background: url(/images/ico-breadcrumbs-arrow.png) no-repeat center top 4px;
  display: inline-block;
  width: 6px;
  height: 14px;
  margin: 0 10px 0 13px;
  position: relative;
}
.breadcrumbs {
  padding-top: 10px;
}

.pb {
  padding-bottom: 5em !important;
}
.pt {
  padding-top: 5em !important;
}
.invalid-feedback {
  color: red;
      text-align: center;
}

.owl-prev {
  position: absolute;
  top: 30%;
  left: 5px;
  background: url(/images/arrow_prev_circle.png)left top no-repeat !important;
  width: 31px;
  height: 31px;
}

.owl-next {
  position: absolute;
  top: 30%;
  right: 5px;
  background: url(/images/arrow_next_circle.png)left top no-repeat !important;
  width: 31px;
  height: 31px;
}

ul.main-menu li.active a {
  color: black;
  background: #fff;
}

nav.main-menu {
    position: relative
}

nav.main-menu>.container {
    position: static
}

ul.main-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    margin: 0 -20px 0 -20px;

}

ul.main-menu>li>a {
    font-weight: 600;
    font-size: var(--normal-text-fs);
    padding: 0 10px;
    color: #fff;
    display: inline-block;
    line-height: 52px;
    transition: all ease 0.2s;
    position: relative;
}
/*ul.main-menu>li.drop:hover>a {
    background: #E9ECF0;
    z-index: 3;
    color: #9F9F9F
}*/
ul.main-menu>li.drop>a {
    padding: 0 12px
}


.main-menu-drop {
    visibility: hidden;
    opacity: 0;
    z-index: -5;
    transition: all ease 0.2s;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #fff;
    padding: 40px 0 45px 0;
    border-top: 1px solid #E9ECF0;
    box-shadow: 0 10px 50px rgba(128, 141, 159, .5)
}

.show .main-menu-drop {
    visibility: visible;
    opacity: 1;
    z-index: 4
}

.main-menu-drop .container {
    display: flex
}

.main-menu-drop-left {
    width: 100%;
    display: flex;
    flex-wrap: wrap
}

.main-menu-drop-right {
    width: 23%;
    padding: 0 0 0 75px;
    display: flex;
    align-items: center;
    border-left: 1px solid #D4DCE5
}

.main-menu-drop-right .title {
    font-weight: 600;
    font-size: var(--big-text-fs);
    color: #320b86;
    line-height: 1;
    margin: 0 0 20px 0
}

.main-menu-drop-right ul li {
    display: block;
    margin: 0 0 12px 0
}

.main-menu-drop-right ul li a {
    font-size: var(--small-text-fs);
    color: #9F9F9F;
    line-height: 1;
    transition: all ease 0.2s
}

.main-menu-drop-close {
    width: 24px;
    height: 24px;
    position: absolute;
    top: 25px;
    right: 25px;
    background: url(/img/ico-modal-close-dark.png) no-repeat;
    cursor: pointer
}

.main-menu-level-1 {
    display: flex;
    flex-wrap: wrap
}

.main-menu-level-1 .col {
    padding-bottom: 70px;
    display: block;
    width: 198px;
    text-align: center;
    margin: auto;
}

/*.main-menu-level-1 .col:nth-child(4n) {
    width: 235px
}*/

.main-menu-level-1 .col .img-box {
    display: flex;
    justify-content: center;
    align-items: center
}

.main-menu-level-1 .col .img-box img {
    vertical-align: bottom
}

.main-menu-level-1 .col .title {
    height: 3em;
    font-weight: 300;
    font-size: var(--small-text-fs);
    color: #320b86;
    line-height: 1.2;
    text-transform: uppercase;
    margin: 0 0 20px 0;
    padding: 0 15px;
    transition: all ease 0.2s
}

.main-menu-level-1 .col .title span {
    display: inline-block;
    position: relative
}

.main-menu-level-1 .col .title span:after {
    content: '';
    display: inline-block;
    position: absolute;
    width: 5px;
    height: 10px;
    background: url(/img/ico-right-tabs.png) no-repeat;
    margin: 4px 0 0 7px
}

.main-menu-level-1 .col .img-box {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 160px;
    height: 135px;
    margin: 0 auto;
}

:root {
    --h1_fs: 48px;
    --h2_fs: 36px;
    --big_text_fs: 20px;
    --normal_text_fs: 18px;
    --small_text_fs: 16px;
    --mini-text-fs: 13px;
}

@media screen and (max-width: 550px) {
.headmodelsimgb.hoc.container {
  background-size: 100% !important;
}}


.main-menu-level-1 .col .title span {
    display: inline-block;
    position: relative;
    height: 45px;
}
.main-menu-level-1 .col .img-box img{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.container {
    padding: 0 1em;
}

ul.main-menu {
    display: none;
}

.main-menu.main-menu-js.menu_for_open.open-menu {
    display: block;
    text-align: center;
    transition: display 0.5s;
}

ul.main-menu > li > a {
    font-size: var(--small-text-fs);
    width: 100%;
}

.burger-button {
    width: 3rem;
    height: 3rem;
    border-radius: 5px;
    cursor: pointer;
    margin-left: 10px;
    position: relative;
}

.burger-button i {
    font-size: var(--big-text-fs);
    color: #fff;
    margin-top: 11px;
    z-index: 9999999;
  position: absolute;
}

.logo-text .city-block {
    position: relative;
    display: inline-block;
}

.logo-text-mob {
    position: absolute;
  top: 5px;
  right: 12px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1;
  padding: 0 5px;
  font-size: 86%;
  left: 24px;
}


.city-block-dropdown {
    display: none;
    transition: all ease 0.2s;
    position: absolute;
    margin-top: 15px;
    z-index: 10;
    left: 0;
    width: 500px;
    background: #efefef;
    padding: 1em;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.23);
    color: #777;
    max-height: 390px;
    overflow-y: auto;
}

@media screen and (max-width: 650px) {
.city-block-dropdown {
  width: 340px;
}
}
.city-block-dropdown-footer {
    top: 76%;
}

.city-block-dropdown li:hover {
    text-decoration: underline;
    color: #555;
}

.active1 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.active1 li{
    width: 33.33%;
    text-align: center;
    padding: 5px 0;
}

.city-block-select{
    cursor: pointer;
    display: inline-block;
}

.city-block-select:after {
    color: #B7B7B7;
    content: '\f0d7';
    font-family: FontAwesome;
    font-size: var(--mini-text-fs);
    margin-left: 3px;
}
.open-cities:after {
    color: #B7B7B7;
    font-family: FontAwesome;
    content: '\f0d8';
    font-size: var(--mini-text-fs);
    margin-left: 3px;
}



.city-block-select span {
    border-bottom: 1px solid #B7B7B7;
}
nav.main-menu {
  position: relative;

}
@media screen and (min-width: 991px) {

    .for-mob {
        display: none;
    }
    ul.main-menu {
        display: flex;
    }
    .burger-button {
        display: none;
    }
    .logo-text-mob {
        display: none;
    }}

span.big a {
    color: white;
}

@media screen and (max-width: 479px) {
  .logo-text{
    display: none;
  }
}
/*@media screen and (min-width: 479px) {
  .logo-text-mob {
    display: none;
  }}*/

@media screen and (max-width: 990px) {
  .main-menu-drop {
    top: 8em;
  }
}


footer .line-title {
    background: #4560e7;
}

.titlefoot {
    color: beige;
    padding-bottom: 10px;
}

.flex {
    display: flex;
    align-items: center;
    height: 52px;
}

@media screen and (max-width: 766px) {
    .flex {
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        width: 100% !important;
        padding: 5px 10px !important;
    }
}

@media screen and (max-width: 479px) {
    footer .line-title h3 {
        font-size: var(--small-text-fs);
    }
}



footer .menu__bottom {
    padding: 45px 0 30px 0;
    display: flex;
    justify-content: space-between;
}


footer .menu__bottom .col__left .col ul.menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}

footer .menu__bottom .col__left .col ul.menu li {
    width: 33%;
}

footer .menu__bottom .col__right {
    width: 30%;
    float: left;
    text-align: right;
}

@media screen and (max-width: 479px) {
    footer .menu__bottom {
        padding: 45px 10px 30px 20px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media screen and (min-width: 479px) and (max-width: 766px) {
    footer .menu__bottom {
        padding: 45px 10px 30px 20px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media screen and (min-width: 479px) and (max-width: 991px) {
    footer .menu__bottom .col__left .col ul.menu li {
        width: 47%;
    }
}

@media screen and (max-width: 479px) {
    footer .menu__bottom .col__left .col ul.menu li {
        width: 100%;
    }
}

@media screen and (max-width: 479px) {
    footer .menu__bottom .col__left, footer .menu__bottom .col__right {
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
}

@media screen and (min-width: 479px) and (max-width: 766px) {
    footer .menu__bottom .col__left .col ul.menu {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        width: 100%;
    }
}

@media screen and (min-width: 479px) and (max-width: 766px) {
    footer .menu__bottom .col__left, footer .menu__bottom .col__right {
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
}
@media screen and (min-width: 479px) and (max-width: 766px) {
    footer .menu__bottom .col__left {
        flex-wrap: wrap;
    }
}
@media screen and (min-width: 479px) and (max-width: 766px) {
    footer .menu__bottom .col__left .col:nth-child(1) {
        width: 100%;
    }
}












/* Rows
--------------------------------------------------------------------------------------------------------------- */
.row0, .row0 a{}
.row1, .row1 a{}
.row2, .row2 a{}
.row3, .row3 a{}
.row4, .row4 a{}
.row5, .row5 a{}

::-webkit-input-placeholder {color:#ccc;}
::-moz-placeholder          {color:#ccc;}/* Firefox 19+ */
:-moz-placeholder           {color:#ccc;}/* Firefox 18- */
:-ms-input-placeholder      {color:#ccc;}

/* Header
--------------------------------------------------------------------------------------------------------------- */
#header{background: black; height: 80px;}
.headstylew {
  padding: 16px;
}
@media screen and (min-width: 420px){
.headstylew {
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1110px;
}}

@media screen and (min-width: 479px) and (max-width: 766px) {
.logo-text {
  font-size: 85%;
  width: 200px;
  line-height: 1.3;
}
 .head__text {
  font-size: 80%;
}}

.backnewtext {
  padding: 10px;
  border-radius: 5px;
  background-color: rgba(255,255,255,0.8);
}

/* CSS для сетки меню */
#mainNav {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(25%, 1fr));
  margin-bottom: 2em;
}

@media screen and (max-width: 978px){
    #mainNav {
  grid-template-columns: repeat(auto-fill, minmax(33%, 1fr));  
}}

@media screen and (max-width: 678px){
    #mainNav {
  grid-template-columns: repeat(auto-fill, minmax(50%, 1fr));  
}}
@media screen and (max-width: 478px){
    #mainNav {
  grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));  
}}
/* Стили для каждого элемента в сетке */
.bybit a.col {
  text-align: center; 
  text-decoration: none; 
  color: #000; 
  padding: 3em;
  outline: #e3e3e3 1px solid;
}


.bybit a.col .img-box img {
  max-width: 80%; 
}

.bottom-text {
  color: #0101ca;
  font-weight: bold;
  padding-top: 1.5em;
}
.bottom-texts {
  color: #adaaaa;
  padding: 2em 0;
}

.bybit a.col .bottom-text {
  margin-top: 10px; 
}

/* CSS для сетки меню */

    
.newtext p {
  color: darkblue;
}
.phone {
  font-weight: 600;
  white-space: nowrap;
  color: darkblue;
}

@media screen and (max-width: 420px) {
  #header #logo {
    margin: 0 0 15px 0;
    width: 100%;
    float: left;
    text-align: center;
    display: block;
  }
.logoname {
  margin: 0;
}
#phone {
  margin: 0 0 15px 0;
  width: 100%;
  float: left;
  text-align: center;
  display: block;
}
#header {
  background: black;
  height: auto;
}}
@media screen and (min-width: 479px){
  .logo-text-mob {
    display: none;
  }
}
/* form */


@font-face {
  font-family: "TTNorms";
  src: url(font/TTNorms-Medium.otf);
}
@font-face {
  font-family: "OpenSans";
  src: url(font/OpenSans.ttf);
}
* {
  box-sizing: border-box;
  font-family: "OpenSans";
  padding: 0;
  margin: 0;
}
a {
  text-decoration: none;
  color: black;
}
li {
  list-style-type: none;
}

.modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    z-index: 99998;
    background-color: rgba(0, 0, 0, .3);
    display: grid;
    align-items: center;
    justify-content: center;
    overflow-y: auto;
    visibility: hidden;
    opacity: 0;
    transition: opacity .4s, visibility .4s;
}
.modal-box {
    position: relative;
    max-width: 500px;
    padding: 45px;
    z-index: 1;
    background-color: white;
    margin: 30px 15px;
    transform: scale(0);
    transition: transform .8s;
    border-radius: 10px;
}
.modal-close-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    border: none;
    background-color: transparent;
    padding: 5px;
}
.modal-close-btn svg path {
    transition: fill .4s;
}

.modal-close-btn:hover svg path {
    fill: rgb(255, 203, 87);
}

.modal-close-btn:active svg path {
    fill: rgb(186, 53, 0);
}
.modal.open {
    visibility: visible;
    opacity: 1;
}
.modal.open .modal-box {
    transform: scale(1);
}


.titleform {
  font-size: 200%;
  font-weight: bold;
  color: cornflowerblue;
  text-align: center;
  padding-bottom: 1em;
}

.modal-box p {
  padding: 0 5%;
}


.container {
  max-width: 1110px;
}
.container {
  width: 100%;
  margin: 0 auto;
  position: relative;
}



















.btn.btn-primary {
  cursor: pointer;
}

input {
  border: 1px solid #ccc !important;
}
.title {
  text-align: center;
  font-size: 200%;
  font-weight: 600;
  color: #047ba0;
  line-height: 1;
  margin: auto;
}
  dialog {
  border: none;
  border-radius: 10px;
}

#show-modal-btn {
  color: #FFFFFF;
  background-color: #97A9BD;
  border-color: #97A9BD;
  display: inline-block;
  padding: 8px 18px 10px;
  text-transform: uppercase;
  border: 1px solid;
  cursor: pointer;
}
#close-modal-btn {
  cursor: pointer;
}
@media screen and (max-width: 801px){
 .formtext img{
  display: none;
}
 .formform {
  width: 100%;
  padding-bottom: 5em;
}
.form1 {
  margin-bottom: 5em;
}}
@media screen and (min-width: 801px){
.formform {
  width: 50%;
  float: left;
  /*padding: 2em !important;*/
}}
.formtext {
  width: 50%;
  float: left;
}
.form1 {
  background: #56b0ff;
  margin: 20px auto;
}
@media screen and (max-width: 801px){
.form1 {
  margin-bottom: 5em;
}}
.linef {
  width: 80%;
  margin: 1.5em auto 0 auto;
  border-radius: 5px;
  padding: 10px;
}
.line3 {
 width: 100%;
margin: 10px 0px;
height: 40px;
border-radius: 3px;
padding: 5px;
}
.btn3 {
  height: 46px;
  line-height: 46px;
  padding: 0 25px 0 25px;
  font-weight: 600;
  color: #fff;
  border-radius: 2px;
  cursor: pointer;
  display: inline-block;
  transition: all ease 0.2s;
  background: #2a5b8c !important;
}
.mb-3 {
  text-align: center;
}
.btn-primary {
  border-radius: 5px;
  background: #2a5b8c !important;
  margin: 20px;
}
.btn-primary1 {
    border-radius: 5px;
    background: #2a5b8c !important;
    margin-top: 25px;
}

.formform h3 {
  padding: 0 10% 1% 10%;
  text-align: center;
  font-weight: bold;
  font-size: 185%;
}

.formform p {
  padding: 0px 10% 0px 10%;
}
 
/* form */


/* price */
.wrapdivs {
  display: flex;
  justify-content: left;
  flex-wrap: wrap;
  margin: 0 -10px 0 0;
}

.wrapflexy {
  display: flex;
}

.wrapdiv {
    display: block;
width: 270px;
min-height: 165px;
padding: 20px 25px 45px 25px;
background: #F0F8FF;
margin: 0 10px 10px 0;
border: 1px solid transparent;
transition: all ease 0.2s;
position: relative;
border-radius: 20px;
border: 1px solid #eeeaea;
}

a.wrapdiv:not(.ending):hover {
    background: #fff
}

.wrapdiv_img-out {
    position: absolute;
    right: 0;
    bottom: 0
}

.wrapdiv_title {
    font-weight: 600;
    font-size: var(--normal-text-fs);
    color: #320b86;
    margin: 0 0 8px 0;
    line-height: 1;
    transition: all ease 0.2s
}

.wrapdiv_title_span {
    font-family: inherit;
    padding: 0 10px 0 0
}

.wrapdiv_title_span:after {
    content: '';
    display: inline-block;
    position: absolute;
    margin: 6px 0 0 5px;
    width: 5px;
    height: 8px;
    /*background: url(../img/icons/ico-right.png) no-repeat center*/
}

.wrapdiv_desc {
    font-size: var(--small-text-fs);
    color: #9F9F9F;
    overflow: hidden;
    line-height: 1.25
}

.failures-prevew-col .wrapdiv_desc {
    font-size: var(--small-text-fs)ж
}

.wrapdiv_price {
    font-weight: 700;
    font-size: var(--normal-text-fs);
    transition: all ease 0.2s;
    position: absolute;
    bottom: 20px;
    display: flex;
    align-items: center
}

.master .wrapdiv_price,
.diagnos .wrapdiv_price,
.guarantee .wrapdiv_price,
.parts .wrapdiv_price {
    color: #fff;
    text-transform: uppercase
}

.wrapdiv_price-sum {
    font-weight: 700;
    display: inline-block;
    margin: 0 15px 0 0
}

.wrapdiv_price-request {
    font-size: var(--small-text-fs);
    text-transform: none;
    margin: 0 0 0 0;
    display: inline-block
}

.wrapdiv.master {
    background: url(../img/prices/accordion-prices-inner-bg-master.jpg) no-repeat;
    background-size: cover
}

.wrapdiv.diagnos {
    background: url(../img/prices/accordion-prices-inner-bg-diagnos.jpg) no-repeat;
    background-size: cover;
    padding-right: 105px
}

.wrapdiv.guarantee {
    background: url(../img/prices/accordion-prices-inner-bg-guarantee.jpg) no-repeat;
    background-size: cover;
    padding-right: 105px
}

.wrapdiv.parts {
    background: #503E3E;
    padding-right: 75px
}

.wrapdiv.master .wrapdiv_title,
.wrapdiv.diagnos .wrapdiv_title,
.wrapdiv.guarantee .wrapdiv_title,
.wrapdiv.parts .wrapdiv_title {
    color: #fff;
    margin: 0 0 6px 0
}

.wrapdiv.master .wrapdiv_desc {
    font-size: var(--small-text-fs);
}

.wrapdiv.diagnos .wrapdiv_desc {
    font-size: var(--small-text-fs);
    color: #8B8B8B
}

.wrapdiv.guarantee .wrapdiv_desc {
    font-size: var(--small-text-fs);
    color: #919FB1
}

.wrapdiv.parts .wrapdiv_desc {
    font-size: var(--small-text-fs);
}


@media screen and (max-width: 479px) {

   .wrapdiv {
    margin: 0 auto 10px auto;
    width: 100%;
    height: 16em;
    padding: 20px;
    }

.wrapdiv_img-out {
        width: 70%;
    }

 .wrapdiv.master .wrapdiv_title,
    .wrapdiv.diagnos .wrapdiv_title,
    .wrapdiv.guarantee .wrapdiv_title,
    .wrapdiv.parts .wrapdiv_title {
        margin: 70px 0 10px 0;
    }

    .wrapdiv_price {
        bottom: 70px;
    }
}

@media screen and (max-width: 766px) {
    .wrapdiv {
        width: 47%;
    }
}

@media screen and (min-width: 767px) and (max-width: 991px) {
 .wrapdiv {
        width: 30%;
    }

    .wrapdiv_wrap {
        width: 100%;
    }
}




@media screen and (min-width: 991px) {


.wrapdiv {
        width: 24%;
    }

    .wrapdiv_wrap {
        width: 100%;
    }
}




/* Page Intro
--------------------------------------------------------------------------------------------------------------- */
#pageintro{padding:200px 0 280px;}/* 280px => 80px for #introblocks negative margin */

#pageintro article, #pageintro article p{display:block; max-width:90%; margin:0 auto; text-align:center;}
#pageintro .heading{margin-bottom:20px; font-size:4rem;}
#pageintro footer{margin-top:50px;}



.bigbook {
    text-transform: uppercase !important;
}

.texts h1 {
  font-size: 2.3em;
  color: #282e39;
}

.white {
  background: aliceblue;
}

.headmodelsimgb {
  min-height: 560px;
}


.content {
  max-width: 1110px;
  width: 100%;
  margin: 0 auto;
  position: relative;
}

.texts {
  padding: 100px 0 0 0;
width: 500px;
margin-left: auto;
}


  @media screen and (max-width: 519px){
.texts {
    width: 100%;
  margin-right: 0;
  padding: 60px 1em 1em 1em;
}}








#phone, #logo {
  color: white;
}


/* Content Area
--------------------------------------------------------------------------------------------------------------- */

/* Content */
.container .content{}

.sectiontitle{display:block; max-width:55%; margin:0 auto 50px; text-align:center;}
.sectiontitle *{margin:0;}

.elements{}
.elements-three li, .elements-four li{margin-bottom:50px;}
.elements-three li:nth-last-child(-n+3), .elements-four li:nth-last-child(-n+4){margin-bottom:0;}/* Removes bottom margin from the last line of items - margin is restored in the media queries when items stack */
.elements-three li:nth-child(3n+1), .elements-four li:nth-child(4n+1){margin-left:0; clear:left;}/* Removes the need to add class="first" */
.elements article{display:block; padding:30px 15px; border-radius:50px 0; text-align:center;}
.elements article *{margin:0 0 15px 0; padding:0; line-height:1;}
.elements article i{width:60px; height:60px; line-height:60px; margin-bottom:30px; font-size:1.6rem; text-align:center; border-radius:50%;}
.elements article .heading{font-size:1.2rem; font-weight:700;}
.elements article p{margin:0; line-height:normal;}

/* Introblocks */
#introblocks{/*display:block;*/ position:relative; margin-top: -90px; z-index:1;}/* 160px => 80px + container padding */

/* Services */
#services{}
#services .elements article{border-radius:0;}

/* Shout */
.shout{}
.shout figure{display:block; max-width:546px;/* same width as the image - contains the caption */}
.shout figure img{}
.shout figure figcaption{display:block; position:relative;}
.shout figure figcaption a{display:block; position:relative; padding:15px; border:solid; border-width:0 1px 1px 1px;}
.shout figure figcaption a::after{position:absolute; top:12px; right:15px; width:30px; height:30px; line-height:30px; font-family:"Font Awesome\ 5 Free"; font-weight:900; content:"\f105";/* fa-angle-right */ text-align:center; border-radius:50%;}

/* Team Members */
.team{}
.team li:last-child{margin-bottom:0;}/* Used when elements stack in small viewports */
.team figure{display:block; text-align:center;}
.team figure *{margin:0; padding:0;}
.team figure a{}
.team figure img{}
.team figure figcaption{padding:20px 10px; line-height:1; border:solid; border-width:0 1px 1px 1px;}
.team figure strong{display:block; margin-bottom:8px; font-size:1.4rem; font-weight:400;}
.team figure em{display:block; font-style:normal; font-size:.8rem;}

/* Easy Pie Charts */
.pr-charts{}
.pr-charts .pr-chart-ctrl{display:block; float:left; width:25%; min-height:200px;}
.pr-charts .pr-chart-ctrl .pr-chart{display:block; position:relative; width:100%; margin:0 0 20px 0; text-align:center;}
.pr-charts .pr-chart-ctrl .pr-chart canvas{display:block; margin:0 auto; padding:0; vertical-align:top;}
.pr-charts .pr-chart-ctrl .pr-chart i{position:absolute; top:0; left:0; width:100%; height:200px; line-height:200px; font-size:18px; font-style:normal;}/* Must have same height & line height as set in the javascript size element to vertical align centre */
.pr-charts .pr-chart-ctrl p{margin:0; padding:0; text-transform:uppercase;}

/* Testimonials */
#testimonials{}
#testimonials article{text-align:center;}
#testimonials article *{margin:0; padding:0;}
#testimonials article figure{display:inline-block; margin-bottom:20px;}
#testimonials article figure img{float:left; margin-right:15px; border-radius:50%; max-width: 100px;}
#testimonials article figure figcaption{float:left; margin-top:30px; font-size:1.4rem; text-align:left;}
#testimonials article figure figcaption .heading{font-size:1.4rem;}
#testimonials article figure figcaption em{display:block; margin-top:-5px; font-size:.8rem; font-style:normal;}
#testimonials article blockquote{margin-bottom:20px; padding:20px; border-radius:25px;}
#testimonials article blockquote::before{top:15px; left:15px; font-size:30px; line-height:30px;}

/* Latest */
#latest{}
#latest > li:last-child{margin-bottom:0;}/* Used when elements stack in small viewports */
#latest article{}
#latest article figure{}
#latest article figure img{}
#latest article .meta{display:block; margin:0 0 15px 0; padding:5px 10px;}
#latest article .meta li{display:block; float:left; width:50%; font-size:.8rem;}
#latest article .meta li:last-child{text-align:right;}
#latest article .meta li i{margin-right:5px;}
#latest article .excerpt{display:block; max-width:85%; margin:0 auto; padding:15px 0 15px 15px; border-left:1px solid;}
#latest article .excerpt time{display:block; margin-bottom:8px; text-transform:uppercase; font-size:.8rem; font-style:normal; line-height:1;}
#latest article .excerpt .heading{margin:0; padding:0; font-size:1.2rem;}

/* Comments */
#comments ul{margin:0 0 40px 0; padding:0; list-style:none;}
#comments li{margin:0 0 10px 0; padding:15px;}
#comments .avatar{float:right; margin:0 0 10px 10px; padding:3px; border:1px solid;}
#comments address{font-weight:bold;}
#comments time{font-size:smaller;}
#comments .comcont{display:block; margin:0; padding:0;}
#comments .comcont p{margin:10px 5px 10px 0; padding:0;}

#comments form{display:block; width:100%;}
#comments input, #comments textarea{width:100%; padding:10px; border:1px solid;}
#comments textarea{overflow:auto;}
#comments div{margin-bottom:15px;}
#comments input[type="submit"], #comments input[type="reset"]{display:inline-block; width:auto; min-width:150px; margin:0; padding:8px 5px; cursor:pointer;}

/* Sidebar */
.container .sidebar{}

.sidebar .sdb_holder{margin-bottom:50px;}
.sidebar .sdb_holder:last-child{margin-bottom:0;}


/* Contact Details
--------------------------------------------------------------------------------------------------------------- */
#ctdetails{}

#ctdetails figure > ul{}
#ctdetails figure > ul li{position:relative; margin:0 0 35px 0; padding:15px 15px 15px 80px; line-height:1;}
#ctdetails figure > ul li:last-child{margin:0;}/* Used when elements stack in small viewports */
#ctdetails figure > ul li i{position:absolute; top:15px; left:15px; width:45px; height:45px; line-height:45px; font-size:16px; text-align:center; border-radius:50%;}
#ctdetails figure > ul li span{display:block; padding:4px 0 0 0;}
#ctdetails figure > ul li strong{display:block; margin:0 0 8px 0; text-transform:capitalize;}

#ctdetails article{margin-bottom:0;}/* Used when elements stack in small viewports */
#ctdetails input, #ctdetails button{border:1px solid;}
#ctdetails input{display:block; width:100%; padding:15px; margin-bottom:20px;}
#ctdetails button{padding:8px 18px 10px; text-transform:uppercase; font-weight:400; cursor:pointer;}


/* Footer
--------------------------------------------------------------------------------------------------------------- */
#footer{padding:80px 0;}

#footer .heading{margin-bottom:50px; font-size:1.2rem;}
#footer .logoname{margin-bottom:50px;}
#footer p + .faico{margin-top:30px;}

#footer .linklist li{display:block; margin-bottom:15px; padding:0 0 15px 0; border-bottom:1px solid;}
#footer .linklist li:last-child{margin:0; padding:0; border:none;}
#footer .linklist li::before, #footer .linklist li::after{display:table; content:"";}
#footer .linklist li, #footer .linklist li::after{clear:both;}

#footer .latestimg{}
#footer .latestimg > li{display:inline-block; float:left; width:30%; margin:0 0 5% 5%;}
#footer .latestimg > li:nth-last-child(-n+3){margin-bottom:0;}/* Removes bottom margin from the last three items - margin is restored in the media queries when items stack */
#footer .latestimg > li:nth-child(3n+1){margin-left:0; clear:left;}/* Removes the need to add class="first" */
#footer .latestimg > li img{width:100%;}/* Force the image to resize to take the full space - may have to be changed for tablets, depends on personal preference */
#footer .latestimg > li a.imgover{display:block;}


/* Copyright
--------------------------------------------------------------------------------------------------------------- */
#copyright{padding:20px 0;}
#copyright *{margin:0; padding:0;}


/* Transition Fade
This gives a smooth transition to "ALL" elements used in the layout - other than the navigation form used in mobile devices
If you don't want it to fade all elements, you have to list the ones you want to be faded individually
Delete it completely to stop fading
--------------------------------------------------------------------------------------------------------------- */
*, *::before, *::after{transition:all .3s ease-in-out;}
#mainav form *{transition:none !important;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Navigation
--------------------------------------------------------------------------------------------------------------- */
nav ul, nav ol{margin:0; padding:0; list-style:none;}

#mainav, #breadcrumb, .sidebar nav{line-height:normal;}
#mainav .drop::after, #mainav li li .drop::after, #breadcrumb li a::after, .sidebar nav a::after{position:absolute; font-family:"Font Awesome\ 5 Free"; font-weight:900; font-size:10px; line-height:10px;}

ul.up {justify-content: space-evenly; display: flex;}
nav#mainav {
    color: white;
    font-weight: 500;
}
/* Top Navigation */
#mainav{}
#mainav ul{text-transform:uppercase;}
#mainav ul ul{position:absolute; width:180px; text-transform:none; z-index:9999;}
#mainav ul ul ul{left:180px; top:0;}
#mainav li{display:inline-block; position:relative; margin:0 15px 0 0; padding:0;}
#mainav li:last-child{margin-right:0;}
#mainav li li{width:100%; margin:0;}
#mainav li a{display:block; padding:30px 0;}
#mainav li li a{border:solid; border-width:0 0 1px 0;}
#mainav .drop{padding-left:15px;}
#mainav li li a, #mainav li li .drop{display:block; margin:0; padding:10px 15px;}
#mainav .drop::after, #mainav li li .drop::after{content:"\f0d7";}
#mainav .drop::after{top:35px; left:5px;}
#mainav li li .drop::after{top:15px; left:5px;}
#mainav ul ul{visibility:hidden; opacity:0;}
#mainav ul li:hover > ul{visibility:visible; opacity:1;}

#mainav form{display:none; width:100%; margin:0; padding:0;}
#mainav form select, #mainav form select option{display:block; cursor:pointer; outline:none;}
#mainav form select{width:100%; padding:5px; border:none;}
#mainav form select option{margin:5px; padding:0; border:none;}

/* Breadcrumb */
#breadcrumb{padding:150px 0 30px;}
#breadcrumb ul{margin:0; padding:0; list-style:none; text-transform:uppercase;}
#breadcrumb li{display:inline-block; margin:0 6px 0 0; padding:0;}
#breadcrumb li a{display:block; position:relative; margin:0; padding:0 12px 0 0; font-size:12px;}
#breadcrumb li a::after{top:4px; right:0; content:"\f0da";}
#breadcrumb li:last-child a{margin:0; padding:0;}
#breadcrumb li:last-child a::after{display:none;}
#breadcrumb .heading{margin:0; font-size:2rem;}

/* Sidebar Navigation */
.sidebar nav{display:block; width:100%;}
.sidebar nav li{margin:0 0 3px 0; padding:0;}
.sidebar nav a{display:block; position:relative; margin:0; padding:5px 10px 5px 15px; text-decoration:none; border:solid; border-width:0 0 1px 0;}
.sidebar nav a::after{top:10px; left:5px; content:"\f0da";}
.sidebar nav ul ul a{padding-left:35px;}
.sidebar nav ul ul a::after{left:25px;}
.sidebar nav ul ul ul a{padding-left:55px;}
.sidebar nav ul ul ul a::after{left:45px;}

/* Pagination */
.pagination{display:block; width:100%; text-align:center; clear:both;}
.pagination li{display:inline-block; margin:0 2px 0 0;}
.pagination li:last-child{margin-right:0;}
.pagination a, .pagination strong{display:block; padding:8px 11px; border:1px solid; background-clip:padding-box; font-weight:normal;}

/* Back to Top */
#backtotop{z-index:999; display:inline-block; position:fixed; visibility:hidden; bottom:20px; right:20px; width:36px; height:36px; line-height:36px; font-size:16px; text-align:center; opacity:.2;}
#backtotop i{display:block; width:100%; height:100%; line-height:inherit;}
#backtotop.visible{visibility:visible; opacity:.5;}
#backtotop:hover{opacity:1;}


/* Tables
--------------------------------------------------------------------------------------------------------------- */
table, th, td{border:1px solid; border-collapse:collapse; vertical-align:top;}
table, th{table-layout:auto;}
table{width:100%; margin-bottom:15px;}
th, td{padding:5px 8px;}
td{border-width:0 1px;}


/* Gallery
--------------------------------------------------------------------------------------------------------------- */
#gallery{display:block; width:100%; margin-bottom:50px;}
#gallery figure figcaption{display:block; width:100%; clear:both;}
#gallery li{margin-bottom:30px;}


/* Font Awesome Social Icons
--------------------------------------------------------------------------------------------------------------- */
.faico{margin:0; padding:0; list-style:none;}
.faico li{display:inline-block; margin:8px 5px 0 0; padding:0; line-height:normal;}
.faico li:last-child{margin-right:0;}
.faico a{display:inline-block; width:36px; height:36px; line-height:36px; font-size:18px; text-align:center;}

.faico a{color:inherit; background-color:#282E39;}
.faico a:hover{color:#FFFFFF;}

.faicon-dribble:hover{background-color:#EA4C89;}
.faicon-facebook:hover{background-color:#3B5998;}
.faicon-google-plus:hover{background-color:#DB4A39;}
.faicon-linkedin:hover{background-color:#0E76A8;}
.faicon-twitter:hover{background-color:#00ACEE;}
.faicon-vk:hover{background-color:#4E658E;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Colours
--------------------------------------------------------------------------------------------------------------- */
body{color:#A5A6AA; background-color:#282E39;}
a{color:#97A9BD;}
a:active, a:focus{background:transparent !important;}/* IE10 + 11 Bugfix - prevents grey background */
hr, .borderedbox{border-color:#D7D7D7;}
label span{color:#FF0000; background-color:inherit;}
input:focus, textarea:focus, *:required:focus{border-color:#97A9BD !important;}

.overlay{color:#FFFFFF; background-color:inherit;}
.overlay::after{color:inherit; background-color:rgba(40,46,57,.7);/* #282E39 */}
.overlay.light::after{background-color:rgba(151,169,189,.7);/* #97A9BD */}

.gradient{color:#474747; background:linear-gradient(to bottom, #F4F4F4 55%, #FFFFFF 50%, #FFFFFF 100%);}/* Overlap dark to make a hard transition */
@media screen and (max-width:750px){/* Only the colours height has been changed */
	.gradient{background:linear-gradient(to bottom, #F4F4F4 24%, #FFFFFF 19%, #FFFFFF 100%);}
}

.btn, .btn.inverse:hover{color:#FFFFFF; background-color:#97A9BD; border-color:#97A9BD;}
.btn:hover, .btn.inverse{color:inherit; background-color:transparent; border-color:inherit;}

.imgover:hover::before{background-color:rgba(151,169,189,.5);/* #97A9BD */}
.imgover, .imgover:hover::after{color:#FFFFFF;}

.logoname a{color:#FFFFFF;}
.logoname::first-letter, .logoname span{color:#97BDAB;}


/* Rows */
.row0, .row0 a{}
.row1{color:#FFFFFF; background-color:#000000;}
.row2{color:#474747; background-color:#F4F4F4;}
.row3{color:#474747; background-color:#FFFFFF;}
.row4{color:#A5A6AA; background-color:#000000;}
.row5, .row5 a{color:#A5A6AA; background-color:#282E39;}
.coloured{color:#FFFFFF; background-color:#97A9BD;}


/* Header */
#header #logo a{color:inherit;}


/* Page Intro */
#pageintro{color:#FFFFFF;}


/* Content Area */
.elements article{color:#474747; background-color:#FFFFFF; box-shadow:0px 0px 15px rgba(0,0,0,.3);}
.elements article:hover{color:#FFFFFF; background-color:#97A9BD;}/* Default */
.elements article a i{color:#FFFFFF; background-color:#97A9BD;}/* Default */
.elements article:hover a i{color:#97A9BD; background-color:#FFFFFF;}/* Default */

/* ###### DELETE THE FOLLOWING IF ONLY THE DEFAULT COLOUR IS REQUIRED ###### */
#introblocks .elements li article{color:#FFFFFF; background-color:#97A9BD;}/* Blue */
#introblocks .elements li article a i{color:#97A9BD; background-color:#FFFFFF;}/* Blue */
#introblocks .elements li article:hover{color:#474747; background-color:#FFFFFF !important;}
#introblocks .elements li article:hover a i{color:#FFFFFF !important; background-color:#97A9BD;}
#introblocks .elements li:nth-child(2) article, #introblocks .elements li:nth-child(2) article:hover a i{background-color:#A197BD;}/* Purple */
#introblocks .elements li:nth-child(2) article a i{color:#A197BD;}/* Purple */
#introblocks .elements li:nth-child(3) article, #introblocks .elements li:nth-child(3) article:hover a i{background-color:#BDA697;}/* Brown */
#introblocks .elements li:nth-child(3) article a i{color:#BDA697;}/* Brown */
#introblocks .elements li:nth-child(4) article, #introblocks .elements li:nth-child(4) article:hover a i{background-color:#97BDAB;}/* Green */
#introblocks .elements li:nth-child(4) article a i{color:#97BDAB;}/* Green */
/* ###### END DELETE ###### */

.shout figure figcaption a{color:inherit; background-color:inherit; border-color:#D7D7D7;}
.shout figure:hover figcaption a, .shout figure figcaption a::after{color:#FFFFFF; background-color:#97A9BD; border-color:#97A9BD;}
.shout figure:hover figcaption a::after{color:#97A9BD; background-color:#FFFFFF;}

.team figure figcaption{color:#474747; background-color:#FFFFFF; border-color:#D7D7D7;}

#testimonials article blockquote{color:#474747; background-color:#FFFFFF;}
#testimonials article blockquote::before{color:rgba(0,0,0,.05);}
#testimonials article blockquote::after{border-top-color:#FFFFFF;}

#latest article .meta, #latest article .meta *{color:#FFFFFF; background-color:#282E39;}
#latest article .excerpt{border-color:#D7D7D7;}


/* Contact Details */
#ctdetails figure > ul li{color:inherit; background-color:#FFFFFF;}
#ctdetails figure > ul li:hover a{color:#FFFFFF;}
#ctdetails figure > ul li:hover, #ctdetails figure > ul li a i{color:#FFFFFF; background-color:#97A9BD;}/* Default */
#ctdetails figure > ul li:hover a i{color:#97A9BD; background-color:#FFFFFF;}/* Default */

/* ###### DELETE THE FOLLOWING IF ONLY THE DEFAULT COLOUR IS REQUIRED ###### */
#ctdetails figure > ul li:hover, #ctdetails figure > ul li a i{color:#FFFFFF; background-color:#A197BD;}
#ctdetails figure > ul li:hover a i{color:#A197BD; background-color:#FFFFFF !important;}
#ctdetails figure > ul li:nth-child(2):hover, #ctdetails figure > ul li:nth-child(2) a i{background-color:#BDA697;}
#ctdetails figure > ul li:nth-child(2):hover a i{color:#BDA697;}
#ctdetails figure > ul li:nth-child(3):hover, #ctdetails figure > ul li:nth-child(3) a i{background-color:#97BDAB;}
#ctdetails figure > ul li:nth-child(3):hover a i{color:#97BDAB;}
/* ###### END DELETE ###### */

#ctdetails input, #ctdetails button{border-color:transparent;}
#ctdetails input{color:#474747; background-color:#FFFFFF;}
#ctdetails button{color:#FFFFFF; background-color:#97A9BD;}
#ctdetails button:hover{color:inherit; background-color:transparent; border-color:inherit;}


/* Footer */
#footer .heading{color:#FFFFFF;}
#footer hr, #footer .borderedbox, #footer .linklist li{border-color:rgba(255,255,255,.1);}


/* Navigation */
#mainav li a{color:inherit;}
#mainav .active a, #mainav a:hover, #mainav li:hover > a{color:#97A9BD; background-color:inherit;}
#mainav li li a, #mainav .active li a{color:#FFFFFF; background-color:rgb(40, 46, 57); border-color:rgba(151,169,189,.5);/* #97A9BD */}
#mainav li li:hover > a, #mainav .active .active > a{color:#FFFFFF; background-color:#97A9BD;}
#mainav form select{color:#474747; background-color:#FFFFFF;}

#breadcrumb a{color:inherit; background-color:inherit;}
#breadcrumb li:last-child a{color:#97A9BD;}

.container .sidebar nav a{color:inherit; border-color:#D7D7D7;}
.container .sidebar nav a:hover{color:#97A9BD;}

.pagination a, .pagination strong{border-color:#D7D7D7;}
.pagination .current *{color:#FFFFFF; background-color:#97A9BD;}

#backtotop{color:#FFFFFF; background-color:#97A9BD;}


/* Tables + Comments */
table, th, td, #comments .avatar, #comments input, #comments textarea{border-color:#D7D7D7;}
th{color:#FFFFFF; background-color:#373737;}
tr, #comments li, #comments input[type="submit"], #comments input[type="reset"]{color:inherit; background-color:#FBFBFB;}
tr:nth-child(even), #comments li:nth-child(even){color:inherit; background-color:#F7F7F7;}
table a, #comments a{background-color:inherit;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Media Queries
--------------------------------------------------------------------------------------------------------------- */
@-ms-viewport{width:device-width;}


/* Max Wrapper Width - Laptop, Desktop etc.
--------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width:1140px){
	.hoc{max-width:1140px;}
}

@media screen and (min-width:978px) and (max-width:1140px){
	.hoc{max-width:95%;}
}


/* Mobile Devices
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:978px){
	/*.hoc{max-width:90%;}*/

	#header #logo{margin-top:0;}

	#mainav{}
	#mainav ul{display:none;}
	#mainav form{display:block; margin-top:2px;}

	#breadcrumb{}

	.container{}
	#comments input[type="reset"]{margin-top:10px;}
	.pagination li{display:inline-block; margin:0 5px 5px 0;}

	#footer{}

	#copyright{}
	#copyright p:first-of-type{margin-bottom:10px;}
}
.fl_left {
  display: flex;
  align-items: center;
}
.fl_right, .imgr { text-align: right;}
@media screen and (max-width:750px){
	.imgl, .imgr{display:inline-block; float:none; margin:0 0 10px 0;}
	.group .group > *:last-child, .clear .clear > *:last-child, .clear .group > *:last-child, .group .clear > *:last-child{margin-bottom:0;}/* Experimental - Needs more testing in different situations, stops double margin when stacking */
	.one_half, .one_third, .two_third, .one_quarter, .two_quarter, .three_quarter{display:block; float:none; width:auto; margin:0 0 30px 0;}

	#header #logo{margin:0 0 15px 0;}

	/*#pageintro article, #pageintro article p{max-width:none;}*/
	#pageintro .heading{font-size:3rem;}

	.sectiontitle{max-width:none;}
	.shout figure, .team li, #latest > li{margin:0 auto 50px;}
	.team li, #latest li{max-width:348px;}/* Restrict the width to the one_third grid element */
	.elements-three li:nth-last-child(-n+3), .elements-four li:nth-last-child(-n+4){margin-bottom:50px;}
	.elements-three li:last-child, .elements-four li:last-child, .shout figure:last-child{margin-bottom:0;}

	#ctdetails figure{margin-bottom:80px;}/* Gives good separation between the two elements */

	#footer{padding-bottom:50px;}/* Not needed - just looks better */
	#footer .latestimg > li, #footer .latestimg > li:nth-last-child(-n+3){display:inline-block; float:none; width:auto; margin:0 5% 5% 0;}
	#footer .latestimg > li:last-child{margin-bottom:0;}
	#footer .latestimg > li img{width:auto;}
}

@media screen and (min-width:451px) and (max-width:900px){
	.pr-charts .pr-chart-ctrl{width:50%; margin-bottom:50px;}
	.pr-charts .pr-chart-ctrl:nth-child(n+3){margin-bottom:0;}
}

@media screen and (max-width:450px){
	.pr-charts .pr-chart-ctrl{width:100%; margin-bottom:50px;}
	.pr-charts .pr-chart-ctrl:last-child{margin-bottom:0;}

	#testimonials article figure img{float:none; margin:0 auto 20px auto;}
	#testimonials article figure figcaption{float:none; margin:0; text-align:center;}
}

@media (max-width: 750px) {
#pageintro {
    padding: 10% 0;
}
#introblocks {
    margin-top: -30px;
}}

/* Other
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:650px){
	.scrollable{display:block; width:100%; margin:0 0 30px 0; padding:0 0 15px 0; overflow:auto; overflow-x:scroll;}
	.scrollable table{margin:0; padding:0; white-space:nowrap;}

	.inline li{display:block; margin-bottom:10px;}
	.pushright li{margin-right:0;}

	.font-x2{font-size:1.6rem;}
	.font-x3{font-size:1.8rem;}
}




.justify-content-center.m-t-20 {
  text-align: center;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}


.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}
.col-6 {
  -webkit-flex: 0 0 50%;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
}
@media (min-width: 576px) {
  .col-sm-4 {
    -webkit-flex: 0 0 33.3333333333%;
    -ms-flex: 0 0 33.3333333333%;
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }
}
@media (min-width: 768px) {
  .col-md-3 {
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
}

@media (min-width: 992px) {
  .col-lg-2 {
    -webkit-flex: 0 0 16.6666666667%;
    -ms-flex: 0 0 16.6666666667%;
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
    margin-bottom: 20px;
  }
}


.card {
  position: relative;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0,0,0,.125);
  border-radius: .25rem;
}
.card-shadow {
  /*! border: none !important; */
  margin: 10px 0px;
  height: 100%;
}
.text-uppercase {
  text-transform: uppercase !important;
}
.text-center {
  text-align: center !important;
}
.card-body {
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1.15rem;
}
.card {
  word-wrap: break-word;
}
.card-body.text-center.text-uppercase img {
  min-height: 50px;
  max-height: 50px;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.card-body.text-center.text-uppercase h6 {
  font-size: 115%;
}
.card.card-shadow.brand:hover {
  background: #fcfcfc;
  color: red;
}
  .col-lg-2 {
    margin-bottom: 20px;
  }