/*
	Project Name : Specialists
	Author Company : SpecThemes
	Project Date: 25 june, 2017
	Template Developer: vsafaryan50yan@gmail.com
*/


/*
==============================================
TABLE OF CONTENT
==============================================

1. MAIN Styles
	a) Sections (white, grey, parallax)
	b) Main Heading
	c) Page Title 
	d) buttons
	e) owl carousel dots

2. Builder classes
	a) Text content
	b) Images
	c) Video box
	d) Frames
	e) Shadows	
	f) backgrounds

3. Top-Bar Styles
4. Navbar Styles
5. Articles section
6. Services styles
7. Counter styles
8. Testmonials Style6. Services Styles
9. Latest projects Styles (Isotop)
10. Team members
11. Blog Grid
12. Blog List
13. Tabs
14. Pricing plan
15. Partners
16. Typed text
17. Progress Bar
18. Accordions
19. Preloader
20. Scroll To Top Button
21. 404 Page
22. Contorms
24. Google Maps
25. Footer
26. Project Detail
27. Service Detail
28. Blog Post 


==============================================
[END] TABLE OF CONTENT
==============================================
*/





/*-----------------------------------------
1. MAIN Styles
-------------------------------------------*/

/*------------------
 a) block-section
--------------------*/
.block-section{
	padding: 90px 0px 20px 0px;
}
.grey-section{
	background: #fafafa;
}
.parallax-section{
    background-size: cover;
    background-attachment: fixed;	
	padding: 90px 0px 90px 0px;
	background-position: 50% 50%;
}


/*------------------
 b) Main Heading
--------------------*/
.main-heading h2{
	font-size: 40px;
	font-weight: 400;
	color: #424040;
	margin: 0px;
}

.main-heading h3{         
	font-size: 35px;
	font-weight: 400;
	color: #424040;
	margin: 0px;
}

.main-heading h5{
	font-size: 14px;
	font-weight: 500;
	line-height: 30px;
	text-transform: uppercase;
	color: #bbb;
	margin: 0px;
}

.main-heading p{
	font-size: 16px;
	line-height: 30px;
	font-weight: 500;
	color: #424040;
	margin: 25px 0px 15px 0px;
}


.main-heading-white h3{
	font-size: 35px;
	font-weight: 400;
	color: #fff;
	margin: 0px;
}

.main-heading-white h5{
	font-size: 14px;
	font-weight: 500;
	line-height: 30px;
	text-transform: uppercase;	
	color: #fff;
	margin: 0px;
}

.main-heading-white p{
	font-size: 16px;
	line-height: 30px;
	font-weight: 500;
	color: #fff;
	margin: 25px 0px 15px 0px;
}


/*------------------
 c) Page Title
--------------------*/
.page-title{
	padding: 70px 0px 70px 0px;
}
.page-title h1{
	font-size: 40px;
	line-height: 50px;
	font-weight: 400;
	color: #fff;
	margin: 0px;
}

.page-title ul{
	padding: 10px 0px 0px 0px;
}
.page-title ul li{
	display: inline-block;
	list-style-type: none;
	font-size: 15px;
	line-height: 25px;
	font-weight: 500;
	color: #fff;
}

.page-title ul li a{
	color: #fff;
}
.page-title ul li a:hover{
	color: #1D9BD4;
}


.page-title ul li:after{
	content: " /";
	font-size: 12px;
	color: #fff;
	padding: 0px 5px 0px 5px;
}
.page-title ul li:last-child:after{
	content: none;
}


/*------------------
 d) buttons
--------------------*/
.button{
	display: inline-block;
}

.button-text{
	font-size: 13px;
	font-weight: 600;	
	color: #1d9bd4;
	padding: 15px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.button-text:hover{
	color: #444;
}

.button-simple{
	font-size: 14px;
	font-weight: 500;
	color: #fff;	
	padding: 10px 25px 10px 25px;
	border: 2px solid #1d9bd4;
	border-radius: 5px;
	background: #1d9bd4;
	text-align: center;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.button-simple:hover{
	color: #1d9bd4;	
	background: transparent;
	text-decoration: none;
}

/*------------------
 e) owl carousel dots
--------------------*/
.custom-dot {
	display: inline-block;
	z-index: 1;
}
.custom-dot span {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #bbb;
    cursor: pointer;
    display: block;
    -webkit-backface-visibility: visible;
    border-radius: 30px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;    
}
.custom-dot span:hover {
    background: #aaa;
    -webkit-backface-visibility: visible;
    border-radius: 30px;
}
.custom-dot.active span{
    width: 10px;
    height: 10px;	
    background: #1d9bd4;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;    
}



/*-----------------------------------------
2. Builder Classes
-------------------------------------------*/

/*------------------
 a) Text Content
--------------------*/
.text-content h5{
	font-size: 15px;
	font-weight: 400;
	color: #424040;
	line-height: 27px;	
}
.text-content h4{
	font-size: 19px;
	font-weight: 400;
	color: #424040;
	line-height: 27px;	
}
.text-content h3{
	font-size: 25px;
	font-weight: 400;
	color: #424040;
	line-height: 27px;	
}
.text-content h2{
	font-size: 30px;
	font-weight: 400;
	color: #424040;
	line-height: 27px;	
}
.text-content p{
	font-size: 15px;
	font-weight: 500;
	color: #777;
	line-height: 27px;
}

.primary-color{
	display: inline;
	color: #1d9bd4 !important;
}
.primary-color h5{
	color: #1d9bd4;
}
.primary-color h4{
	color: #1d9bd4;
}
.primary-color h3{
	color: #1d9bd4;
}
.primary-color h2{
	color: #1d9bd4;
}
.primary-color h1{
	color: #1d9bd4;
}
.primary-color h1{
	color: #1d9bd4;
}
.primary-color p{
	color: #1d9bd4;
}
.primary-color i{
	color: #1d9bd4;
}


/*Use Tis class for making all texts in div white*/
.white-color{	
	color: #fff !important;
}
.white-color h6{
	color: #fff;
}
.white-color h5{
	color: #fff;
}
.white-color h4{
	color: #fff;
}
.white-color h3{
	color: #fff;
}
.white-color h2{
	color: #fff;
}
.white-color h1{
	color: #fff;
}
.white-color h1{
	color: #fff;
}
.white-color p{
	color: #fff;
}
.white-color i{
	color: #fff;
}



.fw-300 {
 	font-weight: 300 !important;
}
.fw-400 {
 	font-weight: 400 !important;
}
.fw-500 {
 	font-weight: 500 !important;
}
.fw-600 {
  	font-weight: 600 !important;
}



.uppercase{
	text-transform: uppercase;
}



/*------------------
 b) Images
--------------------*/
.image-shadow{
	border-radius: 10px;
    -webkit-box-shadow: 0 0 40px rgba(0,0,0,0.25);
    box-shadow: 0 0 40px rgba(0,0,0,0.25);	
}


/*------------------
 c) Video box
--------------------*/
.video-box{
	border-radius: 10px;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 30px;
}

.video-play-icon{
	position: absolute;
	top: 50%;
	left: 50%;
	right: 50%;	
	display: inline-block;
	border-radius: 50%;
	background: #fff;
	color: #333;
	width: 100px;
	height: 100px; 
	opacity: 0.8;
    -webkit-transform: translate3d(-45%, -45%, 0);	
	-webkit-transition-duration: .3s;
	transition-duration: .3s;    

}
.video-play-icon:before{
	font-family: FontAwesome;
	font-size: 14px;
	content: "\f04b";
}

.video-play-icon:hover{
	opacity: 1; 
}

.video-play-icon:active{
	width: 90px;
	height: 90px;
}

.video-sm{
	min-height: 350px;
}
.video-md{
	min-height: 450px;
}
.video-lg{
	min-height: 550px;
}


/*------------------
 d) Frames
--------------------*/
.full-width{
	width: 100%;
}
.round-frame{
	border-radius: 10px;
}


/* e) Shadows
--------------------*/
.light-shadow{
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);	
}

.hover-shadow:hover{
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);
}


/* f) Backgrounds
--------------------*/
.black-transparent-bg{
	background: rgba(0,0,0, 0.3);
	padding: 15px;	
}




/*-----------------------------------------
3. Top-Bar Styles
-------------------------------------------*/
#top-bar{
	background: #fff;
	border-bottom: 1px solid #eee;
	min-height: 50px;
}
.top-bar-info {
	padding: 0px;
}
.top-bar-info li{
	font-size: 13px;
	font-weight: 500;
	color: #777;
	list-style-type: none;
	float: left;
	margin: 0px;
	padding: 16px 16px 16px 0px;
}
.top-bar-info li i{
	font-size: 15px;
	color: #1d9bd4;
	padding-right: 8px;
}

.social-icons{
	padding: 0px;
	float: right;
	margin: 0px;
}
.social-icons li{
	font-size: 14px;
	list-style-type: none;
	float: left;
	width: 50px;
	text-align: center;
	border-left: 1px solid #eee;
	margin: 0px;
	padding: 15px 10px 15px 10px;	
}
.social-icons li:last-child{
	border-right: 1px solid #eee;
}
.social-icons li a{
	color: #777;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;	
}
.social-icons a:hover{
	color: #1d9bd4;
}




/*-----------------------------------------
4. Navbar Styles
-------------------------------------------*/
.affix {
  top: 0;
  width: 100%;
  z-index: 99999;
}

/*Disables affix on small devices*/
@media (max-width: 767px) {
    .affix {
        position: static;
    }
}

.navbar-nav{
	margin: 0px;
}
.navbar-header-custom{
	background: #fff;
	padding: 25px 0px 25px 0px;
}

.navbar-logo img{
	max-width: 100%;
	margin-left: 15px;
	max-height: 50px;
}
.navbar-custom{
	background: #fff;
	border: none;
	border-radius: 0px;
	padding: 0px 0px 0px 0px;
    -webkit-box-shadow: 0px 3px 6px 0px rgba(20, 20, 20, 0.05);
	-moz-box-shadow:    0px 3px 6px 0px rgba(20, 20, 20, 0.05);
	box-shadow:         0px 3px 6px 0px rgba(20, 20, 20, 0.05);
	margin-bottom: 0px;
}


.navbar-custom .navbar-links-custom li {
	padding: 25px 0px 25px 0px;
}
.navbar-custom .navbar-links-custom li a{
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;	
	letter-spacing: 0.5px;
	color: #444;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.navbar-custom .navbar-links-custom li a i{
	font-size: 9px;
	font-weight: normal;
}
.navbar-custom .navbar-links-custom li a:hover{
	color: #1d9bd4;
}
@media screen and (max-width:767px) {
	.navbar-custom .navbar-links-custom li{
	font-size: 13px;
	font-weight: bold;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;	
    border-bottom: 1px solid #eee;
    padding: 0px;
    margin: 0px;
	}
	.navbar-custom .navbar-links-custom li:last-child{
    	border-bottom: none;
	}
	.navbar-custom .navbar-links-custom li a{
		margin: 0px;
		padding: 15px;
	}	
}

.navbar-links-custom .dropdown ul{
	border: none;
	border-radius: 0px;
	padding: 10px;
	margin-left: 5px;
	-webkit-box-shadow: 0px 5px 9px 0px rgba(50, 50, 50, 0.15);
	-moz-box-shadow:    0px 5px 9px 0px rgba(50, 50, 50, 0.15);
	box-shadow:         0px 5px 9px 0px rgba(50, 50, 50, 0.15);	
}
.navbar-links-custom .dropdown ul li{
	padding: 0px;
	border:none;
}
.navbar-links-custom .dropdown ul li a{
	font-weight: 700;
	padding: 12px;
	width: 200px;
	text-transform: none;
	text-align: left;
	color: #444;
}

.navbar-links-custom .dropdown ul li a:hover{
	background: #1d9bd4;
	color: #fff !important;
}


/*DROPDOWN ICON STYLES*/
.navbar-links-custom .dropdown .dropdown-toggle:after{
	content: "\f107";
	font-family: FontAwesome;
	padding-left: 6px;
}

.active-link a{
	color: #1d9bd4 !important;
}

@media screen and (max-width:767px) {
	.navbar-links-custom .dropdown ul li a:hover{
		color: #1d9bd4 !important;
	}	
}


.menu-icon{
	border: none;
	background: none; 	
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: transparent;
}


/*-----------------------------------------
5. Articles section
-------------------------------------------*/
.article-block{
	margin-top: 15px;
	text-align: center;
	padding: 45px;
	border: 1px solid #ececec;
	border-radius: 10px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;			
}

.article-block i{
	font-size: 60px;
	color: #666;
}
.article-block h4{
	font-size: 19px;
	font-weight: 500;
	color: #343434;
	margin-top: 35px;
}
.article-block p{
	font-size: 14px;
	font-weight: 500;
	line-height: 25px;
	color: #999;
	margin-top: 20px;
	margin-bottom: 50px;
}



/*-----------------------------------------
6. Services Styles
-------------------------------------------*/
.our-services-carousel{
	margin-top: 70px;
}
.our-services{
	background: #fff;
	margin: 15px;
	margin-bottom: 50px;
	border-radius: 10px;
	border: 1px solid #ececec;
	overflow: hidden;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;
}
.our-services img{
	width: 100%;
}

.content-our-services{
	padding: 25px;
}

.content-our-services h4{
	font-size: 18px;
	font-weight: 500;
	color: #424040;	
	text-align: left;
	display: inline-block;
	margin-top: 0px;
}
.content-our-services p{
	font-size: 13px;
	font-weight: 500;
	color: #999;	
	line-height: 23px;
	text-align: left;
	margin: 0px;
	margin-bottom: 15px;
}
.content-our-services a{
	font-size: 13px;
	font-weight: 600;	
	color: #1d9bd4;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.content-our-services a:hover{
	color: #444;
}




/*-----------------------------------------
7. Counter Styles
-------------------------------------------*/
.counter-section{
	margin: 0px;
}
.counter-item{
	text-align: center;
}
@media screen and (max-width:767px) {
	.counter-item{
		margin-top: 50px;
		margin-bottom: 50px;
	}
}
.counter-item h4{
	font-size: 35px;
	font-weight: 400;
	color: #fff;
	margin: 15px;	
}
.counter-item p{
	font-size: 17px;
	font-weight: 500;
	color: #fff;
	margin: 0px;	
}
.counter-item i{
	font-size: 55px;
	color: #fff;	
}



/*-----------------------------------------
8. Testmonials Styles 
-------------------------------------------*/
.testmonials-section{
	margin-top: 70px;
}
.testmonial-item{
	margin: 45px 15px 15px 15px;
	padding: 50px;
	background: #fff;
	text-align: center;
	margin-bottom: 50px;
	border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);		
}
.testmonial-item img{
	width: 90px !important;
	height: 90px;
	border-radius: 50%;
	display: inline !important;
	margin-bottom: 0px;
	margin-top: -115px;
}

.content-testmonial-item h4{
    font-size: 20px;
    font-weight: 500;
    color: #343434;
	text-align: center;
	margin: 0px;
}
.content-testmonial-item p{
	font-size: 14px;
	font-weight: 500;
	font-style: italic;
	color: #999;
	text-align: center;
	line-height: 25px;
	margin-top: 20px;
}
.content-testmonial-item p:before{
	content: "''";
	font-weight: 100;
	font-family: FontAwesome;
	margin-right: 5px;
}
.content-testmonial-item p:after{
	content: "''";
	font-weight: 100;
	font-family: FontAwesome;
	margin-left: 5px;
}



/*-----------------------------------------
9. Latest projects Styles (Isotop)
-------------------------------------------*/
.latest-projects{
	margin-top: 60px;
}
.overlay-container{
	position: relative;
}
.project-item img{
	display: block;
	width: 100%;
	height: auto;
	border-radius: 10px;
	margin-bottom: 15px;
	margin-top: 15px;
}

.project-item-overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	border-radius: 10px;
	background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	transition: .5s ease;
}

.overlay-container:hover .project-item-overlay {
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	opacity: 1;
	height: 100%;
	width: 100%;	
	height: 100%;
	transition: .5s ease;
}
.project-item-overlay h4 {
	font-size: 21px;
	font-weight: 500;	
	white-space: nowrap; 
	color: white;
	position: absolute;
	overflow: hidden;
	bottom: 40px;
	left: 10%;
}
.project-item-overlay p {
	font-size: 13px;
	font-weight: 500;	
	white-space: nowrap; 
	color: white;
	position: absolute;
	overflow: hidden;
	bottom: 15px;
	left: 10%;
}

.isotop-button{
	font-size: 13px;
	font-weight: 600;	
	color: #bbb;
	padding: 15px 15px 15px 0px ;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.isotop-button:after{
	content: "/";
	font-weight: 400;	
	color: #bbb;
	padding-left: 15px;
}
.isotop-button:last-child:after{
	content: none;
}

.isotop-button:hover{
	color: #424040;
}

.isotop-button:active,
.isotop-button.is-checked {
	color: #424040;
}



/*-----------------------------------------
10. Team members
-------------------------------------------*/
.member-frame {
  position: relative;
  width: 100%;
  margin: 0px 0px 30px 0px;
}
.member-frame img{
	width: 100%;
	border-radius: 10px;
}

.team-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background: rgba(0,0,0,  0.8);
  border-radius: 10px;  
}

.member-frame:hover .team-overlay {
  opacity: 1;
}

.team-overlay-text {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}

.team-overlay-text a{
  color: #fff;
  font-size: 23px;
  text-align: center;
  padding: 10px;
  margin-top: 20px;
  margin-left: 10px;
  transition: .5s ease;
}

@media screen and (max-width:370px) {
  .team-overlay-text a{
  padding: 0px; 
  }
}

.team-overlay-text a:hover{
  color: #1D9BD4;
  transition: .5s ease;
}

.team-overlay-text h4{
  color: #fff;
  font-size: 22px;
  font-weight: 400;
  text-align: center;
}

.team-overlay-text p{
  color: #fff;
  font-size: 16px;
  text-align: center;
}



/*-----------------------------------------
11. Blog Grid
-------------------------------------------*/
.blog-grid{
  position: relative;
  margin-bottom: 30px;
  background: #fff;
  border-radius: 10px;
  border: 1px solid #eee;
  overflow: hidden;
  -webkit-transition-duration: .3s;
  transition-duration: .3s;  
}
.blog-grid:hover{
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);
}

.blog-grid-img img {
  position: relative;
  width: 100%;
  transition: .3s ease;
}

.blog-grid-content {
  margin-top: 15px;  
  padding: 20px 30px 20px 30px;
}

.blog-grid-content span{
   font-size: 13px;
   font-weight: 500;
   color: #777;
}

.blog-grid-content h3{
  margin-top: 10px;
  margin-bottom: 20px;  
}
.blog-grid-content h3 a{
  color: #424040; 
  font-size: 28px;
  font-weight: 400;
}
.blog-grid-content h3 a:hover{
  color: #1d9bd4; 
}

.blog-grid-content p{
  font-weight: 500;
  font-size: 14px;
  color: #777;  
  line-height: 25px;
  margin-top: 10px;  
}

.blog-bottom {
  font-weight: 500;
  border-top: 1px solid #eee;
  margin-top: 40px;
}

.blog-bottom a{
  display: inline-block;  
  font-size: 12px;
  color: #777;
  padding-top: 20px;
  padding-right: 15px;
}
.blog-bottom a i{
  font-size: 14px;  
  padding-right: 5px;
}
.blog-bottom a:hover{
  color: #1d9bd4;
}



/*-----------------------------------------
12. Blog List
-------------------------------------------*/
.blog-image {
	position: relative;
  	width: 100%;
}
.blog-image img{
  position: relative;
  border-radius: 10px;
  width: 100%;
}

.blog-list-item{
	margin: 30px 0px 20px 0px;
}

.blog-list-item h2 a{
	display: inline-block;
	font-size: 30px;
	font-weight: 400;
	color: #424040;
	text-decoration: none;
}
.blog-list-item h2 a:hover{
    color: #1D9BD4;
}


.blog-list-info{
    display: inline-block;
    margin-top: 10px;
    margin-right: 20px;
}

.blog-list-info i{
    color: #1d9bd4; 
    font-size: 20px;
    font-weight: 500;
    margin-right: 3px;
}    

.blog-list-info span{
    font-size: 16px;
    font-weight: 500;
    color: #979797;
    margin-left: 5px;
}


.blog-list-item p{
	color: #777; 
	line-height: 24px;
	font-size: 13px;
	font-weight: 500;
	border-bottom: 1px solid #eee;
	padding-bottom: 20px;
	margin-top: 20px;
}


.share{
	margin-top: 30px;
	border-bottom: 1px solid #eee;
	padding-bottom: 10px;
}

.communications-box{
    display: block;
    height: auto;
    margin-top: 30px;
    margin-bottom: 20px;
}

.social-icon{
    display: inline-block;
}
.social-icon a i{
    width: 40px;
    height: 40px;
    color: #757575;
    font-size: 15px;
    border: 1px solid #eee;
    border-radius: 5px;
    text-align: center;
    margin-right: 5px;    
    padding-top: 13px;
}
.social-icon a i:hover{
    color: #1D9BD4;
}


.blog-side-box{
  padding: 15px 0px 15px 0px;
}

.blog-side-box h4{
  font-size: 20px;
  font-weight: 500;
  color: #424040;
  border-bottom: 1px solid #eee;    
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.blog-side-box p{
  font-size: 13px;
  font-weight: 500;
  line-height: 180%;
  color: #424040;
}



.categories ul li{
    list-style-type: none;
    padding-left: 0px;
    margin-top: 15px;
}

.categories ul {
    padding-left: 0px;
    margin-top: 30px;
}

.categories ul li a{
    font-size: 16px;
    color: #676767;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s; 
}
.categories ul li a:hover{
    font-size: 16px;
    color: #1d9bd4;
  
}

.categories ul li a span{
    font-size: 15px;
    color: #1d9bd4;
}


.blog-tags{
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    padding: 5px 15px 5px 15px;
    border: 2px solid #1d9bd4;
    margin-top: 5px;
    border-radius: 5px;
    background: #1d9bd4;
    text-align: center;
    text-decoration: none;
    margin-right: 5px;
    margin-bottom: 5px;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.blog-tags:hover, .blog-tags:focus, .blog-tags:active {
    color: #1d9bd4;
    background: transparent;
    text-decoration: none;
}

.side-news-box a{
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    color: #343434;
    text-decoration: none;
    padding: 10px 0px 10px 0px;
}

.side-news-box span{
    display: block;
    font-size: 14px;
    color: #424040;
    padding: 5px 0px 5px 0px;
}



/*-----------------------------------------
13. Tabs
-------------------------------------------*/
.tabs{
	position: relative;
}

.tabs li {
	background: transparent;
	border-bottom: 2px solid #eee;
	margin: 15px;
	display: inline-block;
}

.tabs li a {
	color: #999;
	display: block;
	font-size: 14px;
	font-weight: 500;
	padding: 14px 24px;
	text-decoration: none;
}
.tabs li i {
	color: #999;
	display: block;
	font-size: 40px;
	margin-bottom: 15px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}

.tabs li:hover a, .tabs li:hover i {
	color: #1d9bd4;
}

.active-tab a, .active-tab a i {
	color: #1d9bd4 !important;
}


.tab-menu{
	padding: 0px 15px 0px 15px;
}

@media screen and (max-width:767px) {
	.tabs li{
		font-size: 10px;
		display: block;
		border-bottom-width: 1px;
	}
	.tabs li i {
		font-size: 25px;	
	}	
}



/*-----------------------------------------
14. Pricing plan
-------------------------------------------*/

.pricing-box{
	background: #fff;
	border-radius: 10px;
	padding: 30px;
	margin: 15px 0px 15px 0px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);		
	-webkit-transition-duration: .3s;
	transition-duration: .3s;
}

.pricing-box h4{
	font-size: 15px;
	font-weight: 500;
	text-align: left;
	color: #343434;
	margin: 0px 0px 20px 0px;
}
.pricing-box strong{
	display: block;
	font-family: 'Lato', sans-serif;
	font-size: 43px;
	font-weight: 300;
	color: #343434;
	border-bottom: 1px solid #eee;	
	padding: 0px 0px 20px 0px;
}
.pricing-box strong sup{
	font-size: 20px;
	margin-right: 10px;
}
.pricing-box ul{
	padding: 0px;
	margin-top: 20px;
}
.pricing-box li{
	list-style-type: none;	
	font-weight: 500;
	font-size: 14px;
	color: #999;
	padding: 10px;
}



/*-----------------------------------------
15. Partners
-------------------------------------------*/
.partners img{
	opacity: 0.6;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;	
}
.partners img:hover{
	opacity: 1;
}



/*-----------------------------------------
16. Typed text
-------------------------------------------*/
.typed-cursor{
    opacity: 1;
    font-weight: 100;
    -webkit-animation: blink 0.7s infinite;
    -moz-animation: blink 0.7s infinite;
    -ms-animation: blink 0.7s infinite;
    -o-animation: blink 0.7s infinite;
    animation: blink 0.7s infinite;
}
@-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-ms-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-o-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}

.typed-fade-out{
    opacity: 0;
    animation: 0;
    transition: opacity .25s;
}



/*-----------------------------------------
17. Progress Bars
-------------------------------------------*/
.progress-text{
	font-size: 13px;
	font-weight: 500;
	color: #777;
	margin-bottom: 5px;	
}
.custom-progress{
	height: 5px;
	box-shadow: none;
}
.custom-bar{
	height: 5px;
	background-color: #1d9bd4;
	box-shadow: none;
}



/*-----------------------------------------
18. Accordions
-------------------------------------------*/
.accordion{
	box-shadow: none;
	border-color: #eee;
}
.accordion-heading{
	border-radius: 10px;
	padding: 0px;
}

.accordion-title a{	
	font-size: 14px;
	background: #FFF;
	color: #424040;
	display: block;
	padding: 10px 15px 10px 15px;
	border-radius: 10px;
}
.accordion-title a:after{	
	content: '\f107';
	font-family: FontAwesome;
	float: right;
}

.accordion-body{
	font-size: 14px;
    font-weight: 500;
    color: #777;
    line-height: 27px;	
	border: none !important;
}



/*-----------------------------------------
19. Preloader
-------------------------------------------*/
#preloader {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99999;
    width: 100%;
    height: 100%;
    overflow: visible;
    background: #fff;
    display: table;
    text-align: center;
}
.loader {
    display: table-cell;
    vertical-align: middle;
    height: 100%;
    width: 100%;
    position: relative;
    width: 200px;
    height: 200px;
}
.loader-icon {
    width: 60px;
    height: 60px;
    border: 2px solid #1d9bd4;
    border-right-color: transparent;
    border-radius: 50%;
    position: relative;
    animation: loader-rotate 1s linear infinite;
    margin: 0 auto;
}
@keyframes loader-rotate {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}



/*-----------------------------------------
20. Scroll To Top Button
-------------------------------------------*/
.scroll-to-top{
	font-size: 20px;  
	padding: 10px; 
	text-align:center; 
	color: #424040;
	text-decoration: none;
	position:fixed;
	bottom:80px;
	right:20px;
	display:none;
	border-radius: 50%;
	border:1px solid #eee;
	background: #fff;
	width: 50px;
	height: 50px;  
	z-index: 9999;
	outline: none;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;   
}
.scroll-to-top i{
	color: #424040;
}

.scroll-to-top:hover{
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);	
}
.scroll-to-top:visited{
	color: #424040;
	text-decoration:none;
}



/*-----------------------------------------
21. 404 Page
-------------------------------------------*/
.styles-404{
	text-align: center;
}
.styles-404 h1{
	font-size: 100px;
	font-weight: 400;
	color: #1d9bd4;	
}
.styles-404 h2{
	font-size: 35px;
	font-weight: 400;
	color: #424040;
}

.styles-404 h5{
	font-size: 18px;
	font-weight: 400;
	color: #424040;
}



/*-----------------------------------------
22. Contact Page
-------------------------------------------*/
.contact-box{
	background: #fff;
	text-align: center;
	margin-bottom: 30px;
	padding: 70px 45px;
	border-radius: 10px;
	border:1px solid #eee;
    -webkit-transition-duration: .3s;
	transition-duration: .3s;
}
.contact-box:hover{		
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);
}
.contact-box i{
	color: #666;
	font-size: 50px;
	margin-bottom: 30px;
}
.contact-box h4{
	font-size: 20px;
	font-weight: 500;
	color: #424040;
	margin-top: 40px;
}
.contact-box p{
	font-size: 14px;
	font-weight: 500;	
	color: #777;
	line-height: 24px;
	margin-top: 20px;	
}


/*-----------------------------------------
23. Forms
-------------------------------------------*/
.primary-form input,.primary-form textarea{
	color: #424040;
	font-size: 14px;
	font-weight: 500;
	border-radius: 10px;
	border: 1px solid #eee;
	width: 100%;
	margin-top: 30px; 
	padding: 12px 15px 12px 15px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;    	
}
.primary-form input:focus{
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);
}

.primary-form textarea{
	min-height: 150px;
}
.primary-form textarea:focus{
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);
}


.footer-form input{
	width: 100%;
	font-size: 14px;
	font-weight: 500;
	border-radius: 5px;
	border: 0px;
	padding: 10px 15px 10px 15px;	
	margin-bottom: 15px;
}




/*-----------------------------------------
24. Google Maps
-------------------------------------------*/
#map {
	height: 400px;
}




/*-----------------------------------------
25. Footer
-------------------------------------------*/
.footer{
	background-color: #292b33;
	padding: 60px 0px 60px 0px; 
}


.footer-heading h4{
	font-size: 16px;
	font-weight: 500;
	text-transform: uppercase;
	color: #fff;
}
@media screen and (max-width:991px) {
	.footer-heading h4{
		margin-top: 30px;
	}
}


.footer-contact ul{
	padding-left: 0px;
}
.footer-contact ul li{
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: #fff;
	padding-top: 20px;
}
.footer-contact ul li i{
	color: #1d9bd4;
	font-size: 18px;
	margin-right: 15px;
}
.footer-contact ul li a{
	color: #fff;
}



.footer-social-link ul{
	padding-left: 0px;
}
.footer-social-link ul li{
	display: inline-block;
}
.footer-social-link ul li a{
	font-size: 15px;
	color: #fff;
	padding: 15px;
}
.footer-social-link ul li a:hover{
	color: #1d9bd4;
}



.footer-menu ul{
	padding-left: 20px;
}
.footer-menu ul li{
	list-style-type: none;
	padding: 5px 0px 5px 0px;	
}
.footer-menu ul li a{
	font-size: 14px;
	font-weight: 500;
	color: #fff;
}
.footer-menu ul li:before{
	content: "\f105";
	font-family: FontAwesome;
	font-size: 18px;
	margin-right: 10px;	
	color: #1d9bd4; 
}





/*-----------------------------------------
26. Project Detail
-------------------------------------------*/
.project-detail{
	border: 1px solid #ccc;
	border-radius: 10px;
	overflow: hidden;
}

.project-detail-right {
	margin-left: 30px;
}

.project-detail-right h4 {
	font-size: 30px;
	font-weight: 400;
	color: #333;
	margin-top: 40px;
}


.project-detail-right ul {
	padding-left: 0px;
	margin-top: 20px;
}


.project-detail-right ul li{
	list-style-type: none;
	padding-top: 20px;
}

.project-detail-right ul li i{
	font-size: 30px;
	color: #333;
	margin-right: 25px;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
}
.project-detail-right ul li:hover i{
	color: #1D9BD4;
}

.project-detail-right ul li strong{
	color: #333;
	font-size: 16px;
}

.project-detail-right ul li span{
	font-size: 14px;
	color: #979797;
}


.project-info h4{
	color: #333;
	font-size: 30px;
	font-weight: 400;
}

.project-info p{
	color: #979797
	font-size: 15px;
	line-height: 170%;
}




/*----------------------------------------
27. Services Detail 
-------------------------------------------*/
.service-category-list{
	position: relative;
	overflow: hidden;
	border-radius: 10px;
}

.service-category-list ul{
	margin-bottom: 0px;
	padding-left: 0px;
}

.service-category-list ul li{
	list-style-type: none;
	display: block;
	background: #f9f9f9;
}

.service-category-list ul li a{
	display: block;	
	font-size: 15px;
    font-weight: 600;
    color: #3b3b3b;
	padding: 15px 30px 15px 30px;
	border-bottom: 2px solid #fff;		    
}

.service-category-list ul li a:before{
    content: " \f105";
    font-family: FontAwesome;
    font-size: 16px;
    color: #3b3b3b;	
    padding-right: 20px;    
	-webkit-transition-duration: .3s;
	transition-duration: .3s;	    
}
.service-category-list ul li:hover a{
	background: #1d9bd4;
	color: #fff;	
}
.service-category-list ul li:hover a:before{
	color: #fff;		
}

.list-active-link a{
	background: #1d9bd4 !important;
	color: #fff !important;	
}
.list-active-link a:before{
	color: #fff !important;	
}

.single-contact{
	background: #1d9bd4;
	border-radius: 10px;
	margin-top: 40px;
	padding: 15px;
}

.single-contact h4{
	font-size: 19px;
    font-weight: 600;	
	color: #fff;
}

.single-contact p{
	font-size: 14px;
    font-weight: 600;	
	color: #fff;
	margin-top: 15px;
}

.single-contact h6{
	font-size: 18px;
    font-weight: 500;	
	color: #fff;
	margin-top: 15px;
}

.single-broucher{
	background: #fff;
	margin-top: 40px;
}

.single-broucher ul{
	padding-left: 0px;
	margin-bottom: 0px; 
}

.single-broucher ul li{
	list-style-type: none;	
	margin-top: 10px;		
}

.single-broucher ul li a{
	display: block;
	color: #3b3b3b;
	font-size: 15px;
	font-weight: 600;
	background: #fff;
	border-radius: 10px;
	border: 1.5px solid #efefef;
	padding: 15px;		
}

.single-broucher ul li a i{
	font-weight: 500;
	margin-right: 10px;
}
.single-broucher ul li a:hover{
	color: #fff;
	background: #1d9bd4;	
}


.services-img{
	border-radius: 10px;
}

.detail-heading h3{
	font-size: 22px;
	font-weight: 500;
	color: #3b3b3b;
	text-align: left;	
	margin: 40px 0px 20px 0px;	
}

.service-box{
	background: #fff;
	text-align: center;
	margin-bottom: 30px;
	padding: 50px 40px;
	border-radius: 10px;
	border:1px solid #eee;
    -webkit-transition-duration: .3s;
	transition-duration: .3s;
}
.service-box:hover{		
	box-shadow: 10px 5px 90px 0px rgba(26, 38, 74, 0.13);
}

.service-box i{
	color: #1d9bd4;
	font-size: 45px;
	margin-bottom: 30px;
	-webkit-transition-duration: 1s;
	transition-duration: 1s;
}
.service-box:hover i{
	color: #333;
}

.service-box h4{
	font-size: 18px;
	font-weight: 500;
	color: #424040;
	margin-top: 20px;
}

.service-box p{
	font-size: 14px;
	font-weight: 500;	
	color: #979797;
	line-height: 170%;
	margin-top: 15px;	
}

.services-grid{
	border: 1px solid #eee;
	border-radius: 10px;
	overflow: hidden;
	margin: 20px 0px 20px 0px;
}






/*----------------------------------------
28. Blog Post 
-------------------------------------------*/
.blog-image {
	position: relative;
  	width: 100%;
}
.blog-image img{
  position: relative;
  border-radius: 10px;
  width: 100%;
}

.blog-post-item h2 a{
	display: inline-block;
  font-size: 30px;
	font-weight: 400;
	color: #424040;
	text-decoration: none;
}
.blog-post-item h2 a:hover{
    color: #1D9BD4;
}

.blog-post-item p{
	color: #777; 
  line-height: 24px;
	font-size: 13px;
  font-weight: 500;
	margin-top: 20px;
}

.blog-post-item blockquote{
    background: #fff;
    border-left: 5px solid #1d9bd4;
    margin: 25px 0px 25px 20px;
    padding: 15px;
}
.blog-post-item blockquote p{
    font-size: 13px;
    font-weight: 500;
    color: #424040;
    line-height: 170%;
    margin: 0;
}


.communications-box{
    display: block;
    height: auto;
    margin-top: 50px;
    margin-bottom: 50px;
}

.social-icon{
    display: inline-block;
}
.social-icon a i{
    width: 40px;
    height: 40px;
    color: #757575;
    font-size: 15px;
    border: 1px solid #eee;
    border-radius: 5px;
    text-align: center;
    margin-right: 5px;    
    padding-top: 13px;
}
.social-icon a i:hover{
    color: #1D9BD4;
}


.blog-side-box{
  padding: 15px 0px 15px 0px;
}
.blog-side-box h4{
  font-size: 20px;
  font-weight: 500;
  color: #424040;
  border-bottom: 1px solid #eee;    
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.blog-side-box p{
  font-size: 13px;
  font-weight: 500;
  line-height: 180%;
  color: #424040;
}

.blog-tags{
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    padding: 5px 15px 5px 15px;
    border: 2px solid #1d9bd4;
    margin-top: 5px;
    border-radius: 5px;
    background: #1d9bd4;
    text-align: center;
    text-decoration: none;
    margin-right: 5px;
    margin-bottom: 5px;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.blog-tags:hover, .blog-tags:focus, .blog-tags:active {
    color: #1d9bd4;
    background: transparent;
    text-decoration: none;
}

.side-news-box a{
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    color: #343434;
    text-decoration: none;
    padding: 10px 0px 10px 0px;
}

.side-news-box span{
    display: block;
    font-size: 14px;
    color: #424040;
    padding: 5px 0px 5px 0px;
}