/* 
 * Overrides of default CSS styles
 * Author : Francis Boudreau
 * URL : www.franboud.com
 */

/* FONTS *********************************************************
   Typekit :
   - Nimbus Sans Light : 300
   - Nimbus Sans Black : 900
   ***************************************************************/

body, html,
button,
ul#contact-form li #name, ul#contact-form li #contact-email, ul#contact-form li #phone, ul#contact-form li #message
{
	font-family: "nimbus-sans-n3","nimbus-sans",sans-serif;
	font-style: normal;
	font-weight: 300;
}

p.featured-work-section-title, p.portfolio-section-title, p.blog-section-title a, p.about-section-title, p.skill-section-title, p.contact-section-title,
div.main-menu nav ul li,
.home-title,
div.section h2,
#id_body a.button, #id_body .button
{
	font-family: "nimbus-sans-n9","nimbus-sans",sans-serif;
	font-style: normal;
	font-weight: 900;
}


/* BASE TAGS .................................................... */
body, button {color:#5e6975;}


/* Transitions */
.add_transition,
.main-menu .logo a,
div.main-menu nav ul li,
div.main-menu nav ul li a,
a.button-banner,
.button,
.block a,
.footer-copyright a {
	-webkit-transition: all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
	transition:all 0.3s ease;
}

/* Images responsive */
.main-menu .logo a img {max-width:100%; height:auto;}
.lt-ie9 .main-menu .logo a img {width: auto;}

/* Selection */
::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}


/* HEADER ....................................................... */
div.main-menu {background-color: #044B99; border-bottom: 1px solid #033C7A;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

	@media screen and (max-width: 760px) {
		div.main-menu {position:relative !important;}
	}

/* Top Logo */
.main-menu .logo {float:left; margin:0; width:300px;}
.main-menu .logo a {padding:21px 20px 0 20px;}
.main-menu .logo a:hover {opacity:0.7;}

	@media screen and (max-width: 760px) {
		.main-menu .logo {text-align:center; float:none; margin:0 auto; margin-bottom:15px;}
	}

/* Menu */
div.main-menu nav ul {text-align:right; float:right;}
div.main-menu nav ul li {text-transform:uppercase; font-size:14px; float:left;}
div.main-menu nav ul li.active, 
div.main-menu nav ul li:hover {background-color:rgba(0, 0, 0, 0.2);}
div.main-menu nav a {padding-left:16px; padding-right:14px;}

	@media screen and (max-width: 890px) {
		div.main-menu nav ul li {font-size:12px;}
		div.main-menu nav a {padding-left:11px; padding-right:9px;}
	}

	@media screen and (max-width: 760px) {
		#main-menu-sticky-wrapper {height:250px !important;}
		div.main-menu nav {height:auto;}
		div.main-menu nav ul {float:none;}
		div.main-menu nav ul li {float:none; font-size:18px; letter-spacing:5px; display:block; text-align:center;}
		div.main-menu nav ul li a {padding:10px 0; border-top:1px solid #00357f;}
	}

div.main-menu nav ul li.lang a {
	color:#81a5cc;
}
div.main-menu nav ul li.lang a:hover {
	color:#fff;
}

/* Banner */
.home {
	border-top:0;
	height:600px;
	padding-top:30px;
	
	 /* Fallback */
    background:url('../images/background-home.jpg') no-repeat fixed center center;
    background-size: cover;
    
    /* BG image with pattern over it */
    background:url('../images/site-bg-pattern.png') repeat fixed 0 0, url('../images/background-home.jpg') no-repeat fixed center center;
    background-size: auto, cover;
}
.logo {margin: 100px auto 0 auto;}	
.home-title {
    font-size: 34px;
    letter-spacing: 1px;
    line-height: 40px;
    padding: 0 80px;
	display:block;
    color: #000111;
    text-shadow: 1px 1px 3px rgba(0,0,0, 1);
    text-transform:uppercase;
    letter-spacing: 0px;
    text-shadow: 0px 0px 5px rgba(255,255,255, 1);
}
#id_body a.button-banner {
    border: 1px solid #000111;
    margin: 10px 0;
    text-transform: uppercase;
    color: #000111;
    background: rgba(255,255,255,0.7);
    background: rgba(0,0,0,0.5);
    color: #fff;
    border-color: #fff;
}
#id_body a.button-banner:hover {
	background: rgba(0,75,151,0.85);
	color: #fff;
}

	@media screen and (max-width: 840px) {
		.home-title {padding:0;}
	}

	@media screen and (max-width: 760px) {
		.logo {margin: 100px 5% 0 5%;}
		.home-title-holder {margin-top:50px;}
	}

	@media screen and (max-width: 760px) {
		.home-title-holder {margin-top:50px;}
	}

	@media screen and (max-width: 650px) {
		.logo {margin-top: 60px;}
		.home-title-holder {margin-top:40px;}
	}

	@media screen and (max-width: 423px) {
		#id_body a.button-banner {padding:10px 30px;}
	}


/* PAGES ........................................................ */
div.section h2 {
	text-transform:uppercase;
	letter-spacing:3px;
	color:#323940;
}
.block p {
	font-size: 19px;
	line-height: 26px;
}
.block a {
	color:#044b99;
}
.block a:hover {
	color:#1e294e;
}
div.about {
	padding-bottom: 0;
    
	padding-top: 60px;
}
div.contact {
	padding-top:40px;
	padding-bottom:0;
}
img.separator_x {
	margin:18px 0 10px;
}
p.info {
    margin-bottom:40px;
}
.about_separator {
	border-bottom:1px solid #d9dfe5;
	background:none;
	height:5px;
	margin-bottom:40px;
}
p.featured-work-section-title, p.portfolio-section-title, p.blog-section-title a, p.about-section-title, p.skill-section-title, p.contact-section-title {
	color:#323940;
	font-size:24px;
}
ul.read-more {
	font-size: 19px;
	line-height: 26px;
	margin-bottom:10px;
}
ul.read-more.about-read-more li {
	background:none;
	text-indent:-15px;

}
ul.read-more.about-read-more li:before{
    content:'';
    padding: 0 0 0 15px;
    background:url("../images/blue-arrow.gif") no-repeat 0 9px;
}

.border-left {
	border-color:#D9DFE5;
}
ul#contact-form li #name, ul#contact-form li #contact-email, ul#contact-form li #phone, ul#contact-form li #message {
	background-color:#eff3f8;
	color:#5E6975;
	padding-left:18px;

	font-size:20px;
	line-height:28px;
	width:437px;
}

	@media screen and (max-width: 1018px) {
		ul#contact-form li #name, ul#contact-form li #contact-email, ul#contact-form li #phone, ul#contact-form li #message {
    		width: 354px;
		}
	}

	@media screen and (max-width: 840px) {
		ul#contact-form li #name, ul#contact-form li #contact-email, ul#contact-form li #phone, ul#contact-form li #message {
    		width: 260px;
		}
		
		.services-section {margin-bottom:0;}
	}

	@media screen and (max-width: 760px) {
		ul#contact-form li #name, ul#contact-form li #contact-email, ul#contact-form li #phone, ul#contact-form li #message {
    		width: 254px;
		}
	}

	@media screen and (max-width: 650px) {
		ul#contact-form li #name, ul#contact-form li #contact-email, ul#contact-form li #phone, ul#contact-form li #message {
    		width: 90%;
		}
		
		.form-zone {margin-bottom:0;}
	}

#id_body a.button, #id_body .button {
    background-color: #044B99;
    color: #FFFFFF;
    font-size: 14px;
    letter-spacing: 2px;
	text-transform:uppercase;
	border:0;
	display:inline-block;
    line-height: 26px;
}
#id_body a.button:hover, #id_body .button:hover {
	background-color:#033c7a;
	cursor:pointer;
}
#id_body .button:disabled {
	opacity:0.5;
	cursor:auto;
	background-color:#044B99;
}

.home-imgs {margin-top:50px; overflow:hidden;}
.home-img {float:left; width:32%; margin-right:2%;}
.home-img.home-img-last {margin-right:0;}

	@media screen and (max-width:423px) {
		.home-img {float:none; width:100%; margin:0 auto; text-align:center;}
		.home-img.home-img-last {margin:0 auto;}
	}


/* FOOTER ....................................................... */
footer {
	background-color:#EFF3F8;
	color:#5E6975;
	padding:30px 0;
}
.footer-text {
	color:#323940;
	font-size:24px;
}
.footer-copyright {
	font-size:16px;
	line-height:20px;
	color:#a7aeb6;
}
.footer-copyright a {
	color:#7a9fc8;
}
.footer-copyright a:hover {
	color:#1e294e;
}


.img-responsive {max-width:100%;height:auto;}