/*----------------------------------------------------------------
                // Table of contents //

    0 Google Fonts CSS
    1 Basic CSS
    2 Preloader
    3 Header Area 
        A Main Menu
    4 Slider Area
    5 Advisor Area 
    6 Services Area
    7 Team Area
    8 Total Project Area 
    9 Testimonial Area 
    10 Blog Area  
    11 Footer Area

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


/*---------------------------------------
    0 Google Fonts CSS           
-----------------------------------------*/
@import "https://fonts.googleapis.com/css?family=Montserrat:200,300,400,500,600,700";
@import "https://fonts.googleapis.com/css?family=Roboto:400,500,700";

/*---------------------------------------
    1 Basic CSS            
-----------------------------------------*/
* {
    margin: 0;
    padding: 0;
}
body {
    color: #444;
    font-family: "roboto",sans-serif;
    font-size: 16px;
    line-height: 24px;
}
a {
    color: #000;
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    margin-bottom: 15px;
}
h1 {
    font-size: 35px;
    line-height: 35px;
}
img {
    border: medium none;
    height: auto;
    max-width: 100%;
}
input[type="text"], input[type="email"], textarea {
    border: 1px solid #ddd;
    padding: 5px;
}
input[type="submit"] {
    background: #444 none repeat scroll 0 0;
    border: medium none;
    color: #fff;
    cursor: pointer;
    padding: 5px 15px;
}
ul, ol {
    margin: 15px 0 15px 15px;
}
.fix {
    overflow: hidden;
}
.alignleft {
    float: left;
    margin-right: 10px;
}
.alignright {
    float: right;
    margin-left: 10px;
}
.aligncenter {
    display: block;
    margin: 0 auto;
}
.floatleft {
    float: left;
}
.floatright {
    float: right;
}
.column {
    display: block;
    margin: 0 auto;
    transition: all 0.9s ease 0s;
    width: 1170px;
}
.se-margin {
    margin-bottom: 100px;
    margin-top: 100px;
}
.center{
    text-align: center;
}
.justify{
    text-align: justify;
}
/*---------------------------------------
    2 Preloader             
-----------------------------------------*/

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  /* change if the mask should have another color then white */
  z-index: 9999;
  /* makes sure it stays on top */
}

#status {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  background-image: url(img/preloader.gif);
  /* path to your loading animation */
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px;
  /* is width and height divided by two */
}

/*---------------------------------------
    3 Header Area               
-----------------------------------------*/

.header_area {
    background-color: #F6F6F6; /*#191712;*/
}
.header {
}
.logo {
    margin-top: 38px;
}
/*=================================
    A Main Menu
===================================*/
.main-menu {}
.main-menu nav ul {    margin: 0;
}
.main-menu nav ul li {
    display: inline-block;
    list-style: outside none none;
    margin-right: 5px;
	padding: 0 15px;
}
.main-menu nav ul li:last-child {
    margin-right: 0;
}
.main-menu nav ul li a {
    color: #4b4b4b;
    display: block;
    font-family: Roboto;
    font-size: 14px;
    font-weight: 700;
    padding: 45px 0px;
    text-transform: uppercase;
}
.main-menu nav ul li a:hover, .main-menu nav ul li.active-menu a {
    border-bottom: 2px solid #00b8de;
    color: #00b8de;
    padding-bottom: 43px;
}
#main-menu a:focus {
  outline: none;
}
.slicknav_menu{display: none;}

/*---------------------------------------
    4 Slider Area              
-----------------------------------------*/
.slider-area {
background:url(img/Slider.jpg);
background-size: cover;
min-height: 800px;
position: relative;
}
.sliders {}
.single-slider{margin-top: 217px;width: 76%;}
.single-slider h1{font-family: Montserrat;
font-weight: 200;
color: #fff;
font-size: 48px;
margin: 0;
margin-bottom: 27px;}
.single-slider h2{margin: 0;
font-family: Montserrat;
font-weight: 400;
color: #00b8de;
font-size: 28px;
margin-bottom: 40px;}
.single-slider p{font-family: roboto;
font-size: 16px;
color: #fff;
font-weight: normal;
}
.slider-button{margin-top: 40px;}
.slider-button a{color: #fff;
font-size: 16px;
font-family: roboto;
font-weight: 700;
text-transform: uppercase;
padding: 19px 47px;
display: inline-block;
border-radius: 3px;
margin-right: 30px;border:1px solid #fff;}
.slider-button a:hover{background: #00b8de;border:1px solid #00b8de;}
.sliders .owl-dots{position: absolute;
left: -197px;
top: 60%;}
.sliders .owl-dots .owl-dot{border: 1px solid #fff;
display: block;
width: 10px;
height: 6px;
margin-bottom: 10px;
transition: 0.3s ease-in-out;
}
.sliders .owl-dots .owl-dot.active, .sliders .owl-dots .owl-dot:hover{width:20px;height:6px;border-color:#00b8de;background-color:#00b8de;transition: 0.3s}
/*---------------------------------------
    5 Advisor Area               
-----------------------------------------*/
.advisor-area {
}
.advisor {
}
.single-advisor {
    margin-right: 110px;
    text-align: center;
    width: 27%;
}
.single-advisor:last-child {
    margin-right: 0;
}
.single-advisor h2 {
    color: #333333;
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 18px;
    margin-top: 22px;
}
.single-advisor p {
    color: #333333;
    font-family: Roboto;
    font-size: 16px;
    font-weight: 400;
    
}
/*---------------------------------------
    6 Services Area               
-----------------------------------------*/
.services-area {
    background-color: #f4f4f4;
}
.services {
}
.services-hedding {    
    text-align: center;
}
.services-hedding h2 {
    font-family: Montserrat;
    font-size: 24px;
    font-weight: 500;
    margin: 70px auto 0;
}
.viline {
    background-color: #cccccc;
    height: 1px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 24px;
    width: 12%;
    margin-bottom: 30px;
}
.viline::before {
    background-color: #cccccc;
    content: "";
    display: inline-block;
    height: 8px;
    margin-left: -5px;
    margin-top: -4px;
    position: absolute;
    transform: rotate(40deg);
    width: 8px;
}
.viline::after {
    background-color: #cccccc;
    content: "";
    display: inline-block;
    height: 8px;
    margin-left: 5px;
    margin-top: -4px;
    position: absolute;
    transform: rotate(40deg);
    width: 8px;
}
.services-contents {
}
.left-services {
    margin-right: 20px;
    text-align: right;
    width: 31.5%;
}
.single-service {
    margin-bottom: 62px;
    overflow: hidden;
}
.single-service-content {
    margin-right: 29px;
    width: 71%;
}
.single-service-content h2 {
    color: #333333;
    font-family: montserrat;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 19px;
    margin-top: 0;
}
.single-service-content p {
    color: #333333;
    font-family: roboto;
    font-size: 16px;
    font-weight: 400;
}
.single-service-icon {
}
.single-service-icon i {
    border: 1px solid #cccccc;
    border-radius: 5px;
    font-size: 36px;
    padding: 17px;
}
.services-img {
    width: 28%;
    margin-bottom: 60px;
}
.services-img img {
}
.right-services {
    margin-left: 85px;
    text-align: left;
    width: 31.5%;
}
.right-services .single-service-content {margin-right:0;margin-left:29px;}

.single-service:hover .single-service-content h2 {color:#00b8de;transition: all 0.2s ease 0s;}
.single-service:hover .single-service-icon i {color:#00b8de;border:1px solid #00b8de;transition: all 0.2s ease 0s;}

/*---------------------------------------
    7 Team Area               
-----------------------------------------*/
.team-area {
}
.team {
}
.team-hedding {text-align: center;
}
.team-hedding h2 {text-align: center;
font-family: montserrat;
font-weight: 600;
font-size: 24px;
color: #333333;
margin-top: 0;margin-bottom: 20px;}
.team-hedding p {color: #333333;
font-size: 16px;
font-family: roboto;
font-weight: 400;
width: 70%;
margin: 0 auto;
margin-bottom: 69px;
}
.team-contents {
}
.single-team-member {position: relative;
}
.single-img{position: relative;}
.single-img img{border: 1px solid #cccccc;
margin-bottom: 2px;
}
.single-team-view {background: rgba(0, 0, 0, 0) url("img/latest-work-ov.png") repeat scroll 0 0;
height: 0;
left: 0;
position: absolute;
text-align: center;
top: 0;
width: 100%;transition: all 0.3s ease 0s;}
.single-team-view a i{color: #fff;
font-size: 28px;
margin-top: 44%;
text-align: center;display:none;}
.team-member-details {background-color: #333333;
color: #fff;
text-align: center;
}
.team-member-details h2 {font-family: montserrat;
font-size: 18px;
margin: 0;
margin-bottom: 12px;
padding-top: 40px;
}
.team-member-details h3 {font-family: roboto;
font-weight: 400;
font-size: 16px;
margin-top: 0;
padding-bottom: 30px;
margin-bottom: 25px;}
.social-profile {position: absolute;
bottom: -18px;
left: 0;
right: 0;

}
.social-profile a{}
.social-profile a i{font-size: 16px;
color: #fff;
background-color: #333333;
border: 3px solid #fff;
border-radius: 500px;
height: 37px;
width: 37px;
text-align: center;
padding-top: 8px;}
.single-team-member:hover .team-member-details{background-color:#00b8de;transition: 0.3s;}
.social-profile a i:hover{background-color:#00b8de;}
.single-team-member:hover .single-team-view {height:100%;}
.single-team-member:hover .single-team-view a i{display:block;}

/*---------------------------------------
    8 Total Project Area               
-----------------------------------------*/
.total-project-area {background-image: url(img/counter-bg.jpg);
background-size: cover;
}
.total-project {text-align: center;
}
.single-project {width: 25%;
color: #fff;
}
.single-project i {font-size: 40px;}
.single-project h2 {font-family: montserrat;
font-weight: 600;
font-size: 30px;
}
.single-project h3 {font-family: montserrat;
font-size: 18px;
font-weight: 600;
}
.latest-works-area {
}
.latest-works {
}
.latest-works-headline {text-align: center;
}
.latest-works-headline h2 {font-family: montserrat;
font-weight: 600;
color: #333333;
font-size: 24px;margin:0;}
.latest-works-headline p {font-size: 16px;
color: #333333;
font-family: roboto;
font-weight: 400;
width: 70%;
margin: 0 auto;
    margin-bottom: 0px;
margin-bottom: 69px;
}
.latest-works-content {
}
.single-latest-work {overflow: hidden;margin-bottom: 30px;margin-right: 30px;float: left;position: relative; border: 1px soild #333;}
.imgmargin-ziro{margin-right:0;}
.single-latest-work img {position: relative;}
.single-works{}
.single-works-link {left: 0;top: 0;width: 100%;background: url(img/latest-work-ov.png);text-align: center;height: 0;position: absolute;transition: 0.3s ease-out;}
.single-latest-work:hover .single-works-link{height:100%;transition: 0.5s;}
.single-works-link a{color: #d5d5d5;display: block;position: absolute;left: 50%;top: 50%;transform: translate(-50%);-webkit-transform: translate(-50%);-moz-transform: translate(-50%);-o-transform: translate(-50%);}
.single-works-link a i {font-size: 24px;display: none;}
.single-latest-work:hover .single-works-link a i{display: block}

/*---------------------------------------
    9 Testimonial Area               
-----------------------------------------*/
.testimonial-area {background: url(img/testimonial-bg.jpg);
background-size: cover;
min-height: 300px;
}
.testimonial {margin-top: 55px;
margin-bottom: 55px;
}
.testimonial .owl-stage-outer{}
.testimonial .owl-stage-outer .owl-stage{}
.single-testimonial {
    width: 70%;
    margin: 0 auto;
    text-align: center;
}
.single-testimonial i{font-size: 25px;
color: #fff;;
}
.single-testimonial p{color: #fff;
font-family: roboto;
font-weight: 400;
font-size: 16px;margin-top: 15px;
margin-bottom: 20px;}
.testimonial-info {display: inline-block;
}
.testimonial-img {margin-right: 15px;
}
.testimonial-img img{border-radius:3px;}
.testimonial-name {margin-top: 26px;}
.testimonial-name h2{margin: 0;
font-family: roboto;
font-weight: 700;
color: #fff;
margin-bottom: 8px;
font-size:18px;
}
.testimonial-name h3{margin: 0;
color: #fff;
font-family: roboto;
color: #fff;
font-size: 16px;
}
.testimonial-area .owl-nav{position: absolute;
top: 40%;
left: -19%;
right: -19%;}
.testimonial-area .owl-nav div{}
.testimonial-area .owl-nav div.owl-prev{float: left;}
.testimonial-area .owl-nav div.owl-prev i, .testimonial-area .owl-nav div.owl-next i{color: #fff;
font-size: 14px;
padding: 17px 19px;
border: 1px solid #fff;
}
.testimonial-area .owl-nav div.owl-prev i:hover, .testimonial-area .owl-nav div.owl-next i:hover{border-color:#00b8de;color:#00b8de;}
.testimonial-area .owl-nav div.owl-next{float: right;}

/*---------------------------------------
    10 Blog Area               
-----------------------------------------*/
.blog-area {
}
.viblog {
}
.blog-headding {text-align: center;margin-bottom: 70px;}
.blog-headding h2 {font-size:24px;color:#333333;font-family: roboto;font-weight: 600;margin: 0;}
.blog-headding p {color: #333333;
font-family: roboto;
font-size: 16px;
font-weight: 400;
margin: 0 auto;
width: 70%;}
.single-blog {width: 48.7%;
}
.single-blog:first-child{margin-right: 30px;}
.article-info {position: relative;
}
.blog-img {
}
.imagehover{background: url(img/latest-work-ov.png);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
visibility: hidden;
opacity: 0;
transition: 0.3s ease-in-out;
}
.single-blog:hover .imagehover {opacity: 1;visibility: visible;transition: 0.3s;}
.article-date {background-color: #333333;
color: #fff;
font-family: Montserrat;
font-weight: 600;
font-size: 16px;
padding: 20px 18px;
text-align: center;
position: absolute;
bottom: -40px;
left: 0;
transition: 0.3s ease-in-out;
}
.atcile-comment {font-family: roboto;font-weight: 600;margin-top: 20px;
}
.atcile-comment i {font-size: 14px;color:#aaa;transition: 0.3s ease-in-out;}
.blog-title {}
.blog-title a {}
.blog-title a h2{color: #333333;
font-size: 18px;
font-family: roboto;
font-weight: 700;
margin-bottom: 21px;margin-top: 76px;}
.blog-contnet {}
.blog-contnet p {font-size: 16px;color:#333333;font-family: roboto;font-weight: 400;}
.blog-readmore {}
.blog-readmore a{font-family: roboto;font-weight: 600;color:#333333;font-size:16px;}
.single-blog:hover .article-date{background-color:#00b8de;transition: 0.3s;}
.single-blog:hover .blog-readmore a{color:#00b8de;transition: 0.3s;}
.single-blog:hover .atcile-comment i{color:#00b8de;transition: 0.3s;}
.atcile-comment i:first-child{margin-right:15px;}
.branding-area {background: url(img/brand-logo-bg.jpg);
background-size: cover;}


.branding-logo {margin-top: 115px;
margin-bottom: 115px;}
.branding-logo .owl-carousel, .owl-carousel .owl-item {
 padding:1px;
}
.single-logo {}
.single-logo img {padding:21px;border: 1px solid #00b8de;}



/*---------------------------------------
    11 Footer Area               
-----------------------------------------*/
.footer-area {
    background-color: #f4f4f4;
}
.footer {margin-top:100px;
}
.widgets-area {margin-bottom: 56px;
}
.single-widget {width: 21.7%;margin-right: 50px;
}
.single-widget:last-child{margin-right:0;}
.single-widget h2 {margin: 0;
margin-bottom: 26px;
font-family: Montserrat;
color: #333333;
font-weight: 600;
font-size: 16px;
}
.single-widget h3 {margin: 0;
font-family: roboto;
font-weight: 600;
color: #333333;
font-size: 16px;}
.single-widget.vi-gallery ul li {display: inline-block;
list-style: none;
margin-right: 12px;margin-bottom: 12px;
}
.single-widget.vi-gallery ul li:nth-child(3), .single-widget.vi-gallery ul li:nth-child(6){margin-right:0;}
.single-widget.vi-gallery ul li a{}
.single-widget ul{margin: 0;
padding: 0;}
.single-widget ul li{margin-bottom: 15px;display: block;list-style:none;}
.single-widget ul li a{font-size: 16px;
color: #333333;
font-family: roboto;
font-weight: 400;}
.single-widget ul li a:hover{}
.single-widget p{color: #333333;
font-family: roboto;
font-weight: 400;
font-size: 16px;
}
.single-widget > img {margin-bottom: 19px;}
.social-link {margin-top: 28px;}
.social-link p{font-family: roboto;font-weight: 600;color:#333333;font-size:16px;}
.social-link p a{margin: 0 12.5px;}
.social-link p a i{color:#333333;font-size:16px;}
.social-link p a i:hover{color:#00b8de;}
.copyright {text-align: center;
border-top: 1px solid #cccccc;}
.copyright p{color:#333333;font-size: 14px;font-family: roboto;font-weight: 300;margin:20px 0;}