body{
margin:0;
overflow-x:hidden;
font-family: Open Sans;
line-height: 1.5;

}


html, body {
   height: 100%;
} 
body {
  /* display: flex;
   flex-direction: column;*/
}


.content{
   flex: 1 0 auto; 

}

.pricecolor{
color: yellow;
}
.column1{
color: yellow;
}
.column2{
color: yellow;
}
.column3{
color: yellow;
}
.column4{
color: yellow;
}
.column5{
color: yellow;
}


.call{
   width:30px;
   text-align: center;
   padding-right: 15px;
   padding-bottom: 5px;
   vertical-align: middle;
}

.tbl{
border:1px dotted black;
}


.benefits{    
text-align:left;
/*font-weight: 600;*/

}


.main{
   width:100%;  
   text-align:center;  
}

.maininside{
   margin: 0 auto;
   max-width:1140px;

}

.inside{
   width:100%;  
   background-color:#f1f3f4;
   text-align:center;
   font-weight:1200;

}

.info{
   margin: 0 auto;
  
   max-width:1140px;
   padding-top:100px;
   padding-bottom:100px;
   padding-left:15px;
   padding-right:10px;
   color: #3f3f3f;
   font-size: 13pt;

}
.serv {
  

   max-width:900px;
   margin: 0 auto;  
 /*  padding-bottom:35px;*/
   line-height: 1.5;
   color:black;
   font-weight:400;
   background-color:#5F9EA0;
   text-align:left;

}


.insideserv{
   text-align:center;
   padding-top:100px;
   padding-bottom:100px;
   color:white;
   font-weight:400;
   background-color:#5F9EA0;
  /* background-color:#5F9EA0;*/
   font-size: 18pt;


}
.insideserv   li {
    list-style-type: none; /* Убираем маркеры */

/*  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
*/

}

.serv li{
   line-height: 1.5;
border-bottom:1px solid #bbb;

}

.headline{
   font-size: 20px;
   font-weight:600;
   text-align:center;
}


.contact{
 display:block;
    clear:both;
   padding-top:100px;
   padding-bottom:0px;
   width:100%;  
   background-color:#f1f3f4;
   text-align:center;
   font-weight:1200;
 color:#3f3f3f;
}

.insidecontact{
   margin: 0 auto;
   background-color:#f1f3f4;
   max-width:900px;

 
   color: #3f3f3f;
   font-size: 13pt;
   text-align:left;
   padding-left:15px;
   padding-right:15px;
}

.contbox{
  text-align:left;
  padding-bottom:100px;
  display:block;
  text-align:left;  
}

.contboxtwo{
  text-align:left;
  padding-bottom:100px;
  display:none;
}

.contboxthree{
  text-align:center;
  padding-bottom:100px;
  display:none;
}

.footr{
   width:100%;  
   text-align:center;  
   background-color:#202020;
   position: absolute;
   padding-top:100px;
   padding-bottom: 100px;


}


.fcont{
   margin: 0 auto;
   max-width:1140px;
 
}


.fleft {
   float: left;  
   width: 350px;   
   color: #777;
   text-align:left;
   padding-left:15px;

}

.fcenter {
   float:left;  
   width: 290px;
   text-align:left; 
 }

.fright {
   float: left;  
   width: 290px;
   color: #777;
   text-align:left; 
 }


.footr div ul li a{
   text-decoration: none; 
   color: #6c5e53;
}
.footr div ul li {
   list-style-type: none; 
}
.footr div ul{
   margin:0; 
   padding: 0;
}

.foottr div ul li a:hover{
 color: #777;
}

   table {
    line-height: 1.5;
    width: 700px; /* Ширина таблицы */
    margin: auto; /* Выравниваем таблицу по центру окна  */   
    border-collapse: collapse;

   }
   td {
    text-align: left; /* Выравниваем текст по центру ячейки */
    border: 1px solid gray; /* Параметры рамки */
    padding-left: 5px;
   }





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

.accordion>ul>li {

    height: auto;
    max-height: 100px;


  /*  height: 100px;*/

  /*  display:block;*/
    overflow: hidden;
 /*   height:100px;*/
    max-width: 100%;
    padding-top:19px;

/* задержка перехода при раскрытии */
  /* transition: height 0.5s ease-in-out;*/
    -moz-transition: all 0.9s ease; 
    -webkit-transition: all 0.9s ease; 
    -o-transition: all 0.9s ease; 
    transition: all 0.9s ease; 
    transition-delay: 0.3s;
}

.accordion>ul>li>a {
    display:block;
    text-decoration: none;


   -o-transition: padding-left 250ms ease-out;
   -webkit-transition: padding-left 250ms ease-out;
   -moz-transition: padding-left 250ms ease-out;
}

.accordion>ul>li>div {

 /*color:	#FFFF81;*/
 color:#fffaf0;
 font-size: 13pt;
 padding-top:15px; 
 padding-left:15px; 


}
.accordion>ul>li:hover {

max-height: 1000px;
/*height: 240px;*/
cursor:pointer;



/*color:	#D0D0D0;*/
/*color:	#FFDAB9;*/
color:#DCDCDC;
}

.accordion:hover>ul>li:hover> a {
    cursor:pointer;
 
}



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

.rounded a {
cursor:pointer;
}

.phone {
text-decoration: none;
color:#3f3f3f;
}
/*--------------------------------------------------------------*/


.sekunomug-convesion {
    position: relative;
    /*color: black;*/
    cursor: pointer;
    
}

.sekunomug-convesion:after {
    display: block;
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 2px;
    background-color: #FF8C00;
    content: "";
    transition: width 0.3s;
}

.sekunomug-convesion:hover {
  color: black;/* #1c4f76;*/
}
.sekunomug-convesion:hover:after {
  width: 100%;
}
/*------------------------------------------*/








.action {


   max-width:900px;
   margin: 0 auto;     
   line-height: 1.5;
   color:#3f3f3f;
   font-weight:400;
   background-color:#ffefd5;   

}


.insideaction{

   padding-top:100px;
   padding-bottom:100px;
   color:#3f3f3f;
   font-weight:400;   
   background-color:#ffefd5;   
  
   font-size: 18pt;

   text-align: center;

}

/*------------Акции-переворот----------------*/




.card {
    cursor: pointer;
    margin-left: auto;
    margin-right: auto;
    margin:30px;
   
    width: 230px;
    height: 290px;
/*    position: relative;*/
    position: static;
    /* задать область как 3D-пространство */
    perspective: 800px;


  display: inline-block;


}

.card-front,

.card-back {

-webkit-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
-moz-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);




   /* box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);*/
 

   /* width: 100%;*/
    height: 100%;
    position: absolute;

    top: 0;
    left: 0;
   /* background-color:#ffa07a;*/
    background-color:white;
    /* анимация при переворачивании объекта */
    transition: 0.8s;

    * скрывать заднюю часть объекта */
    backface-visibility: hidden;

}

.card-front {
/*box-shadow: 0 0 0 rgba(0, 0, 0, 0) !important;*/


-webkit-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
-moz-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);

 /*border: 1px solid black;*/


    z-index: 100;
    
    font-size: 11pt;
    padding: 20px;
    font-weight: 600;

   line-height: 1.5;
 /*  display: flex;*/
   align-items: center;
   justify-content: center;
   color:	#2f4f4f	;
 
}
.card-back {
    padding: 20px;
    opacity: 0;
    z-index: 1;
 /*   background-color:#f0f8ff;*/
    background-color:#708090;
    /* Повернуть элемент */
    transform: rotateY(180deg);
    font-size: 11pt;
    line-height: 1.2;
    color:white;

  /* border-top: 3px solid #f0f8ff;*/
  text-align: left;
}


.card:hover .card-front {
    opacity: 0;
    transform: rotateY(-180deg);

}

.card:hover .card-back {
    opacity: 1;
    transform: rotateY(0deg);

}

.card {
/*cursor:default;*/
}

.goaltop {
height: 100px;
}
/*-------------------------------------------*/




header{width:100%;display:table;background-color:white;margin-bottom:0px;    } /*position: fixed; #6c5e53*/  
/*position: fixed; */
.container{width:95%;padding-right:15px;padding-left:15px;margin-bottom:0px; margin-right:auto;margin-left:auto; }
.container{text-align:justify;font-size:25px; font-weight:normal; }

@media (min-width: 1200px) {

.container{max-width:1140px;}
.container{width:100%;text-align:justify;font-size:18pt; font-weight:normal; background: white;}


}

.gifone {
width: 200px;
}



#logo{float:left;font-size:14px;text-transform:uppercase; font-weight:400;text-decoration:none; padding-top: 20px; padding-bottom:15px;} /*#f5ebd0*/

.logl{
color:#1c4f76;
/*font-weight:600;*/
font-size:18px;
}
.logr{
color:black; 
font-weight:400;
font-size:18px;


}


nav{width:auto;float:right;margin-top:6px;}
nav ul{display:table;float:right;margin:0;padding:0;}
nav ul li{float:left;list-style-type:none;}
nav ul li:last-child{padding-right:0}
nav ul li a{color:#5f6368;font-size:14pt;padding:0px 29px; padding-top:16px;display:inline-block;text-decoration: none; font-weight:400;}
nav ul li a:hover{color:black;text-decoration:none; color:black;}
.toggle-menu ul{display:table;width:45px;margin-left:0;padding-left:0;margin:15px}
.toggle-menu ul li{width:100%;height:1px;background-color:#3f3f3f;margin-bottom:6px;list-style:none}
.toggle-menu ul li:last-child{margin-bottom:0}
input[type=checkbox],label{display:none}




@media only screen and (max-width: 980px) {
header{padding:10px 0}
#logo{padding: 0;}
#logo{padding-top: 8px;}
input[type=checkbox]{position:absolute;top:-9999px;left:-9999px;background:none}
input[type=checkbox]:fous{background:none}
label{float:right;display:inline-block;cursor:pointer;margin-right:25px}
input[type=checkbox]:checked ~ nav{display:block}
nav{display:none;position:absolute;right:0;top:44px;background-color:white;padding:0;z-index:99;width:100%;}
nav ul{width:100%; text-align: center;}
nav ul li{float:none;padding:0;width:100%;display:table}
nav ul li a{font-size:16px;padding:10px 20px;display:block;border-bottom:0px solid #4b4a45;}
nav ul li a:hover{ color:black;}

.toggle-menu ul{width:30px;}
.toggle-menu ul li{height:2px; }
.toggle-menu{padding-top:0px;}
header{padding-top:1px;padding-bottom:1px;}

.rounded a {
cursor:default;
}

.card {
cursor:default;
}
.contbox{
  text-align:center;
  padding-bottom:100px;
  display:none;
}
.contboxthree{  
  text-align:center;
  padding-bottom:100px;
  display:block;
}
.contboxtwo{
  text-align:center;
  padding-bottom:100px;
  display:none;

}



.insideserv   li {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  font-size: 14pt;
  padding-right:10px;
  padding-left:10px; 
  text-align:center;
}
.serv {
color:black;
}
.serv ul{
 padding-right:10px;
 padding-left:10px; 
}
.serv li{

   padding-top:9px;
line-height: 1.5;
padding-bottom:9px;
}
.accordion>ul>li {
    max-height:800px;

}
.accordion>ul>li:hover {
    max-height: 800px;
 color:black;
}
.accordion>ul>li>div {

 padding-top:0px; 
padding-left:0px; 
 font-size: 11pt;
}

.visual {    
   margin: 60px 0px -11px 0px; 
}



.footr{
   width:100%;  
   text-align:center;  
   position: static;
   padding-bottom:0px;
 
}

.fcont {  
   width:100%; 

   text-align:center;
   background-color:#202020;

}

.fleft {
  float: none;  
  width:100%;  
  text-align:center;
  font-weight:400;
  font-size: 12pt;
  color: #777;
  padding-left:0px;
}

.fcenter {
 float: none;  
 width:100%;  
 text-align:center;
 padding-top:50px;
 padding-bottom:50px;
 font-size: 12pt;
 }

.fright {
  float: none;  
  width:100%;   
  text-align:center;
  color: #777;
  font-size: 12pt;
 }

.info{
   font-weight:400;
   font-size: 14pt;
   padding-left:10px;
   padding-right:15px;

}

.serv {

   font-weight:400;

   
}
.maininside{
   font-weight:400;
   
}

   table {
    width: 340px; /* Ширина таблицы */
   }

.sekunomug-convesion:after {
    height: 0px;
}


 table { font-size: 8pt; }

}



@media only screen and (max-width: 360px) {
label{padding:5px 0}
#logo{font-size:20px}
nav{top:47px}

.serv ul{
 padding-right:10px;
 padding-left:10px; 
}


.sekunomug-convesion:after {
    height: 0px;
}

.card {
cursor:default;
}


}




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

.logl{
font-size:16px;
}

.insideserv   li {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  font-size: 14pt;
  padding-right:10px;
 padding-left:10px; 
  text-align:center;
}
.serv {
color:black;
}
.serv ul{
 padding-right:10px;
 padding-left:10px; 
}
.serv li{

   padding-top:9px;
line-height: 1.5;
padding-bottom:9px;
}
.accordion>ul>li {
    max-height:800px;
table { text-align: center; font-size: 9pt; }
}
.accordion>ul>li:hover {
    max-height: 800px;
    color:black;
}
.accordion>ul>li>div {

 padding-top:0px; 
padding-left:0px; 
}

.insidecontact{
    text-align:center;
}

.contbox{
  text-align:center;
  padding-bottom:100px;
  display:none;
}
.contboxthree{
  text-align:center;
  padding-bottom:100px;
  display:none;
}
.contboxtwo{
  text-align:center;
  padding-bottom:100px;
  display:block;
  text-align:center;  
}
.sekunomug-convesion:after {
    height: 0px;
}
.card {
cursor:default;
}



}


.icon{
   list-style: none; /* Убираем исходные маркеры */
   padding-right: 24px; /* Смещаем текст вправо */ 
   vertical-align: middle;
   padding-bottom:10px;
   padding-left:15px;

}




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



.rounded {
   padding-left:20px;

 /*text-align:justify;*/
counter-reset: li; 
list-style: none; 
/*padding: 0;*/
/*text-shadow: 0 1px 0 rgba(255,255,255,.5);*/
}

.rounded a {

position: relative;
display: block;
padding: .4em .4em .4em 2em;
margin: .5em 0;
/*background: #F5F5F5;*/
color: #444;
text-decoration: none;
border-radius: .3em;
transition: .3s ease-out;
}
/*.rounded a:hover {background: #FFF8DC;}*/
.rounded a:hover {background: white;}
.rounded a:hover:before {transform: rotate(360deg);}
.rounded a:before {
content: counter(li);
counter-increment: li;
position: absolute;
left: -1.3em;
top: 50%;
margin-top: -1.3em;
/*background: #8FD4C1;*/
/*background: #87CEFA;*/
background:#FF8C00;
height: 2em;
width: 2em;
line-height: 2em;
border: .3em solid white;
text-align: center;
font-weight: bold;
border-radius: 2em;
transition: all .3s ease-out;
}










table { text-align: center; }
.gridlines td { border:1px solid #D3D3D3;text-align: center;}
.gridlines th {}
 
