@import url(reset.css);



body{
    margin: 0 auto;
	color: #b2b1af;
    font-family: 'PTSansRegular', arial, sans-serif;
    font-size:14px; background: #F5F4F2 url('../images/bg.png') 0 0 repeat;

}

#bg {background: url('../images/kolibri-bg-header.jpg') center top no-repeat;}

#contact{background: #F5F4F2 url('../images/kolibri-bg-footer.jpg') center top no-repeat; display:block; height: 262px; padding-top: 30px;}

button, input[type="submit"], input[type="button"] {
    cursor: pointer;
}

a {
    color: #2c4d9b;
	text-decoration:underline;
}

a:hover {
    text-decoration: none;
}

.bold {
    font-weight: bold;
}

.clear {
    clear: both;
}

@font-face {
    font-family: 'PTSansRegular';
    src: url(../fonts/pts55f-webfont.eot);
    src: url(../fonts/pts55f-webfont.eot?#iefix) format('embedded-opentype'),
         url(../fonts/pts55f-webfont.woff) format('woff'),
         url(../fonts/pts55f-webfont.ttf) format('truetype'),
         url(../fonts/pts55f-webfont.svg#PTSansRegular) format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'PTSansItalic';
    src: url(../fonts/pts56f-webfont.eot);
    src: url(../fonts/pts56f-webfont.eot?#iefix) format('embedded-opentype'),
         url(../fonts/pts56f-webfont.woff) format('woff'),
         url(../fonts/pts56f-webfont.ttf) format('truetype'),
         url(../fonts/pts56f-webfont.svg#PTSansItalic) format('svg');
    font-weight: normal;
    font-style: normal;

}

 @font-face {
 font-family: 'DINPro-Regular';
 src: url('../fonts/dinpro-regular.eot');
 src: url('../fonts/dinpro-regular.eot?#iefix') format('embedded-opentype'),url('../fonts/dinpro-regular.woff') format('woff'), url('../fonts/dinpro-regular.ttf') format('truetype'), url('../fonts/dinpro-regular.svg') format('svg');
 font-weight: normal;
 font-style: normal;
}

/*
section, header, footer, div, p{float:left;}
*/
aside, nav, footer, header, section { display: block }


#continer {width: 960px; margin: 0 auto;}
header{padding-top: 35px;}
header h1 a{
	display: block;
	width: 290px;
	height: 200px;
	float: left; margin: 0 88px 0 64px;
	background: url(../images/kolibri-logo.png) no-repeat;
	text-indent: -9999px;
	}

	header h1 a.area{
	display: block;
	width: 215px;
	height: 140px;
	float: left; margin: 0 122px 0 105px;
	background: url(../images/kolibri-logo-area.png) no-repeat;
	text-indent: -9999px;
	}
	
	nav ul {list-style: none;}
	
	  nav ul li{
		float: left;
		margin: 0 35px 0 0;
		  }
		  
		  nav ul li a{
			  font-size: 18px; 
			  color: #b2b1af;
			  text-decoration: none;
			  border-bottom: 1px solid #b2b1af;
			}

			nav ul li a:hover{
			color: #2c4d9b;
			border-bottom: 1px solid #2c4d9b;
			}

			 nav ul li.active a{
			  color: #3c3c3c;
			  border-bottom: none;
			}
	.slogan {padding-top: 50px;}
	
	  .slogan h1{color: #515151; font-size:32px; margin-bottom: 5px; }
	  .slogan h1 b {color: #396eb2; font-size: 58px; font-weight: normal;}
	  
	  .slogan h2{color: #a09f9e; font-size: 15px; line-height:20px;}

	  #content{margin-top: 58px; min-height:420px; width: 850px;
padding-left: 110px; padding-bottom: 45px;}

	#content:after {
		content: ""; display: block; clear: both;
	}

	  #slider {list-style: none;}

	    #slider li {float: left; width: 33.3%; text-align: center; display: block;}



		  #slider li h2 {color: #000000; font-size: 43px; margin: 10px 0 18px;}

		  hr {
border: none;
color: #3C3C50;
background-color: #3C3C50;
height: 5px;
clear: both;
}

#service{list-style: none;  height: 250px;}
#service li{float: left;
width: 224px;
padding: 8px;}

#service li p{ line-height: 20px;}
#service li h1 {color: black;
font-size: 28px;
padding: 10px 0 18px;}

#service li p b{color: #396EB2; font-weight: normal;} 

.bbot {
border-bottom: 1px solid #EFEFEF;}



#slider {width: 802px; float: right; 
position: relative;
margin-right: -65px;}

#contac{padding-bottom: 35px;}
#contact h1 {color: #396eb2; font-size: 32px; padding-bottom: 35px; font-family: 'DINPro-Regular', Tahoma, serif;}
#contact ul {list-style: none;}
#contact ul li {float: left;}

#contact ul li.mail{padding-right: 60px;}
#contact ul li p{color: black; font-size: 19px; margin-bottom: 8px;}
#contact ul li p a{text-decoration: none; background: url(../images/line_link.png) 0 20px repeat-x;}
#contact ul li p a:hover{ background: none; color: #3C3C3C;}


#block-slider{display: block;
width: 960px;
padding-top: 0px;
margin-left: 47px;
height: 365px;
overflow: hidden;}

footer	{ position: relative;
clear: both;
color: black;
display: block;
text-align: center;
margin-top: -100px;}
footer a, footer p{color: #ABABAB;}

#content p {color: #5D5D5C; text-align: justify; line-height: 20px;}
#content p b{color: #000; font-weight: normal;}
#content h2 {color: #A09F9E;
padding: 0;
text-shadow: 1px 1px white;
text-align: justify;
font-size: 1.7em;
line-height: 1.2em;
margin-bottom: 25px; }

ul.service{ list-style: none; margin-left: 15px;}

ul.service li {padding-left: 23px;

background: url(../images/line.png) no-repeat 0 -1px;}

ul.service li a{font-size: 21px;
text-decoration: none; line-height: 27px;}

#content h1{color: #396eb2;
font-size: 24px;
margin-bottom: 15px}

.main h1{color: #396eb2;
font-size: 48px;
margin-bottom: 15px}

#block-service{border: 4px solid #396EB2;
padding: 20px;}


#service-list {list-style: none;}

#service-list li {float: left; width: 30%;}
#service-list li p {text-align: left;}

#sidemenu ul{list-style: none; padding-bottom: 20px;} 
#sidemenu ul li a{color: #626262; font-size: 16px; text-decoration: none; border-bottom: none;}
#sidemenu ul li {padding: 7px 0 7px 5px; border-top: 1px dotted #acacac; width: 275px;}
#sidemenu ul li:hover {background: #29a9ff url(../images/sidemenu-hover.jpg);}
#sidemenu ul li:hover a{color: white;}
#sidemenu ul li:last-child { border-bottom: 1px dotted #acacac;}


#ContentWrapper {
margin: 0 auto;
min-height: 162px;
width: 850px;
margin-top: 30px;
margin-bottom: 30px;
padding-top: 20px;

}

.ContactWrap {
float: left;
height: auto;
margin-right: 50px;

width: 530px;
}

.ContactSide {
float: left;
width: 270px;
}

.ContactSide p b{font-size: 18px;}
.ContactSide p {font-size: 16px;}

.contactForm {border-top: 1px solid lightGrey; margin-top: 15px; padding-top: 15px;}
.contactForm		p{ text-align:left;}
.contactForm		label{clear:both; display:block; margin:0 0 4px;}
.contactForm		input,	.contactForm		textarea		{margin:0 0 10px;  font-size:12px;
	background:#e3e1dd; border:1px solid #cecdc8; color:#a0a09e;
	-webkit-border-radius: 3px;	-moz-border-radius: 3px;	border-radius: 3px; float:left; clear:both;}
.contactForm		textarea 						{line-height:1.4em;height:150px; width:250px;/*290/300*/ padding: 4px; }
.contactForm		input		{ line-height:2.5em;/*35/14*/height:33px; width:225px;/*220/300*/ padding:0 10px; }
.contactForm		textarea:hover,
.contactForm		input:hover 	{background-color:#eceae7; 	border-color:#d7d6d2;}
.contactForm		textarea:focus,
.contactForm		input:focus 	{background-color:#F5F4F2; 	border-color:#e3e0da;
	-moz-box-shadow: 1px 1px 3px #fff, inset 1px 1px 2px rgba(106, 106, 105, 0.1); /*#6A6A69*/
  	-webkit-box-shadow: 1px 1px 3px #fff, inset 1px 1px 2px rgba(106, 106, 105, 0.1); 
  	box-shadow: 1px 1px 3px #fff, inset 1px 1px 2px rgba(106, 106, 105, 0.1);
}
.contactForm .submit {
margin-right: -11px;
padding: 0;
width: 541px;
cursor: pointer;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 14px;
text-shadow: #DEDEDD 1px 1px 1px;
background: #C7C6C4;
color: #6A6A69;
font-size: 13px;
text-shadow: white 1px 1px 1px;
line-height: 30px;
border: 1px solid #B7B5B2;
height: 35px;
float: right;
-webkit-appearance: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-top: 9px;
text-align: center;
}
.contactFormLeft, .contactFormRight{width: 250px; float: left;} 
.contactFormLeft {padding-right: 30px;}


#fb_suc {
    padding: 35px 35px 0 35px; 
}

#fb_suc > h1 {
    font-size: 28px;
}

h2.link-cont{font-size: 24px!important; clear:both;

margin: 30px auto!important;
font-weight: 300;
text-align: center;
border-top: 1px solid lightGrey;
border-bottom: 1px solid lightGrey;
padding: 12px 0!important;
letter-spacing: 1px;}

h2.link-cont a {
text-decoration: none;
background: url(../images/line_link.png) 0 25px repeat-x;
}
h2.link-cont a:hover{background: none;}


footer ul.social {

margin-top: 12px;
}

footer ul.social li {

display: inline-block;
vertical-align: top;
}

footer ul.social .vk-link a {
background-position: 0 0;
}

footer ul.social li a {
display: block;
width: 25px;
height: 25px;
background-image: url(../images/social.png);
background-repeat: no-repeat;
}

footer ul.social .tw-link a {
background-position: -25px 0;
}

footer ul.social .fb-link a {
background-position: -50px 0;
}
footer ul.social .vk-link a:hover,footer ul.social .vk-link a:focus,footer ul.social .vk-link a:active{background-position:0px -25px}
footer ul.social .tw-link a:hover,footer ul.social .tw-link a:focus,footer ul.social .tw-link a:active{background-position:-25px -25px}
footer ul.social .fb-link a:hover,footer ul.social .fb-link a:focus,footer ul.social .fb-link a:active{background-position:-50px -25px}





.grid {
	margin: 30px auto;
}

.grid figure {
	display: block;
	float: left;
	margin: 0 1% 10px 1%;
	cursor: pointer;
	overflow: hidden;
	background: white;
padding: 8px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1)

}

.grid figure img {
	display: block;
	width: 250px;
}

.grid figure figcaption {
	position: absolute;
	font-size: 16px;
	font-weight: 400;
	left: auto;
	width: 100%;
	height: 20px;
	bottom: -60px;
	padding: 20px;
	color: #ddd;
	background:  white;
	-webkit-font-smoothing: antialiased;
	-webkit-transition: bottom 0.2s ease;
	-moz-transition: bottom 0.2s ease-in-out;
	-ms-transition: bottom 0.2s ease-in-out;
	-o-transition: bottom 0.2s ease-in-out;
	transition: bottom 0.2s ease-in-out;
opacity: 0.8;
}

.grid figure figcaption a {
	color: #515151;
}

.grid figure figcaption a:hover {
	color: #396EB2;
}

.grid figure:hover figcaption {
	bottom: 0px;
}

.main {
width: 100%;
max-width: 850px;
padding-left: 110px;
margin: 0 auto;
position: relative;
padding-top: 25px;
	-webkit-transition-delay: 150ms;
	-moz-transition-delay: 150ms;
	-o-transition-delay: 150ms;
	-ms-transition-delay: 150ms;
	transition-delay: 150ms;
}

.main p {
color: #A09F9E;
padding: 0;
text-shadow: 1px 1px white;
text-align: justify;
font-size: 1.7em;
line-height: 1.2em;
margin-bottom: 25px;
}




#gallery{display: block; height: auto;}
	#gallery:after {
		content: ""; display: block; clear: both;
	}



#gallery li {
    list-style: none; float: left; margin: 15px;
	position: relative; width: 250px; color: white;
	
}
#gallery img.a{
position: absolute;
left: 0;
top: 0;
z-index: 10;
}
#gallery img{width: 250px; height: 187px;border: 1px solid #CECDC8;}

#gallery p a{ font-size: 12px; padding-top: 3px; color: #848484;
text-decoration: none;
width: 230px;
display: block;} 
#gallery b{font-weight: bold;} 
#gallery a.link{text-align: right;
color: #858585;
width: 230px;
display: block;}    
       

#gallery p a:hover{color: #2F96D0;}


#gallery p {
color: #9a9a9a;
line-height: 1.5em;
font-weight: bold;

font-style: normal;
text-align: center;	   
}
#gallery p span{
line-height: 1.1em; text-decoration: none;
color: #848484;
font-weight: normal;
}
.labels {
padding: 10px 5px;
background: #E3E1DD;
border-bottom: 1px solid #CECDC8;
border-left: 1px solid #CECDC8;
border-right: 1px solid #CECDC8;
width: 240px;
}

.labels h3 a{color: black; }


#gallery li:hover .labels h3 a{color: #396EB2; }
#gallery li:hover .labels {background: #eceae7; 
-webkit-transition: 0.8s ease;
	-moz-transition: 0.8s ease;
	-ms-transition: 0.8s ease;
	-o-transition: 0.8s ease;
	transition: 0.8s ease;
}