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

1. Sections
2. Headings
3. Top-Bar
4. Navbar
5. Articles
6. CountUps
7. Services Box
8. Helper Classes
	a) Text-content
	b) Image-properties
	c) Buttons
	d) Lists
	e) Color Control
	f) Video Box
	g) Pagination
	h) Forms
9. Projects
10. Testmonials
11. Team
12. Pricing
13. Certificates
14. Services-Detail(Page)
15. Features Section
16. Blog Grid
17. Blog List (Page)
18. Blog Post (Page)
19. Contact (Page)
20. 404 (Page) 
21. Shop (Page)
22. Shop Detail (Page)
23. Tabs
24. Progress Bars
25. Pie Charts
26. Accordions
27. Scroll To Top Button

28. Footer


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



/*-----------------------------------------
1. Sections
-------------------------------------------*/
.section-block{
	padding: 90px 0px 90px 0px;
	background-color: #fff;
}	

.section-block-grey{
	padding: 90px 0px 90px 0px;
	background-color: #f7f7f7;
}

.section-block-parallax{
    background-size: cover;
    background-attachment: fixed;
    background-position: 50% 50%;
	padding: 70px 0px 70px 0px;    
}	

.partner-section{
	background-color: #fff;
	padding: 60px 0px 60px 0px;   
}
.partner-section-grey{
	background-color: #f7f7f7;
	padding: 60px 0px 60px 0px;   
}

.partner-section-grey{
	padding: 40px 0px 40px 0px;
	background: #f7f7f7;
}


/*-----------------------------------------
2. Headings
-------------------------------------------*/
.section-heading{
	margin-bottom: 70px;
}

.section-heading h2{
	font-size: 33px;
	font-weight: 300;
	color: #3b3b3b;
	line-height: 130%;
	margin-bottom: 10px;
}
.section-heading h2:after{
	content: '';
	display: block;	
	border-bottom: 2px solid #2578ff;
	width: 100px;
	margin: auto;
	padding-top: 15px;
}

.section-heading-left h2{
	font-size: 33px;
	font-weight: 300;
	color: #3b3b3b;
	line-height: 130%;
	margin-bottom: 10px;
}
.section-heading-left h2:after{
	content: '';
	display: block;	
	border-bottom: 2px solid #2578ff;
	width: 100px;
	padding-top: 15px;
}
.section-heading-left p{
	font-size: 15px;
	font-weight: 500;
	color: #979797;
	line-height: 160%;
	padding-top: 10px;
	margin-bottom: 0px;
}

.section-heading h3{
	font-size: 25px;
	font-weight: 300;
	color: #3b3b3b;
	line-height: 130%;
	margin-bottom: 10px;
}
.section-heading h3:after{
	content: '';
	display: block;	
	border-bottom: 2px solid #2578ff;
	width: 100px;
	margin: auto;
	padding-top: 15px;
}

.section-heading p{
	font-size: 15px;
	font-weight: 500;
	color: #979797;
	line-height: 160%;
	padding-top: 10px;
	margin-bottom: 0px;
}

.section-heading span{
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: #2578ff;
	line-height: 160%;
}

.section-heading-white h2{
	font-size: 33px;
	font-weight: 300;
	color: #fff;
	line-height: 130%;
	margin-bottom: 10px;
}
.section-heading-white h2:after{
	content: '';
	display: block;	
	border-bottom: 2px solid #2578ff;
	width: 100px;
	padding-top: 15px;
	margin: auto;
}
.section-heading-white p{
	font-size: 15px;
	font-weight: 500;
	color: #fff;
	line-height: 180%;
	padding-top: 10px;
	margin-bottom: 0px;
}

.section-heading-white-left h2{
	font-size: 33px;
	font-weight: 300;
	text-align: left;
	color: #fff;
	line-height: 130%;
	margin-bottom: 10px;
}
.section-heading-white-left h2:after{
	content: '';
	display: block;	
	border-bottom: 2px solid #2578ff;
	width: 100px;
	padding-top: 15px;
}
.section-heading-white-left p{
	font-size: 15px;
	font-weight: 500;
	text-align: left;
	color: #fff;
	line-height: 180%;
	padding-top: 10px;
	margin-bottom: 0px;
}

.page-title{
	padding: 150px 0px 100px 0px;
	background-color: #f7f7f7;
	background-size: cover;	
	background-position: top;
}

.page-title h1{
	font-size: 40px;
	font-weight: 300;
	color: #fff;
	text-align: center;
}

.page-title ul{
	text-align: center;
	padding-top: 10px;
	padding-left: 0px;
}

@media screen and (max-width:767px) {
	.page-title h1{
		text-align: center;
	}	
	.page-title ul{
		text-align: center;
	}	
}

.page-title ul li{
	display: inline-block;
}	

.page-title ul li a{
	font-size: 15px;
	font-weight: 500;
	color: #fff;
}
.page-title ul li:after{
	content: " / ";
	font-family: FontAwesome;
	font-size: 15px;
	font-weight: 900;
	color: #fff;
	margin: 0px 5px 0px 5px;	
}
.page-title ul li:last-child:after{
	content: none;
}
.page-title ul li a:hover{
	color: #2578ff;	
}

.block-heading h3{
	font-size: 28px;
	font-weight: 300;
	color: #3b3b3b;
	line-height: 130%;
	margin-bottom: 10px;	
	margin-top: 30px;	
}

.heading-sm h3{
	font-size: 29px;
	font-weight: 300;
	color: #3b3b3b;	
	line-height: 150%;
	margin-bottom: 20px;
	margin-top: 30px;
}

.heading-sm h3:after{
	content: '';
	display: block;	
	border-bottom: 2px solid #2578ff;
	width: 100px;
	padding-top: 5px;
}


.heading-sm h4{
	font-size: 22px;
	font-weight: 500;
	color: #3b3b3b;	
	line-height: 150%;
	margin-bottom: 20px;
	margin-top: 30px;
}

.heading-sm h4:after{
	content: '';
	display: block;	
	border-bottom: 2px solid #2578ff;
	width: 100px;
	padding-top: 5px;
}

.heading-sm h5{
	font-size: 20px;
	font-weight: 500;
	color: #3b3b3b;	
	line-height: 150%;
	margin-bottom: 20px;
	margin-top: 30px;	
}
.heading-sm h5:after{
	content: '';
	display: block;	
	border-bottom: 2px solid #2578ff;
	width: 70px;
	padding-top: 5px;
}


.heading-sm p{
	font-size: 15px;
    font-weight: 500;
    color: #979797;
    line-height: 180%;
    margin-bottom: 15px;
}

/*-----------------------------------------
3. Top-Bar
-------------------------------------------*/
#top-bar{
	background: #242b3a;
	min-height: 30px;
}

.top-bar-info {
	padding: 0px;
}

.top-bar-info li{
	font-size: 13px;
	font-weight: 500;
	color: #fff;
	list-style-type: none;
	float: left;
	margin: 0px;
	padding: 7px 16px 5px 0px;
}

.top-bar-info li i{
	font-size: 15px;
	color: #fff;
	padding-right: 8px;
}

.social-icons{
	padding: 0px;
	float: right;
	margin: 0px;
}
.social-icons li{
	font-size: 14px;
	list-style-type: none;
	float: left;
	width: 30px;
	text-align: center;
	margin: 0px;
	padding: 7px 10px 5px 7px;	
}
.social-icons li a{
	color: #fff;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;	
}
.social-icons a:hover{
	color: #AEC9E5;
}

/*-----------------------------------------
4. Navbar 
-------------------------------------------*/
.affix {
	top: 0;
	width: 100%;
	z-index: 9999999;
}
#bs-example-navbar-collapse-1{
	padding: 0px;
}
.navbar-nav{
	margin: 0px;
}

.navbar-header-custom{
	background: transparent;
	padding: 15px 0px 15px 0px;
}

.navbar-logo img{
	max-width: 100%;
	margin-left: 15px;
	max-height: 80px!important;
}

@media screen and (max-width:767px) {
.navbar-logo img{
	max-width: 100%;
	max-height: 50px!important;
}
}

.navbar-custom{
	background: transparent;
	border: none;
	border-radius: 0px;
	padding: 0px 0px 0px 0px;
	margin-bottom: 0px;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s; 	
	margin-top:30px
}
@media screen and (max-width:990px) {
.navbar-custom{	
		margin-top:0
}
}

.navbar-custom .navbar-links-custom li {
	padding: 15px 5px 15px 5px;
}

.navbar-custom .navbar-links-custom li a{
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;	
	letter-spacing: 0.5px;
	color: rgba(255, 255, 255, 0.67);
	-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: #fff;
}

.navbar-custom .navbar-toggle .icon-bar {
    background-color: #2578ff;
}

@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 #555;
	    padding: 0px !important;
	    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-default .navbar-links-custom .open .dropdown-menu>li>a {
	    color: #fff;
	    font-size: 12px;
	    padding: 10px 0px 10px 30px;
	}		
}

.dropdown-menu{
	background-color: rgba(28, 35, 48, 0.85);
	border-radius: 5px !important;
	padding: 5px;
}
.dropdown-menu:after {
	content: '';
	position: absolute;
	top: 0;
	left: 20%;
	width: 0;
	height: 0;
	border: 7px solid transparent;
	border-bottom-color: rgba(28, 35, 48, 0.85);
	border-top: 0;
	margin-left: -7px;
	margin-top: -7px;
}

.navbar-links-custom .dropdown ul{
	border: none;
	margin-left: 5px;
	margin-top: 7px;
	-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{
	border-radius: 5px;
	font-weight: 600;
	padding: 12px 15px 12px 15px;
	width: 180px;
	text-transform: none;
	text-align: left;
	color: #fff;
}

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

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

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

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

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

/*Navbar breakpoint*/
@media (max-width: 991px) {
	.navbar-custom{
		background: rgba(28, 35, 48, 0.85);
	}	
	.dropdown-menu:after{
		border: none;
	}	
	.navbar-custom .navbar-links-custom{
		background: rgba(28, 35, 48, 1);
		padding: 0px !important;
		margin: 0px;
	}	
	.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
		max-height: 100%;
	}	
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }  
    .collapse.in{
        display:block !important;
    }
   .navbar-nav .open .dropdown-menu {
       position: static;
       float: none;
       width: auto;
       margin-top: 0;
       background-color: transparent;
       border: 0;
       -webkit-box-shadow: none;
       box-shadow: none;
    }  
    .navbar-links-custom{
    	padding-bottom: 5px;
    }
	.navbar-custom .navbar-links-custom li {
		padding: 5px 0px 0px 5px;
	}    
}



/*-----------------------------------------
5. Articles
-------------------------------------------*/
.article-box{
	border: 3px solid #f7f7f7;
	background: #fff;
	border-radius: 5px;
	text-align: center;
	padding: 30px;
	margin: 15px 0px 15px 0px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;	
}

.article-box:hover{
	border-color: #5ab1fb;
}

.article-box i{
	font-size: 55px;
	color: #2578ff;
}

.article-box h4{
	font-size: 18px;
	font-weight: 500;
	color: #252525;
	margin: 30px 0px 25px 0px;	
}

.article-box p{
	font-size: 14px;
	font-weight: 500;
	line-height: 200%;	
	color: #979797;
	margin-bottom: 30px;
}

.article-box a{
	font-size: 14px;
	font-weight: 600;
	color: #2578ff;
}
.article-box a i{
	font-size: 14px;
	color: #2578ff;	
	padding-left: 5px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.article-box a:hover i{
	padding-left: 12px;
}


.article-list{
	background: #f7f7f7;
	border-radius: 5px;	
	padding: 30px;
	margin: 15px 0px 15px 0px;	
}
.article-list h3{
	font-size: 20px;
	font-weight: 500;
	line-height: 150%;
	color: #252525;
}
.article-list ul{
	padding: 0px;
	margin-bottom: 0px;
	margin-top: 20px;
}
.article-list ul li{
	list-style-type: none;
	color: #979797;
	font-size: 15px;
	font-weight: 500;
	padding: 5px 0px 5px 0px;
}

.article-list ul li i{
	color: #2578ff;
	font-size: 13px;
	padding-right: 15px;
}
.article-list a{
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
	color: #2578ff;
	background: #fff;
	border-radius: 5px;
	padding: 15px 30px 15px 30px;
}
.article-list a i{
	font-size: 14px;
	color: #2578ff;	
	padding-left: 5px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.article-list a:hover i{
	padding-left: 12px;
}


/*-----------------------------------------
6. CountUps
-------------------------------------------*/

.countup-box{
	text-align: center;
	background: rgba(255, 255, 255, 0.1);	
	border-radius: 5px;
	padding: 15px;
	margin: 15px 0px 15px 0px;
}

@media screen and (max-width:767px) {
	.countup-box{
		margin: 20px 0px 20px 0px;
	}	
}

.countup-box h4{
    font-size: 40px;
    font-weight: 500;
    color: #fff;
    line-height: 130%;
    margin: 10px 0px 10px 0px;    
}
.countup-box h4:after{
	content: '+';
}

.countup-box i{
    font-size: 50px;
    color: #2578ff;
}

.countup-box p{
    font-size: 18px;
    font-weight: 400;
    color: #fff;
    line-height: 130%;
}



/*-----------------------------------------
7. Services Box
-------------------------------------------*/
.services-box{
	background: #fff;
	border-radius: 5px;
	overflow: hidden;
	border: 1px solid #eee;
	margin: 15px 0px 15px 0px;
} 

.services-box img{
	width: 100%;
}

.services-box-inner{
	padding: 30px;
}
.services-box h4{
	font-size: 21px;
	font-weight: 500;
	color: #1c2330;
	margin: 5px 0px 15px 0px;
}
.services-box p{
	font-size: 14px;
	font-weight: 500;
	line-height: 180%;
	color: #979797;
	margin-bottom: 20px;
}

.services-box a{
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
	border: 2px solid #eee;
	border-radius: 5px;
	color: #1c2330;
	padding: 10px 15px 10px 15px;
}
.services-box a i{
	font-size: 14px;
	color: #1c2330;	
	padding-left: 5px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.services-box a:hover{
	border-color: #2578ff;
	background: #2578ff;
	color: #fff;
}
.services-box a:hover i{
	color: #fff;
}

/*-----------------------------------------
8. Helper Classes
-------------------------------------------*/

/*--------------------
a) Text-content
----------------------*/
.text-content p{
	font-size: 15px;
	font-weight: 500;
	color: #979797;
	line-height: 180%;	
	margin-bottom: 15px;
}

/*--------------------
b) Image-properties
----------------------*/

.rounded-border{
	border-radius: 5px;
}

.shadow-primary{
	-webkit-box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.3);
	-moz-box-shadow:    7px 9px 22px 0px rgba(50, 50, 50, 0.3);
	box-shadow:         7px 9px 22px 0px rgba(50, 50, 50, 0.3);		
}

.full-width{
	width: 100%;
}


/*--------------------
c) Buttons
----------------------*/
.button-tag{
	display: inline-block;
	font-size: 12px;
	font-weight: 500;
	margin: 5px 5px 5px 0px;
	padding:  5px 10px 5px 10px !important;
}
.button-xs{
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
}
.button-xs i{
    font-size: 15px;
    padding-left: 7px;
}
.button-sm{
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
}
.button-sm i{
    font-size: 17px;
    padding-left: 7px;
}
.button-md{
	display: inline-block;
	font-size: 16px;
	font-weight: 600;
}

.button-lg{
	display: inline-block;
	font-size: 17px;
	font-weight: 500;
	padding:  10px 25px 10px 25px !important;
}


.primary-button{
	position: relative;
	background: #2578ff;
	border-radius: 5px;
	color: #fff;
	padding: 11px 17px 11px 17px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;				
}
.primary-button:hover{
	border-color: #1c2330;
	color: #fff;
	background: #1c2330;
}

.dark-button{
	position: relative;
	background: #1c2330;
	border: 2px solid #1c2330;
	border-radius: 5px;
	color: #fff;
	padding:  10px 15px 10px 15px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;				
}
.dark-button:hover{
	border-color: #2578ff;
	color: #fff;
	background: #2578ff;
}


/*--------------------
d) Lists
----------------------*/
.primary-list{
	padding-left: 0px;
}
.primary-list li{
    list-style-type: none;
    color: #979797;
    font-size: 14px;
    font-weight: 500;
    margin-top: 10px;  
}
.primary-list li i{
    color: #2578ff;
    padding-right: 15px;
}


.dark-list{
	padding-left: 0px;
}
.dark-list li{
    list-style-type: none;
    color: #979797;
    font-size: 14px;
    font-weight: 500;
    margin-top: 10px;  
}
.dark-list li i{
    color: #252525;
    padding-right: 15px;
}

/*--------------------
e) Color Control
----------------------*/
.primary-color h1, 
.primary-color h2, 
.primary-color h3, 
.primary-color h4, 
.primary-color h5, 
.primary-color h6, 
.primary-color p, 
.primary-color i, 
.primary-color span{
	color: #2578ff !important;
}
.dark-color h1, 
.dark-color h2, 
.dark-color h3, 
.dark-color h4, 
.dark-color h5, 
.dark-color h6, 
.dark-color p, 
.dark-color i, 
.dark-color span{
	color: #3c59b3 !important;
}

/*--------------------
f) Video Box
----------------------*/
.video-block-parallax{
    background-size: cover;
    background-attachment: fixed;
    background-position: 50% 50%;
    padding: 70px 0px 70px 0px;	
}
.video-button{
	text-align: center;
}
.video-play-button{
    display: inline-block;
    border-radius: 50%;
    font-size: 15px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3c59b3+0,38d0c5+100 */
	background: rgb(60,89,179); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(60,89,179,1) 0%, rgba(56,208,197,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(60,89,179,1) 0%,rgba(56,208,197,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(60,89,179,1) 0%,rgba(56,208,197,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c59b3', endColorstr='#38d0c5',GradientType=1 ); /* IE6-9 */
    color: #fff;
    width: 100px;
    height: 100px;
    opacity: 1;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;	
}


.video-box{
	position: relative;
	display: block;
	width: 100%;
	height: auto;	
}
.video-box-overlay{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
  transition: .5s ease;
}

.video-box-button{
  position: absolute;
  overflow: hidden;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}

.video-box-button button{
	color: #fff;
	background: rgba(28, 35, 48, 0.85);
	width: 90px;
	height: 90px;
	border-radius: 50%;
	padding: 30px;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;	
}

.video-box-button button:hover{
	color: rgba(28, 35, 48, 0.85);
	background: rgba(255, 255, 255, 0.75);
}


/*--------------------
g) Pagination
----------------------*/
.paginator{
	display: inline-block;
	border: 2px solid #f1f1f1;
	border-radius: 10px;
	font-size: 15px;
	font-weight: 600;
	width: 40px;
	height: 40px;
	color: #255;
	background: #fff;
	padding: 6px 15px 10px 14px;
	margin: 3px;
}
.paginator:hover{
	color: #fff;
	background: #2578ff;
}
.paginator:focus{
	color: #fff;
	background: #2578ff;
}
.active-page{
	color: #fff;
	background: #2578ff;	
}



/*--------------------
h) Forms
----------------------*/
.primary-form input, .primary-form textarea {
    color: #424040;
    font-size: 14px;
    font-weight: 500;
    border-radius: 5px;
    border: 1px solid #eee;
    width: 100%;
    margin-top: 30px;
    padding: 11px 15px;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
}

#search-input{
    padding: 0px;
    border: solid 1px #f1f1f1;
    border-radius: 10px;
    background-color: #fff;
    padding: 3px;
}

#search-input input{
    border: 0;
    border-radius: 10px;
    box-shadow: none;
}

#search-input button{
    margin: 2px 0 0 0;
    background: none;
    box-shadow: none;
    border: 0;
    outline: none !important;
    color: #2578ff;
    padding: 0 11px 0 13px;
    border-left: solid 1px #ccc;
}

#search-input button:hover{
    border: 0;
    box-shadow: none;
    border-left: solid 1px #ccc;
}

#search-input .glyphicon-search{
    font-size: 13px;
}




/*-----------------------------------------
9. Projects
-------------------------------------------*/
.project-item{
	position: relative;
	overflow: hidden;
	width: 100%;
	border-radius: 5px;
	margin: 15px 0px 15px 0px;	
}
.project-item img{
	display: block;
	width: 100%;
	height: auto;	
}

.project-item-img{
	height: 509px!important;	
}

.project-item-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  z-index: 999;
  transition: .5s ease;
  background: rgba(28, 35, 48, 0.5);
}

.project-item:hover .project-item-overlay {
  opacity: 1;
}
.project-item:hover img{
    filter: blur(3px);
}

.project-item-content{
  position: absolute;
  bottom: 30px;
  left: 30px;
}

@media screen and (max-width:767px) {
	.project-item-content{
		position: absolute;
		bottom: 15px;
		left: 15px;
	}	
}

.project-item-content h5{
	font-size: 18px;
	font-weight: 500;
	color: #fff;
}
.project-item-content a{
	display: inline-block;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	border: 2px solid #fff;
	border-radius: 5px;
	margin-top: 20px;
	padding: 10px 15px 10px 15px;
}

.project-item-content a:hover{
	background: #2578ff;
	border-color: #2578ff;
}


.project-detail img{
	width: 100%;
	height: 500px;
	border-radius: 5px;
	margin-bottom: 30px;
}

.project-detail h4{
	font-size: 25px;
	font-weight: 500;
	color: #1C2330;
	margin-top: 15px;
}

.project-detail h4:after {
    content: '';
    display: block;
    border-bottom: 2px solid #2578ff;
    width: 100px;
    padding-top: 12px;
}

.project-detail p{
	font-size: 15px;
	font-weight: 500;
	line-height: 160%;
	color: #979797;
	margin-top: 15px;
}

.project-info{
	border: 1px solid #f1f1f1;
	border-radius: 10px;
	overflow: hidden;
	padding: 15px;
	margin-bottom: 30px;
}

.project-info ul{
	font-size: 16px;
    font-weight: 500;
    color: #979797;	
    margin-top: 10px;
    padding: 0px;
}

.project-info ul li{
	list-style-type: none;
	padding: 15px 0px 10px 0px;
}

.project-info ul li i{
	color: #ffc527;
	padding-right: 15px;
}

.project-info strong {
	color: #1c303e;
	font-size: 14px;
	font-weight: 600;
}

.project-info span {
	color: #979797;
	font-size: 14px;
	margin-left: 10px;
}

.project-info h4{
	font-size: 22px;
    font-weight: 600;
    color: #1c303e;	
}

.project-info h5{
	font-size: 15px;
    font-weight: 500;
    color: #1c303e;	
    margin-top: 5px;
}

/*-----------------------------------------
10. Testmonials
-------------------------------------------*/
.testmonial-item{
	background: #fff;
	border-radius: 5px;
	text-align: center;
	-webkit-box-shadow: 0px 5px 28px 0px rgba(50, 50, 50, 0.1);
	-moz-box-shadow:    0px 5px 28px 0px rgba(50, 50, 50, 0.1);
	box-shadow:         0px 5px 28px 0px rgba(50, 50, 50, 0.1);
	margin: 50px 15px 15px 15px;
	padding: 50px;
}

.testmonial-item p{
	font-size: 15px;
	font-weight: 400;
	line-height: 180%;
	color: #979797;
    margin-top: 10px;
}

.testmonial-item h4{
	font-size: 22px;
	font-weight: 400;
	color: #1c2330;
	margin-bottom: 5px;
}

.testmonial-item-raiting {
    color: #ffc527;
    font-size: 14px;
}

.testmonial-item img{
	width: 90px !important;
	height: 90px;
	display: inline !important;
	border-radius: 10px;
	margin-bottom: 0px;
	margin-top: -120px;
}


/*-----------------------------------------
11. Team
-------------------------------------------*/
.section-team{
	background: #fff;
	border: 1px solid #e9e9e9;
    position: relative;
    overflow: hidden;
    border-radius: 5px;
    margin: 15px 0px 15px 0px;
}

.team-img{
	border-bottom: 1px solid #e9e9e9;
    position: relative;
    overflow: hidden;
    display: block;
    width: 100%;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;    
}
.team-img img{
	width: 100%;
}

.section-team:hover .team-img img{
    filter: blur(5px);
}

.overlay-team-img {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(28, 35, 48, 0.65);
	overflow: hidden;
	width: 100%;
	height: 100%;
	opacity: 0;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s; 
}
.section-team:hover .overlay-team-img {
	opacity: 1; 
}

.team-img ul {
    list-style-type: none;
    position: absolute;
    overflow: hidden;
    top: 80%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    padding-left: 0px;
}

.team-img ul li {
	display: inline-block;
	padding: 7px;
}

.team-img ul li a {
    color: #fff;
    font-size: 17px;
}

.team-img ul li a:hover {
    color: #2578ff;
}

.section-team-text{
    text-align: center;
    padding: 15px 30px 10px 30px; 
}

.section-team-text h4{
    font-size: 17px;
    color: #1C2330;
    margin: 10px 0px 15px 0px;
}

.section-team-text span{
	border-radius: 5px;
	background: #2578ff;
    font-size: 13px;
    font-weight: 500;
    color: #fff;
    padding: 3px 10px 3px 10px;
}

.section-team-text p{
	color: #979797;
	font-size: 15px;
	font-weight: 400;
	line-height: 170%;
	margin-top: 30px;
}





/*-----------------------------------------
12. Pricing
-------------------------------------------*/
.pricing-list{
	overflow: hidden;
	border: 1px solid #eee;
	border-radius: 10px;
	-webkit-transition: 0.3s;
    transition: 0.3s;
}
.pricing-list:hover{
	margin-top: -10px;
}

.pricing-top{
	background: #f1f1f1;
	text-align: center;
}

.pricing-top h4{
	color: #000;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	padding: 7px;
}

.pricing-digits{
	background: #f7f7f7;
	text-align: center;
	padding: 5px 0px 5px 0px;
}


.pricing-digits span{
	font-size: 17px;
	color: #2578ff;
}

.pricing-digits h2{
	display: inline-block;
	font-size: 45px;
	color: #2578ff;
	font-weight: 500;
	margin: 10px 0px 10px 0px;
}

.pricing-digits p{
	font-size: 14px;
	color: #979797;
}


.option-list{
	background: #fff;
	text-align: center;
}

.option-list ul{
	padding-left: 0px;
}

.option-list ul li{
	color: #979797;
	padding: 20px 0px 10px 0px;
	border-bottom: 1px solid #f1f1f1;
}

.pricing-button {
	text-align: center;
	margin: 30px 0px 30px 0px;
}

.pricing-button a{
	border: 2px solid #eee;
	border-radius: 10px;
	color: #2578ff;
	font-size: 15px;
	font-weight: 600;
	padding: 8px 30px 8px 30px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;  
}
.pricing-button a:hover{
	color: #fff;
	background: #2578ff;
	border: 2px solid #2578ff;

}

.pricing-premium{
	background: #2371F0;
	text-align: center;
}

.pricing-premium h4{
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	padding: 7px;
}

.premium-digits{
	background: #2578ff;
	text-align: center;
	padding: 5px 0px 5px 0px;
}

.premium-digits span{
	font-size: 17px;
	color: #fff;
}

.premium-digits h2{
	display: inline-block;
	font-size: 45px;
	color: #fff;
	font-weight: 500;
	margin: 10px 0px 10px 0px;
}

.premium-digits p{
	font-size: 14px;
	color: #fff;
}


.pricing-button-premium{
	text-align: center;
	margin: 30px 0px 30px 0px;
}

.pricing-button-premium a{
	border: 2px solid #2578ff;
	border-radius: 10px;
	color: #fff;
	background: #2578ff;
	font-size: 15px;
	font-weight: 600;
	padding: 8px 30px 8px 30px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;  
}

.pricing-button-premium a:hover{
	color: #2578ff;
	background: #fff;
	border: 2px solid #eee;

}




/*-----------------------------------------
13. Certificates
-------------------------------------------*/
.certificates img{
	border-radius: 5px;
	background: rgba(255, 255, 255, 0.1);
	padding: 20px;
}





/*-----------------------------------------
14. Services-Detail(Page)
-------------------------------------------*/
.services-nav{
	position: relative;
	overflow: hidden;
	border-radius: 10px;
}

.services-nav ul{
	margin-bottom: 0px;
	padding-left: 0px;
}

.services-nav ul li{
	list-style-type: none;
	display: block;
	background: #f7f7f7;
}

.services-nav ul li a{
	display: block;	
	font-size: 14px;
    font-weight: 600;
    color: #252525;
	padding: 15px 30px 15px 15px;
	border-bottom: 2px solid #fff;		    
}

.services-nav ul li:hover a{
	background: #1c2330;
	color: #fff;	
}

.services-nav-active a{
	background: #1c2330;
	color: #fff !important;	
}
.btn-download {
    display: block;
    border-radius: 10px;
    border: 2px solid #f1f1f1;
    font-size: 14px;
    font-weight: 600;
    color: #3b3b3b;
    margin: 10px 0px 10px 0px;
    padding: 15px;
}
.btn-download:hover{
	color: #fff;
	border-color: #2578ff;
	background: #2578ff;
}





/*-----------------------------------------
15. Features Section
-------------------------------------------*/
.feature-box{
	display: inline-block;
	padding: 20px;
}

.feature-box-right-info{
	border-radius: 5px;
	background: #fff;
	text-align: center;
	padding: 20px;
	margin: 15px 0px 15px 0px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;  	
}

.feature-box-right-info i{
	color: #2578ff;
	font-size: 40px;
	margin: 0 auto;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;  	
}
.feature-box-right-info:hover {
    -webkit-box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.05);
    -moz-box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.05);
    box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.05);
} 

.feature-box-right-info:hover i{
	color: #252525;
}

.feature-box-right-info h4{
	color: #252525;
	font-size: 18px;
	font-weight: 400;
	margin: 15px 0px 10px 0px;  
}

.feature-box-right-info p{
	color: #979797;
	font-size: 13px;
}


/*-----------------------------------------
16. Blog Grid
-------------------------------------------*/
.blog-grid{
	overflow: hidden;
	border: 1px solid #eee;
	border-radius: 5px;
	margin: 15px 0px 15px 0px;
    -webkit-box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.05);
    -moz-box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.05);
    box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.05);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s; 
}			
.blog-grid:hover{
    -webkit-box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.1);
    box-shadow: 7px 9px 22px 0px rgba(50, 50, 50, 0.1);
}	

.blog-grid img{
	width: 100%;
}

.blog-grid-content{
	padding: 30px 25px 30px 25px;
}			

.blog-grid-content h4 {
	margin: 0px 0px 10px 0px;
}

.blog-grid-content h4 a{
	color: #1C2330;
	font-size: 20px;
	font-weight: 500;
	-webkit-transition-duration: 0.3s;
    transition-duration: 0.3s; 
}	
.blog-grid-content h4 a:hover{
	color: #2578ff;
}	

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

.blog-grid-content p{
	color: #979797;
	font-size: 14px;
	font-weight: 500;
	line-height: 170%;
	border-bottom: 1px solid #eee;
	padding-bottom: 15px;
	margin: 15px 0px 25px 0px;
}	

.blog-grid-button a{
	position: relative;
	display: inline-block;
    font-size: 13px;
    font-weight: 500;	
    background: #2578ff;
    border-radius: 5px;
    color: #fff;
    padding: 11px 17px 11px 17px;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
}	

.blog-grid-button a:hover{
	background: #1c2330;
	color: #fff;
}	




/*-----------------------------------------
17. Blog List
-------------------------------------------*/
.blog-list-left{
    position: relative;
    border: 1px solid #e9e9e9;
    border-radius: 10px;
    font-size: 15px;
    background: #fff;
    overflow: hidden;
    margin-bottom: 50px;
}

.blog-list-left img{ 
   width: 100%;
}

.blog-list-left h4{
    font-size: 26px;
    font-weight: 500;
    color: #1C2330;
    margin-top: 20px;
}

.blog-list-left p{
    font-size: 14px;
    line-height: 180%;
    font-weight: 500;
    color: #979797;
    margin-top: 20px;
}

.blog-list-info{
     padding: 20px;
}


.blog-list-icon{
    list-style-type: none;
    padding: 0px;
    margin-top: 10px;
}


.blog-list-icon li{
    display: inline-block;
    margin-right: 25px;
}

.blog-list-icon li i{
    color: #2578ff;
}

.blog-list-icon span{
    color: #979797;
    padding-left: 10px;
}

.blog-list-bottom{
    border-top: 1px solid #e9e9e9;
    padding-top: 15px;
    margin-top: 40px;
}


/*Right Side*/

.blog-post-right h5{
	color: #1C2330;
	font-size: 20px;
	margin: 40px 0px 25px 0px;
}

.blog-post-right h5:after {
    display: block;
    content: "";
    width: 25%;
    border-bottom: 1.5px solid #2578ff;
    padding-bottom: 10px;
}

.blog-post-right button{
    background: #2578ff;
     -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.blog-post-right button:hover{
    background: #1C2330;
}

.latest-posts{
    margin-top: 20px;
}

@media (max-width: 767px) {
    .latest-posts-text{
        margin-top: 10px;
    }
    .blog-post-left{
        margin-top: 20px;
    }
}

.latest-posts-text a{
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #1C2330;
    margin-bottom: 10px;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s; 
}

.latest-posts-text span{
    font-size: 14px;
    color: #2578ff;
}


.blog-categories ul{
    margin-top: 20px;
    padding: 0px;
}

.blog-categories ul li{
    list-style-type: none;
    border-bottom: 1px solid #f1f1f1;
}

.blog-categories ul li a{
    display: block;
    color: #1C2330;
    font-size: 15px;
    font-weight: 500;
    padding: 15px 0px 15px 0px;
}

.blog-categories ul li a:after {
    content: "\f178";
    font-size: 15px;
    font-weight: 400;
    float: right;
    font-family: FontAwesome;
    color: #2578ff;
}
.blog-categories ul li a:hover{
    color: #2578ff;
}


.blog-share{
	list-style-type: none;
	margin-top: 20px;
}

.blog-share ul  {
	border-bottom: 1px solid #e9e9e9;
	padding: 10px 0px 10px 0px;
}

.blog-share ul li {
   display: inline-block;
   padding-right: 25px;
}

.blog-share ul li a {   
  color: #2578ff;
  font-size: 15px;
}

.blog-share ul li a:hover{   
  color: #1C2330;
}




/*-----------------------------------------
18. Blog Post
-------------------------------------------*/
.blog-post-left{
    position: relative;
    border-radius: 10px;
    font-size: 15px;
    background: #fff;
    overflow: hidden;
    margin-bottom: 50px;
}

.blog-post-left img{ 
   width: 100%;
}

.blog-post-info{
    padding-right: 20px;
}

.blog-post-left h4{
    font-size: 26px;
    font-weight: 500;
    color: #1C2330;
    margin: 20px 0px 20px 0px;
}

.blog-post-left ul{
    list-style-type: none;
    margin-bottom: 30px;
}

.blog-post-left li{
    display: inline-block;
    margin-right: 25px;
}

.blog-post-left li i{
    color: #2578ff;
}

.blog-post-left span{
    color: #979797;
    padding-left: 10px;
}


.blog-post-left p{
    font-size: 14px;
    line-height: 180%;
    font-weight: 500;
    color: #979797;
    margin-top: 15px;
}

blockquote{
    border-left: 0px;
    margin-top: 20px;
    margin-bottom: 30px;
    padding: 0px;
}

.blockquote-icon-holder{
	text-align: center;
	padding-top: 35px;
}

.blockquote i{
    color: #2578ff;
    font-size: 38px;
    padding-top: 10px; 
}

.blockquote p{
    color: #797979;
    font-size: 18px;
    font-weight: 500;
    line-height: 170%;
}

@media (max-width: 767px) {
    .blog-post-info{
        padding-right: 0px;
    }
}








/*-----------------------------------------
19. Contact (Page)
-------------------------------------------*/
.contact-left-side{
	position: relative;
	border-radius: 10px;
	background: #fbfbfb;
	padding: 15px 15px 30px 15px;
}
.contact-box-full{
	border-bottom: 1px solid #eee;
	padding: 30px 0px 30px 0px;
		-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
}
.contact-box-full:hover{
	border-bottom: 1px solid #2578ff;
}

.contact-icon{
	float: left;
	width: 25%;
	text-align: center;
}

.contact-icon i{
	color: #2578ff;
	font-size: 20px;
	border: 1px solid #2578ff;
	border-radius: 50px;
	padding: 13px 15px 13px 14px;
	width: 50px;
	height: 50px;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s; 
}
.contact-box-full:hover .contact-icon i{
	background: #2578ff;
	color: #fff;
}
.contact-box-full:hover  i{
	border: 1px solid #2578ff;
	color: #2578ff;
}

.contact-info{
	float: left;
	width: 75%;
}

.contact-info h5{
	font-size: 17px;
	font-weight: 600;
	color: #1C2330;
	margin-bottom: 5px;
}

.contact-info p{
	font-size: 14px;
	font-weight: 600;
	color: #979797;
	margin: 10px 0px 3px 0px;
}

.contact-right-side h2{
    font-size: 22px;
    font-weight: 400;
    color: #1C2330;
    line-height: 150%;
    margin-bottom: 15px;	
}
.contact-right-side h2:after {
    content: '';
    display: block;
    border-bottom: 2px solid #2578ff;
    width: 100px;
    padding-top: 15px;
}

.contact-form input, .contact-form textarea{
	color: #1C2330;
	font-size: 14px;
	font-weight: 500;
	border-radius: 5px;
	border: 0.5px solid #eee;
	width: 100%;
	margin: 15px 0px 15px 0px; 
	padding: 12px 15px 12px 15px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;    	
}

.contact-form input:focus{
	border-color: #2578ff;
}

.contact-form textarea{
	min-height: 150px;
}

.contact-form textarea:focus{
	border: 1px solid #2578ff;
}

.map iframe{
	width: 100%;
	border:0;
	height:auto;
	min-height:350px;
	padding-bottom: 20px;
}


/*-----------------------------------------
20. 404(Page) 
-------------------------------------------*/
.error-bg{
	width: 100%;
	height: 100%;
	background-size: cover;
}

.error{
	text-align: center;
    position: absolute;
    overflow: hidden;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);	
}

.error h1{
	font-size: 180px;
	font-weight: 600;
	background: -webkit-linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.7));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.error h2{
	font-size: 30px;
	background: -webkit-linear-gradient(rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.2));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;	
}

.error h4{
	background: -webkit-linear-gradient(rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.2));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;	
	font-size: 20px;
	margin: 20px 0px 0px 0px;
}

@media screen and (max-width:767px) {
	.error h1{
		font-size: 100px;
	}
	.error h2{
		font-size: 25px;
	}
	.error h4{
		font-size: 18px;
	}
}



/*-----------------------------------------
21. Shop(Page)
-------------------------------------------*/
.product-box{
	overflow: hidden;
	border: 1px solid #E9E9E9;
	border-radius: 10px;
	margin-bottom: 30px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;  	
}
.product-box:hover{
    -webkit-box-shadow: 7px 7px 22px 0px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 7px 7px 22px 0px rgba(50, 50, 50, 0.1);
    box-shadow: 7px 7px 22px 0px rgba(50, 50, 50, 0.1);
}

.product-img{
	border-bottom: 1px solid #f1f1f1;
	width: 100%;
}
.product-img img{
	width: 100%;
}
.product-info{
	padding: 20px;
}

.product-info h4{
	margin-bottom: 15px;	
}
.product-info h4 a{
	font-size: 17px;
	font-weight: 500;
	color: #1C2330;
}

.product-info h4 a:hover{
	color: #2578ff;
}

.product-info span{
	font-size: 15px;
	color: #333;
	margin-right: 20px;
	text-decoration: line-through;
}

.product-info strong{
	color: #2578ff;
}

.sali{
	border-top: 1px solid #f1f1f1;
	margin-top: 15px;
	padding-top: 5px;
}

.sali button{
	font-size: 	14px;
	font-weight: 600;
	color: #1C2330;
	margin-top: 15px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;   
}
.sali button:hover{
	color: #2578ff;
}

.sali button i{
	margin-right: 15px;
	color: #2578ff;
}

.shop-category-list{
	position: relative;
	overflow: hidden;
	border-radius: 10px;
}

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

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

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

.shop-category-list ul li:hover a{
	color: #fff !important;
	background: #1c2330;
}

.shop-active-link a{
	color: #fff !important;
	background: #1c2330;
}





/*-----------------------------------------
22. Shop Detail(Page)
-------------------------------------------*/
.product-page-img{
	position: relative;
	overflow: hidden;
	border: 1px solid #f1f1f1;
}

.product-small{
	width: 33.45%;
	border: 1px solid #f1f1f1;
	margin-right: -4px;
}

.product-page-text h2{
	font-size: 22px;
	font-weight: 600;
    color: #333;
}

.product-page-text i{
	color: #ffc527;
	font-size: 15px;
	margin-top: 15px;
}			

.product-rating{
	display: inline-block;
	margin-right: 20px;	
}			

.product-page-text span{
	font-size: 15px;
}

.product-page-text p{
	font-size: 15px;
	color: #979797;
	margin-top: 20px;
}

.product-page-text h5{
	font-size: 16px;
	color: #333;
	margin-top: 20px;
}

.product-number {
  position: relative;	
  color: #333;
  margin-top: 5px;
}

.product-number input {
	text-align: center;
	font-size: 16px;
	display: block;
	border: 1px solid #333;
	border-radius: 5px;
	width: 55px;
	height: 45px;
	padding: 0px 10px 0px 10px;
	margin-top: 15px;
}

.product-page-text h3{
	font-size: 25px;
	font-weight: 600;
	color: #333;
	margin-top: 15px;
}

.product-number-nav {
  float: left;
  position: relative;
  height: 43px;
}

.product-number-button {
	position: relative;
	cursor: pointer;
	border-left: 1px solid #1c303e;
	width: 22px;	
	text-align: center;
	color: #333;
	font-size: 14px;
	font-weight: 400;
	line-height: 175%;
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;  
}
.product-number-button:hover{
  color: #ffc527;
}

.product-number-button.product-number-up {
  position: absolute;
  height: 55%;
  top: 0;
  border-bottom: 1px solid #333;
}

.product-number-button.product-number-down {
  position: absolute;
  bottom: -1px;
  height: 50%;
}

.com-img img{
	width: 100px;
	border-radius: 50%;
	margin-bottom: 15px;
}

.com-text{
	padding: 15px;
 	border: 0.5px solid #f1f1f1;
 	border-radius: 10px;
}

.com-text h4{
	display: inline-block;
	color: #333;
	font-size: 17px;
	font-weight: 500;
	margin-right: 30px;
}

.com-text a{
	font-size: 14px;
	color: #979797;
	-webkit-transition-duration: .3s;
	transition-duration: .3s; 
}

.com-text a:hover {
	color: #ffc527;
	transform: scale(1.3);
}

.com-text span{
	color: #979797;
	font-size: 14px;
	float: right;
	margin-right: 30px;
}

.com-text p{
	color: #979797;
	margin-top: 15px;
	line-height: 150%;
	font-size: 14px;
	font-weight: 500;
}

.big-product-overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: .5s ease;
	background: rgba(37, 120, 255, 0.4);
}

.product-page-img:hover .big-product-overlay {
	opacity: 1;
}

.big-product-overlay i {
	color: #fff;
	font-size: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
}







/*-----------------------------------------
23. Tabs
-------------------------------------------*/
.tab-menu{
	padding: 0px 15px 15px 0px;
}

.tab-menu{
	position: relative;
}

.tab-menu li {
	display: inline-block;	
	background: transparent;
	background: transparent;
	width: 150px;
	border-radius: 10px;
	margin: 0px 10px 0px 10px;	
}

.tab-menu li a {
	color: #1c303e;
	display: block;
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;	
	border-bottom: 1.5px solid #1c303e;	
	padding: 10px 5px 10px 5px;
}

.tab-menu li i {
	color: #3c59b3;
	display: block;
	font-size: 40px;
	text-align: center;
	margin-bottom: 15px;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;		
}
.tab-menu li:hover a, .tab-menu li:hover i {
	color: #1c303e;
}

.active-tab a{
	color: #2578ff !important;
	border-bottom: 1.5px solid #2578ff !important;
}
.active-tab a i{
	color: #2578ff !important;
}

@media screen and (max-width:767px) {
	.tab-menu{
		display: block;
		padding-right: 0px;
	}
	.tab-menu{
		text-align: center;
	}
	.tab-menu li{
		display: block;
		width: 100%;
		padding: 5px 0px 5px 0px;
		margin-right: 0px;
		margin-left: 0px;
	}	
}



/*-----------------------------------------
24. Progress Bars
-------------------------------------------*/
.progress-text{
	font-size: 13px;
	font-weight: 600;
	color: #333;
	margin-bottom: 10px;	
}

.custom-progress{
	background: #f7f7f7;
	height: 6px;
	box-shadow: none;
}

.primary-bar{
	height: 6px;
	background-color: #2578ff;
	box-shadow: none;
}
.dark-bar{
	height: 6px;
	background-color: #1c2330;
	box-shadow: none;
}



/*-----------------------------------------
25. Pie Charts
-------------------------------------------*/

.circle-container {
  display: block;
  margin: 125px 0px 25px 0px;
  text-align: center;
  width: auto !important;
}

.circle-container h5 {
  display: block;
  text-align: center;
  font-size: 17px;
  font-weight: 500;
  color: #fff;
}

.circle-container h2 {
  display: block;
  text-align: center;
  font-size: 20px;
  font-weight: 500;
  color: #fff;
}

.circle-container h4 {
	position: relative;
	font-size: 40px;
	font-weight: 500;
	color: #fff;
	z-index: 999;
	margin-bottom: -160px;
}

.circliful {
  position: relative; 
  width: auto !important;    
}

.circliful span{
  width: auto !important;  
}

.circle-text, .circle-info, .circle-text-half, .circle-info-half {
    width: 100%;
    position: absolute;
    text-align: center;
    display: inline-block;
    left: 40%;
}

.circle-info, .circle-info-half {
    color: #999;
}

.circliful .fa {
    margin: -10px 3px 0 3px;
    position: relative;
    bottom: 4px;
}



/*-----------------------------------------
26. Accordions
-------------------------------------------*/
.accordion{
	background: #fff !important;
	box-shadow: none;
	border: none;
}

.accordion-heading{
	border-radius: 0px;
	padding: 0px;
	background: #fff !important;
}

.accordion-title a{	
	font-size: 14px;
	font-weight: 600;
	background: #2578ff;
	color: #fff;
	display: block;
	border-bottom: 1px solid #f7f7f7;
	border-radius: 10px;
	padding: 15px 20px 15px 20px;
}
.accordion-title .collapsed{	
	font-size: 14px;
	font-weight: 600;
	background: #f7f7f7;
	color: #333;
	display: block;
	border-bottom: 1px solid #f7f7f7;
	border-radius: 10px;
	padding: 15px 20px 15px 20px;
}
.accordion-title a:before{	
	content: '\f107';
	font-weight: 700;
	color: #fff;
	font-family: FontAwesome;
	font-size: 13px;
	padding-right: 15px;
}
.accordion-title .collapsed:before{	
	content: '\f105';
	font-weight: 700;
	color: #333;
	font-family: FontAwesome;
	font-size: 13px;
	padding-right: 15px;
}

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




/*-----------------------------------------
27. Scroll To Top Button
-------------------------------------------*/

/* #Progress
================================================== */
:root {
	--red: #da2c4d;
	--yellow: #f8ab37;
	--green: #2ecc71;
	--white: #ffffff;
	--grey-light: #f2f7f9;
	--grey: #ecedf3;
	--black: #080808;
	--black-blue: #1f2029;
	--black-blue-light: #353746;
	--black-blue-light-2: #404255;
	--black-blue-light-3: #4b4d64;
	--black-light: #424455;
}

.progress-wrap {
	position: fixed;
	right: 20px;
	bottom: 20px;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	border-radius: 50px;
	box-shadow: inset  0 0 0 2px rgba(255,255,255,0.2);
	z-index: 10000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.progress-wrap.active-progress {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.progress-wrap::after {
	position: absolute;
	font-family: 'FontAwesome';
	content: '\f062';
	text-align: center;
	line-height: 46px;
	font-size: 20px;
	color: var(--black-light);
	left: 0;
	top: 0;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	z-index: 1;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.progress-wrap:hover::after {
	opacity: 0;
}
.progress-wrap::before {
	position: absolute;
	font-family: 'FontAwesome';
	content: '\f062';
	text-align: center;
	line-height: 46px;
	font-size: 20px;
	opacity: 0;
	background-image: linear-gradient(298deg, var(--red), var(--yellow));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	left: 0;
	top: 0;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	z-index: 2;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.progress-wrap:hover::before {
	opacity: 1;
}
.progress-wrap svg path { 
	fill: none; 
}
.progress-wrap svg.progress-circle path {
	stroke: var(--black-light);
	stroke-width: 4;
	box-sizing:border-box;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}

/*-----------------------------------------
28. Footer
-------------------------------------------*/
#footer{
	background: #1c2330;
	padding: 60px 0px 60px 0px;
}

#footer h2{
    font-size: 22px;
    font-weight: 400;
    color: #fff;
    line-height: 150%;
    margin-bottom: 15px;	
}

#footer h2:after {
    content: '';
    display: block;
    border-bottom: 2px solid #2578ff;
    width: 100px;
    padding-top: 15px;
}

@media screen and (max-width:767px) {
	#footer h2{	
		margin-top: 30px;
	}
}

.footer-logo{
	position: relative;
	margin-bottom: 5px;
}
.footer-logo:after {
    content: '';
    display: block;
    border-bottom: 2px solid #2578ff;
    width: 100px;
    padding-top: 15px;
}
.footer-logo img{
	width: auto;
	max-height: 80px;
}
.footer-contact{
	padding-left: 0px;
}

.footer-contact li{
	list-style-type: none;
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	margin-top: 15px;
}

.footer-contact li i{
	width: 40px;
	height: 40px;
	padding: 13px 15px 15px 14px;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	background: #242b3a;
	margin-right: 15px;
}

.footer-text p{
    font-size: 15px;
    font-weight: 500;
    color: #fff;
    line-height: 180%;
    margin-bottom: 15px;
}

.footer-list{
	padding-left: 0px;
}

.footer-list li{
	list-style-type: none;
	display: block;
	padding-top: 15px;
}

.footer-list li:before{
	content: '\f178';
	font-family: FontAwesome;
	color: #2578ff;
	font-size: 16px;
	padding-right: 15px;
}

.footer-list li a{
	color: #fff;
	font-size: 14px;
	font-weight: 500;
}

.footer-list li a:hover{
	color: #2578ff;
}

.footer-form input,.footer-form textarea{
	background: #fff;
    color: #333;
    font-size: 13px;
    font-weight: 600;   
    border: none;
    border-bottom: 1px solid #eee;    
    width: 100%;
    border-radius: 5px;
    margin-top: 30px; 
    padding: 11px 15px 11px 15px;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;       
}
.footer-form input:focus,.footer-form textarea:focus{
    background: #f9f9f9;
    border-color: #2578ff;
}

.footer-form textarea{
    min-height: 100px;
}

.footer-bar{
	text-align: center;
	background: #242b3a;
	padding: 20px 0px 20px 0px;
}
.footer-bar span,.footer-bar span a{	
	color: #fff;
	font-size: 14px;
	font-weight: 500;
}
.cursor-pointer {
    cursor: pointer;
}

.pogoSlider-slide {
    position: relative;
}

.pogoSlider-slide .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.slider-content {
    position: relative;
    z-index: 2;
}

.blog-post-contact{
	border-radius: 10px;
	background: #f7f7f7;
    padding: 15px;
    margin-top: 50px;
}

.blog-post-contact a{
    color: #1c303e;
    margin-right: 10px;
}

.contact-icons a i{
    color: #1c303e;
    font-size: 16px;
    padding: 0px 0px 0px 5px;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;    
}

.contact-icons a i:hover{
    color: #ffc527;
    font-size: 16px;
    padding: 0px 0px 0px 5px;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;    
}

.left-icon a {
	color: #1c303e;
}

.left-icon a:hover {
	color: #ffc527;
}