/*

  Theme Name: Doors

  Theme URL: http://www.themeregion.com

  Author: ThemeRegion

  Author URI: http://www.themeregion.com

  Description: Onepage Responsive HTML Parallax Template

  Version: 1.0

*/



/*=======================================================================

[Table of contents]

=========================================================================



1. Typography

2. Home / Navigation + Main Carousel

3. Service

4. parallax promo-One

5. Recent-works

6. About Us / Skills-Section + Team-member

7. parallax promo-two

8. Blog

9. parallax promo-three

10. Clients

11. News Letter 

12. Pricing Table

13. Twitter

14. Contact us

15. Footer

16. Preloader



==========================================================================*/



/*========================

=======Typography=========

==========================*/


@import url(https://fonts.googleapis.com/css?family=Dosis&subset=latin,latin-ext);
body {

	font-family: 'Dosis';  

	font-size: 15px;

	color: #7A7777;

	background-color: #fff;

}



ul {

	list-style: none;

	margin:0;

	padding:0;

	

}



.navbar-nav li a:hover, 

.navbar-nav li a:focus {

	outline:none;

	outline-offset: 0;

	text-decoration:none;  

	background: transparent;

}



a {

	color: #fff;

	text-decoration: none;

	-webkit-transition: 300ms;

	-moz-transition: 300ms;

	-o-transition: 300ms;

	transition: 300ms;

}



a:focus, 

a:hover {

	text-decoration: none;

	outline: none;

	/* color:#312f61; */
	
	text-decoration:underline;

}



h1 {

	font-size:36px;

}



h2 {

	font-size: 18px;

}



h3 {

	font-size: 30px;

}



h4 {

	font-size: 18px;

}



h5 {

	font-size: 14px;

}



h1, h2, h3, h4, h5, h6 {

	font-family: 'Dosis';

	font-weight:normal;

}



.padding-top {

	padding-top:10px;

}



.padding-bottom{	

	padding-bottom:0;

}



.section-title {



}



.section-title h3 {

	color: #312F61;

	line-height: 1px;

	margin-bottom: 0;



}



.title-border {

	background-color:#312F61;

	height: 1px;

	margin-bottom: 22px;

}



.parallax-section { 	

	background-position: 50% 0;

	background-repeat: no-repeat;

	background-size: cover;

	background-attachment:fixed;

	width: 100%;

	min-height: 385px;

	color: #fff;

	font-size:18px;  

}



.parallax-content {	

	padding-bottom:70px;

	padding-top:110px;

}



.parallax-content h1 {

	text-transform: uppercase;

	line-height: 48px;

}



.navbar-toggle {

	border:1px solid #fff;

	margin-top:15px;

}



.navbar-toggle .icon-bar {

	background-color: #fff;

}





/*========================

========Home CSS==========

==========================*/



.navbar-brand.change-logo {	

	height: 78px;

	background-color: #;

	padding:9px 3px 9px 9px;

}



.navbar-brand.change-logo h1 {

  margin-top: -5px;

}



.navbar-brand.change-logo h2 {

	display: none;

}



.navbar-brand.change-logo h1 img {

	width: 63%;

}



.main-nav {

	left: 0;

	position: absolute;

	top: 0;

	width: 100%;

	z-index: 1000;

}



.top-bar-hide {

	display: none;

}



/*Topbar*/

.top-bar {

	position:absolute;

	right:35px;

	top:5px;

	z-index: 10;

}



.top-bar span {

	color:#fff;

}



.top-bar span i {

	/* color: #312f61; */

	font-size: 18px;

}



/*Navigation CSS*/

#navigation .container {

	position:relative;

}



a.navbar-brand {

	

	display: block;

	height: 180px;

	overflow: hidden;

	padding:12px;

	color: #fff;

	margin-left: 0 !important;

}



.navbar-brand h1 {

	margin-bottom: 0;

}



.navbar-brand h2 {

	font-size:14px;

	letter-spacing:2px;

	text-transform: uppercase;

	font-family: 'aller_lightregular';

	font-weight: 700;

	margin-top: 5px;

}



#navigation .navbar-right {

	margin-top: 76px;

	margin-right: 35px;

}



#navigation .navbar-right li a {

	color:#fff;

	font-size:16px;

	height: 100%;

	text-transform:uppercase;

	font-family: 'Dosis';

	padding:10px 17px;

}



#navigation .navbar-fixed-top {

	background-color: #312F61;

	border-bottom: 1px solid #dfdfdf;

	-webkit-transition: 300ms;

	-moz-transition: 300ms;

	-o-transition: 300ms;

	transition: 500ms;

}



#navigation .navbar-fixed-top .navbar-right{

	margin-top: 0;

}



#navigation .navbar-fixed-top .navbar-right li a{

	line-height: 48px;

	padding: 15px 17px;

}



#navigation .navbar-fixed-top .navbar-right li a.active, 

#navigation .navbar-fixed-top .navbar-right li a:hover, 

#navigation .navbar-fixed-top .navbar-right li a:focus, 

#navigation .navbar-fixed-top .navbar-right li.active a{

}



#navigation .navbar-right li a.active, 

#navigation .navbar-right li a:hover, 

#navigation .navbar-right li a:focus, 

#navigation .navbar-right li.active a  {

	background-color:#312f61;

	border-radius: 4px;

}



.search{

  position: absolute;

  top: 88px;

  right:15px;

  z-index: 1;

}



#navigation .navbar-fixed-top .search {

	top: 30px;

}



#navigation .navbar-fixed-top .search .field-toggle{

	top: 40px;

}



.search i{

  color: #fff;

  cursor: pointer;

  position: absolute;

  right:0;

  top: 2px;

}



#navigation .navbar-fixed-top .search i:hover {

	color: #fff;

}



.field-toggle {

  position: relative;

  top: 30px;

  right: 0px;

  display: none;

  height: 50px;

}



.search-form{

  padding-left: 10px;

  height:35px;

  font-size: 14px;

  color: #818285;

  font-weight: 300;

  outline: none;

  border: 1px solid #df392e;

  margin-top:10px;

}



.search i:hover {

	color:#df392e;

}



/*Main Carousel CSS*/



#home-carousel  .item {

	background-position: center top;

	background-repeat: repeat-y;

	background-size:100% 100%;

	width:100%;

	height: 1000px;


}



.carousel-caption {

	left: 85px;

	right: 15px;

	top: 180px;

	font-size: 15px;

	text-align: left;

	color: #fff;

	text-shadow: none;	

}



.carousel-caption h1 {

	font-size:46px;

	margin-bottom:0;

	letter-spacing:2px;

}



.carousel-caption h2 {

	font-size:81px;

	font-family: 'aller_displayregular';

	margin-top:0px;

	text-transform:lowercase;

	letter-spacing:2px;

}



.carousel-caption p {

	max-width:580px;

}



.brand-promotion {

	bottom:46px;

	left: 0;

	position: absolute;

	right: 15px;

	color:#464040;

	z-index:15;

}



.brand-content {

	background-color:rgba(18,89,199,0.8);

	/*padding: 30px 32px;*/

	font-size: 14px;

	margin-right: -25px;

}



.brand-content h2 {

	text-transform: capitalize;

}



.brand-content:hover {

	background-color:rgba(18,89,199,0.8);

}



.brand-content img {

	margin-right: 15px;

	margin-top: 15px;

	margin-left: 10px;

}



.container>.carousel-arrows {

	top: 450px;

	left:40px;

	position: relative;

}



.home-carousel-left, 

.home-carousel-right {	

	position: absolute;

	font-size: 30px;

	z-index: 15;

	color:#fff;	

}



.home-carousel-left {

	left:0px;

}



.home-carousel-right {

	left:25px;

}



/*=========================

========Service CSS========

===========================*/



.service-icon {

	display:inline-block;	

	color: #312F61;

	font-size:60px;

	line-height: 75px;	

	-webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}



#service .col-md-3:hover .service-icon {

	-moz-transform: scale(1.3);

	-webkit-transform: scale(1.3);

	-o-transform: scale(1.3);

	-ms-transform: scale(1.3);

	transform: scale(1.3);	

}



.service-text h4 {

	margin-bottom:30px;

}



/*=========================

==parallax promo-One CSS===

===========================*/



#promo-one  {

	background-image: url("../images/promotions/promo-one-bg.jpg");

}



#promo-one h2 {

	line-height: 28px;

	margin-top: 40px;

	position: relative;

	display: inline-block;

}



#promo-one h2:before {

	content: '"';

	position: absolute;

	left: -50px;

	top:20px;

	font-size: 101px;

	font-family: Arial;

}



#promo-one h2 span {

	display: block;

	font-size: 14px;

}



/*=========================

=======Recent-works CSS=======

===========================*/



#recent-works .section-title {



}



.filter {

	overflow:hidden;



}



.filter li {

	display:inline-block;

}



.filter li a {

	display:block;

	padding:4px 8px;

	font-size:18px;

	font-weight:300;

	color: #454545;

}



.filter li a:hover, 

.filter li a:active, 

.filter li a:focus, 

.filter li a.active {

	color:#fff;

	background-color:#DFA32F

}



.portfolio-items li {

	width: 24.97%;

	float: left;

	position: relative;

	overflow: hidden;

}



.portfolio-item img {

	width: 100%;

}



.portfolio-content {

	position:relative;

	overflow:hidden;

}



.overlay {

	position:absolute;

	bottom:0;

	left:0;

	height:100%;

	width:100%;

	color: #fff;

	padding:90px;

	background-color:rgba(18,89,199,0.8);

	-webkit-transition:all 0.3s ease-out 0s;

	-moz-transition:all 0.3s ease-out 0s;

	-ms-transition:all 0.3s ease-out 0s;

	-o-transition:all 0.3s ease-out 0s;

	transition:all 0.3s ease-out 0s;

}



.overlay h2, .overlay h4 {

	-webkit-transition:all 0.3s ease-out 0.15s;

	-moz-transition:all 0.3s ease-out 0.15s;

	-ms-transition:all 0.3s ease-out 0.15s;

	-o-transition:all 0.3s ease-out 0.15s;

	transition:all 0.3s ease-out 0.15s;

	position: relative;

	top:10%;

}



.overlay p {

	-webkit-transition:all 0.3s ease-out 0.25s;

	-moz-transition:all 0.3s ease-out 0.25s;

	-ms-transition:all 0.3s ease-out 0.25s;

	-o-transition:all 0.3s ease-out 0.25s;

	transition:all 0.3s ease-out 0.25s;

	position: relative;

	top: 34%;

}



.portfolio-content:hover .overlay a.folio-detail, 

.portfolio-content:hover .overlay a.folio-link, 

.portfolio-content:hover .overlay h2, 

.portfolio-content:hover .overlay p, 

.portfolio-content:hover .overlay, 

.team-member:hover .overlay, 

.team-member:hover .overlay p, 

.team-member:hover .overlay h4, 

.team-member:hover .social-icons {

	opacity:1;

	-moz-transform: scale(1);

	-webkit-transform: scale(1);

	-o-transform: scale(1);

	-ms-transform: scale(1);

	transform: scale(1);

}



.overlay a.folio-detail, 

.overlay a.folio-link {

	position:absolute;

	left: 115px;	

}



.overlay a.folio-link {

	bottom:22px;

	font-size:24px;

	-webkit-transition:all 0.3s ease-out 0.35s;

	-moz-transition:all 0.3s ease-out 0.35s;

	-ms-transition:all 0.3s ease-out 0.35s;

	-o-transition:all 0.3s ease-out 0.35s;

	transition:all 0.3s ease-out 0.35s;		

} 



.overlay a.folio-detail {

	top:5px;	

	font-size:75px;

	-webkit-transition:all 0.3s ease-out 0.10s;

	-moz-transition:all 0.3s ease-out 0.10s;

	-ms-transition:all 0.3s ease-out 0.10s;

	-o-transition:all 0.3s ease-out 0.10s;

	transition:all 0.3s ease-out 0.10s;	

}



.overlay a.folio-detail, 

.overlay a.folio-link, 

.overlay p, 

.overlay h2,  

.overlay, 

.overlay h4, 

.social-icons {

	-moz-transform: scale(0.5);

	-webkit-transform: scale(0.5);

	-o-transform: scale(0.5);

	-ms-transform: scale(0.5);

	transform: scale(0.5);

	opacity: 0;

}





/*=========================

 ====Isotope filtering=====

===========================*/

.isotope-item {

    z-index: 2;

}

.isotope-hidden.isotope-item {

    pointer-events: none;

    z-index: 1;

}

.isotope, .isotope .isotope-item {/* change duration value to whatever you like */

    -webkit-transition-duration: 0.8s;

    -moz-transition-duration: 0.8s;

    transition-duration: 0.8s;

}

.isotope {

    -webkit-transition-property: height, width;

    -moz-transition-property: height, width;

    transition-property: height, width;

}

.isotope .isotope-item {

    -webkit-transition-property: -webkit-transform, opacity;

    -moz-transition-property:-moz-transform, opacity;

    transition-property:transform, opacity;

}





/*=========================

======About Us CSS=========

===========================*/

#about-us  {

	overflow:hidden;

}



#about-us .section-title {

	padding-bottom: 60px;

}



.about-content h2 {

	margin-bottom: 25px;

}



.about-content .col-sm-4 {

	margin-bottom: 25px;

}



/*=== Skills-Section ==*/



.skills-section {

	min-height: 350px;

}



.heading {

	margin-bottom: 35px;

}



.skill-circle {

	margin: 0 auto;

	display: block;

	text-align: center;

	position: relative;	

}



.skill h2 {

    text-align: center;

    text-transform: uppercase;

    margin-top: 15px;

}



.skill-data {

	font-size: 24px;

	font-family: 'aller_displayregular';

	display: block;

	text-align: center;

	line-height: 185px;

	position: absolute;

	left: 50%;

	margin-left: -25px;

}



/*=======Team-member=======*/

#team-carousel .carousel-inner .col-sm-3 {

	padding: 0;

	overflow: hidden;

}



.team-member {

	position: relative;

}



.our-team {

	margin-bottom:100px;

}



.team-member .overlay h4 {

	top:15%;

	position: relative;

}

 

.team-member .overlay p {

	top:20%;

} 



.social-icons {

	bottom: 40px;

    position: absolute;

    -webkit-transition:all 0.3s ease-out 0.15s;

	-moz-transition:all 0.3s ease-out 0.15s;

	-ms-transition:all 0.3s ease-out 0.15s;

	-o-transition:all 0.3s ease-out 0.15s;

	transition:all 0.3s ease-out 0.15s;

}



.social-icons li {

	float:left;

	margin-right:25px;

}



.social-icons li a {

	color: #fff;

}



.team-carousel-left, 

.team-carousel-right {

	position: absolute;

	bottom:-90px;

	color: #312F61;

	background-color:#f7f7f7;

	height:55px;

	width: 55px;

	line-height: 60px;

	font-size:24px;

	text-align: center;

}



.team-carousel-left i {

	margin-left: -4px;

}



.team-carousel-right i {

	margin-right: -4px;

}



.team-carousel-left {

	left: 50%;

	margin-left: -65px;

} 



.team-carousel-right {

	right:50%;

	margin-right: -65px;

}



.team-carousel-left:hover, 

.team-carousel-right:hover {

	background-color: #312F61;

	color: #fff;

} 





/*=========================

==parallax promo-two CSS===

===========================*/



#promo-two {

	background-image: url("../images/promotions/promo-two-bg.jpg");		

}



#promo-two .parallax-content {

	padding-top: 70px;

}



.btn-submit {

	border: 6px solid #fff;

	border-radius: 0;

	font-size: 18px;

	font-weight: 700;

	letter-spacing: 2px;

	margin-top: 50px;

	padding:20px 80px 17px;

	text-transform: uppercase;	

	color: #fff;

	background-color:#312F61;

}



.btn-submit:hover {

	background-color:#312F61;

	color: #fff;

}





/*=========================

==========Blog CSS=========

===========================*/



#blog {

	overflow: hidden;

}



.single-blog {

	margin-bottom:30px;

	overflow:hidden;

	height:354px;

}



.blog-image {

	width:40%;

	float:left;

	position:relative;

}



.blog-image img{

	width:222px;

	height:354px;

}



.entry-content {

	width:60%;

	float:left;

	padding:10px 40px 40px 35px;

	height:100%;

	font-weight:300;

	background-color: #f5f5f5;

}



.entry-content  a h2 {

	color:#454545;

	line-height:32px;

	margin-bottom: 20px;

}



.entry-meta {

	margin-bottom:20px;

}



.entry-meta span a {

	color:#333;

	margin-right:18px;

	font-size:16px;

	font-weight:300;

}



.read-more {

	background-color: #312F61;

	color: #fff;

	display: inline-block;

	font-size: 16px;

	font-weight: 300;

	margin-top: 18px;

	padding: 10px 20px;

}



.read-more:hover{

	background-color:#bd1e26;

	color: #fff;

}



.entry-meta span a:hover {

	color:#bd1e26;

}





.post-date {

	background-color: #312F61;

	color: #1E1E1E;

	font-size: 48px;

	font-weight: 400;

	line-height: 30px;

	padding: 20px 25px 0;

	position: absolute;

	right: 0;

	text-align: center;

	top: 15px;	

	-webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}



.single-blog:hover .post-date {

	background-color: #312F61;

	color: #fff;



}



.post-date span {

	font-weight:300;

	font-size:18px;

	display:block;

}





/*===========================

==parallax promo-three CSS===

=============================*/



#fun-fact {

	background-image: url("../images/promotions/promo-three-bg.jpg");

	background-color: #312F61;		

}



#fun-fact .parallax-content {

	padding-top: 50px;

}



#fun-fact .parallax-content h1 {

	font-weight: 700;

}



#fun-fact .funs {

	margin-top: 40px;

}



#fun-fact .funs i {

	font-size: 48px;

	margin-bottom: 20px;

}



h3.timer {

	font-size: 120px;

	font-family: 'aller_displayregular';

	margin-bottom: 0;

    margin-top: 20px;

}





/*=========================

========Clients CSS========

===========================*/





#clients-carousel .item {

	font-size:0;

	text-align:center;

}



#clients-carousel .item ul li {

	display:inline-block;

	width:25%;

}



#clients-carousel .item img {

	opacity:0.5;

	-webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}



#clients-carousel .item img:hover {

	opacity:1;

}



.client-left, 

.client-right {	

	color: #1e1e1e;

	font-size: 60px;

	position: absolute;

	bottom: -20px;

}



.client-left:hover, 

.client-right:hover {

	color: #312F61;

}



.client-left {

	left:-20px;

}



.client-right {

	right:-20px;

}





/*=========================

=======News Letter CSS=====

==========================*/



#news-letter {

	background-image: url("../images/promotions/news-letter-bg.jpg");	

	background-color: #312F61;

	overflow:hidden;

}



#newsletter input {

	background-color: #312F61;

	border-width: 0 0 1px 0;

	border-style: solid;

	border-color: #fff;

	color: #fff;

	display: block;

	margin-top: 35px;

	padding: 12px 25px;

	width: 100%;

	outline: none;

}



#newsletter input:focus {

	background-color: #312F61;

}





/*========================

=====Pricing Table CSS====

=========================*/

#pricing-tables {

	overflow: hidden;

}



.single-table {

	background-color: #fafafa;

}



.single-table h2 {

	background-color: #f2f2f2;

	padding: 23px;

	margin-top: 0;

	margin-bottom: 0;

}



.price {

	font-size: 14px;

	background-color: #dedede;	

	padding:9px 23px;

	margin-bottom: 0;

}



.price span {

	font-size: 24px;

	font-weight: 700;

}



.price span.dollar-icon {

	font-size: 16px;

	font-weight: 400;

	position: relative;

	top: -5px;

}



.single-table ul {

	padding: 5px 23px;

}



.single-table ul li {

	margin-top: 15px;

}



.btn-signup {

	background-color: #dedede;

	border: medium none;

	border-radius: 0;

	color: #454545;

	display: block;

	margin-bottom: 0;

	margin-top:40px;

	text-align: center;

	text-transform: uppercase;

	font-weight: 700;

	padding: 10px 0;

}



.single-table.featured-table {	

	background-color: #f2f2f2;

}



.single-table.featured-table h2  { 

	background-color: #db1820;

	color: #fff;

}



.single-table.featured-table .price {

	background-color: #c7161c;

	color: #fff;

}



.single-table.featured-table .btn-signup, 

.single-table:hover .btn-signup:hover{

	background-color: #dfa32f;

	color: #fff;

}



/*========================

========Twitter CSS=======

==========================*/

#twitter {

	background-image: url("../images/promotions/twitter-bg.jpg");	

}



#twitter i {

	font-size: 80px;

	margin-bottom: 35px;

}



#twitter .parallax-content {

	padding-top: 75px;

}



/*=========================

=======Contact us CSS======

===========================*/



#contact-us .section-title {

	

	padding-bottom: 15px;

}



.contact-content h2 {

	margin-bottom: 28px;

}



.contact-content i {

	color: #dfa32f;

	font-size: 22px;

	margin-right: 5px;

}



.contact-content i.fa-envelope {

	font-size: 17px

}



.business-time span {

	color: #db1820;

}



.contact-content .form-control {

  background-color: #fcfcfc;

  border-width:0 0 1px 0;

  border-style: solid;

  border-color: #d7d7d7;

  border-radius: 0;

  box-shadow: none;

  height: 42px;

  margin-bottom: 5px;

}



.contact-content .form-control:focus {

	border-color: #db1820;

}



.contact-content textarea.form-control {

  min-height: 90px;

  resize: none;

}



#contact-form .name-field {

	padding-right:7px;

}



#contact-form .email-field {

	padding-left: 7px;

}



#contact-form .btn-submit {

	background-color: #dfa32f;

	color: #fff;

	margin-top: 0;

	padding: 13px 0 8px;

	width: 100%;

	border:0;

	outline: none;

}



#contact-form .btn-submit:hover {

	background-color: #ab8a41;

}



/*=========================

========Footer CSS========

===========================*/



#gmap {

	height:440px;

}



#footer {

	background-color:#dfa32f;

	color:#fff;

	padding-top:30px;

	padding-bottom:20px;

	font-weight:400;

	position: relative;

}



#footer a {

	font-weight:700;

	color:#fff;

}



#footer a.to-top {

	left: 50%;

	top: -25px;

	margin-left:-30px;

	position: absolute;

}



#footer a.to-top:before {

	content: "";

	position: absolute;

	border-color: transparent transparent #dfa32f;

	border-style: solid;

	border-width: 28px 60px;

	left:-25px;

	top: -30px;

}





/*========================

=======Preloader CSS======

==========================*/

.preloader{

  display: table;

  background: #fff;

  z-index: 999999;

  position: fixed;

  height: 100%;

  width: 100%;

  left: 0;

  top: 0;

}



#loaderImage {

  display: table-cell;

  vertical-align: middle;

  overflow: hidden;

  text-align: center;

}



#canvas {

  display: table-cell;

  vertical-align: middle;

  margin: 0 auto;

}