/*
 Theme Name:	JH Martin
 Theme URI:     https://reports.jhmartinmechanical.com/
 Description:   Custom theme built upon the SEOteric framework
 Author:        SEOteric
 Author URI:    http://www.seoteric.com
 Template:		Framework
 Version:       2.0.0
*/




@import url('https://fonts.googleapis.com/css?family=Nunito:400,700|Roboto:300,400,500,700');

/*////////////////////////////////////////////////
GENERAL STYLES
///////////////////////////////////////////////*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
    font-family: 'Nunito', sans-serif;
    font-weight: 700;
}

.valign {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

/*////////////////////////////////////////////////
PANEL LAYOUTS and STYLES
///////////////////////////////////////////////*/
.panel {
    color: #297fca;
}
.panel.blue,
.blue {
    background-color: #2E3192;
    color: #FFF;
}

.panel.gradient {
    background-image: linear-gradient(to left, #c8c8c8, #979797);
    color: #FFF;
}
.panel.testimonials .container {
    max-width: 800px;
    text-align: center;
}
.panel.testimonials p.subheader {
	padding: 0 60px;
}
.panel.looking {
    padding: 40px 0;
}
.panel.looking .container {
    display: table;
}
.panel.looking .seventy,
.panel.looking .thirty {
    padding: 0 10px;
    display: table-cell;
    vertical-align: middle;
    float: none;
}
.panel.spacer {
	background: rgb(0, 93, 186); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(0, 93, 186,1) 0%, rgba(0, 93, 186,1) 70%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(0, 93, 186,1) 0%,rgba(0, 93, 186,1) 70%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(0, 93, 186,1) 0%,rgba(0, 93, 186,1) 70%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2E3192', endColorstr='#FFFFFF',GradientType=1 ); /* IE6-9 */
    padding: 5px 0;
}
.work .full {
    position: relative;
	padding: 0;
}
.work .fifty {
    padding: 15px;
    margin: 20px 0;
}
.work .fifty .fifty {
    border-radius: 4px;
    width: 48%;
    margin: 0 0 20px 2%;
    padding: 0;
    position: relative;
}
.work .fifty.first {
    margin: 0 2% 20px 0;
}
.work .fifty.bottom .fifty {
    margin-top: 20px;
}
.work .fifty .overlay {
    position: absolute;
    background: rgba(0,0,0,0);
    opacity: 0;
    top: 0;
    bottom: 6px;
    left: 0;
    right: 0;
    padding: 0 10%;
    border-radius: 4px;
    transition: all .5s linear;
}
.work .fifty .overlay:hover {
    opacity: 1;
    background: rgba(0,0,0,0.75);
    transition: all .5s linear;
}

.work h5 {
    line-height: 22px;
    margin-bottom: 8px;
}
.work p {
    line-height: 1.5;
}
.work p:last-of-type {
    margin-bottom: 15px;
}
.work img {
	-webkit-border-radius:5px;
	border-radius: 5px;
}
.panel.associates {
    padding: 30px 0;
}
.associates .subheader,
.associates .logos {
    display: inline;
}
.associates .subheader {
    vertical-align: -webkit-baseline-middle;
}
.services {
    background: #2E3192;
}
.services .thirtythree {
    background: #FFF;
    border:1px solid #FFF;
}
.services .thirtythree .contentThirds {
    padding: 20px;
}
.services .thirtythree img {
    border-radius: 9px 9px 0 0;
}
.services h5 {
	text-transform: uppercase;
}
.services .btn.small {
	margin-bottom: 0;
}
.panel.map {
    background-image: linear-gradient(to bottom, #c8c8c8, #FFFFFF);
}

.ttip {
    width: 304px;
    padding: 20px;
    background-color: #FFF;
    -webkit-box-shadow: 0 20px 40px 0 rgba(12, 23, 32, 0.24);
	box-shadow: 0 20px 40px 0 rgba(12, 23, 32, 0.24);

}


#page-banner .info {
    background: rgba(0,0,0, 0.3);
}

footer {
    padding: 0 0 0 !important;
}

.copy {
    background: #DDDDDD;
    padding: 20px 0;
    margin-top: 0px !important;
}

/*////////////////////////////////////////////////////////////////////////////////////////
		CONVERSION PANEL AND FORM STYLES
////////////////////////////////////////////////////////////////////////////////////////*/	

.panel.conversion,
.page-template-page-flexible-content .panel.conversion {
	background: rgb(0, 93, 186); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(0, 93, 186,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(0, 93, 186,1) 50%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(0, 93, 186,1) 50%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2E3192', endColorstr='#FFFFFF',GradientType=1 ); /* IE6-9 */
	padding:60px 0;
}
.contact .gform_wrapper {
    margin: 0;
}

.gform_wrapper .top_label .gfield_label,
.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),.gform_wrapper textarea, input {
    border-radius:0 0 4px 4px;
}

.gform_wrapper input {

border: 1px solid #404040;
}

.gform_wrapper .top_label .gfield_label {
    display: block !important;
    padding: 4px 0 0 8px;
    border-radius: 4px 4px 0 0;
}
body .gform_wrapper .top_label div.ginput_container {
    margin-top: 0 !important;
}

		::-webkit-input-placeholder,
		.gform_wrapper.gf_browser_chrome ul.gform_fields li.gfield select { 
		  color: #2E3192;	}
		::-moz-placeholder { 
		  color: #2E3192;	}
		:-ms-input-placeholder { 
		  color: #2E3192;	}
		:-moz-placeholder { 
		  color: #2E3192;	}
.conversion .fifty.blue {
	padding: 20px 5%;
}
.conversion .fifty.blue p {
	font-size: 20px;
    line-height: 26px;
}
.conversion .fifty.blue h3 {
	margin-bottom: 25px;
}
/*//////////////////////////////////////////
BUTTONS AND LINKS
///////////////////////////////////////////*/

.btn,
.btn.small,
.readmore a,
.su-button.btn,
.gform_wrapper .gform_footer input.button, 
.gform_wrapper .gform_footer input[type=submit], 
.gform_wrapper .gform_page_footer input.button, 
.gform_wrapper .gform_page_footer input[type=submit],
.older a,
.newer a
 {
    background:#2E3192;
    text-transform: none;
    padding: 20px 30px;
    border: none;
    border-radius: 5px;
    color: #FFF;
}
.btn.white {
    background: #FFF;
    color: #2E3192;
}
.btn.small {
    padding: 4px 8px;
}
.looking .btn.center {
    margin-top: 0;
    margin-bottom: 0;
}
.fa-facebook:before {
    content: "\f082" !important;
}
.btn:hover {
    background-color: #E4F1FD;
    color: #2E3192;
}
a.arrow:after {
    font-family: 'FontAwesome';
    content: '\f054';
    font-weight: 300;
    font-size: 12px;
    padding-left: 8px;
    
}
/*////////////////////////////////////////////////
HEADER AND NAV STYLES
///////////////////////////////////////////////*/
header,
header.sticky {
    background:#FFF;
}
header img.custom-logo {
    margin: 15px 0 0 0;
}
header a[href^="tel:"] {
    color: #9b9b9b;
}
.navWrapper .eighty,
.navWrapper .twenty {
    padding: 0;
}
.navWrapper .twenty.pro img {
    margin-top: 3px;
    max-width: 175px;
    float: right;
}
/*.navWrapper .container {
    display: table;
    width: 100%;
}
.navWrapper .container .menu-header-menu-container {
    display: table-cell;
}
header .pro {
    display: table-cell;
    float: right;
}*/
ul.numbers {
    float: right;
    list-style-type: none;
    margin: 15px 0;
}
ul.numbers:before {
    font-family: 'FontAwesome';
    content: '\f095';
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    display: -webkit-inline-box;
    float: left;
    margin-left: -32px;
    font-size: 36px;
    color: #2E3192;
    margin-top: 2px;
    
}
ul.numbers li.usa:before,
ul.numbers li.canada:before {
    content: 'USA:';
    color: #2E3192;
    padding-right: 5px;
}
ul.numbers li.canada:before {
    content: 'CAN:';
}
.navWrapper {
    background:#2E3192;
    margin-top: 15px;
    
}
.nav {
    text-align: left;
}
.nav a {
    color: #FFF;
    padding: 15px 10px;
}






/*///////////////////////////////////////////////////////
CONTENT STYLES
////////////////////////////////////////////////////////////*/
.lightblue {
    background-color: #e4f1fd;
}

h1, h2, h4, .work h5, .contact .gform_wrapper h3.gform_title , p.subheader, p, #slider p.subheader {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
}
p {
    margin-bottom: 20px;
    font-size: 16px;
}
p.subheader {
    font-size: 24px;
}
p.large {
    font-size: 20px;
    line-height: 26px;
}
p:last-of-type {
    margin-bottom: 0;
}
a, h1, h2, h3, h4, h5, h6{
    color: #2E3192;
}
h2,
.contact .gform_wrapper h3.gform_title {
    font-size: 52px;
    margin-top: 0;
}
h3 {
    font-size: 36px;
    margin-bottom: 0;
}
.testimonials h3 {
    margin-bottom: 25px;
}
h4 {
    font-size: 32px;
}
h5 {
    font-size: 20px;
    margin-bottom: 0;
}
.blue h1,.blue h2,.blue h3,.blue h4,.blue h5,.blue h6,.blue p,.blue li,.panel.blue h1,.panel.blue h2,.panel.blue h3,.panel.blue h4,.panel.blue h5,.panel.blue h6,.panel.blue p,.panel.blue li,.panel.gradient h1,.panel.gradient h2,.panel.gradient h3,.panel.gradient h4,.panel.gradient h5,.panel.gradient h6,.panel.gradient p,.panel.gradient li,.services h2, .overlay, .overlay h5, .overlay h4, overlay p, .overlay a {
    color: #FFF;
}

ul.logos li {
    margin: 0px;
    width: 9%;
    padding: 0 8px;
}
ul.logos li img {
    max-height: 60px;
}


/*FOOTER STYLES*/
footer h6 {
    font-size: 18px;
}
footer {
    padding: 20px 0 0;
}
footer,
copy {
    background: #fff;
}
footer .twentyfive {
    padding: 0;
    width: 100%;
}
footer ul.contactInfo {
    margin: 0;
    padding: 0;
    clear: both;
}
footer ul.contactInfo li {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;    
}
footer ul.contactInfo li:before {
    content: '';
    padding: 0;
    margin: 0;
}
footer .widget_nav_menu {
    margin-bottom: 20px;
}
footer .widget_nav_menu li {
    display: inline-block;
    width: 49%;
    font-size: 18px;
}
footer ul.socials li a {
    font-size: 32px;
    height: 32px;
    width: 32px;
    margin-right: 20px;
}

footer input {
    float: left;
    width: 75%;
    padding: 9px 5px;
    background-color: #DDDDDD;
    border-radius: 4px 0 0 4px;
}

footer input.btn {
    margin: 0;
    float: right;
    display: inline-block;
    padding: 8px 13px;
    width: 25%;
    border-radius: 0 4px 4px 0;
}
footer img.pro {
    max-width: 175px;
    margin-top: 30px;
}

.copy {
    background: #DDDDDD;
    padding: 20px 0 ;
    margin-top: 20px;
}
.copy p {
    font-weight: 700;
    color: #2E3192;
}
.seoLogo {
    width: 40px;
    padding: 10px 0 0 10px;
    box-sizing: content-box;
}

/*PROJECTS*/ 
.post-type-archive-projects .services .thirtythree {
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.25);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.25);
}

.post-type-archive-projects .panel.services {
	background: #FFF;
	padding-top: 0;
}






/*TOOLTIPS*/
.qtip{
	max-width: 300px;
}
.qtip-bootstrap {
	border: 1px solid rgba(0, 0, 0, 0);
}
.tooltip-content p {
	line-height: 22px;
	color: #297fca;
}
/*///////////////////////////////////////////////////////
RESPONSIVE STYLES
////////////////////////////////////////////////////////////*/
@media only screen and (max-width: 1100px) /*and (min-width: 980px)*/  {

    
}

@media only screen and (max-width: 980px) {
	.associates .subheader, .associates .logos {
		display: block;
	}
	ul.logos li {
	    width: 15%;
	}
}

@media only screen and (max-width: 767px) {

	.work .fifty .fifty {
		float: left;
	}
	.work img,
	.services img,
	.why img{
		width: 100%;
	}
	.panel.looking .seventy, 
	.panel.looking .thirty {
		display:block;
		text-align: center;
	}
	.panel.testimonials p.subheader {
		font-size: 17px;
		padding: 0 45px;
	}
	.panel.conversion, .page-template-page-flexible-content .panel.conversion {
		background: #FFF;
		padding: 0;
	}
	.fifty.contact {
		padding: 20px 5%;
	}
	footer .copy p, .terms, .seoteric {
    	text-align: center;
	}
}

@media only screen and (max-width:660px) {
    .fifty.contact .widget.gform_widget {
    	padding: 0;
	}
    
}

@media only screen and (max-width: 559px) {
    

    
}
@media only screen and (max-width: 480px) {
	ul.logos li {
    	width: 30%;
    	margin: 15px 1% 0;
	}
	.work .fifty .fifty {
		float: none;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
    
}