/*
Theme Name: Midnight Wireless Theme
Version: 1.0
*/

/* GENERAL
############################################################################################### */
* {	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
*:focus {	outline:none; }
body { padding:0; margin:0; background:#fff; }
img { max-width:100%; height:auto; width:auto; vertical-align: bottom; }
.clear { clear: both; }

/* LAYOUT
############################################################################################### */
.container { position: relative; width:90%; max-width:1200px; margin:auto; }
.row { clear: both; position: relative; }
.row:after { content: " "; display: table; clear: both; }
.col { float:left; }
.page-wrapper { margin-top:174px; }
.page-content { background-color:#f1f1f1; }
.page-content .container { background-color:#fff; }
.info-image .info { width:50%; padding:5%; float:left; }
.info-image.blue { background-color:#0077b5; color:#fff; }
.info-image .info p:last-child { margin-bottom:0; }
.info-image .image { float:right; width:50%; padding:3%; }
.info-image .image img { width:100%; }
.info-image .image.fill { padding:0; left:50%; top:0; position: absolute; height:100%; overflow: hidden; }
.info-image .image.fill img { position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:101%; height:100.5%; object-fit:cover; }
.info-image.alt .info { float:right; }
.info-image.alt .image { float:left; }
.info-image.alt .image.fill { left:0; }

.full-width-content { padding:5%; }

.gallery:after { content: " "; display: table; clear: both; }
.gallery .gallery-item { float:left; transition: transform 100ms ease, box-shadow 100ms ease; }
.gallery .gallery-item:hover { transform: scale(1.02); box-shadow: 0 3px 10px rgba(0,0,0,0.2); }
.gallery .gallery-item img { width:100%; }
.gallery-columns-2 .gallery-item { width:47.5%; margin:0 5% 5% 0; }
.gallery-columns-2 .gallery-item:nth-child(3n-1) { margin-right:0!important; }
.gallery-columns-3 .gallery-item { width:30%; margin:0 5% 5% 0; }
.gallery-columns-3 .gallery-item:nth-child(4n-1) { margin-right:0!important; }
.gallery-columns-4 .gallery-item { width:22.75%; margin:0 3% 3% 0; }
.gallery-columns-4 .gallery-item:nth-child(5n-1) { margin-right:0!important; }
.gallery-columns-5 .gallery-item { width:17.6%; margin:0 3% 3% 0; }
.gallery-columns-5 .gallery-item:nth-child(6n-1) { margin-right:0!important; }
.gallery-caption { display: none; }

@media only screen and (max-width: 1099px) {
	.container { width:100%; }
}
@media only screen and (max-width: 1023px) {
	.page-wrapper { margin-top:60px; }
	.col { width: 100%; }
	.info-image .info { width:100%; padding:7%; }
	.info-image .image { width:100%; }
	.info-image .image.fill { width:100%; position: relative; left:0; }
	.info-image .image.fill img { position: relative; top:0; left:0; transform: none; }
}

/* TYPOGRAPHY
############################################################################################### */
html { font-family: "Roboto", sans-serif; font-size:15px; line-height: 1.6em; color:#3c4046; font-weight: 300; }
h1 { font-family: 'VerbCond', sans-serif; font-size:3rem; line-height: 1.2em; margin:0 0 20px; font-style: italic; font-weight: 900; }
h2 { font-family: 'VerbCond', sans-serif; font-size:2.4rem; line-height: 1.2em; margin:0 0 20px; font-style: italic; font-weight: 900; }
h3 { font-family: 'VerbCond', sans-serif; font-size:1.8rem; line-height: 1.2em; margin:0 0 20px; font-style: italic; font-weight: 900; }
h4 { font-family: 'VerbCond', sans-serif; font-size:1.4rem; line-height: 1.2em; margin:0 0 20px; font-style: italic; font-weight: 900; }
h5 { font-family: 'VerbCond', sans-serif; font-size:1.2rem; line-height: 1.2em; margin:0 0 20px; font-weight: 600; }
h1 a, h2 a, h3 a, h4 a, h5 a { text-decoration: none; }
p { margin:0 0 25px; font-size: 1.15em; }
p:last-child { margin-bottom:0; }
a { color:#0077b5; transition: color 200ms ease; }
a:hover { color:#0095e3; }
.nounderline { text-decoration: none; }
.text-sm { font-size:0.8em; line-height:1.4em; }
.text-grey { color:#999; }
.text-light-grey { color:#aaa; }
.semi-bold { font-weight:500; }

@media only screen and (max-width: 767px) {
html { font-size:14px; }
h1 { line-height: 1em; }
}

/* HEADER
############################################################################################### */
.site-header { font-family: 'VerbCond', sans-serif; box-shadow: 0 3px 8px rgba(0,0,0,0.2); position: fixed; z-index: 9000; width:100%; top:0; left:0; background-color: #fff; }
.header-content { height:118px; position: relative; transition: height 300ms ease; }
.branding { position: absolute; top:50%; left:0; transform: translateY(-50%); height:100%; }
.branding a { display:block; margin:0; height:100%; position: relative; float:left; }
.branding .description { display:block; position: relative; float:left; top:50%; transform: translateY(-50%); }
.branding h1 { font-size: 16px; margin:3px 0 0 10px; text-transform: uppercase; letter-spacing: 0.02em; }
.branding h2 { font-size: 13px; margin:0 0 0 10px; text-transform: uppercase; letter-spacing: 0.02em; }
.branding .site-logo { display:block; height:60%; position: relative; top:50%; transform: translateY(-50%); }
.site-phone-number { position: absolute; top:50%; right:0; transform: translateY(-50%); font-size:30px; font-weight: 900; font-style: italic; transition: font-size 300ms ease; }
.site-phone-number a { color:#3c4046; text-decoration: none; }
.site-phone-number a:hover { color:#0077b5; }
.site-phone-number .fa { background-color:#0077b5; color:#fff; padding:10px; border-radius: 100px; height:50px; width:50px; text-align: center; transition: width 300ms ease, height 300ms ease; }
.site-nav { background-color: #0077b5; position: relative; }
.site-nav ul { list-style-type: none; margin:0; padding:0; }
.site-nav li { margin:0; padding:0; float:left; position: relative; display:block; }
.site-nav ul li a { display:block; margin:0; height:56px; padding:20px 22px 18px; color:#fff; text-transform: uppercase; text-decoration: none; line-height: 1.2em; letter-spacing: 0.1em; font-size: 16px; transition: background-color 200ms ease, height 300ms ease, padding 300ms ease; cursor: pointer; }
.site-nav li a:hover { background-color:rgba(255,255,255,0.1); }
#menu-main-menu > .current-menu-item > a, 
#menu-main-menu > .current-menu-ancestor > a, 
#menu-main-menu > .current-post-ancestor > a, 
#menu-main-menu > .current-page-ancestor > a { background-color:rgba(0,0,0,0.3); }
#menu-main-menu > .current-menu-item > a:hover, 
#menu-main-menu > .current-menu-ancestor > a:hover, 
#menu-main-menu > .current-post-ancestor > a:hover, 
#menu-main-menu > .current-page-ancestor > a:hover { background-color:rgba(0,0,0,0.3)!important; }
.site-nav li ul { display: none; position: absolute; left:0; background-color:#3c4046; box-shadow: 0 4px 13px rgba(0,0,0,0.3); min-width: 200px; }
.site-nav li.hover ul { display: block; }
.site-nav li ul li { float:none; }
.site-nav li ul li a { font-size:14px; padding:20px 20px 18px!important; border-bottom:1px solid #313131; height:auto!important; }
.sub-menu > .current-menu-item > a { background-color:rgba(0,0,0,0.15); }
.sub-menu > .current-menu-item > a:hover { background-color:rgba(0,0,0,0.15)!important; }
.menu-item-has-children > a:after { content:"\f107"; font-family: 'FontAwesome'; margin-left:5px; color:rgba(255,255,255,0.5); }
.site-search { position: absolute; top:50%; right:0; transform: translateY(-50%); }
.site-search input[type="text"] { border-radius: 100px; border:none; padding:5px 15px; font-size:15px; height:36px; max-width:100%; width:210px; transition: width 300ms ease; }
.site-search input[type="text"]:focus { width:300px; }
.site-search .search-wrap button { font-size:20px; top:3px; right:3px; }
.mobile-nav-btn { display: none; }

@media only screen and (min-width: 1024px) {
	.site-header.mini .header-content { height:80px; }
	.site-header.mini .site-nav ul li a { height:50px; padding:16px 22px 15px; }
	.site-header.mini .site-phone-number { font-size:24px; }
	.site-header.mini .site-phone-number .fa { width:44px;height:44px; }
}

@media only screen and (max-width: 1099px) {
	.site-phone-number { right:2%; }
	.branding { left:2%; }
	.site-search { right:2%; }
}

@media only screen and (max-width: 1023px) {
	.header-content { height:60px; }
	.branding { position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); text-align: center; }
	.branding .description { display:block; position: absolute; top:-100px; float:none; transform: none; }
	.site-phone-number { position: absolute; right:15px; }
	.site-phone-number span { display: none; }
	.site-phone-number .fa { background:none; color:#0077b5; padding:0; height:auto; width: auto; }
	.site-nav { position: fixed; top:0; left:-70%; height:100%; width:70%; overflow: scroll; z-index: 9000; transition: left 200ms ease; }
	.site-nav.slide-in { left:0; box-shadow: 2px 0 15px rgba(0,0,0,0.5); }
	.site-nav ul { border-top:1px solid rgba(0,0,0,0.1); }
	.site-nav li { border-bottom:1px solid rgba(255,255,255,0.1); }
	.site-nav li ul li { border-bottom:none; }
	.menu-item-has-children > a:after { float: right; }
	.site-nav li { float:none;  }
	.site-nav li ul { display: none; position: relative; box-shadow: none; }
	.site-search { position: relative; top:auto; right:auto; transform: none; padding:12px 12px; height:60px; }
	.site-search input[type="text"] { width:100%; }
	.mobile-nav-btn { display:block; position: absolute; left:10px; top:18px; font-size:24px; line-height: 1em; color:#3c4046; }
}

/* FORM ELEMENTS
############################################################################################### */
.btn, input[type='button'] { display:inline-block; border:none; border-radius: 3px; padding:15px 25px; font-size:1.2rem; background-color:#0077b5; color:#fff; text-align: center; font-weight:700;; text-decoration: none; text-transform: uppercase; letter-spacing: 0.05em; transition: background-color 200ms ease; }
.btn:disabled, input[type='button']:disabled { border-color:#999; color: #999; cursor: not-allowed!important; }
.btn:hover, input[type='button']:hover, .post-password-form input[type="submit"]:hover { text-decoration: none; background-color:#0095e3; cursor: pointer; color:#fff; }
.btn-block { display: block; width: 100%; }
.btn-round { border-radius: 100px; }
.btn-lg { font-weight: 600; font-size:1.5rem; }
.blue .btn, .blue input[type='button'] { background-color:rgba(0,0,0,0.4); }
.blue .btn:hover, .blue input[type='button']:hover { background-color:rgba(0,0,0,0.2); }

label { display:inline-block; margin-bottom:5px; text-transform: uppercase; font-size: 0.8rem; line-height: 1em; font-weight:600!important; letter-spacing: 0.1em; }
input[type="text"],
input[type="number"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="search"],
textarea { background:#fff; font-size:16px; font-weight:400; height:50px; border-radius: 3px; width:100%; border:rgba(0,0,0,0.3) solid 1px; padding:15px; color:#000; transition: border ease-out 150ms; }
input[type="text"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus { border-color:rgba(0,0,0,0.6); }
textarea { min-height:150px; }
select { background:#fff;  width:100%; border:rgba(0,0,0,0.15) solid 1px; border-radius: 3px; height:35px; font-size:1rem; line-height: 1em; padding:7px; color:#333; }
input[type="checkbox"] { margin-left:0!important; }

.blue input, .blue textarea { border:none; }

nf-field:last-child .nf-field-container { margin-bottom:0; }
.footer-contact .nf-field-container { margin-bottom:15px; }
.footer-contact .nf-field-element textarea { vertical-align: bottom; }
.footer-contact .nf-form-fields-required { display: none; }
.footer-contact .nf-field-container .nf-error-msg { background-color:#ef2b2b; color:#fff; display: inline-block; padding:2px 6px; border-radius: 3px; }
.footer-contact .nf-field-container .nf-error-msg { position:absolute; top:-5px; right:5px; margin-right:0!important; }
.footer-contact .nf-error .ninja-forms-field { border:none; }
.footer-contact .nf-error .ninja-forms-field::placeholder { color:red; }
.footer-contact .nf-form-errors .nf-error-msg { color:#fff; }
.footer-contact .submit-container { float:left; margin-right:10px; }

.page-wrapper #search-form { max-width:50%; }
.search-wrap { position: relative; }
.search-wrap button { background:none; border:none; font-size:25px; position: absolute; top:7px; right:4px; cursor: pointer; transition: color 200ms ease; }
.search-wrap button:hover { color:#0077b5; }

.recaptcha-wrap label { display: none; }

/* HOME
############################################################################################### */
.slider-wrapper { background-color:#ddd; }
.slide { padding:0; position: relative; overflow: hidden; }
.slide .details { position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); text-align: center; width: 80%; }
.slide .details h2 { background-color: rgba(0,119,181,0.9); padding:15px 15px 10px; color:#fff; display: inline-block; font-size:4rem; margin-bottom:5px; text-shadow: 0 3px 3px rgba(0,0,0,0.3); }
.slide .details p { background-color: rgba(0,0,0,0.7); padding:12px 15px 12px; color:#fff; display: inline-block; font-size:1.6rem; font-style: italic; }
.slide img { position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); height:101%; width: 100%; object-fit: cover; }
.carousel .height-setter { margin-top:50%; }
.slick-dots { position: absolute; left:50%; bottom:20px; transform: translateX(-50%); margin:0; padding:0; list-style-type: none; line-height: 1em; }
.slick-dots li { padding:0; display: inline-block; margin:0 5px; }
.slick-dots li button { border:none; border-radius: 20px; width:12px; height:12px; padding:0; overflow: hidden; display: block; background:#fff; color:#fff; }
.slick-dots li.slick-active { opacity: 0.5; }

@media only screen and (max-width: 1023px) {
.slide .details h2 { font-size:3rem; padding:13px 13px 10px; }
.slide .details p { font-size:1.5rem; padding:5px; }
.carousel .height-setter { margin-top:66.6%; }
.slick-dots { bottom:20px; }
}
@media only screen and (max-width: 767px) {
.slide .details h2 { font-size:2.5rem; padding:10px 10px 7px; }
.slide .details p { font-size:1.3rem; }
.carousel .height-setter { margin-top:66.6%; }
.slick-dots { bottom:10px; }
}
@media only screen and (max-width: 599px) {
.slide .details h2 { font-size:2rem; padding:10px 10px 7px; }
.slide .details p { font-size:1rem; }
.slide .details .btn { display: none; }
.carousel .height-setter { margin-top:75%; }
.slick-dots { bottom:10px; }
}

/* CATEGORY PAGE
############################################################################################### */
.sub-page { width:22.75%; margin:0 3% 3% 0; }
.sub-page:nth-child(4n+0) { margin-right:0; }
.sub-page .thumb { display: block; overflow: hidden; position: relative; margin-bottom: 15px; }
.sub-page .thumb .height-setter { margin-top:66%; }
.sub-page .thumb img { width:100%; height:100%; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); object-fit: cover; }

@media only screen and (max-width: 1023px) {
	.sub-page { margin:0 5% 7% 0; width:47.5%; }
	.sub-page:nth-child(2n+0) { margin-right:0; }
}

@media only screen and (max-width: 767px) {
	.sub-page { margin:0 0 7% 0; width:100%; }
	.sub-page .thumb .height-setter { margin-top:60%; }
}

/* PROJECTS
############################################################################################### */
@media only screen and (min-width: 1024px) {
	.page-template-page-project .page-header { margin-top:-10px; }
}

/* CONTACT
############################################################################################### */
.page-template-page-contact .page-content header { padding:5% 5% 0; }
.contact-wrapper .content { width:50%; padding:5% 5%; }
.contact-wrapper .details { width:50%; padding:5% 5%; font-size:1.6rem; }

@media only screen and (max-width: 1023px) {
	.contact-wrapper .content { float:left; width:100%; padding:5% 5%; }
	.contact-wrapper .details { float:right; width:100%; padding:5% 5%; }
}

@media only screen and (max-width: 767px) {
	.contact-wrapper .details { font-size:1.5rem; }
}

/* FOOTER
############################################################################################### */
.footer-contact { background-color:#3c4046; }
.footer-contact textarea { max-height: 150px; }
.site-footer { background-color:#1b1d21; padding:50px 0; color:#fff; }
.site-footer .col { width:17.6%; margin-right:3%; }
.site-footer .col:last-child { margin-right:0; }
.site-footer ul { padding:0; margin:0; list-style-type:none; }
.site-footer li { padding:0 0; margin:0; color:#aaa; }
.site-footer li a { text-decoration: none; color:inherit; }
.site-footer li a:hover { color:#fff; }
.logo-col { padding-right: 2%; }

@media only screen and (max-width: 1099px) {
	.site-footer { padding: 50px 3%; font-size:0.8rem; line-height: 1.5em; }
}
@media only screen and (max-width: 1023px) {
	.site-footer { text-align: center; }
	.site-footer { font-size:1rem; }
	.site-footer .col { width:100%; margin-right:0; }
	.footer-logo { max-width:200px; }
	.site-footer .col { margin-bottom:20px; }
	.site-footer h5 { margin-bottom:10px; }
}
@media only screen and (max-width: 599px) {
}

/* CUSTOM MARGINS
############################################################################################### */
.no-margin-top { margin-top:0; }
.no-margin-bottom { margin-bottom:0; }
.no-margin { margin:0!important; }
.margin-top-xxxl { margin-top:100px; }
.margin-top-xxl { margin-top:75px; }
.margin-top-xl { margin-top:50px; }
.margin-top-lg { margin-top:30px; }
.margin-top-md { margin-top:20px; }
.margin-top-sm { margin-top:10px; }
.margin-top-xs { margin-top:5px; }
.margin-top-xxs { margin-top:3px; }
.margin-bottom-xxl { margin-bottom:75px; }
.margin-bottom-xl { margin-bottom:50px; }
.margin-bottom-lg { margin-bottom:30px; }
.margin-bottom-md { margin-bottom:20px; }
.margin-bottom-sm { margin-bottom:10px; } 
.margin-bottom-xs { margin-bottom:5px; } 
.margin-bottom-xxs { margin-bottom:3px; } 
.margin-right-xxs { margin-right:3px; } 
.margin-right-xxl { margin-right:75px; }
.margin-right-xl { margin-right:50px; }
.margin-right-lg { margin-right:30px; }
.margin-right-md { margin-right:20px; }
.margin-right-sm { margin-right:10px; } 
.margin-right-xs { margin-right:5px; } 
.margin-right-xxs { margin-right:3px; } 

@media only screen and (max-width: 767px) {
.margin-top-xxxl { margin-top:50px; }
.margin-top-xxl { margin-top:40px; }
.margin-top-xl { margin-top:30px; }
.margin-top-lg { margin-top:20px; }
.margin-top-md { margin-top:14px; }
.margin-top-sm { margin-top:7px; }
.margin-top-xs { margin-top:4px; }
.margin-top-xxs { margin-top:2px; }
.margin-bottom-xxxl { margin-bottom:50px; }
.margin-bottom-xxl { margin-bottom:40px; }
.margin-bottom-xl { margin-bottom:30px; }
.margin-bottom-lg { margin-bottom:20px; }
.margin-bottom-md { margin-bottom:14px; }
.margin-bottom-sm { margin-bottom:7px; } 
.margin-bottom-xs { margin-bottom:4px; } 
.margin-bottom-xxs { margin-bottom:2px; } 
}

/* LIGHTBOX
######################################################## */
#imagelightbox
{
    position: fixed;
    z-index: 9999;
 		box-shadow: 0 10px 60px rgba(0,0,0,0.2);
}

		/* OVERLAY */

		#imagelightbox-overlay
		{
			background-color: rgba( 255, 255, 255, .7 );
			position: fixed;
			z-index: 9998;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
		}

		/* ARROWS */

		.imagelightbox-arrow
		{
			display: block; padding:50px 20px;
			background:none; border:none; font-size:100px; line-height: 1em;
			position: fixed;
			z-index: 10001;
			top: 50%;
			transform: translateY(-50%);
			cursor: pointer;
		}

			.imagelightbox-arrow-left	{ left: 0; }
			.imagelightbox-arrow-right	{ right: 0; }



		/* ACTIVITY INDICATION */

		#imagelightbox-loading,
		#imagelightbox-loading div
		{
			border-radius: 50%;
		}
		#imagelightbox-loading
		{
			width: 2.5em; /* 40 */
			height: 2.5em; /* 40 */
			background-color: #444;
			background-color: rgba( 0, 0, 0, .5 );
			position: fixed;
			z-index: 9997;
			top: 50%;
			left: 50%;
			padding: 0.625em; /* 10 */
			margin: -1.25em 0 0 -1.25em; /* 20 */

			-webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
			box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
		}
			#imagelightbox-loading div
			{
				width: 1.25em; /* 20 */
				height: 1.25em; /* 20 */
				background-color: #fff;

				-webkit-animation: imagelightbox-loading .5s ease infinite;
				animation: imagelightbox-loading .5s ease infinite;
			}

			@-webkit-keyframes imagelightbox-loading
			{
				from { opacity: .5;	-webkit-transform: scale( .75 ); }
				50%	 { opacity: 1;	-webkit-transform: scale( 1 ); }
				to	 { opacity: .5;	-webkit-transform: scale( .75 ); }
			}
			@keyframes imagelightbox-loading
			{
				from { opacity: .5;	transform: scale( .75 ); }
				50%	 { opacity: 1;	transform: scale( 1 ); }
				to	 { opacity: .5;	transform: scale( .75 ); }
			}

@media only screen and (max-width: 767px) {
#imagelightbox { transform: scale(1.5); }
.imagelightbox-arrow { display: none!important; }
}



