@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700');
@import url('https://fonts.googleapis.com/css?family=Ubuntu:400,500,700');
 
 
body{
font-family: 'Roboto', sans-serif;	
} 

h1, .h1, h2, .h2, h3, .h3 {
font-family: 'Ubuntu', sans-serif;
}
 
.btn-primary{
color:#fff;
background-color: #00549d;
border: 0px;
border-radius:0px;	
}

.btn-primary:hover, .btn-primary:active, .btn-primary:focus{
background-color: #0160b3;
}


/*--------------- nav bar ---------------*/

.header-area{
position: fixed;
width: 100%;
top: 0;
left: 0;
z-index: 999;
}

.sticky{
-webkit-transition: all .03s ease-out;
transition: all .03s ease-out;
padding: 0;
box-shadow: 0 1px 15px rgba(0,0,0,0.2);
}

.sticky .logo:before {
background: #fff;
right: -15px;
left: -600px;
border-radius: 0px;
}

.sticky .main-menu:before {
background: #fff;
right: -600px;
left: 0px;
border-radius: 0px;
}

.sticky .main-menu .navbar-default {
margin: 10px 0px;
}

.sticky .logo{
padding: 13px 0px;
}

.sticky .logo img{
width: 150px;
}


.logo{
padding: 18px 0px;
}

.logo:before {
background: rgba(255,255,255,.7);
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: -600px;
z-index: -1;
-webkit-transform: skew(-30deg);
-moz-transform: skew(-30deg);
-o-transform: skew(-30deg);
transform: skew(-30deg);
border-radius: 0 0 5px 0;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}

.logo img{
width: 210px; 
transition: all 0.3s ease-out;   
}

.main-menu:before {
background: rgba(255,255,255,.7);
content: "";
position: absolute;
top: 0;
bottom: 0;
right: -600px;
left: 80px;
z-index: -1;
-webkit-transform: skew(-30deg);
-moz-transform: skew(-30deg);
-o-transform: skew(-30deg);
transform: skew(-30deg);
border-radius: 0 0 0 5px;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}

.navbar-default {
background-color: transparent;
border-color: transparent;
margin:15px 0px;
}

.navbar-default .navbar-right{
padding-top: 13px;	
}

.navbar-nav li:last-child{
margin-right: 0px;  
}

.navbar-default .navbar-nav > li > a {
color: #00549d;
padding-top: 0;
padding-bottom: 0;
font-size: 15px;
font-weight: 500;
}

.navbar-nav li.active ul {
margin-top: 0;
}

.navbar-toggle {
padding: 12px 10px;
margin-top: 10px;
margin-right: 0px;
background-color: #ccc;
border-radius: 3px;
}

.navbar-default .navbar-nav .active a,
.navbar-default .navbar-nav .active a:hover, 
.navbar-default .navbar-nav .active a:focus{
color: #f38929;
background-color: transparent;
}

.navbar-default .navbar-nav li a:hover, .navbar-default .navbar-nav > li > a:focus{
color: #329be2;	
outline: none;
}	


/*--------------- Slider ---------------*/


.nivo-caption{
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  height:100%;
  opacity:1;
  padding: 0;
}
.slide-text-left {
  float:left;
  margin-left: 150px;
}
.slide-text-right {
  float:right;
  margin-right: 150px;
}
.slide-text-left-2 {
  float:left;
  margin-left: 100px;
}
.slide-text-right-2 {
  float:right;
  margin-right: 100px;
}
.slide-text-center {
  float:none;
  margin: 0 auto;
}
.slide-text {
  display: table;
  height: 100%;
}
.middle-text {
  display: table-cell;
  vertical-align: middle;
}
.cap-sub-title {
  font-size: 36px;
  font-weight: 400;
  margin-bottom: 10px;
  letter-spacing: 1px;
}
.cap-title {
  font-size: 48px;
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 60px;
  margin-top: 0px;
  margin-bottom: 20px;
}
.cap-dec {
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 8px;
  line-height: 22px;
  margin-bottom: 30px;
  text-transform: uppercase;
}
.cap-sub-title-2 {
  font-size: 24px;
}
.cap-title-2 {
  font-size: 48px;
  line-height: 48px;
}
.cap-dec-2 {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 8px;
  line-height: 18px;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.cap-readmore {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  overflow: hidden;
  padding: 8px 25px;
  text-transform: uppercase;
  
}
.cap-readmore:hover {
  background: #CD6289 !important;
  color: #fff !important;
  text-decoration:none;
}

.text-white .cap-sub-title, .text-white .cap-dec {
  color: #fff;
}
.text-white .cap-title {
  color: #ebebeb;
}
.text-white .cap-readmore {
  background: #fff none repeat scroll 0 0;
  color: #252525;
}

.text-black .cap-sub-title, .text-black .cap-title, .text-black .cap-dec {
  color: #252525;
}
.text-black .cap-readmore {
  background: #252525 none repeat scroll 0 0;
  color: #fff;
}
/* Nivo Controls */
.nivo-directionNav{}
.nivo-directionNav a {
  color: #969695;
  font-size: 60px;
  height: 70px;
  line-height: 62px;
  text-align: center;
  width: 70px;
  top: 50%;
  margin-top: -35px;
}
.nivo-directionNav a i {}

.nivo-controlNav {
  position: absolute;
  width: 100%;
  bottom: 0;
  z-index: 9999;
}
.nivo-control {
  background: #e2e2e2 none repeat scroll 0 0;
  border-radius: 4px;
  display: inline-block;
  height: 15px;
  margin: 0 5px;
  text-indent: -99999px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 15px;
}
.nivo-control.active {
  background: #ff343b;
}
.slider-progress{
	position:absolute;
	top:0;
	left:0;
	background-color: #fff;
	height:5px;
	-webkit-animation: timebar 7000ms ease-in-out;
	-moz-animation: timebar 7000ms ease-in-out;
	-ms-animation: timebar 7000ms ease-in-out;
	animation: timebar 7000ms ease-in-out;
	opacity:0;
}
@-webkit-keyframes timebar {
	from {width: 0;}
	to {width: 100%;}
 }
 @keyframes timebar {
	from {width: 0;}
	to {width: 100%;}
 }
 .slider-progress.pos_hover{
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
 }	

/*--------------- about ---------------*/ 

.about-sbd{
padding: 90px 0px 60px;
position: relative;
}

.about-sbd:before {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 950px;
z-index: -1;
background: #f9f9f9;
}

.about-sbd:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 22%;
height: 2px;
background: #cacacb;
}

.about-img{
margin-top: 20px;
}

.big-about h1{
position: absolute;
left: 0;
font-size: 200px;
font-weight: 700;
color: #303540;
opacity: .05;
margin: 0px;
line-height: 0.6;
}

.about-text h2{
font-size: 42px;
line-height: 1.2;
font-weight: 700;
margin-top: 10px;
color: #303540;
margin-bottom: 40px;
}

.about-text p{
color: #7b808c;
line-height: 22px;
letter-spacing: 0.2px;
margin-bottom: 15px;
font-size: 15px;
text-align: justify;
}


/*--------------- about group ---------------*/ 

.about-group{
padding: 45px 0px 90px;
position: relative;
}

.about-group:before {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 950px;
z-index: -1;
background: #f9f9f9;
}

.group-text{
padding-left: 125px;
}

.group-text h2{
font-size: 42px;
font-weight: 700;
margin-top: 0px;
color: #303540;
margin-bottom: 40px;
}

.group-text p{
color: #7b808c;
line-height: 22px;
letter-spacing: 0.2px;
margin-bottom: 15px;
font-size: 15px;
text-align: justify;
}

.sugal-logo{
padding-right: 0px;
}

.sugal-logo img{
float: right;
margin-top: 50px;
}

.sugal-logo img:nth-child(2) { display: none;}



/*--------------- project ---------------*/  

.project-area{
border-top: 2px solid #f4f5f7;
background: url(../img/shadow.png) no-repeat top center;
padding: 50px 0px 70px;
}

.heading{
margin: 0px 0px 40px;
}

.heading h2{
font-size: 42px;
font-weight: 700;
margin-top: 0px;
color: #303540;
text-align: center;
}

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

.project-select .nav-tabs li a {
font-size: 16px;
color: #555;
font-weight: 400;
border: 1px solid #e6e6e6;
background: #f7f8fa;
padding: 8px 16px;
}

.project-select .nav-tabs li.active a, .project-select .nav-tabs li.active a:hover, .project-select .nav-tabs li.active a:focus {
color: #fff;
background: #00549d;
border: 0px;
}

.project-select .nav-tabs {
margin-bottom: 30px;
text-align: center;
border: 0px;
}

.project-select .nav-tabs li {
float: none;
display: inline-block;
margin: 0px 4px;
}

.project-select .tab-content {
background: url(../img/project-pattern.png) center;
background-size:cover;
box-shadow: 0px 1px 15px -2px rgba(2,2,2,0.10);
padding: 20px;
min-height: 604px;
position: relative;
}



.project-heading{
background: url(../img/project-bg.jpg) no-repeat center fixed;
background-size: cover;
padding: 40px 0px;
}

.project-heading h2{
font-size: 42px;
font-weight: 700;
margin-top: 0px;
color: #fff;
text-align: center;
}

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

.project-detail{
background: #fff;
padding: 20px 10px;
border: 1px solid #eee;
margin: 0px;
min-height: 564px;
}

.project-logo{
margin-bottom: 20px;
width: 280px;
}

.para-height p{
color: #7b808c;
line-height: 22px;
letter-spacing: 0.2px;
margin-bottom: 15px;
font-size: 15px;
text-align: justify;
}

.para-height {	
padding-right: 15px;
}

/*.para-height::-webkit-scrollbar {
width: 3px;
}
 
.para-height::-webkit-scrollbar-track {
-webkit-box-shadow: none;
}

.para-height::-webkit-scrollbar-thumb {
background-color: #f4f5f7;
outline: none;
} */

.project-detail button{
background: none;
border: 0px;
outline: none;
float: right;
margin-bottom: 20px;
}

.project-detail h2{
font-size: 68px;
font-weight: 700;
margin-top: 15%;
color: #00549d;
text-align: center;
}

#Div2, #Div4, #Div5{
display: none;
transition: all .5s ease;
}

#Div1, #Div3{
transition: all .5s ease;
}

.project-open button{
background: none;
outline: none;
font-weight: 400;
margin-top: 40px;
color: #00549d;
padding: 6px 30px;
font-size: 19px;
margin-bottom: 0px;
border: 6px double #eee;
line-height: 28px;
}

.project-open button span{
display: block;
color: #7b808c;
font-size: 16px;
}

.project-open img{
margin: 0px auto;
}

.project-open{
text-align: center;
margin: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
}

.middle-line:before{
content: '';
position: absolute;
background: #f4f5f7;
width: 3px;
height: 100%;
top: 0;
right: 0;
left: 0;
bottom: 0;
margin: 0 auto;
}


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

.project-carousel.owl-theme .owl-controls .owl-buttons div {
color: #fff;
font-size: 24px;
background: #00549d;
border-radius: 50%;
width: 35px;
height: 35px;
line-height: 35px;
text-align: center;
}
.project-carousel.owl-theme .owl-controls .owl-buttons div.owl-prev {
position: absolute;
left: 0;
top: 50%;
}
.project-carousel.owl-theme .owl-controls .owl-buttons div.owl-next {
position: absolute;
right: 0;
top: 50%;
}


/*--------------- Associate ---------------*/ 

.associate-area{
background:url(../img/associate-bg.jpg) no-repeat center fixed;
background-size: cover;
padding: 50px 0px 70px;
}

.associate-area .heading h2{
color: #fff;
}

.associate-box{
background: #fff;
padding: 28px 45px;
box-shadow: 0px 1px 15px -2px rgba(2,2,2,0.10);
outline: 2px dashed #ddd;
outline-offset: -10px;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
}

.associate-box:hover{
outline-offset: 6px;
}

.associate-box img{
margin: 0px auto 20px;
}

.associate-box p{
color: #7b808c;
line-height: 22px;
letter-spacing: 0.2px;
font-size: 15px;
text-align: justify;
}

.associate-box ul{
text-align: center;
margin: 20px 0px 0px;
}


.associate-pop .modal-header {
padding: 20px 20px 0px 0px;
border-bottom: 0px;
text-align: right;
}

.associate-pop .modal-dialog {
margin: 8% auto 0;
}

.associate-pop .modal-header button{
background: none;
border: 0px;
outline: none;
display: inline-block;
}

.associate-pop .modal-body {
padding: 0px 15px 20px;
}

.associate-logo{
margin: 0px auto 28px !important;	
}

.associate-slider h4{
color: #00549d;
text-align: center;
font-size: 20px;
margin-bottom: 12px;
}

.associate-slider img{
margin-bottom: 10px;
}

/*-- carousel-control --*/

.carousel-control {
background-color: rgba(0,0,0,0.6);
background-image: none !important;
height: 150px;
opacity: 1;
filter: alpha(opacity=100);
top: 40%;
-webkit-transition: background-color 0.2s linear;
-moz-transition: background-color 0.2s linear;
-o-transition: background-color 0.2s linear;
transition: background-color 0.2s linear;
width: 40px;
}
.carousel-control:hover {
background-color: #00549d;
color: #fff;
}
.carousel-control .fa {
font-size: 36px;
line-height: 150px;
}
.carousel-control.left{
border-radius: 8px 0px 0px 8px;
left: -56px;
}
.carousel-control.right{
border-radius: 0px 8px 8px 0px;
right: -56px;
}


/*--------------- team ---------------*/ 

.team-area{
background:url(../img/team-bg.jpg) no-repeat bottom center;
padding: 50px 0px 70px;
}

.team-box{
background: #fff;
padding: 20px;
text-align: center;
}

.team-box h4{
margin-top: 0px;
}

.team-box p{
margin-bottom: 0px;
color: #7b808c;
letter-spacing: 0.2px;
font-size: 15px;	
}

.team-area .col-md-4{
margin-top: 20px;
}


/*--------------- query ---------------*/ 

.query-area{
background:url(../img/team-bg.jpg) no-repeat bottom center;
padding: 90px 0px 100px;
}

.query-area h2{
font-size: 42px;
font-weight: 700;
margin-top: 0px;
color: #303540;
margin-bottom: 15px;
}

.query-area p{
color: #7b808c;
line-height: 22px;
letter-spacing: 0.2px;
font-size: 15px;
text-align: justify;
}

.query-area .form-control{
margin-bottom: 18px;
border-radius: 0px;
height: 46px;
}

.query-area textarea{
height: auto !important;
}






/*--------------- contact ---------------*/ 

.contact-area{
background:#f8f8f8;
}

.no-left{
padding-left: 0px;
}

.contact-area iframe{
margin-top: 98px;	
}

.contact-box{
padding: 20px;
background: #fff;
margin-top: 98px;
box-shadow: 0px 0px 24px rgba(5,6,6,0.07);
}

.contact-box h4{
color: #00549d;
text-align: center;
margin-bottom: 40px;
}

.contact-item{
text-align: center;
border-right: 1px solid #eee;
padding: 40px 16px;
min-height: 239px;
}

.contact-box .col-md-4:nth-child(4) .contact-item{
border: 0px;
}

.contact-item img{
margin: 0 auto;
width: 45px;
}

.contact-item h5{
color: #303540;
font-size: 18px;
margin-top: 25px;
}

.contact-item p{
color: #7b808c;
margin: 0px;
}

.contact-item p a{
color: #7b808c;
text-decoration: none;
}


.copyright{
color: #fff;
background: #00549d;
padding: 12px 0px;
text-align: center;
}

.copyright p{
margin:0px;
letter-spacing: 0.2px;
}


/*--------------- back to top ---------------*/  

#toTop{
position: fixed;
bottom: 60px;
right: 20px;
cursor: pointer;
display: none;
background-color: #00549d;
color: #fff;
border: none;
border-radius: 0;
width: 45px;
height: 45px;
line-height: 41px;
}