@charset "utf-8";
/*   1. Global styles for the entire project    */
html {overflow: hidden;}
body {position: relative; font-family: 'ClearSansRegular'; }
.load {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: url(../logo.png) no-repeat center center #000; z-index: 1031; color: #fff;}
a:hover {text-decoration: none;}
.no-margin {padding-left: 0; padding-right: 0;}
.scroll {position: absolute; bottom: 50px; left: 50%; margin: 0 0 0 -8px;}
.navbar-toggle {background: #fbb02c; padding: 5px 6px; margin-top: 15px;}
.navbar-toggle .icon-bar {background: #fff;}
.navbar-brand {height: auto;}
.nav > li > a:hover, .nav > li > a:focus {background-color: transparent;}

/*   1.1 Styles for the block of social buttons   */
.social a {width: 30px; height: 30px; border-radius: 15px; display: inline-block; margin: 0 20px 0 0; background: url(../images/social.png) no-repeat; overflow: hidden; text-indent: -99999px;}
.social a:last-child {margin: 0;}
.social a.fb {background-position: 0 0;}
.social a.tw {background-position: -30px 0;}
.social a.vk {background-position: -60px 0;}
.social a.gp {background-position: -90px 0;}
.social a.be {background-position: -120px 0;}

/*   1.2 Elements forms   */
.proposal-field {width: 100%; background: transparent; border: none; outline: none; font-size: 1.28em; border-bottom: 1px solid #fff; margin: 5px 0; color: #fff;}
.proposal-button {display: block; color: #000; background: #fbb02c; padding: 8px 0; border-radius: 3px; text-align: center; margin: 5px 0; font-family: 'ClearSansBold';}
.proposal-button:hover{color: #fff !important;}

/*   1.3 The headlines in the sections   */
h1.title {text-align: center; margin: 80px 0 55px 0; position: relative; padding: 0 0 30px 0;}
h1.title + p {text-align: center; font-size: 18px; margin: 0 0 50px 0;}
.dark {color: #2c2e30;}
.light {color: #fff;}
h1.dark + p {color: #767676;}
h1.light + p {color: #fff;}
h2.dark + p {color: #6b6c6c;}
h1.title:before {display: block; width: 30px; height: 3px; position: absolute; left: 50%; bottom: 0; margin: 0 0 0 -15px; background: #fbb02c; content: '';}

/*   1.4 Global styles for sections   */
#services {background: url(../images/slides/slide2.jpg) no-repeat center center; background-size: cover; padding: 10px 0;}
#benefits, #portfolio {padding: 0 0 100px 0;}
#benefits, #portfolio, #stages {background: #f3f3f3;}
#statistics {background: url(../images/statistics_bg.jpg) no-repeat center center; background-size: cover; padding: 100px 0;}
#statistics {background: url(../images/statistics_bg.jpg) no-repeat center center; background-size: cover; padding: 100px 0;}
#proposal {background: url(../images/proposal_bg.jpg) no-repeat center center; background-size: cover; padding: 0 0 50px 0;}
#contacts {background: url(../images/contacts_bg.jpg) no-repeat center center; background-size: cover; padding: 0 0 50px 0;}
#map {height: 475px;}

/*   1.5 Global styles for carousels   */
#carousel-1 .carousel-indicators li, #carousel-2 .carousel-indicators li {width: 14px; height: 14px; border-radius: 50%; cursor: pointer; margin: 0;}
#carousel-1.carousel .item {width: 100%; height: 100%;}
#carousel-1 .carousel-indicators li {border: 2px solid #ffffff;}
#carousel-1 .carousel-inner {height: 1000px;}
#carousel-2 .carousel-indicators {position: relative;}

/*  2. Styles for Slider sections   */
#slider .item:nth-child(1) {background: url(../images/slides/slide1.jpg) no-repeat center center; background-size: cover;}
#slider .item:nth-child(2) {background: url(../images/slides/slide2.jpg) no-repeat center center; background-size: cover;}
#slider .item:nth-child(3) {background: url(../images/slides/slide3.jpg) no-repeat center center; background-size: cover;}
#slider .item:nth-child(4) {background: url(../images/slides/slide4.jpg) no-repeat center center; background-size: cover;}
#slider .carousel-indicators li {border: 2px solid #dadada;}


/*  3. Styles for headers   */
header {border-bottom: 1px solid rgba(255, 255, 255, .2)!important; color: #fff; transition: background 1s ease;}
header .menu{padding-top: 15px;}
header li a {padding-top: 7px !important; padding-bottom: 7px !important; color: #fff ;}
header li a:hover {color: #fbb02c ;}
header li.active a:hover {color: #000;}
header li.active {background: #fbb02c; border-radius: 3px;}
header p {color: #fff; margin-top: 8px !important; font-family: 'ClearSansBold';}

/*  4. Styles for Greeting section   */
.greeting {position: absolute; top: 21em; left: 50%; color: #fff; width: 100%; margin-left: -50%;}
.greeting h1 {font-size: 4em; text-align: center; margin: 0; font-family: 'ClearSansBold'}
.greeting small {font-size: 1.71em; text-align: center; display: block; margin: 0 0 3.5em 0}

/*   5. Styles for Services section    */
.service {border: 1px solid #000; text-align: center; padding: 40px; margin: 0 0 30px 0;background: #f3f3f3;}
.service p {min-height: 150px;}
.service h2 {min-height: 60px; font-family: 'ClearSansBold';}

/*   6. Styles for Benefits section    */
.benefit {padding: 0 0 60px 0;}
.benefit img {margin: 0 30px 0 0;}
.benefit h2 {margin-left: 100px; font-family: 'ClearSansBold';}
.benefit p {margin: 0 0 0 100px;}

/*   7. Styles for Statistics section    */
.stats {text-align: center; color: #fff;}
.stats img {height: 60px;}
.stats h2 {font-size: 2.5em; font-family: 'ClearSansBold'; margin: 0;}
.stats p {font-size: 1.1em; margin: 0;}

/*   8. Styles for Portfolio section    */
.filter {text-align: center; margin: 0 0 30px 0;}
.filter li {display: inline-block;}
.filter li a {color: #757575; font-size: 1.1em; display: block; font-family: 'ClearSansBold';}
.filter li a:hover {color: #212121;}
.filter li a.active {color: #212121; border: 1px solid #fbb02c; border-radius: 4px;}
.project {overflow: hidden; position: relative; margin-bottom: 30px;}
.project img  {height: 100%;}
.project a {display: inline-block; width: 100%; height: 100%; background: #000; color: #fff; text-align: center; top: 0; left: 0; position: absolute; padding: 40px; opacity: 0;}
.project a strong  {display: block; font-size: 2.14em;}
.project a span  {display: block; font-size: 1.28em;}

/*   9. Styles for Team section    */
.member {text-align: center; margin: 0 0 60px 0}
.member h2 {margin-bottom: 0; font-family: 'ClearSansBold';}
.member img  {width: 100%;}
.member small {color: #6b6c6c; font-size: 1em; margin: 0 0 30px 0; display: block; font-family: 'ClearSansItalic';}

/*   10. Styles for Prices section    */
.product {border: 1px solid #f0f0f0; border-radius: 5px; text-align: center; padding: 0 30px; margin: 0 0 60px 0;}
.product h2 {color: #212121; background: #f6f6f6; margin: 0 -30px; padding: 20px 0; font-family: 'ClearSansBold';}
.product p {border-bottom: 1px solid #dddddd; padding: 20px 0; color: #2c2e30;}
.product span  {display: block; font-family: 'ClearSansBold';}
.product a  {margin: 30px 0;}

/*   11. Styles for Reviews section    */
#reviews .item > div {background: url(../../../images/quote.png) no-repeat 15px 0;}
#reviews .client {overflow: hidden; margin: 20px 0 60px 0;}
#reviews p {color: #0d0d0e; font-size: 1.14em; margin: 0 30px 0 50px;}
#reviews .avatar {width: 60px; height: 60px; border-radius: 50%; border: 3px solid #f1f1f1; margin: 0 30px 0 50px;}
#reviews h3 {color: #0d0d0e; font-size: 1.28em; font-weight: normal; margin-top: 0; font-family: 'ClearSansBold';}
#reviews h3 span {display: block; color: #6b6c6c; font-style: italic; font-size: 0.7em; font-family: 'ClearSansItalic';}
#reviews .carousel-indicators .active {background: #dadada;}
#reviews .carousel-indicators li {border: 2px solid #dadada;}

/*   12. Styles for Stage section    */
.circle {width: 100px; height: 100px; text-align: center; position: relative; background: #fff; border-radius: 50%; line-height: 100px; margin: 0 0 20px 0;}
.circle .bage {width: 30px; height: 30px; line-height: 25px; text-align: center; color: #9b9b9b; position: absolute; top: 5px; right: -5px; border: 2px solid #fbb02c; border-radius: 50%; background: #fff;font-weight: bold;}
.circle + p {color: #0d0d0e; font-size: 1.14em; margin: 0 0 70px 0;}
.finish {background: #fbb02c;}
.finish .bage {color: #fff; background: #fbb02c;}

/*   13. Styles for Partners section    */
.partner {margin: 0 0 60px 0;}
.partner img {width: 100%;filter: alpha(Opacity=65);opacity: 0.65; }

/*   14. Styles for Contacts section    */
#contacts p {color: #fff; text-align: center; margin: 0;}
#contacts p:last-child {margin: 0 0 50px 0;}
#contacts img {margin: 0 0 20px 0;}

/*   15. Styles for footer    */
footer {height: 100px; line-height: 100px;}
footer p {margin: 0;}
footer .social {text-align: right;}
footer .social a {margin: 35px 20px 0 0;}

/*   16. Responsive fixes   */
@media screen and (min-width: 768px){
	#carousel-1 .carousel-indicators {bottom: 120px;}
}
@media screen and (max-width: 768px){
	footer, footer .social {text-align: center;}
	.stats {margin: 0 0 30px 0;}
	#statistics {padding: 50px 0;}
}
@media screen and (min-width: 1200px){
	#stages .row {background: url(../images/stages_bg.png) no-repeat 0 250px;}
	.greeting {width: 1170px; margin-left: -585px;}
}