/*
Theme name: kic
Theme URL:
Description: for myself
Version: 2023.0
Author: Root
Author URL:
*/


body{
  background: #fff; 
  font-family:  "Roboto-Regular" !important;
  font-size: 100%; 
  color: #002a58; /*  COLOR OF FONT   */
  margin: 0px auto;
  padding-left: 5%;
   padding-right: 5%;
   padding-top: 1%;
  height:50%;
  width: 1260px;

  }
 
a:link	{
	text-decoration: none;
	color: #052a49; }      /*  RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
a:visited	{
	text-decoration: none;
	color: #052a49; }  /*  #50657F  ССИЛКА В НАЗВІ */
a:active	{
	text-decoration: underline;
	color: blue; }
a:hover	{
	text-decoration: underline;
	color: #287fc8; }      /*  ССИЛКА ПРИ НАТИСКАННІ   */

a img {
padding: 0px;
margin-left: 0px;
margin-top:0px;
margin-right: 0px;
}


a.class1:link { 
color:#052a49; 
text-decoration: underline; 
margin-left:4px;
font-weight: bold;
font-family: Book Antiqua;
font-size: 12;}
a.class1:visited { color:#299AE7; }
a.class1:active	{ color:#299AE7; }
a.class1:hover 	{ color:#299AE7; }
	
a.img2:link { color: #2B85C5; text-decoration: none; }         /*  RAMKA NAVKOLO KORISNI SSULKY */
a.img2:visited { color:#2B85C5; text-decoration: none; }      /*     RAMKA NAVKOLO IMG HREF */
a.img2:active	 { color: black; }
a.img2:hover	{ color:#94ccfb; text-decoration: underline; }       /*    COLOR kolu NAJOMAESH */

a.post-img {
padding: 0px;
margin: 0px;
width: 325px;
height:220px;
}

a.wp-image {
padding: 0px;
margin: 0px;
width: 325px;
height:220px;
}


a img.alignleft {
float: left;
margin-left: 0px;
margin-right: 14px;
margin-top: 4px;
margin-bottom: 4px;
}
a img.alignright {
float: right;
margin-left: 14px;
margin-right: 0px;
margin-top: 4px;
margin-bottom: 4px;
}
a img.aligncenter {
clear: both;
margin-left: auto;
margin-right: auto;
margin: 0px;
}


#up {
width: 100%;
position: relative;
height: 175px;
border-bottom: 4px solid #c9a168; 
background: #fff;      /*102540;  #00284b   */
top:0px;
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 

}


#kc-logo {
position: absolute;
width: 266px;
height: 177px;
left: 497px;
top: 4%;
background: url(images/logo.webp);
background-size: 100% 100%;   
margin: 0 auto;    
border: 0px solid #ccc;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
}
}

#headermenu {
position: relative;
margin: 0 auto;
margin-top: -50px;
bottom: 0px;
max-width: 100%;
width: 1260px;
height: 40px;

color: #fff;
}

#block-box {
position: absolute;
left: 0px;
bottom: 0px;
max-width: 100%;
width: 1260px;
height: 40px;
border-right: 0px solid #ccc;  
color: #fff;  

}


#block1 {
position: relative;
float: left;
max-width: 100%;
width: 200px;
height: 40px;


    }
    
    #block1:hover {

opacity: 1.00;
filter: alpha (Opacity=100);
padding: 0px;
display: block;
}
    

#block2 {
position: absolute;
left:  221px;
max-width: 100%;
width: 200px;
height: 40px;
border: 0px solid #ccc;  

    }
    
       #block2:hover {
background: #;
opacity: 1.00;
filter: alpha (Opacity=100);
padding: 0px;
display: block;
}
    
    #block3 {
position: absolute;
left:  792px;
max-width: 100%;
width: 247px;
height: 40px;
border: 0px solid #ccc; 
     }
       #block3:hover {
background: #;
opacity: 1.00;
filter: alpha (Opacity=100);
padding: 0px;
display: block;
}
    
    #block4 {
position: absolute;
left:  1010px;
max-width: 100%;
width: 247px;
height: 40px;
border: 0px solid #ccc;

    }
       #block4:hover {
background: #;
opacity: 1.00;
filter: alpha (Opacity=100);
padding: 0px;
display: block;
       }
    
.blocktext45 {
text-align: center;
font-size: 100%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color:  #002a58; 
position: relative;
}

.blocktext45 a:hover	{
	text-decoration: underline;
	color:  #002a58; 
	font-weight: bold;
    
} 
	
.blocktext45	a:active, a:link {
	 
   
	color:  #002a58; 
	font-weight: bold;
} 


#contacts {
position: absolute;
width: 100%;
height: 220px;
left: 0px;
top: 400px;
}
    
#motto {
width: 290px;
height: 40px;
position: absolute;
left: 0px;
top: -7%;
background: #ca9f68;
}    


#top-contacts {
width: 1260px;
height: 28px;
position: absolute;
left: 0px;
margin-top: 1%;
border: 0px solid #ccc;

}

#top-tel {
width: 290px;
height: 40px;
position: absolute;
left: 965px;
background: #ca9f68;
}
#top-tel-logo {
width: 30px;
height: 30px;
position: absolute;
margin: 3px;
left: 5px;
background:  url(images/tel.webp);
background-size: 100% 100%;  
}

#motto-logo {
width: 35px;
height: 35px;
position: absolute;
margin-left: 5px;
top: 2px;
left: 5px;
background:  url(images/mail2.jpg);
background-size: 100% 100%;  

} 



.blocktext3 {
text-align: left;
font-size: 150%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color:  #c9a168;
margin-top: 1.5%;

}




#search_menu {
width: 300px;
height: 17px;
position: relative;
float: right;
margin-left: 50px;
border: 1px solid red;
background: #102540;
margin-top: 2%;
} 

.search-result {
position: absolute;
width: 550px;
height: 50px;
margin-left: 300px;
margin-top: 22px;
border: 0px solid #fff;
}

.search-result-text {
text-align: justify;
padding: 6px;
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color:#fff;

}

.search-result-word {
text-align: justify;
padding: 6px;
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: gold;

}

   .search {
border-radius: 0px;
border: 2px solid #8d1a18; 
vertical-align: middle;
text-align: left;
width: 270px;
height: 30px;
position: absolute;
top: 23%;
right: 1px;
background: #fff;
margin-top: 1%;
float: left;
color: #8d1a18;
padding-left: 10px;
font-weight: normal;
font-family: "Roboto-Regular" !important;
   }

#tablo  {
position: relative;
margin-top: 35px;
top: 35px;
max-width: 100%;
width: 1260px;
height: 600px;
margin: 0 auto;    
border: 0px solid #ccc;    
border-bottom: 0px solid #ccc;    
 clear:both; 
 overflow: hidden;
 
}

#top5-image {
position: relative;
width: 1260px;
height: 600px;
margin: 0 auto;
overflow:hidden;
 }


.top5 {
position: absolute;
left: 1px;
top: 0px;
max-width: 100%;
width: 1260px;
height: 120px;
border-top: 1px solid #ccc;    
border-bottom: 1px solid #ccc;      
border: 0px solid #ccc;  

  }
  
 #slider {
position: relative;
margin-top:  0px;
top: 0px;
max-width: 100%;
width: 1260px;
height: 600px;
margin: 0 auto;    
border-top: 0px solid #ccc;    
border-bottom: 0px solid #ccc;      
   clear:both;      
     background: ;
    margin:  0 auto;
    overflow: hidden;
 } 
 
 
  #top-column1 {
position: absolute;
width: 395px;
height: 120px;
border-left: 0px solid #ccc;    
border-right: 0px solid #ccc;          
left: 15px;      
top: 0px;
overflow: visible;
background: rgba(8, 20, 36, 0.3);   
  }
  
   #top-column21 {
position: absolute;
width:  395px;
height: 120px;
border-left: 0px solid #ccc;    
border-right: 0px solid #ccc;          
left: 15px;      
top: 0px;
overflow: visible;
background: #002a58;   /*  f4f4f4 */
opacity: 0.9;
filter: alpha (Opacity=90);
  }
  

 #top-column2 {
position: absolute;
max-width: 100%;
width:  395px;
height: 120px;
 top: 0px;  
border-left: 0px solid #ccc;    
border-right: 0px solid #ccc;          
left: 433px;      
background: rgba(8, 20, 36, 0.3);      
overflow: visible;

      
  }
  
  #top-column22 {
position: absolute;
max-width: 100%;
width:  395px;
height: 120px;
 top: 0px;  
border-left: 0px solid #ccc;    
border-right: 0px solid #ccc;          
left: 433px;      
   
overflow: visible;
background: #002a58;   /*  f4f4f4 */
opacity: 0.9;
filter: alpha (Opacity=90);
      
  }

 #top-column3 {
position: absolute;
max-width: 100%;
width:  395px;
height: 120px;
top: 0px;
border-left: 0px solid #ccc;    
border-right: 0px solid #ccc;          
left: 850px;      
background: rgba(8, 20, 36, 0.3);   
overflow: visible;

  }
 
  #top-column23 {
position: absolute;
max-width: 100%;
width: 395px;
height: 120px;
top: 0px;
border-left: 0px solid #ccc;    
border-right: 0px solid #ccc;          
left: 850px;      

overflow: visible;
background: #002a58;   /*  f4f4f4 */
opacity: 0.9;
filter: alpha (Opacity=90);
  }

 
  
  
  .top-column-number {
position: relative;
top:  0px;
max-width: 100%;
width: 20px;
height: 120px;
margin: 0 auto;
float: left;
border-right: 0px solid #ccc;          
text-align: center;
font-size: 150%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: gold;
  }
  
  .text-column {
text-align: left;
font-size: 110%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #fff;
position: relative;
top: 20px;
margin-left: 30px;
border: 0px solid #fff;  

  }

.img1 {
background:  url(images/1.jpg);
width: 1260px;
height: 600px;
border-radius: 0px;
}
.img2 {
background:  url(images/2.jpg);
width: 1260px;
height: 600px;
border-radius: 0px;
}
.img3 {
background:  url(images/3.jpg);
width: 1260px;
height: 600px;
border-radius: 0px;
}



#tablo-top5  {
position: absolute;
left: 0px;
top: 450px;
width: 100%;
height: 120px;
 clear:both;   
border: 0px solid #ccc;  
overflow: visible;
   
    
}

#section-one {
top:  55px;
width: 100%;
position: relative;
height: 1355px;
background: #fff;      /*102540;  #00284b   */
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
border-bottom: 0px solid #b17034; 
border-top: 0px solid #b17034; 
}

#section-one2 {
top:  60px;
width: 100%;
position: relative;
background:  #fff; /* #fff  */
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
border: 0px solid #ccc;  
min-height: 800px;
height: auto !important;

}

#welcome {
position: relative;
width: 1260px;
height: 500px;
margin: 0 auto;    
max-width: 100%;
border-bottom: 1px solid #b17034;
top:30px;
}

#photo-advocat {
position: absolute;
width: 600px;
height: 500px;
left: 0px;   
background: #fff;
}

#kvadrat {
position: absolute;
width: 300px;
height: 400px;
left: 80px;   
background: #a5acb4;
}

#kv {
position: absolute;
width: 300px;
height: 400px;
margin-top: 50px;
left: 150px;
background: url(images/kv2.webp);
background-size: 100% 100%;

}


#photo-opis {
position: absolute;
width: 760px;
left: 500px;
height: 500px;

border-top: 0px solid #b17034; 
}


.textpromova {
text-align: left;
font-size: 200%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color:  #002a58; 
position: relative;
padding-left: 20px;
}

.textpromova2 {
text-align: left;
font-size: 70%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color:  #a5acb4; 
position: relative;
padding-top: 5px;

}

.textpromova3 {
text-align: left;
font-size: 95%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color:   #002a58; /*  */
position: relative;
padding-left: 20px;
padding-right: 15px;
top: -7px;
}

.textpromova4 {
text-align: left;
font-size: 95%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color:  #002a58; /*  */
position: relative;
padding-left: 20px;
padding-right: 15px;
}

#map{
position:relative;
height:400px;
width:1260px; 

 overflow: visible;

 background: url(images/maptosite2.webp);
background-size: 100% 100%;
margin-top: 30px;
     }





#promova1 {
position: absolute;
width: 760px;
left: 0px;
height: 100px;
background: #fff;
}

#promova2 {
position: absolute;
width: 760px;
top: 80px;
left: 0px;
height: 340px;
background: #fff;
border-left: 2px solid #c9a168; 
}
#promova3 {
position: absolute;
width: 760px;
left: 0px;
top: 400px;
height: 60px;
background: ;
border-left: 0px solid #b17034; 
}


#section-one-name  {
position: relative;
width: 1260px;
height: 100px;
margin: 0 auto;    
background: #032253;
max-width: 100%;
border: 0px solid #ccc; 
}


#practices {
position: relative;
width: 1260px;
height: 770px;
max-width: 100%;
border-bottom: 0px solid #b17034;
top: 40px;
border: 0px solid green; 
}

#practica-name1 {
position: relative;
width: 1260px;
height: 100px;
margin: 0 auto;    
background: #032253;
max-width: 100%;
border: 0px solid #ccc; 
}

.box-name-practica {
text-align: center;
font-size: 170%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #fff;
margin-top: 19px;
position: relative;
}

#practica-one {
position: absolute;
left:0px; 
width: 1260px;
height: 325px;
top: 115px;
margin: 0 auto;    
background: #fff;
max-width: 100%;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc; 
}

#practica-two {
position: absolute;
left:0px; 
width: 1260px;
height: 325px;
top: 440px;
margin: 0 auto;    
background: #fff;
max-width: 100%;
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc;
}

#perevaga1 {
  position: absolute;
width: 900px;
height: 150px;
   
background: #fff;
max-width: 100%;
border: 0px solid #ccc;   
 top: 120px;
  left: 80px;
}
#perevaga2 {
  position: absolute;
width: 900px;
height: 150px;
  
background: #fff;
max-width: 100%;
border: 0px solid #ccc;   
   top: 310px;
 left: 180px;
}
#perevaga3 {
  position: relative;
width: 900px;
height: 150px;
   
background: #fff;
max-width: 100%;
border: 0px solid #ccc;
border-bottom: 0px solid #ccc;   
   top: 500px;
     left: 280px;
}


#perevaga-logo1 {
  position: absolute;
  left: 0px;
width: 300px;
height: 150px;
max-width: 100%;

}
#perevaga-logo2 {
 position: absolute;
  left: 0px;
width: 300px;
height: 150px;
max-width: 100%;

}
#perevaga-logo3 {
  position: absolute;
  top: 0px;
  left: 0px;
width: 300px;
height: 150px;
max-width: 100%;

   
}

#perevaga-opys {
  position: absolute;
  top: 0px;
width: 600px;
height: 150px;
left: 300px;    
max-width: 100%;
  border-left: 2px solid #b17034;
   
}

#logo-perevaga1 {
    position: relative;
width: 140px;
height: 70px;
top: 15px;
margin-bottom: 15px;
    border: 0px solid #ccc;
    margin: 0 auto;  
      background: url(images/perevaga1.webp) no-repeat;
background-size: 140px 70px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}

#logo-perevaga2 {
    position: relative;
width: 140px;
height: 70px;
top: 15px;
margin-bottom: 15px;
    border: 0px solid #ccc;
    margin: 0 auto;  
      background: url(images/perevaga2.webp) no-repeat;
background-size: 140px 70px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}

#logo-perevaga3 {
    position: relative;
width: 140px;
height: 70px;
top: 15px;
margin-bottom: 15px;
    border: 0px solid #ccc;
    margin: 0 auto;  
       background: url(images/perevaga3.webp) no-repeat;
background-size: 140px 70px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}



#posluga-one {
position: absolute;
left:0px; 
width: 1260px;
height: 35px;
top: 115px;
margin: 0 auto;    
background: #fff;
max-width: 100%;
border-top: 0px solid #ccc;
border-bottom: 0px solid #ccc; 
}

#posluga-two {
position: absolute;
left:0px; 
width: 1260px;
height: 80px;
top: 250px;
margin: 0 auto;    
background: #fff;
max-width: 100%;
border-bottom: 0px solid #ccc;
border-top: 0px solid #ccc;
}

#posluga-three {
position: absolute;
left:0px; 
width: 1260px;
height: 100px;
top: 340px;
margin: 0 auto;    
background: #fff;
max-width: 100%;
border-bottom: 0px solid #ccc;
border-top: 0px solid #ccc;
}

#posluga-four {
position: absolute;
left:0px; 
width: 1260px;
height: 100px;
top: 430px;
margin: 0 auto;    
background: #fff;
max-width: 100%;
border-bottom: 0px solid #ccc;
border-top: 0px solid #ccc;
}

#posluga-five {
position: absolute;
left:0px; 
width: 1260px;
height: 100px;
top: 520px;
margin: 0 auto;    
background: #fff;
max-width: 100%;
border-bottom: 0px solid #ccc;
border-top: 0px solid #ccc;
}

#posluga-six {
position: absolute;
left:0px; 
width: 1260px;
height: 100px;
top: 610px;
margin: 0 auto;    
background: #fff;
max-width: 100%;
border-bottom: 1px solid #ccc;
border-top: 0px solid #ccc;
}



#logo-rozdil1 {
    position: relative;
width: 140px;
height: 70px;
top: 0px;
    border: 0px solid #ccc;
    margin: 0 auto;  
    margin-bottom: 5px;
    background: url(images/poslugalogo1.webp) no-repeat;
background-size: 140px 70px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}
#logo-rozdil2 {
    position: relative;
width: 140px;
height: 70px;
top: 0px;
    border: 0px solid #ccc;
    margin: 0 auto;  
    margin-bottom: 5px;
    background: url(images/poslugalogo2.webp) no-repeat;
background-size: 140px 70px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}
#logo-rozdil3 {
    position: relative;
width: 140px;
height: 70px;
top: 0px;
    border: 0px solid #ccc;
    margin: 0 auto;  
    margin-bottom: 5px;
    background: url(images/poslugalogo3.webp) no-repeat;
background-size: 140px 70px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}

 #box-practica1 {
position: absolute;
width: 395px;
height: 295px;
border-left: 1px solid #ccc;    
border-right: 1px solid #ccc;          
left: 15px;      
top: 15px;

  }
  
  
    #rozdil-posluga1 {
position: absolute;
width: 395px;
height: 140px;
border-left: 0px solid #b17034;    
border-right: 0px solid #ccc;          
left: 15px;      
top: 7px;

  }
  
    #rozdil-posluga2 {
position: absolute;
max-width: 100%;
width:  395px;
height: 100px;
 top: 7px;  
border-left: 0px solid #b17034;    
border-right: 0px solid #ccc;          
left: 433px;      
  }
  
  #rozdil-posluga3 {
position: absolute;
max-width: 100%;
width:  395px;
height: 100px;
top: 7px;
border-left: 0px solid #b17034;    
border-right: 0px solid #ccc;          
left: 850px;      
  }
  
   #box-posluga1 {
position: absolute;
width: 395px;
height: 70px;
border-left: 2px solid #b17034;    
border-right: 0px solid #ccc;          
left: 15px;      
top: 7px;

  }
  
    #box-posluga2 {
position: absolute;
max-width: 100%;
width:  395px;
height: 70px;
 top: 7px;  
border-left: 2px solid #b17034;    
border-right: 0px solid #ccc;          
left: 433px;      
  }
  
  #box-posluga3 {
position: absolute;
max-width: 100%;
width:  395px;
height: 70px;
top: 7px;
border-left: 2px solid #b17034;    
border-right: 0px solid #ccc;          
left: 850px;      
  }
  
  #tlo1 {
   position: absolute;
width: 150px;
height: 150px;
border-left: 0px solid #ccc;    
border-right: 0px solid #ccc;          
left: 76px;      
top: 1px;
overflow: visible;
background: rgba(8, 20, 36, 0.3);      
      
  }
  
  #practica-logo1 {
  position: absolute;
  width: 150px;
height: 150px;
border: 2px solid #b17034; 
background: url(images/trud.webp) no-repeat;
background-size: 150px 150px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
left: 120px;
top: 40px;
margin: 0 auto;
display: block;  
 }
 
  
  
 #box-practica2 {
position: absolute;
max-width: 100%;
width:  395px;
height: 295px;
 top: 15px;  
border-left: 1px solid #ccc;    
border-right: 1px solid #ccc;          
left: 433px;      
  }
  
 
  
  
  #practica-logo2 {
  position: absolute;
  width: 150px;
height: 150px;
border: 2px solid #b17034;  
background: url(images/spadk.webp) no-repeat;
background-size: 150px 150px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
left: 120px;
top: 40px;
margin: 0 auto;
display: block;  
 } 

 #box-practica3 {
position: absolute;
max-width: 100%;
width:  395px;
height: 295px;
top: 15px;
border-left: 1px solid #ccc;    
border-right: 1px solid #ccc;          
left: 850px;      
  }

 



 #practica-logo3 {
  position: absolute;
  width: 150px;
height: 150px;
border: 2px solid #b17034; 
background: url(images/sim.webp) no-repeat;
background-size: 150px 150px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
left: 120px;
top: 40px;
margin: 0 auto;
display: block;  
 }
#box-practica4 {
position: absolute;
width: 395px;
height: 295px;
border-left: 1px solid #ccc;    
border-right: 1px solid #ccc;          
left: 15px;      
top: 15px;
 
  }
   #practica-logo4 {
  position: absolute;
  width: 150px;
height: 150px;
border: 2px solid #b17034; 
background: url(images/dohovir.webp) no-repeat;
background-size: 150px 150px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
left: 120px;
top: 40px;
margin: 0 auto;
display: block;  
 }
  
 #box-practica5 {
position: absolute;
max-width: 100%;
width:  395px;
height: 295px;
 top: 15px;  
border-left: 1px solid #ccc;    
border-right: 1px solid #ccc;          
left: 433px;      

  }
  #practica-logo5 {
  position: absolute;
  width: 150px;
height: 150px;
border: 2px solid #b17034; 
background: url(images/straf.webp) no-repeat;
background-size: 150px 150px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
left: 120px;
top: 40px;
margin: 0 auto;
display: block;  
 } 

 #box-practica6 {
position: absolute;
max-width: 100%;
width:  395px;
height: 295px;
top: 15px;
border-left: 1px solid #ccc;    
border-right: 1px solid #ccc;          
left: 850px;      


  }
 #practica-logo6 {
  position: absolute;
  width: 150px;
height: 150px;
border: 2px solid #b17034; 
background: url(images/admin.webp) no-repeat;
background-size: 150px 150px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
left: 120px;
top: 40px;
margin: 0 auto;
display: block;  
 }

#practica-name {
  position: absolute;
  width: 385px;
height: 90px;
border: 0px solid #b17034; 
left: 5px;
bottom: 0px;
margin: 0 auto;
display: block;  
 }

.practica-name-style {
text-align: center;
font-size: 130%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #032253; /* ; */
}


#part1 {
position: relative;
width: 50%;
height: 645px;   
top: 0px;    
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
background: #;
}


#part2 {
position: relative;
width: 50%;
height: 645px;   
top: 0px;    
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;

background: #;    
    
}

#news-bigtop-image {
position: relative;
width: 600px;
height: 400px;   
top: 15px;
margin: 0 auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border: 1px solid #ccc;
}

#news-smallbottom-image1 {
position: absolute;
width: 295px;
height: 200px;   

top: 430px;
left: 15px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border: 1px solid #ccc;    
    
}

#news-smallbottom-image2 {
position: absolute;
width: 295px;
height: 200px;   
top: 430px;
left: 320px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border: 1px solid #ccc;    
    
}

#news-bigbottom-image {
position: relative;
width: 600px;
height: 400px;   
top: 230px;
margin: 0 auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border: 1px solid #ccc;    
    
}

#news-smalltop-image1 {
position: absolute;
width: 295px;
height: 200px;   

top: 15px;
left: 15px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border: 1px solid #ccc;    
    
}

#news-smalltop-image2 {
position: absolute;
width: 295px;
height: 200px;   
top: 15px;
left: 320px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border: 1px solid #ccc;    
    
}



























#vikno-cascad {
position: absolute;
top: 280px;
width: 99.9%;
height: auto !important;
min-height: 1182px;
border: 0px solid green;
left: 0px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;      
}


#vikno1 {
position: absolute;
top: 0px;
width: 50%;
height: 55%;
float: left;
border: 0px solid green;
margin: 0;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
  
  
}

#vikno2 {
position: absolute;
top: 0px;
width: 50%;
height: 55%;
float: left;
border: 0px solid green;
margin-left: 50%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  

    
    
    
}


#vikno3 {
position: absolute;
top: 62%;
width: 50%;
height: 55%;
float: left;
border: 0px solid green;
margin-left: 0%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
  

}

#vikno4 {
position: absolute;
top: 62%;
width: 50%;
height: 55%;
float: left;
border: 0px solid green;
margin-left: 50%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  

}


#A1 {
position: absolute;
top: 1%;
width: 48%;
height: 54%;
float: left;
border: 1px solid  #ccc;
margin-left: 2%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
    
}

#A2 {
  position: absolute;
top: 1%;
width: 48%;
height: 54%;
float: left;
border: 1px solid #ccc;
margin-left: 52%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;    
    
}

#A3 {
position: absolute;
top: 57%;
width: 48%;
height: 54%;
float: left;
border: 1px solid  #ccc;
margin-left: 2%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;      
    
    
}


#A4 {
position: absolute;
top: 57%;
width: 48%;
height: 54%;
float: left;
border: 1px solid  #ccc;
margin-left: 52%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;      
  }


#AA2-one {
position: absolute;
top: 1%;
width: 48%;
height: 48%;
float: left;
border: 0px solid white;
margin-left: 1%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;      
  background: #ccc;   
   }

#AA2-two {
     position: absolute;
top: 1%;
width: 48%;
height: 48%;
float: left;
border: 0px solid white;
margin-left: 51%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;   
   background: #ccc;     
  }

#AA2-three {
   position: absolute;
top: 51%;
width: 48%;
height: 48%;
float: left;
border: 0px solid white;
margin-left: 1%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;   
   background: #ccc;      
  }

#AA2-four {
position: absolute;
top: 51%;
width: 48%;
height: 48%;
float: left;
border: 0px solid white;
margin-left: 51%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
 background: #ccc;     
 }















#leftside {
position: absolute;
width: 10%;
height: auto !important;
min-height: 1182px;
border: 0px solid #0370cc;
margin-top: 270px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
}
#leftnav {
position: absolute;
width: 30px;
height: 40px;
border: 0px solid #0370cc;
margin-top: 560px;
right: 10px;
}

#rightside {
position: absolute;
width: 10%;
height: auto !important;
min-height: 1182px;
border: 0px solid #0370cc;
margin-top: 270px;
right: 0px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
}

#rightnav {
position: absolute;
width: 30px;
height: 40px;
border: 0px solid #0370cc;
margin-top: 560px;
left: 10px;
}




#middle {
width: 1100px;
position: relative;
height: auto !important;
min-height: 803px;
border: 0px solid #0370cc;
background: #fff;
top: 240px;
margin: 0% auto;

-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
}

#middle1{
width: 80%;
position: absolute;
height: auto !important;
/*min-height: 1600px;*/
border: 0px solid #0370cc;
background: #fff;
margin-top: 240px;
margin-left: 120px;
margin-right: 120px;
display: table;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;

}

   
  


#language {
width: 150px;
position: absolute;
height: 20px;
margin-left: 105px;
margin-top: 20px;
}

#logo {
position: absolute;
width: 180px;
height: 180px;
margin-top: 25px;
right: 115px;
background: url(images/cf_logo2.png);
background-size: 100% 100%;
}

#search_menu {
width: 300px;
height: 17px;
position: absolute;
left: 105px;
border: 0px solid #fff;
background: #102540;
margin-top: 6%;
} 

.search-result {
position: absolute;
width: 550px;
height: 50px;
margin-left: 300px;
margin-top: 22px;
border: 0px solid #fff;
}

.search-result-text {
text-align: justify;
padding: 6px;
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color:#fff;

}

.search-result-word {
text-align: justify;
padding: 6px;
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: gold;

}

.search {
border-radius: 3px;
border: 1px solid grey; 
vertical-align: middle;
text-align: left;
width: 270px;
height: 30px;
position: absolute;
top: 0%;
left: 110px;
background: #fff;
margin-top: 4%;
float: left;
color: grey;
padding-left: 10px;
   }

.menu {
width: 130px;
height: 17px;
position: absolute;
margin: 0px;
border-right: 0.5px solid #a5c8e5;

}

.menu2 {
width: 150px;
left: 150px;
height: 17px;
position: absolute;
margin: 0px;

}

.menu3 {
width: 110px;
left: 180px;
height: 17px;
position: absolute;
margin: 0px;
border-right: 0px solid #a5c8e5;
}

.text-up {
font-family: "Roboto-Regular" !important;
color: #3e516e;  /* #a5c8e5;   */
font-size: 80%;
text-align: left;
margin-left: 4px;
}




.text-up a:link	{
	text-decoration: none;
	color: #667791; }      /*  RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.text-up a:visited	{
	text-decoration: none;
	color: #667791; }  /*  #50657F  ССИЛКА В НАЗВІ */
.text-up a:active	{
	text-decoration: underline;
	color: #667791; }
.text-up a:hover	{
	text-decoration: underline;
	color: #7d8ea9;  }   







s
#panel {
width: 1100px;
position: absolute;
height: 45px;
margin: 0% auto;
top: 0%;
background: #3e516e;  /* #657fa6;  #0370cc;  */
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
}


.panel1{
width: 16.5%;
position: absolute;
height: 100%;
margin: 0%;
border-right: 1px solid #667791;
}
.panel2{
width: 16.5%;
position: absolute;
height: 100%;
margin-left: 16.6%;
border-right: 1px solid #667791;
}
.panel3{
width: 16.5%;
position: absolute;
height: 100%;
margin-left: 33%;
border-right: 1px solid #667791;
}
.panel4{
width: 16.5%;
position: absolute;
height: 100%;
margin-left: 50%;
border-right: 1px solid #667791;
}
.panel5{
width: 16.5%;
position: absolute;
height: 100%;
margin-left: 67%;
border-right: 1px solid #667791;
}
.panel6{
width: 16.5%;
position: absolute;
height: 100%;
margin-left: 84%;
}


.page_panel {
font-size: 95%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #fff;
text-align: center;
margin: 0px;
}

.page_panel a:link	{
	text-decoration: none;
	color: #fff; }      /*  RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.page_panel a:visited	{
	text-decoration: none;
	color: #fff; }  /*  #50657F  ССИЛКА В НАЗВІ */
.page_panel a:active	{
	text-decoration: underline;
	color: gold; }
.page_panel a:hover	{
	text-decoration: underline;
	color: gold; }   

.pageimgleft {
width: 30px;
height: 40px;
display: block;
background: url(images/leftb.png);
position: absolute;
top: 0px;
}


.pageimgleft:hover	{
background: url(images/left.png);
		}  
	
	.pageimgright {
width: 30px;
height: 40px;
display: block;
background: url(images/rightb.png);
position: absolute;
}
	
		.pageimgright:hover	{
background: url(images/right.png);
		}   


.text_panel {
font-size: 95%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #fff;
text-align: center;
padding-top: 12px;
margin: 0px auto;
}

.text_panel a:link	{
	text-decoration: none;
	color: #fff; }      /*  RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.text_panel a:visited	{
	text-decoration: none;
	color: #fff; }  /*  #50657F  ССИЛКА В НАЗВІ */
.text_panel a:active	{
	text-decoration: underline;
	color: gold; }
.text_panel a:hover	{
	text-decoration: underline;
	color: gold; }   

#photo {
width: 1100px;
position: absolute;
top: 54px;
margin: 0%;
background: #fff;   /* #102540; */
border: 0px solid #ccc;
height: 500px;
}

.photo-name {
width:320px;
height:80px;
top:210px;
position: absolute;
right:14px;
background: #081424;   /*  f4f4f4 */
opacity: 0.6;
filter: alpha (Opacity=60);
border: 0px solid gold;
float:right;
}

.photo-post {
width:100%;
height:300px;
}

.motto {
width:240px;
height:200px;
}

.photo-cycle {
font-size: 105%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #fff;
text-align: left;
padding: 8px;
overflow: visible;
margin-left: 4px;
margin-right: 4px;
}

.photo-cycle  a:link	{
	text-decoration: none;
	color: #fff; 
	}      /* #042547; RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.photo-cycle  a:visited	{
	text-decoration: none;
	color: #fff;
	}  /* #042547; #50657F #0370cc ССИЛКА В НАЗВІ */
.photo-cycle  a:active	{
	text-decoration: underline;
	color: #fff;
	}
.photo-cycle  a:hover	{
	text-decoration: underline;
	color: #fff;
	}   






#news_panel {
width: 1100px;
position: absolute;
top: 565px;
margin: 0% auto;
background: #3e516e; /* #0370cc; #102540; */
border: 0px solid yellow;
height: 90px;
}



#column {
width: 1100px; /* 1024px; */
position: absolute;
top: 622px;
margin: 0px;
background: #fff; /* #ebebeb; */
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
height: 440px;
display: table;
}

.last-news {
margin-top: 30px;
margin-left: 25px;
color: #fff;
float: left;
font-size: 130%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
}

#stattya {
width: 75%;
top: 0px;
position: relative;
left: 25%;
height: 100%;
min-height: 705px;
background: #f4f4f4; /* f2f2f2; #d3e0ed  #fefce2;*/
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;
box-sizing: border-box;       
border-left: 0px dotted #ccc;
border-right: 0px dotted #ccc;

}

.stattya_name {
width: 100%;
min-height: 54px;
background:  #e9e9e9;  /* #f4f4f4  #e9e9e9 #ccc;  */
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border-bottom: 0.5px solid #667791;    
border-top: 2px solid #667791;  
color: #081424; 
font-size: 130%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
text-align: justify;
padding-top: 18px;
padding-left: 34px;
padding-right: 38px;
padding-bottom: 18px;
}

.stattya_name2 {
width: 100%;
height: 14px;
background:  #e9e9e9;  /* #f4f4f4  #e9e9e9 #ccc;  */
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border-bottom: 0.3px solid #667791;
padding-top: 10px;
bottom:1px;
position: absolute;    
}

.image-text {
padding: 10px;
border: 0px;
}

.stattya_name_text {
padding: 6px;
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #081424;
text-align: justify;
margin-left:33px;
margin-right: 33px;

}


   #menu_left {
width: 245px;
height: 100%;
/* background: #184163;  background: #e9e9e9; */
margin:0px;
display: table-cell;
vertical-align: top;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;  
margin-right: 8px;
float: left;
border: 1px dotted #ccc;
background: #f4f4f4;
   }
   
 
#leftsidebar {
position: relative;
background: #fff; /* #fff; #f4f4f4;  #d3e0ed   */
width: 23%;
height: 100%;
display: table-cell;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
margin-right: 8px;
border-top: 0px solid #081424;
}

.leftnews {
font-size: 90%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #081424;
margin-bottom: 15px;
padding: 10px;
width: 220px;
background: #e9e9e9; /* #f4f4f4;  #d3e0ed   */
border: 1px dotted #;
height: 100%;

}



.leftnewsname {
margin-top: 15px;
font-size: 100%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
text-align: justify;
margin-bottom: 0px;
padding-bottom: 5px;
width: 220px;
border-bottom: 1.5px dotted #ccc;
color: #081424;
}

.leftpagetext {
margin-top: 40px;
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
color: #081424;

}

.leftpagetext a:link	{
	text-decoration: none;
	color: #081424; }      /* #042547; RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.leftpagetext a:visited	{
	text-decoration: none;
	color: #081424; }  /* #042547; #50657F #0370cc ССИЛКА В НАЗВІ */
.leftpagetext a:active	{
	text-decoration: none;
	color: #0370cc; }
.leftpagetext a:hover	{
	text-decoration: none;
	color: #0370cc; }   

.leftnewsname a:link	{
	text-decoration: none;
	color: #081424; }      /* #042547; RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.leftnewsname a:visited	{
	text-decoration: none;
	color: #081424; }  /* #042547; #50657F #0370cc ССИЛКА В НАЗВІ */
.leftnewsname a:active	{
	text-decoration: none;
	color: #0370cc; }
.leftnewsname a:hover	{
	text-decoration: none;
	color: #0370cc; }   



.dotted-line {
border-bottom: 1px dotted blue;
margin: 1.5px;
width: 100%;
position: relative;
}

.lefttext {
font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
margin-top: 10px;
width: 220px;
color: #50657F ;  /* #3e3e3e #355372; #808080 #081424       */
}

.text_stattya {
margin:20px;
font-size: 95%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
padding: 20px;
text-align: justify;
color: #081424; /*  #081424;  */
 } 
 
.column1 {
width: 31.5%;
position: relative;
top:3px;
display: block;
left: 0px;
margin-right: 0px;
margin-left: 4px;
margin-top: 2px;
margin-bottom: 2px;
height:420px;
background: #f2f2f2;  /*    */
float: left;
padding: 5px;
border: 0.7px solid #ccc;
}

.column1:hover	{
	 border: 1.4px solid #0370cc;
	background: #f4f4f4 ;   /*   */
	 opacity: 0.8;
	 filter: alpha (Opacity=80);
 }   



.last {
	margin-right: 0px;
}


		

.img_column2 {
width: 325px;
top:10px;
margin: 0px;
height:220px;
background: url(images/cfs_image_en.png);
border: 0px solid #73baf6;
padding: 0px;
}

.img_column {
width: 99%;
top:10px;
margin: 0px;
height:220px;
background: url(images/cfs_image_ukr.png);
border: 0px solid #73baf6;
padding: 0px;
}

.img-news {
margin: 0px;
padding: 0px;
width: 325px;
height:220px;
}

.text_column_name {
width: 98%;
height: 40px;
border-bottom: 1px dotted #052a49;
font-size: 100%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #081424;  /*  #484f53  #052a49;  */
text-align: justify;
margin: 12px 0px 5px 0px;
padding: 3px;
} 

.text_column_name a:link	{
	text-decoration: none;
	color: #0a3c6e; }      /* #042547; RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.text_column_name a:visited	{
	text-decoration: none;
	color: #0a3c6e; }  /* #042547; #50657F  ССИЛКА В НАЗВІ */
.text_column_name a:active	{
	text-decoration: underline;
	color: #0370cc; }
.text_column_name a:hover	{
	text-decoration: underline;
	color: #0370cc; }   



.text_column{
width: 98%;
height: 142px;
border: 0px solid #fff;
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #052a49;       /* #355372; #808080 #081424 #3e3e3e;      */
text-align: justify;
margin-top: 0px;
margin-bottom: 4px;
margin-left: 3px;
margin: 3px;
padding: 0px;
} 

.date {
width: 50px;
height: 12px;
border: 0px solid yellow;
padding: 0px;
font-size: 60%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #052a49;
float:right;


}

.date2 {
width: 50px;
height: 12px;
border: 0px solid yellow;
padding: 0px;
font-size: 60%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #052a49;
float:right;
text-align: right;

}


.read {
font: bold 100% "Roboto-Regular" !important;
right: 10px;
bottom: 10px;
position: absolute;
}

.read a:link	{
	text-decoration: none;
	color: #042547;
	}      /*  RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.read a:visited	{
	text-decoration: none;
	color: #042547; 
	}  /*  #50657F  ССИЛКА В НАЗВІ */
.read a:active	{
	text-decoration: underline;
	color: #0370cc;
	}
.read a:hover	{
	text-decoration: underline;
	color: #0370cc; 
	}   


.button {
width: 100px;
height: 18px;
background: #d6def1;   
bottom: 0px;
position: absolute;
right: 0px;
border: 1px dotted #0a3c6e;
text-align: center;
padding: 1px;
}


.read2 {
position: absolute;
right: 130px;
width: 300px;
height: 50px;
padding-bottom: 40px;
bottom: 1px;
border: 0px solid #ccc;
}


.button-back {
position: relative;
float: left;
width: 140px;
height: 50px;
border: 1px dotted #ccc;
background: #;
}

.button-main {
position: relative;
float: right;
width: 147px;
height: 50px;
background: #;
border-top: 1px dotted #ccc;
border-right: 1px dotted #ccc;
border-left: 1px dotted #ccc;
border-bottom: 1px dotted #ccc;
}


.read2 a:link	{
	text-decoration: none;
	color: #042547;
	}      /*  RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.read2 a:visited	{
	text-decoration: none;
	color: #042547; 
	}  /*  #50657F  ССИЛКА В НАЗВІ */
.read2 a:active	{
	text-decoration: underline;
	color: #0370cc;
	}
.read2 a:hover	{
	text-decoration: underline;
	color: #0370cc; 
	}   


.buttons {
 
text-align: center;
padding: 4px;
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #ccc;
}

  
 

#logo-clock {
position: absolute;
width: 28px;
height: 28px;
background: url(images/clock.webp);
background-size: 100% 100%;

}     


#advert{
background: #3e516e; /* #112d4e;   #102641;*/
width: 100%;
height: 300px;
border: 0px solid black;
position: absolute;
top: 420px;
margin: 0px auto;
}


#rights {
background: #032253; 
width: 100%;
height: 195px;
border-bottom: 0px solid gold;
position: absolute;
top: 420px;
}

#footer-contacts {
position: relative;
width: 25%;
float: left;
height: 170px;
top: 20px;
border: 0px solid #fff;
} 

#map-contacts {
position: relative;
width: 25%;
float: right;
height: 320px;
top: 25px;
right: 25px;
border: 0px solid #fff;
background: #032253; /* #081424; */ 
opacity: 0.9;
filter: alpha (Opacity=90);
} 

.blocktext4 {
text-align: center;
font-size: 170%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color:  #fff; 
margin-top: 1.5%;
}

.blocktext42 {
text-align: left;
left: 45px;
position: relative;
font-size: 170%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color:  #fff; 
margin-top: 1.5%;

}

.blocktext5 {
text-align: left;
font-size: 130%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color:  #fff; 
margin-top: 5%;
margin-left: 15%;
}

.blocktext6 {
text-align: center;
font-size: 95%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
margin-left: 15%;
margin-right: 15%;
color:  #fff; 
margin-top: 7%;
margin-bottom: 7%;
}

#footer2{
background: #fff; /*#a5c8e5;*/
width: 100%;
min-height: 400px;
border-top: 0px solid yellow;
position: relative;
margin-top: 10px;
margin: 0px auto;
margin-bottom: 6px;
float: left;
top: 0px;
}

#advert2{
background: #3e516e; 
width: 100%;
height: 300px;
border: 0px solid black;
position: absolute;
top: 20px;
margin: 0px auto;
}


#rights2 {
background: #081424; /*#a5c8e5;*/
width: 100%;
height: 95px;
border: 1px solid black;
position: absolute;
top: 340px;
}

.copyright {
margin-top: 50px;
font-size: 70%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #fff;
margin-bottom: 12px;
text-align: center;
position: relative;
}

#footerlogo {
background: url(images/) no-repeat;
background-size: 100% 100%;   
position: relative;
float: left;
width: 50%;
height: 180px;
border: 0px solid #fff;
top: 10px;  
 
}

#deviz {
position: absolute;
width: 800px;
height: 61px;
top: 145px;
left: 105px;
border: 0px solid #fff;
background: url(images/motto_ua2.png);
background-size: 100% 100%;
}



#box{
padding-bottom:200px;
display: table;
-moz-box-sizing: border-box;      /* фикс проблемы для Firefox        */
-webkit-box-sizing: border-box;   /* фикс для старых Chrome и Safari  */
box-sizing: border-box;           /* не поддерживается в CSS2         */

width: 40%;
position: absolute;
height: 40%;
border: 1px solid #336699;
background: #1b2128;
margin: 1% 7% 1% 7%;
top:27%;
}

 /* MENU of PAGES NEXT PREVIOUS */
	 
#page {
width: 100%;
left: 0px;
position: absolute;
top: 1430px;
margin: 0%;
background: #3e516e; /* #0370cc;   */
border: 0px solid yellow;
height: 31px;
}

#page2 {
width: 100%;
position: relative;
top: 0px;
margin: 0%;
background: #0370cc;
border: 0px solid yellow;
height: 31px;
}
	 
	 .pages {
	 font: normal 16px "Roboto-Regular" !important;
	 color:#052a49;
	 border: 0px; 
	 margin: 0px;
	 padding: 5px;
	 }
  
  
#photo-panel1 {
top: 0px;
width: 1260px;
margin: 0 auto;
position: absolute;
height: 600px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
border-top: 0px solid #0d417b;  /*  #0d417b  */
}

.photo1 img {
padding: 0px;
margin: 0 auto;
width: 1260px;
height: 600px;
background-size: cover; 
background-repeat: repeat-y;
}

.photo1:before {
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
background: rgba(0,0,0,0.2);
content: "";
position:absolute;
width: 100%;
height: 100%;
}

.photo1:hover:before {
opacity: 0;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
} 


.anons-box {
position: absolute;
right: 30px;
bottom: 20px;
width: 61%;
min-height: 100px;
padding: 10px;
}

.anons-text {
font-size: 170%;
font-weight: normal;
text-transform: uppercase; /* uppercase */
font-family: "Roboto-Regular" !important;
color:#fff;
}


.anons-text:hover {
text-decoration: underline;
}

.anons-text2 {
font-size: 170%;
font-weight: normal;
text-transform: uppercase; /* uppercase */
font-family: "Roboto-Regular" !important;
color:#fff;
}

#news-pages {
float: right;
right: 2.5%;
top: 26%;
height: 40px;
width: 15%;
border: 0px solid #fff;
background: #;      
position: absolute;
display: table-cell;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}


#left {
float: left;
border: 2px solid #fff;
position: absolute;
height: 40px;
width: 40px;
background: url(images/left-a.png);
}


.leftnav {
height: 38px;
width: 38px;
display: block;
position: absolute;
margin: 0px;
top: 0px;
padding: 0px;
}

.leftnav:hover	{
background: url(images/left-b.png);
height: 40px;
width: 40px;
border: 2px solid #ecc306;
margin: -2px;
top: 0px;
padding: -2px;
}


#right {
float: left;
left: 48px;
height: 40px;
width: 40px;
border: 2px solid #fff;  
position: absolute;
background: url(images/right-a.png);
}


.rightnav {
display: block;
position: absolute;
height: 38px;
width: 38px;
margin: 0px;
top: 0px;
padding: 0px;
}


.rightnav:hover	{
background: url(images/right-b.png);
height: 40px;
width: 40px;
border: 2px solid #ecc306;
margin: -2px;
top: 0px;
padding: -2px;
}

#pagenumber {
float: left;
left: 95px;
height: 42px;
width: 80px;
border: 0px solid #fff;  
position: absolute;
}

.pagenumberfont {
color: #fff; 
font-size: 105%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: center;
vertical-align: middle;
padding: 12px;
margin-left: 5px;
position: absolute;
}

#news-box-table {
top: 120px;
left: 0px;
position: absolute;
width: 100%;
}

#news-box-table-advices {
top: 20px;
left: 0px;
position: relative;
width: 100%;
height: auto!important;
     min-height: 1075px;
     -moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
display: block;
height: auto ! important;
overflow: hidden;

}

#news-box1 {
width: 33.3%;
top: 0px;
padding-top: 1%;
padding-bottom: 2%; 
position: relative;
float: left;
display: table-cell;
border:  0px solid green;
}

#news-box {
top: 0px;
width: 90%;
max-width: 325px;
height: 350px;
border:  2px solid #fff;
border-bottom: 2px solid #cccfff; /* #6385aa;   #f3f5f8;*/ 
background: #fff; /*   #f3f5f8; #bad9fb  */      
position: relative;
margin: 0 auto;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
}


#news-box:hover	{
border: 2px solid #3e516e;  /* #0370cc;  #4b98ed; */
opacity: 100;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
/*
#news-box-img img {
width: 100%;
max-width: 318px;
background: url(images/cfs-logo.jpg);
}
*/

#news-box-img {
top: 0px;
padding: 0px;
margin: 0px;
background: url(images/cfs-logo.jpg);
max-width: 325px;
height: 225px;
position: absolute;
border-bottom: 0px solid red; /* #6385aa; */
}

#news-box-img31 {
top: 0px;
padding: 0px;
margin: 0px;
background: url(images/cfs-logo.jpg);
max-width: 450px;
height: 300px;
position: absolute;
border-bottom: 0px solid red; /* #6385aa; */
}

.data-img {
top: 1%;
border: 0px solid #fff;
right: 1%;
width: 38%;
height: 25px;
padding-top: 5px;
padding-left: 5px;
float: right;
background: #010101;  /*  #cecece; */     
position: absolute;
display: table-cell;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
color: #fff; 
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: center;
opacity: 0.4;
filter: alpha (Opacity=40);

}

.news-box-name {
top: 250px;
position: absolute;
width: 100%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
color: #3e516e; /* #0370cc; */ 
font-size: 110%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
text-align: left;
text-transform:uppercase;
padding-top: 8px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 8px;
}

.news-box-name31 {
top: 325px;
position: absolute;
width: 100%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
color: #3e516e; /* #0370cc; */ 
font-size: 110%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
text-align: left;
text-transform:uppercase;
padding-top: 8px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 8px;
border-bottom: 0px solid red;
}

.cat-name {
top: 225px;
position: absolute;
width: 80%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
color:  #75819f; /*  #6385aa; */
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
padding-top: 8px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 8px;
float: left;
border: 0px solid #ccc;
}

.cat-name31 {
top: 302px;
position: absolute;
width: 80%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
color:  #75819f; /*  #6385aa; */
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
padding-top: 8px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 8px;
float: left;
border: 0px solid #ccc;
}

.views {
top: 225px;
position: relative;
width: 20%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
color: #6385aa; 
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
padding-top: 8px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 8px;
float: right;
border: 0px solid #ccc;
}

#cascad {
width: 1100px;
position: relative;
margin: 0 auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;     
height: 100%;
height: auto ! important;
display: table;
top: 565px;
 }
 
 #single-panel {
top: 0px;
width: 30%;
border: 0px solid #ccceee;
background: #fff;      
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
display: table-cell;
vertical-align: top;
margin-bottom: 20px;
margin-right: 1%;
}



#single-room {
top: 0px;
height: 80px;
width: 100%;

background: #3e516e; /* #f4f4f4 #e9e9e9;  #0d417b; */      
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
border-bottom: 0px solid #667791;    
border-top: 0px solid #667791;  /*  #081424; */ 
}

#single-bar {
width: 100%;
border-left: 0px solid #ccceee;
border-right: 0px solid #ccceee;
border-bottom: 0px solid #ccceee;
background: #fff;      
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
left: 0px;
min-height: 900px;
height: auto ! important;
overflow: hidden;
}

.single-theme {
top: 30%;
width: 25%;
padding-left: 25%;  
position: absolute;
color: #fff; 
font-size: 200%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: center;
}

#single-stattya {
top: 0px;
width: 69%;
border-bottom: 2px solid #667791; 
background: #fff;  /* #f4f4f4;  */          
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
display: table-cell;
vertical-align: top;
margin-bottom: 30px;
}
#single-stattya-special {
 background: #fff;
height: auto !important;
width: 100%;
height: 100%;
position: relative;
border: 0px solid #ccc;
margin-top: 10px;
margin: 0px auto;
display: table;
-moz-box-sizing: border-box;     
-webkit-box-sizing: border-box;  
box-sizing: border-box;
padding-top: 5px;
float: center;   
    
    
}

#stattya-name {
height: 80px;
width: 100%;
border-bottom: 0.5px solid #667791;     /*#0370cc;  */
border-top: 2px solid #667791;  /* #0370cc;  */
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
background: #f4f4f4;  /* #3e516e; */
}

.stattya-name-style {
font-size: 110%;
text-transform:uppercase;
padding: 3%;
color: #2e475d; /*  #102540  #0370cc; */
font-size: 140%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
text-align: justify; 

}

#stattya-content-box {
background: #fff;  /* #f4f4f4;  */    
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
width: 100%;
vertical-align: top;
height: auto ! important;
overflow: hidden;
min-height: 700px;
padding-bottom: 150px;
border: 0px solid #ccc;
}

.stattya-content {
color: #002a58;  
font-size: 105%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
padding: 10%;

}



#lastnews {
margin-bottom: 15.3px;
width: 99.6%;
height: 208px;
border: 1px dotted #ccc;
background: #f4f4f4;  /* #efefec  */
position: relative;
top: 15px;
}


#lastnews:hover	{
border: 1px solid #667791; /* #4b98ed; */
}



#stage {
top: 0px;
width: 100%;
height: 20px;
border-bottom: 0px solid #ccceee;;
position: relative;

}

.date {
top: 1%;
right: 1%;
width: 30%;
height: 15px;
padding-top: 5px;
padding-left: 5px;
float: right;
position: relative;
color: #6385aa; 
font-size: 70%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: center;
}

.cat {
top: 1%;
position: relative;
width: 60%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
color: #6385aa; 
font-size: 70%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
padding-top: 5px;
padding-left: 5px;
float: left;
}

.cat2 {
top: 0%;
position: relative;
width: 60%;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
color: #6385aa; 
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: left;
padding-top: 30px;
padding-left: 15px;
float: left;
}

.date2 {
top: 0%;
width: 30%;
height: 15px;
padding-top: 30px;
padding-right: 15px;
float: right;
position: relative;
color: #6385aa; 
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: right;
}

#stage2 {
top: 25px;
height: auto ! important;
height: 100%;
width: 100%;
border: 0px solid #ccceee;
position: absolute;
}

#stage3 {
top: 120px;
height: auto ! important;
height: 95px;
width: 100%;
border: 0px solid #ccceee;
position: absolute;
}

.lastnewsimg {
position: relative;
width: 119px;
height: 89px;
border: 0px solid #ccceee;
float: left;
margin-left: 5px;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 10px;
}



.lastnewsname {
left: 125px;
top: 0px;
position: absolute;
margin-top: 5px;
margin-bottom: 5px;
height: 91px;
height: auto ! important;
width: 190px;
float: left;
background-size: 100% 100%;
border: 0px solid #ccceee;
color: #052e4e; /* #0d417b; */
font-size: 85%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
text-align: left;
text-transform:uppercase;
margin-left: 6px;
margin-right: 6px;
}

.lastnewsname:hover	{

}




.lastnewstext {
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
position: relative;
color: #052e4e; /* #0d417b; */
width: 95%;
padding-top: 0px;
padding-left: 5px;
padding-right: 5px;
paddin-bottom: 5px;
height: auto ! important;
 /*  */
}


#menu_page {
left: 0px;
width: 100%;
top: 10px;
position: absolute;
background: #fff;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;
box-sizing: border-box; 

			}
			
.menu_left li{
list-style-type:none;
margin-bottom: 20px;
/* border: 1px solid #ccceee; */
margin-left: -40px;
background: #fff;
min-height: 50px;
display : flex;
align-items : center;
margin-bottom: 15px;
position: relative;
padding-left: 10px;
padding-right: 10px;
border: 1px dotted #ccc;
background: #e9e9e9;
color: #081424;
	}
	
.menu_left a {
text-decoration: none;
color: #081424;
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: left;
text-transform: uppercase;
	}	
	
.menu_left a:link, .menu_left a:visited {
text-decoration: none;

	}
	
.menu_left a:hover, .menu_left a:active {
text-decoration: underline;

	}

#gallery {
position: relative;
height: 400px;
border-bottom: 1px solid #cccccc;
background: #f3f5f8  ;      /* fff #f3f5f8 #fdfcfd     */
width: 100%;
margin: 0 auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
top: 0px;
}

#videobar {
top: 0px;
height: 400px;
width: 33.1%;
background: #;      
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}

#bar {
top: 0px;
height: 80px;
width: 100%;
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
background: #3e516e;    
}

#photobar {
top: 0px;
height: 400px;
width: 33.1%;
border: 0px solid #cccccc;
background: #;      
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
left: 33.6%;
}

#books {
top: 0px;
height: 400px;
width: 33%;
border: 0px solid #cccccc;
background: #;      
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
left: 67%;
}

		
	
	#video-box-table {
top: 125px;
position: relative;
width: 100%;
border: 0px solid #fff;
}

#video-box1 {
width: 100%;
padding-top: 4px;
padding-bottom:20px; 
position: relative;
float: left;
margin: 0 auto;
display: table-cell;
border:  0px solid green;
margin-bottom: 20px;
}


#video-box{
top: 0px;
width: 90%;
max-width: 317px;
height: 224px;
position: relative;
margin: 0 auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
opacity: 0.9; 
filter: alpha (Opacity=90);
overflow:hidden;

}


#video-box3 {
width: 33.1%;
padding-top: 10px;
padding-bottom:20px; 
position: relative;
float: left;
display: table-cell;
border:  0px solid green;
margin-bottom: 20px;
}

#video-box4{
top: 0px;
width: 90%;
max-width: 317px;
height: 224px;
position: relative;
margin: 0 auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
opacity: 0.9; 
filter: alpha (Opacity=90);
overflow:hidden;

}
#video-box4:hover 	{
border: 0px solid #0d417b; 
opacity: 1.0; 
filter: alpha (Opacity=100);
}

#video-box:hover 	{
border: 0px solid #0d417b; 
opacity: 1.0; 
filter: alpha (Opacity=100);
}


#video-box41{
top: 0px;
width: 90%;
max-width: 450px;
height: 400px;
position: relative;
margin: 0 auto;

border:  2px solid #fff;
border-bottom: 2px solid #cccfff; /* #6385aa;   #f3f5f8;*/ 
background: #fff; /*   #f3f5f8; #bad9fb  */      
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
}

#video-box41:hover 	{
border: 2px solid #3e516e;  /* #0370cc;  #4b98ed; */
opacity: 100;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}

#video-box31 {
width: 50%;
padding-top: 10px;
padding-bottom:20px; 
position: relative;
float: left;
display: table-cell;
border:  0px solid green;
margin-bottom: 20px;
/*margin-left: 20px;*/ 
}


.video-box-style:hover .video-button {
opacity: 1.0; 
filter: alpha (Opacity=100);
opacity: 100;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
/* background: url(images/video1.png);*/ 
}

.video-box-style:hover .name-media {
opacity: 1.0; 
filter: alpha (Opacity=100);
/* background: #0d417b; */ 
opacity: 100;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}

.video-box-style:hover .views-media {
opacity: 1.0; 
filter: alpha (Opacity=100);
opacity: 100;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}

.books-button {
position:absolute; 
top:0; 
left:0;
margin: 1%; 
width:50px; 
height:50px; 
background: url(images/books2.png);
opacity: 0.8; 
filter: alpha (Opacity=80);
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
}


.video-button {
position:absolute; 
top:0; 
left:0;
margin: 1%; 
width:50px; 
height:50px; 
background: url(images/video3.png);
opacity: 0.8; 
filter: alpha (Opacity=80);
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
}



.photo-box-style:hover .name-media {
opacity: 0.8; 
filter: alpha (Opacity=80);
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
}

.photo-box-style:hover .button-photo {
opacity: 1.0; 
filter: alpha (Opacity=100);
opacity: 100;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}

.photo-box-style:hover .views-media {
opacity: 1.0; 
filter: alpha (Opacity=100);
opacity: 100;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}

.button-photo {
position:absolute; 
top:0; 
left:0;
margin: 1%; 
width:50px; 
height:50px; 
background: url(images/photo3.png);
opacity: 0.8; 
filter: alpha (Opacity=80);
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
} 

.views-media {
position:absolute; 
top:1%; 
right:1%;
margin: 2%; 
width:40px;
height: 15px;
color: #fff; 
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: justify;
padding-top: 2px;

float: right;
text-align: center;
background: black;
opacity: 0.8; 
filter: alpha (Opacity=80);
}

.name-media {
position:absolute; 
bottom:0; 
left:0; 
width: 100%; 
min-height: 24%; 
background: black;
opacity: 0.8; 
filter: alpha (Opacity=80);
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
}

.name-media-font {
color: #ffffff; 
font-size: 100%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: left;
text-transform: uppercase;
padding: 3%;
}


.button {
position:absolute; 
top:0; 
left:0; 
width:100%; 
height:100%; 
background: url(images/play2.png) no-repeat 50% 50%;
opacity: 0.6; 
filter: alpha (Opacity=60);
} 

.button:hover {
opacity: 1.0; 
filter: alpha (Opacity=100);
*/ background: url(images/play.png) no-repeat 50% 50%;  */
}


.news-theme {
top: 35%;
width: 50%;
border: 0px solid #fff;
background: ;      
position: absolute;
color: #fff; 
font-size: 130%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: left;
margin-left: 7%;
display: table-cell;
}

#showall {
top: 22%;
right: 5%;
height: 40px;
width: 40px;
border: 2px solid #fff;  
position: absolute;
background: url(images/right-a.png);
}


.rightnav {
display: block;
position: absolute;
height: 38px;
width: 38px;
margin: 0px;
top: 0px;
padding: 0px;
}


.rightnav:hover	{
background: url(images/right-b.png);
height: 40px;
width: 40px;
border: 2px solid #ecc306;
margin: -2px;
top: 0px;
padding: -2px;
}  
        
        
#one {
height: auto !important;
width: 100%;
height: 100%;
position: relative;
margin-top: 0px;
margin: 0px auto;
display: table;
-moz-box-sizing: border-box;     
-webkit-box-sizing: border-box;  
box-sizing: border-box;
padding-top: 0px;
float: center;
   }

   #two {
width: 0.1%;
height: 100%;
margin:0px;
display: table-cell;
vertical-align: top;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
        
   }

#three {
width:99.8%;
height: 100%;
float:left;
margin-left:1px;
display: table-cell;
vertical-align: top;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;     

text-align: justify;
border: 0px solid #ccc;
} 


   
 #four {  
width:0.1%;
height: 100%;
background: #184163;
margin:0px;
display: table-cell;
vertical-align: top;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
border: 0px solid #ccc;        
   }
        
        
#video-box-table2 {
position: relative;
width: 99.8%;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
background: #f3f5f8; 
min-height: 280px;
float: left; 
padding-top:30px; 
}

.clear:after {
        display: block;
        clear: both;
       }

 .clear {
    clear: both;
   }


#videobar3 {
margin-top: 0px;
height: 80px;
width: 100%;
background: #3e516e;      
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
}


.col1 {
top: 19%;
left: 35%;
width: 25%;
border: 0px solid #fff;
background: #;      
position: absolute;
color: #fff; 
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: left;
display: table-cell;
}

.col2 {
top: 19%;
left: 55%;
width: 25%;
border: 0px solid #fff;
background: #;      
position: absolute;
color: #fff; 
font-size: 80%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
text-align: left;
display: table-cell;
}

.text-menu-top {
font-size: 95%;
font-weight: normal;
font-family: "Roboto-Regular" !important; /* Roboto-Regular */
color: #fff;     /* #0d417b  #124d8a   */
text-align: center;
margin: 0% auto;
vertical-align: middle;
}

.text-menu-top a:link	{
	text-decoration: none;
	color: #ccc; }      /* #042547; RAMKA NAVKOLO KORISNI SSULKY виділена сторінка*/
.text-menu-top a:visited	{
	text-decoration: none;
	color: #ccc; }  /* #042547; #50657F #0370cc ССИЛКА В НАЗВІ */
.text-menu-top a:active	{
	text-decoration: underline;
	color: #fff; }
.text-menu-top a:hover	{
	text-decoration: underline;
	color: #fff; }   




form#contact  {
	border:1px solid #667791;
	padding:10px;
	background:#f4f4f4;
	border-radius:5px;
	}
#contact label {
	font-size: 14px;
	max-width: 100%;
	color: #052e4e;
}
#contact input:required:valid {
	box-shadow: 0 0 3px #BCEF89;
	border-color: #BCEF89!important;
	background: #fff url(images/valid.png) no-repeat 98% center;
}
#contact textarea:required:valid {
	box-shadow: 0 0 3px #BCEF89;
	border-color: #BCEF89!important;

}
#contact input:focus:invalid {
	box-shadow: 0 0 3px #FFDF97;
	border-color: #FFDF97!important;
	background: #fff url(images/invalid.png) no-repeat 98% center;
	
}
#contact textarea:focus:invalid {
	box-shadow: 0 0 3px #FFDF97;
	border-color: #FFDF97!important;
	}
.err {
	border: 1px solid #ff8c00;
	padding: 10px;
	background: #FFDF97;
	text-align: left;
	border-radius: 3px;
	
}
.ok {
	border: 1px #BCEF89 solid;
	margin-bottom: 15px;
	padding: 10px;
	background: #f5f9fd;
	text-align: center;
	border-radius: 3px;
	
}
#author, #email, #url {
	width: 40%;
	padding: 5px;
	border-radius: 5px;
	border: 1px solid #667791;
	color: #052e4e;
}
#comment {
	width: 100%;
	height: 160%;
	padding: 5px;
	border-radius: 5px;
	border: 1px solid #667791;
	color: #052e4e;
	box-sizing: padding-box;   
}
#submit {
	font-weight: 400;
	background: #393;
	font-size: 15px;
	color: #fff;
	padding: 10px 50px;
	border: none;
	cursor: pointer;
	margin-left: 60.5%;
}


#box-menu1 {
width: 315px;
height: 315px;
border: 2px solid #fff;  
left: 0px;
background: ;
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 15px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}




#box-menu1:hover {
background: ;
border: 2px solid #800000;
opacity: 1.00;
filter: alpha (Opacity=100);
padding: 0px;
display: block;
}

.box-img1 {
  width: 150px;
height: 150px;
border: 0px solid #032253;  
left: 0px;
background: url(images/box05.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img2 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/box06.webp) no-repeat center;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img3 {
  width: 150px;
height: 150px;
border: 0px solid #032253;  
left: 0px;
background: url(images/box01.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img4 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background:  url(images/box10.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img5 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/box12.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }

.box-img6 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/box08.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img7 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/box09.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img8 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/box02.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img9 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/box04.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }


.box-img10 {
  width: 150px;
height: 150px;
border: 0px solid #032253;  
left: 0px;
background: url(images/box03.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img11 {
  width: 150px;
height: 150px;
border: 0px solid #032253;   
left: 0px;
background: url(images/box11.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
 .box-img12 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/box07.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 20px;
margin: 0 auto;
display: block;  
 }
 
#box-top {
width: 100%;
height: 180px;

left: 0px;
background: #fff;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
margin: 0 auto;
display: block;    
    
}

#box-bottom {
width: 100%;
height: 131px;
 
top: 0px;
background: #fff;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
margin: 0 auto;
display: block;    
    
}

.box-name {
position: relative;
width: 300px;
height: 110px;
top: 2px;    
max-width: 100%;
border: 0px solid #ccc;  
margin-top: 0px;
margin: 0 auto;
}

#box-jobmenu1 {
width: 315px;
height: 365px;
border-right: 2px solid #032253;  
left: 0px;
background: ;
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 15px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-jobmenu2 {
width: 315px;
height: 365px;
border-right: 2px solid #032253;  
left: 315px;
background: ;
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 15px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-jobmenu3 {
width: 315px;
height: 365px;
border-right: 2px solid #032253;  
left: 630px;
background: ;
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 15px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-jobmenu4 {
width: 315px;
height: 365px;
border-right: 0px solid #032253;  
left: 945px;
background: ;
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 15px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

.box-name-style {
text-align: center;
font-size: 110%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #002a58;
}

.box-name-style5 {
text-align: center;
font-size: 110%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #002a58;
margin-top: 24px;
}

.box-name-style2 {
text-align: center;
padding: 2px;
margin-top: 8px;
font-size: 75%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #002a58 ; /*#002a58 */
}

.box-name-style3 {
text-align: center;
padding: 2px;
margin-top: 8px;
font-size: 85%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #373D3F;
}

.box-name-style4 {
text-align: left;
padding: 7px;
font-size: 85%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #373D3F;
margin-left: 7px;
}

#box-jobtop {
width: 100%;
height: 200px;

left: 0px;
background: #fff;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
margin: 0 auto;
display: block;    
    
}

#box-jobbottom {
width: 100%;
height: 165px;
 
top: 0px;
background: #fff;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
margin: 0 auto;
display: block;    
    
}

.box-jobname {
position: relative;
width: 300px;
height: 150px;
top: 10;    
max-width: 100%;
border: 0px solid #ccc;  
margin-top: 0px;
margin: 0 auto;
}


#box-menu2 {
width: 315px;
height: 315px;
border: 2px solid #fff;  
left: 315px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 15px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu2:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu3 {
width: 315px;
height: 315px;
border: 2px solid #fff; 
left: 630px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 15px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu3:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu4 {
width: 315px;
height: 315px;
border: 2px solid #fff; 
left: 945px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 15px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu4:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu5 {
width: 315px;
height: 315px;
border: 2px solid #fff;   
left: 0px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 345px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu5:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu6 {
width: 315px;
height: 315px;
border: 2px solid #fff; 
left: 315px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 345px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu6:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu7 {
width: 315px;
height: 315px;
border: 2px solid #fff; 
top: 345px;
left: 945px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
left: 630px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu7:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu8 {
width: 315px;
height: 315px;
border: 2px solid #fff;   
top: 345px;
left: 945px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
display: block;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
}

#box-menu8:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu9 {
width: 315px;
height: 315px;
border: 2px solid #fff; 
left: 0px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 675px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu9:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu10 {
width: 315px;
height: 315px;
border: 2px solid #fff; 
left: 315px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 675px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu10:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu11 {
width: 315px;
height: 315px;
border: 2px solid #fff;   
left: 630px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 675px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu11:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#box-menu12 {
width: 315px;
height: 315px;
border: 2px solid #fff; 
left: 945px;

position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
float: left;
top: 675px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
content: "";
display: block;
}

#box-menu12:hover {

border: 2px solid #032253;
opacity: 1.00;
filter: alpha (Opacity=100);
height: 315px;
width: 315px;
padding: 0px;
display: block;
}

#section-two {
top:  40px;
width: 100%;
position: relative;
height: 570px;
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
margin-top: 80px;
border: 0px solid #ccc;  
}

#section-two-one {
top:  100px;
width: 100%;
position: relative;
height: 590px;
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
margin-top: 80px;

}


#section-seven {
top:  10px;
width: 100%;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
margin-top: 30px;
min-height: 595px;
height: auto !important;
display: block;
overflow: hidden;
}

#porada-box {
  top:  100px;
width: 100%;
position: absolute;
height: 400px;
left: 0px;


}

#tel-box {
      top:  45px;
width: 450px;
position: absolute;
height: 302px;
left: 260px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
background: url(images/consult.jpg) no-repeat;
background-size: 450px 302px;
border-left: 2px solid #b17034;
border-top: 2px solid #b17034;
}

#tel-box-opys {
    top:  35px;
width: 450px;
position: absolute;
height: 300px;
left: 340px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
border: 4px solid #b17034;
}

.porada-text {
   text-align: left;
   margin-left: 120px;
   margin-top: 40px;
padding: 15px;
font-size: 140%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #032253;
	text-decoration: none; 
	position: relative;
}


#section-two-four {

width: 100%;
position: relative;
height: 670px;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
top: 180px;

}

#section-two-two {
top:  60px;
width: 100%;
position: relative;
height: 550px;
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
margin-top: 40px;
border: 0px solid #ccc;  
}

#section-two-name  {
position: relative;
width: 1260px;
height: 100px;
margin: 0 auto;    
background: #032253;
max-width: 100%;
border: 0px solid #ccc; 
}


#contact-form {

width: 100%;
position: relative;
height: 80px;
background: #fff;      /*102540;  #00284b   */
top: 20px;
border-bottom: 2px solid #032253;     
  }
  
  
  #contact-form2 {

width: 100%;
position: relative;
height: 80px;
background: #fff;      /*102540;  #00284b   */
top: 400px;
border-bottom: 2px solid #032253;     
  }
  
 #pushbutton {
top:  0px;
width: 20%;
position: relative;
height: 60px;
background: #032253;      /*102540;  #00284b   */
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
margin-top: 10px;
border: 0px solid gold;     
  }
  
 #pushbutton:hover {
background:  #032253;      /*102540;  #00284b   */
border: 0px solid gold;     
  }  
  
  .button-name-style {
text-align: center;
padding: 19px;
font-size: 105%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #fff;
	text-decoration: none;
}

.button-name-style:hover {
text-align: center;
padding: 19px;
font-size: 105%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: gold;
	text-decoration: none;
}



.box-name-style {
text-align: center;
font-size: 105%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: #032253;
}



.box-name-style2 {
text-align: center;
padding: 2px;
margin-top: 8px;
font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #454444; /* */
}


 
  

#section-three {
top:  20px;
width: 100%;
position: relative;
height: 905px;
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
margin-top: 20px;
border-bottom: 2px solid #032253;  
}

#section-three-name  {
position: relative;
width: 1260px;
height: 100px;
margin: 0 auto;    
background: #032253;
max-width: 100%;
border: 0px solid #ccc; 
}

#job {
    top: 110px;
   position: relative;
width: 1260px;
height: 400px;
margin: 0 auto;    

max-width: 100%;
border: 0px solid #ccc;  
    
}

 .box-job1 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/etap1.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 40px;
margin: 0 auto;
display: block;  
 }

.box-job2 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/etap2.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 40px;
margin: 0 auto;
display: block;  
 }
 
 .box-job3 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/etap3.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 40px;
margin: 0 auto;
display: block;  
 }
 
 .box-job4 {
  width: 150px;
height: 150px;
border: 0px solid #032253; 
left: 0px;
background: url(images/etap4.webp) no-repeat;
background-size: 150px 150px;
position: relative;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
top: 40px;
margin: 0 auto;
display: block;  
 }

.box-jobnumber {
    top: 15px;
width: 30px;
height: 40px;
left: 25px;
background: #fff;
position: absolute;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box;
margin: 0 auto;
display: block;   
text-align: center;
padding: 2px;
font-size: 170%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #032253;
border: 0px solid #ccc;
}


#section-four {
top:  10px;
width: 100%;
position: relative;
height: 250px;
background: red;      /*102540;  #00284b   */
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
margin-top: 20px;
border: 0px solid #ccc;  
}

#section-four-name  {
position: relative;
width: 1260px;
height: 100px;
margin: 0 auto;    
background: #032253;
max-width: 100%;
border: 0px solid #ccc; 
}


#footer{
top:  10px;
width: 100%;
position: relative;
height: 640px;
margin: 0px auto;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
margin-bottom: 20px;
display: block;
}

.wpcf7 {
     background: #ffffff;
     border: 3px solid #b17034;
     width: 900px;
     margin: 0 auto;
     position: relative;
     padding: 20px 20px 20px 20px !important;
     height: auto!important;
     min-height: 1450px;
      float: center;
      -moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
 }
 
 
 .wpcf7 input[type="text"],
 .wpcf7 input[type="email"],
 .wpcf7 input[type="tel"],
 textarea {
     font-size: 14px;
     background-color: #fff;
     border: 1px solid #b17034;
     width: 100%;
     padding: 2%;
     margin-top: 1%;
      font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
 }
 
 .wpcf7 input[type="message"],
 textarea {
  font-size: 14px;
     background-color: #fff;
     border: 1px solid #b17034;
     width: 100%;
     padding: 2%;
     margin-top: 1%;
     height: 100%;
     min-height: 300px;
      font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
 display: block;
     
 }
 
.wpcf7 input[type="file"] {
  font-size: 14px;
     color: #a5acb4;
          margin-top: 1%;
      }
 
 
 .wpcf7 input[type="submit"] {
  
     font-size: 14px;
    width: 30%;
    height: 16%;
     font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #fff; 
     background: #b17034;
     padding: 15px 25px 15px 25px;
     border: 0px solid gold;
      float: right;
      position: relative;
      margin-bottom: 10px;
      -moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
    }
    
 .wpcf7 input:hover[type="submit"] {
     background: green;
     transition: all 0.4s ease 0s;
 }
 .wpcf7 input:active[type="submit"] {
     background: #b17034;
 }
 
 .copyright2 {
font-size: 170%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: #fff; 
   line-height: 1.7;
 }
 

div.wpcf7-response-output {
border: 0px solid green;
top: 20px;
position: relative;
margin: 0 auto;
width: 50%;
font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: green; 
text-align: center;
padding: 10px;
clear: both;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
}

div.wpcf7-mail-sent-ok {
border: 2px solid green;
top: 20px;
position: relative;
margin: 0 auto;
padding: 10px;
width: 50%;
font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: green; 
text-align: center;
clear: both;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
}

div.wpcf7-mail-sent-ng,
div.wpcf7-aborted {
border: 2px solid red;
top: 20px;
position: relative;
margin: 0 auto;
width: 50%;
font-size: 90%;
font-weight: bold;
font-family: "Roboto-Regular" !important;
color: red; 
text-align: center;
padding: 10px;
clear: both;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
    }

div.wpcf7-spam-blocked {
border: 2px solid red;
margin-top: 20px;
padding: 10px;
position: relative;
margin: 0 auto;
width: 50%;
font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: red;
text-align: center;
clear: both;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
}

div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
border: 2px solid red;
padding: 10px;
top: 20px;
position: relative;
margin: 0 auto;
width: 50%;
font-size: 90%;
font-weight: normal;
font-family: "Roboto-Regular" !important;
color: red; 
text-align: center;
clear: both;
-moz-box-sizing: border-box;      
-webkit-box-sizing: border-box;   
box-sizing: border-box; 
display: block;
}

#showother {
 margin-top: 30px;
margin-right: 25px;
position: relative;
}

.showother-style {
     margin-top: 30px;
margin-right: 25px;
    color: #fff;
float: right;
font-size: 130%;
font-family: "Roboto-Regular" !important;
text-align: justify; 

font-weight: normal;
}

.showother-style:hover {
color: gold;
	text-decoration: underline;
}
