/*
Theme Name: F&S Building Innovations
Theme URI: 
Author: AP
Author URI: 
Description: This is a generic starter theme, that incorporates Bootstrap, Fontawesome.
Version: 1.9
*/

@import url('https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i');

/* #Misc
/***********************************************************/
body { padding-top: 0; font-size: 16px; line-height: 30px; color: #333; font-family: 'Lato', sans-serif;}
iframe, object, embed{ max-width:100%; }
sup{ vertical-align: super; font-size: smaller; }
sub{ vertical-align: sub; font-size: smaller; }
code{ font-family: Monaco, "Andale Mono", "Courier New", Courier, monospace; }
.navbar-fixed-top {top: auto;}
.alignleft { float: left; margin: 1% 2% 2% 0}
.alignright { float: right; margin: 1% 0 2% 2%}
.aligncenter { clear: both; text-align: center; margin: 1%}
.alignnone { float: none; margin: 1% } 
.text-center {text-align: center;}
.text-right {text-align: right;}
.padding-left {padding-left: 0;}
.padding-right {padding-right: 0;}
.padding-none {padding: 0;}
.row {margin-left: 0; margin-right: 0;}
.container {width: 1230px;} 
.parallax {
	background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.caret {display: none}

/*About Page Content*/

.misc-content {padding: 2rem 0; text-align: center;}
.misc-content h2 {color: #c51428;}
.misc-content ul {padding: 0; list-style-type: none;}

.testimonials {padding: 2rem 0;}
.testimonials .testimonial-header {text-align: center; color: #c51428;}
.testimonials .testimonial-item {border-bottom: solid 1px #000; padding: 2rem 0; clear: both;}
.testimonials .testimonial-item:last-child {border-bottom: none;}
.testimonials .testimonial-item .testimonial-logo img {margin: 0 auto;}
.testimonials .testimonial-item .testimonial-text {font-style: italic;}

/*Projects*/

.projects-view {padding: 2rem 0;}
.projects-view .project-filter {padding: 0 0 3rem 0; text-align: center;}
.projects-view .project-filter .filter-item {text-align: center; background-size: cover; padding: 15px; -webkit-filter: grayscale(.8); filter: grayscale(.8); -webkit-transition: all .5s; transition: all .5s; margin-bottom: 3rem;}
.projects-view .project-filter .filter-item:hover {-webkit-filter: grayscale(0); filter: grayscale(0);}
.projects-view .project-filter .filter-item span {font-weight: bold; -webkit-filter: grayscale(0); filter: grayscale(0); color: #fff; text-shadow: 2px 2px #000; font-size: 2rem; padding: 8rem 0; text-transform: uppercase; display: block; -webkit-transition: all .5s; transition: all .5s;}
.projects-view .project-filter .filter-item:hover span {background: rgba(0, 0, 0, .6); }
.projects-view .project-filter .clear-filters {clear: both;}
 
.projects-view .project-item {position: relative;}
.projects-view .project-item .project-image img {opacity: 1 !important; filter:brightness(70%); width: 100%;}
.projects-view .project-item:hover .project-image img {opacity: 1; filter:brightness(50%);}
.projects-view .project-item .project-title {position: absolute; top: 35%; text-align: center; padding: 0 15px; color: #fff; text-shadow: 1px 1px #000; font-size: 1.8rem; font-weight: 900; width: 90%;}

.services-view {padding: 2rem 0;}
.services-view .services-filter {padding: 0 0 3rem 0; text-align: center;}
.services-view .services-filter .filter-item {text-align: center; background-size: cover; padding: 15px; -webkit-filter: grayscale(.8); filter: grayscale(.8); -webkit-transition: all .5s; transition: all .5s; margin-bottom: 3rem;}
.services-view .services-filter .filter-item:hover {-webkit-filter: grayscale(0); filter: grayscale(0);}
.services-view .services-filter .filter-item span {font-weight: bold; -webkit-filter: grayscale(0); filter: grayscale(0); color: #fff; text-shadow: 2px 2px #000; font-size: 2rem; padding: 8rem 0; text-transform: uppercase; display: block; -webkit-transition: all .5s; transition: all .5s;}
.services-view .services-filter .filter-item:hover span {background: rgba(0, 0, 0, .6); }
.services-view .services-filter .clear-filters {clear: both;}
.services-view .service-item .services-title {text-align: center; color: #c51428; font-size: 3rem; font-weight: bold; margin-bottom: 2rem;}
.services-view .service-item .services-content > h3 {text-align: center;}


 
/* #Images
/***********************************************************/
img, a img { border:none; padding: 0; margin:0; display:inline-block; max-width: 100%; height:auto; width:auto; image-rendering: optimizeQuality; }

/* #Links
/***********************************************************/
	a { text-decoration: none; outline: 0; max-width:100%; max-width:none; } 
	a:hover, a:focus, a:visited { outline: 0; text-decoration: none;}
	p a, p a:visited { line-height: inherit; }
	a img { border: 0}
	#navbar li.dropdown:hover .dropdown-menu {display: block;}
	
/***********************************************************/
/***** HEADINGS / Typography  ******************************/
/***********************************************************/

h1,h2,h3,h4,h5 { margin-top: 0; }
h1.red,h2.red,h3.red,h4.red,h5.red {color: #c51428;}
	h1 { font-size: 34px; line-height: 1.1em; margin-bottom: 14px; font-weight: 600;}
	h2 { font-size: 26px; line-height: 1.1em; margin-bottom: 10px; }
	h3 { font-size: 20px; line-height: 1.1em; margin-bottom: 8px; } 
	h4 { font-size: 18px; line-height: 1.1em; margin-bottom: 4px; } 
	h5 { font-size: 16px; line-height: 1.1em; }						
	h6 { font-size: 14px; line-height: 1.1em; }
	
hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; }

p + h1, p + h2, p + h3, p + h4, p + h5, p + h6{ margin-top:1.4em; }
p { margin: 1em 0; }
p img { margin: 0; }
em, i { font-style: italic; }
strong, b{ font-weight: bold;  }
small { font-size: 80%; }
blockquote{ border-left-style:solid; border-left-width:7px; padding-left:20px; margin-bottom:1em; margin-right:1em; font-size: 16px; line-height: 1.5em; }
blockquote small, blockquote cite, blockquote small a, blockquote cite a, blockquote a small, blockquote a cite{font-size: 12px;}

#social_links {padding: 0; text-align: center; padding-bottom: 20px; margin-bottom: 0;}
#social_links > li:first-child {margin-left: 0}
#social_links > li {list-style: none; display: inline-block; margin-left: 15px; }
#social_links > li > a {color: #3a3a3a; padding: 9px 10px; background-color: #ccc;}
#social_links > li > a:hover {background-color: #c51529; color: #fff;}

.btn {font-size: 24px; text-transform: uppercase; border-radius: 0; padding: 6px 50px; }
.red-btn {font-size: 24px; font-weight: 700; text-transform: uppercase; color: #fff; padding: 6px 50px; background-color: #c51529; border-radius: 2px}
.btn-red {background-color: #c51529; color: #fff; font-size: 24px; text-transform: uppercase; border-radius: 0}
.btn-red:hover, .red-btn:hover {color: #fff; background-color: #333}
.btn-black {background-color: #040707; color: #fff; }
.btn-black:hover {background-color: #c51529; color: #fff;}
.btn-red:hover, .btn-red, .red-btn, .red-btn:hover, #social_links > li > a, #social_links > li > a:hover, #header-top .site-logo
#masthead.smaller #header-top .site-logo, #masthead.smaller #header-top, #masthead #header-top,
.btn-black, .btn-black:hover, .project-item img, .project-item:hover img {
	-webkit-transition: all .6s ease;
	-moz-transition: all .6s ease;
	-ms-transition: all .6s ease;
	-o-transition: all .6s ease;
	transition: all .6s ease;		
}
.bggray {background-color: #ddd;}
.bglgray {background-color: #eee;}
.padded {padding-bottom: 100px; padding-top: 100px;}

.flex {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
 }

/* #Header
/***********************************************************/
#header-top {padding-top: 20px;     padding-bottom: 20px;}
.navbar {min-height: 0; border: 0; margin-bottom: 0}
nav .navbar-nav > li > a {text-transform: uppercase; color: #fff; font-size: 15px; padding: 10px 8px;}
#navbar .navbar-nav {float: none; padding-top: 20px;}
nav .navbar-nav > li {float: none; display: inline-block}
nav .navbar-nav > li > a:hover, .navbar-nav > li > a:focus, .navbar-nav > li.active > a {color: #c51428; background: transparent}
#masthead.smaller #header-top{ background-color: rgba(0,0,0,.8)}
#masthead.smaller #header-top .site-logo {max-width: 35%;}
#masthead.smaller nav .navbar-nav > li > a {padding: 15px 10px;}
.mobile {display: none;}
.dropdown-menu {border-radius: 0; background: rgba(0,0,0,.55); padding: 0; border: 0;}
.dropdown-menu li a {text-transform: uppercase; font-size: 15px; padding: 7px 20px; color: #fff;}

.banner-wrapper .banner-title {
	text-align: center;
	color: #fff;
	font-size: 7rem;
	margin-top: 20rem;
	text-shadow: 0px 2px 2px #000;
}

/* #Slider
/***********************************************************/
#full-slider {overflow: hidden;}
#full-slider .metaslider .caption-wrap{
	background: -moz-linear-gradient(top, rgba(0,0,0,0.75) 0%, rgba(44,44,44,0.3) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.75) 0%,rgba(44,44,44,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(0,0,0,0.75) 0%,rgba(44,44,44,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bf000000', endColorstr='#4d2c2c2c',GradientType=0 ); /* IE6-9 */
	left: 0;
	right: 0;
	margin: 0 auto; 
	top: 0;
	opacity: 10;
	
}
#full-slider .metaslider .caption-wrap .caption {
	font-size: 50px; 
	font-weight: 700; 
	color: #fff; 
	position: absolute; 
	left: 50%; 
	top: 50%;
	transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%); 
	-webkit-transform: translate(-50%, -50%); 
	-o-transform: translate(-50%, -50%);
	width: 100%;
	text-align: center;
	line-height: 50px;  
	text-transform: uppercase;
}

#full-slider .banner-wrapper {
	background: -moz-linear-gradient(top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 15%, rgba(0,0,0,0.2) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 15%,rgba(0,0,0,0.2) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 15%,rgba(0,0,0,0.2) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa000000', endColorstr='#33000000',GradientType=0 ); /* IE6-9 */
	left: 0;
	right: 0;
	margin: 0 auto; 
	top: 0;
	opacity: 10;
	
}
#full-slider {position: relative}
#full-slider img {width: 100%; display: block;}
#full-slider .banner-wrapper {
	position: absolute;
    bottom: 0;
    left: 0;
    color: white;
    opacity: 1;
    margin: 0;
    display: block;
    width: 100%;
    line-height: 1.4em;	
}

/* #Main
/***********************************************************/
.home #main {font-size: 18px}
#main-content #main {padding: 85px 0}
.home #main-content #main {padding: 85px 15px}
.quote {padding: 100px 0 120px; color: #333; font-size: 26px; background-color: rgba(255,255,255,.40)} 
#quote h3 {font-size: 40px; color: #333; text-transform: uppercase; line-height: 35px;}
#clients {padding: 105px 0}
#clients .cimg {line-height: 105px;}
.project-item {padding-bottom: 30px; padding-top: 15px;}
.project-item .pimg {background-color: #222;}
.project-item .project-title {font-size: 16px; margin-top: 15px; color: #212121; }
.project-item:hover img {opacity: .5}
.page-title {border-bottom: 1px solid #bbb; padding-bottom: 15px; margin-bottom: 50px; text-transform: uppercase; font-weight: 600;}
.misc-content {background-color: #eee; padding: 75px 0}
.misc-content .padded-left {padding-left: 85px}  

/* #Bid Opportunities
/***********************************************************/
.btitle h4 {font-weight: 700;}
.mtitle {display: none}  

/* #Sidebar
/***********************************************************/
.widgettitle {font-weight: 600; font-size: 25px; margin-bottom: 20px} 
#sidebar {padding: 85px 0 85px 30px} 
#sidebar ul {list-style: none; padding-left: 0}
#sidebar ul li {font-size: 20px; line-height: 25px; border-bottom: 1px solid #eee; padding-bottom: 20px; margin-bottom: 20px;}
#sidebar ul li > a {color: #333}  
#sidebar ul li .post-date {display: block; font-size: 14px; color: #c51428;} 


/* #Post
/***********************************************************/
.post-cont {border-bottom: 1px solid #bbb; padding-bottom: 15px; margin-bottom: 50px;}
h3.post-title {font-size: 30px; color: #333; margin: 25px 0 0; line-height: 30px;}
h3.post-title a {color: #333} 
.read-more.red-btn {font-size: 15px; padding: 10px 30px;} 
 
 
/* #Footer
/***********************************************************/ 
#footer {background-color: #111; color: #fff; padding: 80px 0 40px}
#footer a {color:#fff}
#footer hr {margin: 35px 0 35px;}
#footer-widget .widget {text-align: center; }
#footer-widget .widget .inner {background-color: #fff; padding: 25px; height: 100%;}
#footer-widget .widget .inner .widgettitle {margin-top: -50px;}
#footer-widget .widget .inner .widgettitle i { background-color: #c51529; border-radius: 100px; font-size: 30px; color: #fff; padding: 10px 0; width: 50px;}
#footer-widget .widget p {margin-bottom: 0;}
.footer-menu {padding-bottom: 10px}  
.footer-menu ul {float: none} 
.footer-menu ul li {float: none; display: inline-block}
.footer-menu ul li a {font-size: 17px}
.footer-menu ul li a:hover {background: transparent; opacity: .5}
.contact-info span {margin: 0 20px}
.contact-info, .office-hours {padding-bottom: 13px;}
.attribution {font-size: 15px}



/***********************************************************/
/* #MEDIA QUERIES ******************************************/
/***********************************************************/

@media only screen and ( max-width: 1230px ) {
	.container {width: auto}
	#full-slider img {width: 120%; margin-left: -10%; max-width: 120%;}
	.project-item .project-title {height: 40px;}
	nav .navbar-nav > li > a {padding: 15px !important;}
}

@media only screen and ( max-width: 1165px ) {
	nav .navbar-nav > li > a {padding: 10px !important;}
}

@media only screen and ( max-width: 1108px ) {
	nav .navbar-nav > li > a {padding: 6px !important;}
}

@media only screen and ( max-width: 1160px ) {
	nav .navbar-nav > li > a {padding: 30px 15px;}
	#full-slider .metaslider .caption-wrap .caption {font-size: 40px;}
}

@media only screen and ( max-width: 1110px ) {
	#full-slider .metaslider .caption-wrap .caption {font-size: 30px; line-height: 35px; top: 60%;}
}

@media only screen and ( max-width: 975px ) {
	.navbar-collapse.collapse.desktop {display: none!important;}
	.mobile {display: block}
	.shiftnav.shiftnav-nojs.shiftnav-skin-standard-dark ul.shiftnav-menu li.menu-item > .shiftnav-target:hover, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu li.menu-item.shiftnav-active > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu li.menu-item.shiftnav-in-transition > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu li.menu-item.current-menu-item > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu > li.shiftnav-sub-accordion.current-menu-ancestor > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu > li.shiftnav-sub-shift.current-menu-ancestor > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu.shiftnav-active-highlight li.menu-item > .shiftnav-target:active, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu.shiftnav-active-on-hover li.menu-item > .shiftnav-target:hover {
		background: #c51529!important;
	}
	#masthead.smaller #header-top .site-logo, #header-top .site-logo {max-width: 70%;}
	.shiftnav-toggle-button {    margin-top: 5%!important; background: #c51529!important;}
	#full-slider img {width: 140%; margin-left: -25%; max-width: 140%;}
}	

@media only screen and ( max-width: 767px ) {
	.logo {float: left; width: 50%}
	.navbar {width: 50%; float: left;}
	.project-item .pimg img {width: 100%;}
	.flex {display: block;}
	#footer-widget .widget {margin-bottom: 60px;}
	#full-slider .metaslider .caption-wrap .caption {font-size: 20px; line-height: 25px; top: 70%;}
	.shiftnav-toggle-button {margin-top: 25%!important;}
	#full-slider img {width: 165%; margin-left: -50%; max-width: 165%;}
	#quote h3 {font-size: 30px;}
	.misc-content .padded-left {padding-left: 15px;}
	#sidebar {padding: 0 15px 20px;}
	.bid-title {display: none;}
	.mtitle {display: inline-block}
	#bid-list .bid-items {padding-bottom: 20px}
}

@media only screen and ( max-width: 320px ) {
	.shiftnav-toggle-button {margin-top: 17%!important;}
} 


#text-4 > div > div > p:nth-child(2) > iframe {
	height:400px !important;
}

#menu-item-586 {
	    background-color: #c51428;
    border-radius: 15px;
}

#menu-item-586 > a:hover{
	color:#fff;
}

@media only screen and ( max-width: 767px ) { 
	#header-top > div > nav > div.col-sm-12.clearfix {
	display:none;
	}}


@media only screen and ( min-width: 767px ) {   .mobile-btn {
	display:none
	}}