@charset "UTF-8";
/*
Theme Name: Komo Metform
Author: Jonico Bansil & Tracey Shaw @ GOOP. SASS v1.3
Author URI: http://www.goop.com.au/
Description: Custom WordPress theme for Komo Metform.
Version: 1.3
*/
/* Font imports */
@import url("//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css");
@import url("//fonts.googleapis.com/css?family=Hind:400,700");
/* SASS file imports*/
/* Core */
/*========================================================================
Rem Calc function - from Zurb Foundation, licenced under MIT Open Source
========================================================================*/
/*
Simplified breakpoints
You may need to add to these or add manually numbered ones in _main.scss if you need to fine-tune more than this.
Note that you can use mathematical operators in your media queries, e.g. ($small - 1)
*/
/* Colour scheme */
/* Typography */
/*leave this as 16px (the browser default) and use this value in base.css, otherwise the calculations go off*/
/* Navigation */
/* Links */
/* Transitions */
/* Border radii */
/*==============================================
	REMOVE UNNEEDED ELEMENTS ON SMALL/MEDIUM SCREENS
==============================================*/
/*==============================================
	REALIGN TEXT ON SMALL/MEDIUM SCREENS
==============================================*/
/*==============================================
	CENTRE ITEMS ON SMALL/MEDIUM SCREENS
==============================================*/
/*==============================================
	MAKE IMAGES FULL WIDTH ON MOBILE
==============================================*/
/*==============================================
	HIDE THINGS ON PRINT VERSION
==============================================*/
/*==============================================
	MAKE THINGS FULL WIDTH ON PRINT VERSION
==============================================*/
/* Base */
/* --- base.css | version 1.3 --- */
/* reset */
html, 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, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 1rem; vertical-align: baseline; background: transparent; }

html { -webkit-text-size-adjust: none; }

body { line-height: 1; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

nav ul, aside ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

ins { background-color: #ff9; color: #000; text-decoration: none; }

mark { font-weight: bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

article ul, article ol { margin-left: 1.3em; }

article pre { width: 100%; white-space: pre-wrap; white-space: -moz-pre-wrap !important; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word; margin-bottom: 1em; }

article blockquote { margin: 0 1.25rem 1em 1.25rem; }

/* lists */
article ul.columns-1, article ul.columns-2, article ul.columns-3, article ul.columns-4 { clear: both; width: 100%; margin: 10px 0px 15px 0px; }

article ul.columms-1 { float: left; display: inline; width: 100%; }

article ul.columns-2 li { float: left; display: inline; width: 50%; }

article ul.columns-3 li { float: left; display: inline; width: 33.333%; }

article ul.columns-4 li { float: left; display: inline; width: 25%; }

/* fluid columns */
.container { position: relative; width: 98%; padding: 0 1%; margin: 0 auto; max-width: 960px; }

.container .column, .container .columns { float: left; display: inline; }

.row { margin-bottom: 0px; }

.container .one.column, .container .one.columns { width: 6.25%; }

.container .two.columns { width: 12.5%; }

.container .three.columns { width: 18.75%; }

.container .four.columns { width: 25%; }

.container .five.columns { width: 31.25%; }

.container .six.columns { width: 37.5%; }

.container .seven.columns { width: 43.75%; }

.container .eight.columns { width: 50%; }

.container .nine.columns { width: 56.25%; }

.container .ten.columns { width: 62.5%; }

.container .eleven.columns { width: 68.75%; }

.container .twelve.columns { width: 75%; }

.container .thirteen.columns { width: 81.25%; }

.container .fourteen.columns { width: 87.5%; }

.container .fifteen.columns { width: 93.75%; }

.container .sixteen.columns { width: 100%; }

.container .one-third.column { width: 33.33%; }

.container .two-thirds.column { width: 66.66%; }

/* extra */
.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

/*Offsets*/
.container .columns.offset-by-one { margin-left: 6.25%; }

.container .columns.offset-by-two { margin-left: 12.5%; }

.container .columns.offset-by-three { margin-left: 18.75%; }

.container .columns.offset-by-four { margin-left: 25%; }

.container .columns.offset-by-five { margin-left: 31.25%; }

.container .columns.offset-by-six { margin-left: 37.5%; }

.container .columns.offset-by-seven { margin-left: 43.75%; }

.container .columns.offset-by-eight { margin-left: 50%; }

.container .columns.offset-by-nine { margin-left: 56.25%; }

.container .columns.offset-by-ten { margin-left: 62.5%; }

.container .columns.offset-by-eleven { margin-left: 68.75%; }

.container .columns.offset-by-twelve { margin-left: 75%; }

.container .columns.offset-by-thirteen { margin-left: 81.25%; }

.container .columns.offset-by-fourteen { margin-left: 87.5%; }

.container .columns.offset-by-fifteen { margin-left: 93.75%; }

@media only screen and (max-width: 767px) { .container .one.column, .container .one.columns, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column { width: 100%; padding: 0; margin: 0 auto; } }
/* clearfix */
.clearfix:before, .clearfix:after, .row:before, .row:after, .group:before, .group:after, section:before, section:after, article:before, article:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }

.clearfix:after, .row:after, .group:after, section:after, article:after { clear: both; }

.clearfix, .row, .group, section, article { zoom: 1; }

/* selections */
::selection { background: #dddddd; }

::-moz-selection { background: #dddddd; }

.lt-ie8 .clearfix, .lt-ie8 .row, .lt-ie8 .group { zoom: 0; }

/* active numbers */
a[href^=tel] { color: inherit; text-decoration: none; }

/* GOOP logo */
@font-face { font-family: 'GOOP'; src: url("goop/GOOP.eot?9ommr"); src: url("goop/GOOP.eot?#iefix9ommr") format("embedded-opentype"), url("goop/GOOP.woff?9ommr") format("woff"), url("goop/GOOP.ttf?9ommr") format("truetype"), url("goop/GOOP.svg?9ommr#GOOP") format("svg"); font-weight: normal; font-style: normal; }
.goop-logo { font-family: 'GOOP'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; }

.goop-logo:before { content: "\e600"; }

/*Replace [at] with @ for email address*/
.domain:before { content: "\40"; margin-right: 0px; }

/*=================================================================================
	SITEMAP
=================================================================================*/
article ul.sitemap { margin-left: 25px; }
article ul.sitemap li ul { /*Submenu*/ margin: 5px 0 10px 15px; list-style-type: inherit; }
article ul.sitemap li.current_page_item { display: none; }

/*=================================================================================
	SCROLL
=================================================================================*/
#scroll { width: 20px; height: 20px; padding: 0px; position: fixed; bottom: 10px; right: 10px; cursor: pointer; display: none; color: #373f55; z-index: 10000; background-size: 100%; opacity: 0.5; }

/*=================================================================================
	VIDEOS
=================================================================================*/
.video-container { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; margin-bottom: 20px; }
.video-container iframe { /* .video-container iframe */ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/*=================================================================================
	FORMS
=================================================================================*/
form li { list-style: none; }
form label { display: block; margin-top: 1em; }
form input[type=radio] + label { margin-top: 0; }
form .input-group { margin-top: 1em; }
form input[type=checkbox] + label, form input[type=radio] + label, form label.checkbox { display: inline-block; }
form .ninja-forms-required-items { display: block; margin: 0 0 5px 0; font-size: 0.75rem; color: #666666; font-style: italic; }
form input[type=text], form input[type=email], form input[type=password], form textarea, form select { border: 1px solid #bbbbbb; padding: 0.3125rem; display: block; margin-left: 0 !important; width: 100%; color: #999999; }
form input[type=text]:hover, form input[type=text]:focus, form input[type=email]:hover, form input[type=email]:focus, form input[type=password]:hover, form input[type=password]:focus, form textarea:hover, form textarea:focus, form select:hover, form select:focus { /*.ninja-forms-cont form input[type=text]:focus, .ninja-forms-cont form textarea:focus, .ninja-forms-cont form select:focus*/ color: #373f55; }

/* End of form section*/
.ninja-forms-response-msg { margin: 0; font-weight: 700; }

.ninja-forms-response-msg.ninja-forms-error-msg { color: #cc0000; }
.ninja-forms-response-msg.ninja-forms-error-msg p { /*ninja-forms-response-msg.ninja-forms-success-msg p*/ display: inline; padding-right: 5px; }

ninja-forms-response-msg.ninja-forms-success-msg { color: #066aa6; margin: 0 0 20px; }

.ninja-forms-field-error { color: #cc0000; font-size: 0.75rem; }
.ninja-forms-field-error p { display: inline; }

.ninja-forms-error input[type=text], .ninja-forms-error textarea, .ninja-forms-error select { border-color: #cc0000; }

.ninja-forms-field-description { font-size: 0.75rem; }
.ninja-forms-field-description p { margin: 0 0 5px; color: #cccccc; }

.field-wrap { margin-bottom: 0.5rem !important; }

/*==============================================
	IMAGES
==============================================*/
.alignnone { margin: 0 0 1em 0; }

.aligncenter, div.aligncenter { display: block; margin: 0 auto 1em; }

.alignright { float: right; margin: 0 0 1em 1em; }

.alignleft { float: left; margin: 0 1em 1em 0; }

.aligncenter { display: block; margin: 0 auto; }

img, img[class*="align"], img[class*="wp-image-"] { max-width: 100%; height: auto; }

img.alignright { margin-left: 0 0 1em 1em; }

img.alignleft { margin: 0 1em 1em 0; }

img.aligncenter { display: block; margin: 0 auto 1em; }

img[class*="align"], img[class*="wp-image-"] { border: none; }

img.wp-post-image { display: block; margin: 0 auto; margin-bottom: 1.875rem; }

@media only screen and (max-width: 600px) { .alignnone, .aligncenter, div.aligncenter, .alignright, .alignleft, .aligncenter { float: none; display: block; margin-left: auto; margin-right: auto; text-align: center; width: 100%; max-width: 100%; } }
@media only screen and (max-width: 600px) { .alignnone, .aligncenter, div.aligncenter, .alignright, .alignleft, .aligncenter { width: 100% !important; max-width: 100%; margin-left: 0; margin-right: 0; float: none; } }

/*=================================================================================
	WP-CAPTION
=================================================================================*/
.wp-caption { margin-bottom: 1em; margin-left: 0; max-width: 100%; text-align: left; position: relative; }
@media only screen and (max-width: 600px) { .wp-caption { width: 100% !important; max-width: 100%; margin-left: 0; margin-right: 0; float: none; } }
.wp-caption img { display: block; margin: 0 auto; }
@media only screen and (max-width: 600px) { .wp-caption img { width: 100% !important; max-width: 100%; margin-left: 0; margin-right: 0; float: none; } }

.wp-caption-text { font-size: 0.75rem; padding: 8px 5px; opacity: 0.8; }

/*=================================================================================
	PAGINATION
=================================================================================*/
article .pagination { margin-top: 1.25rem; margin-bottom: 1.25rem; padding: 0; display: block; }
article .pagination span, article .pagination a { /*article .pagination span, article .pagination a*/ display: inline-block; background: #373f55; color: #ffffff; height: 20px; width: 20px; line-height: 20px; text-align: center; font-size: 0.75rem; border: none; text-decoration: none; display: inline-block; }
article .pagination span.current, article .pagination span:hover, article .pagination span:focus, article .pagination a.current, article .pagination a:hover, article .pagination a:focus { background: #066aa6; border: none; color: #ffffff; text-decoration: none; }
article .pagination.single { /*article .pagination.single */ clear: both; }
article .pagination.single div { /*article .pagination.single div*/ display: inline-block; width: 50%; margin: 0; }
article .pagination.single div.newer { /*article .pagination.single div.newer*/ text-align: right; }

/*End of pagination section*/
/* Features */
/*=================================================================================
	RESPONSIVE MENU
=================================================================================*/
/* 
SASS Tip:
Nesting of navigation can get pretty messy. 
I try to limit nesting to 3-4 levels where possible, even if that means not nesting something that could have been nested. 
*/
#responsive { display: block; position: relative; z-index: 10000; /*width: 100%;*/ /*Container class is applied to #responsive in this site, so we'll let that handle the width*/ /*End of span*/ /*End of #responsive ul*/ }
@media only screen and (min-width: 768px) { #responsive { display: none; } }
#responsive.container { width: 100%; padding: 0; }
#responsive span { /*span inside #responsive*/ padding: 0.625rem; position: absolute; left: 5px; color: #ffffff; cursor: pointer; }
#responsive span i { font-size: 1.5625rem; }
#responsive ul { /*ul inside #responsive*/ background: #232836; padding: 0; margin-bottom: 0; display: none; list-style: none; /*End of li subsection*/ }
#responsive ul li { /*Compiles to #responsive ul li*/ border-bottom: 1px solid #0f1117; margin: 0; line-height: 2.1875rem; min-height: 2.1875rem; padding: 0; font-weight: 700; text-transform: uppercase; /*Ampersand as parent selector example*/ /*end of li:hover subsection*/ /* Submenu/ul within li*/ /*End of li.menu-item-has-children subsection*/ }
#responsive ul li a { /*Links inside list items - compile to #responsive ul li a*/ color: #ffffff; text-decoration: none; display: block; padding: 0 0.625rem; }
#responsive ul li:last-child { /*Compiles to #responsive ul li:last-child*/ border: none; }
#responsive ul li:hover { /*#responsive ul li:hover*/ background: #373f55; color: #ffffff; }
#responsive ul li:hover a { /*#responsive ul li:hover a*/ color: #ffffff; }
#responsive ul li:hover > ul { opacity: 1; position: relative; top: auto; left: auto; display: block; height: auto; width: auto; white-space: nowrap; margin: 0; text-align: left; overflow: visible; }
#responsive ul li ul { /* #responsive ul li ul */ border-top: 1px solid #0f1117; position: absolute; top: -99999px; left: 0; opacity: 0; -webkit-transition: opacity 0.3s ease-in-out; -moz-transition: opacity 0.3s ease-in-out; -o-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; z-index: 1; }
#responsive ul li ul li a:before { content: "- "; }
#responsive ul li.menu-item-has-children { /*We're inside the ul here, so this will compile as #responsive ul li.menu-item-has-children */ position: relative; }
#responsive ul li.menu-item-has-children > a { /* #responsive ul li.menu-item-has-children > a */ width: 90%; }
#responsive ul li.menu-item-has-children:before { /* #responsive ul li.menu-item-has-children:before */ position: absolute; top: 0; right: 10px; content: "\f107"; color: #ffffff; }

/*End of #responsive*/
/*=================================================================================
	IMAGE BANNER
=================================================================================*/
#slideshow { padding: 0; position: relative; /*End img*/ /*End caption*/ /*End cycle pager*/ }
@media only screen and (max-width: 480px) { #slideshow { display: none; } }
#slideshow .cycle-slideshow { position: relative; }
#slideshow img { /* #slideshow img */ display: block; margin: 0 auto; width: 100%; height: auto; }
#slideshow .caption { position: absolute; left: 6.25%; top: 1.875rem; /*left: 0;
top: 55px; */ z-index: 9999; /*font-size: rem-calc(40);*/ font-size: 1.75rem; font-weight: 300; color: #0f1117; /*line-height: rem-calc(50);*/ line-height: 1.875rem; }
#slideshow .caption strong { /*font-size: rem-calc(60);*/ font-size: 2rem; display: block; font-weight: 600; }
#slideshow .cycle-pager { text-align: center; width: 100%; z-index: 9999; position: absolute; /*bottom: rem-calc(15); */ bottom: 0; left: 0; /*End span*/ }
#slideshow .cycle-pager span { width: 16px; height: 16px; display: inline-block; background: rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0); /*transparent*/ cursor: pointer; border: 1px solid #FFF; border-radius: 16px; margin: 2px; /*end active*/ }
#slideshow .cycle-pager span.cycle-pager-active { background: #FFF; }

/*End banner*/
/*=================================================================================
	GALLERIES
=================================================================================*/
article .gallery { margin: 0 0 40px !important; /*End of gallery item*/ }
article .gallery a, article .gallery a:hover, article .gallery a:focus { padding: 0; margin: 0; background: none; }
article .gallery:last-of-type { margin: 0 !important; }
article .gallery .gallery-item { margin: 0 1% 0.5% 0 !important; float: none !important; display: inline-block !important; width: 15.8% !important; position: relative !important; }
article .gallery .gallery-item:nth-of-type(6n+6) { margin-right: 0 !important; }
article .gallery .gallery-item img { display: block; border: none !important; width: 100%; height: auto; }
article .gallery .gallery-item .gallery-caption { position: absolute !important; bottom: 0; text-align: center; background: rgba(0, 0, 0, 0.5); padding: 5px; color: #ffffff; width: 100%; font-style: normal; opacity: 0; -webkit-transition: opacity 0.3s ease-in-out; -moz-transition: opacity 0.3s ease-in-out; -ms-transition: opacity 0.3s ease-in-out; -o-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; display: none; }
article .gallery .gallery-item:hover .gallery-caption { opacity: 1; }
article .gallery br { display: none; }

/*End of gallery section*/
#slb_viewer_wrap .slb_theme_slb_default .slb_data_title, #slb_viewer_wrap .slb_theme_slb_default .slb_group_status { font-family: "Hind", "Verdana", "Tahoma", sans-serif !important; }

#slb_viewer_wrap .slb_theme_slb_baseline .slb_slideshow, #slb_viewer_wrap .slb_theme_slb_baseline .slb_group_status { display: none; }

/*=================================================================================
	MAILCHIMP
=================================================================================*/
#mc_embed_signup li { background: none; padding: 0; }

#mc_embed_signup input.mce_inline_error { border-color: #F96567 !important; }

#mc_embed_signup div.mce_inline_error { background: #F96567 !important; }

blockquote.testimonial { padding: 0; margin: 0 20px 20px; min-height: 0px; }
blockquote.testimonial cite { display: block; margin: -5px 0 0 10px; font-style: normal; font-size: 0.875rem; position: relative; }
blockquote.testimonial cite:before { content: "- "; position: absolute; top: 0; left: -8px; clear: both; }

/*End of testimonial*/
/* Site specifc */
/*=================================================================================
	TABLE OF CONTENTS
=================================================================================*/
/* 
	- Basics
		- Utility classes
		- Typography
		- Links
		- Buttons
		- Messages
	- Header 
		- Details (Phone number etc)
	- Main navigation
	- Content
		- Homepage specific styles
		- Article
			- Lists
			- Blockquotes
			- Tables
			- Extras
		- WP-Caption
		- Posts & Children
		- iFrames
	- Sidebar
	- Footer
	- GOOP credit
	- Media Queries
*/
/*=================================================================================
	BASICS
=================================================================================*/
html, body { height: 100%; margin: 0; padding: 0; line-height: 1.4; font-size: 1rem; color: #373f55; font-family: "Hind", "Verdana", "Tahoma", sans-serif; font-weight: 400; background: #201b19; }

*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

a, img, span { -o-transition: opacity 0.3s ease-in-out; -ms-transition: opacity 0.3s ease-in-out; -moz-transition: opacity 0.3s ease-in-out; -webkit-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; }

#komometform { background: #ffffff; }

/*==============================================
	UTILITY CLASSES
==============================================*/
.clearfix { clear: both; }

.left, .columns.left { float: left; }

.right, .columns.right { float: right; }

/*==============================================
	TYPOGRAPHY
==============================================*/
body, input, select, textarea, label, button { font-family: "Hind", "Verdana", "Tahoma", sans-serif; }

#responsive ul li.menu-item-has-children:before, article blockquote:before { font-family: 'FontAwesome'; }

h1, h2, h3, h4, h5, h6 { font-family: "Hind", "Verdana", "Tahoma", sans-serif; font-weight: 600; }

h1, h2, h3, h4, h5, h6, p { margin-bottom: 0.875rem; }

li, p, em, strong, th, td { font-size: 1rem; }

small { font-size: 0.75rem; }

/*==============================================
	LINKS
==============================================*/
article a, aside a { color: black; text-decoration: none; position: relative; transition: 0.3s ease-in-out; }
#home article a, #home aside a { color: rgba(255, 255, 255, 0.7); }
article a:hover, article a:focus, aside a:hover, aside a:focus { color: #066aa6; text-decoration: underline; }
#home article a:hover, #home article a:focus, #home aside a:hover, #home aside a:focus { color: white; }
article a.readmore, aside a.readmore { white-space: nowrap; }

/*==============================================
	BUTTONS
==============================================*/
/*Default button*/
.btn, input[type=submit], button { color: #ffffff; background: #373f55; font-size: 1rem; padding: 6px 10px; margin: 0; cursor: pointer; border: none; transition: opacity 0.3s ease-in-out; /*
Button variations
Use in conjunction with btn class to inherit all properties not overwritten here
*/ /*End btn-secondary*/ /*Add other variations here as needed*/ /*End btn-small*/ }
.btn:hover, .btn:focus, input[type=submit]:hover, input[type=submit]:focus, button:hover, button:focus { color: #ffffff; background: #232836; }
.btn.btn-secondary, input[type=submit].btn-secondary, button.btn-secondary { background: #066aa6; }
.btn.btn-secondary:hover, .btn.btn-secondary:focus, input[type=submit].btn-secondary:hover, input[type=submit].btn-secondary:focus, button.btn-secondary:hover, button.btn-secondary:focus { background: #044b75; }
.btn.btn-small, input[type=submit].btn-small, button.btn-small { padding: 5px 10px; font-size: 0.75rem; text-transform: uppercase; }

/*End buttons*/
/*==============================================
	MESSAGES
==============================================*/
.message { padding: 1.25rem; margin-bottom: 1.25rem; margin-top: 1.25rem; }
.message.warning { background: #fffbd7; border: 1px solid #d7c200; }
.message.error { background: #ffc6c7; border: 1px solid #c60004; }
.message.success { /*background: #91E7AD;
border: 1px solid darken(#91E7AD, 40%);*/ background: #7eccfa; border: 1px solid #022b44; }

/*End of messages section*/
/*=================================================================================
	HEADER
=================================================================================*/
header { background: url(img/backgrounds/header.jpg) no-repeat top center; background-size: cover; position: relative; margin: 0; z-index: 100; /*End of topline section*/ }
@media only screen and (min-width: 600px) { header { padding-bottom: 18%; } }
@media only screen and (min-width: 960px) { header { padding-bottom: 15%; } }
header .strip { background-color: rgba(0, 0, 0, 0.5); padding: 15px; /*End of logo subsection*/ /*End of details subsection*/ }
header .strip #logo a.logo { /*Compiles to header a.logo*/ display: block; }
header .strip #logo a.logo img { /*Compiles to header a.logo img*/ display: block; margin: 0.625rem auto; width: 100%; max-width: 290px; }
@media only screen and (min-width: 768px) { header .strip #logo a.logo img { margin: 0; } }
header .strip #details { /*Compiles to header #details*/ color: #ffffff; text-align: right; display: block; list-style: none; }
@media only screen and (max-width: 767px) { header .strip #details { float: none; display: block; margin-left: auto; margin-right: auto; text-align: center; width: 100%; max-width: 100%; } }
@media only screen and (max-width: 767px) { header .strip #details { text-align: center; } }
header .strip #details li { margin-bottom: 5px; font-size: 1rem; }
@media only screen and (max-width: 767px) { header .strip #details li { float: none; display: block; margin-left: auto; margin-right: auto; text-align: center; width: 100%; max-width: 100%; } }
@media only screen and (min-width: 600px) { header .strip #details li { font-size: 1.25rem; } }
header .strip #details li:first-child { font-size: 1.5625rem; }
@media only screen and (max-width: 767px) { header .strip #details li:first-child { float: none; display: block; margin-left: auto; margin-right: auto; text-align: center; width: 100%; max-width: 100%; } }

/*End of header section*/
/*=================================================================================
	MAIN NAVIGATION
=================================================================================*/
/*.nav-wrapper {
	background: $primary-color;
}*/
nav { padding: 0; margin: 0; position: relative; display: none; z-index: 999; text-align: center; font-size: 0; background: #066aa6; /*end of nav ul*/ }
#home nav { background: white; }
@media only screen and (min-width: 768px) { nav { display: block !important; } }
nav ul { /* nav ul */ text-align: center; margin: 0; padding: 0; font-size: 0; height: 3.125rem; }
nav ul li { /* nav ul li */ font-family: "Hind", "Verdana", "Tahoma", sans-serif; font-size: 1rem; font-weight: 400; display: inline-block; padding: 0 0.875rem; margin: 0; height: 3.125rem; line-height: 3.125rem; position: relative; border-right: 1px solid #077abf; background: #066aa6; /*==============================================
	DROPDOWNS
==============================================*/ /*end of nav ul li ul (sub menu ul)*/ /*End of nav ul li ul li:hover*/ }
#home nav ul li { background: white; border-right: 1px solid #d8dce6; }
@media only screen and (min-width: 960px) { nav ul li { font-size: 1.125rem; padding: 0 1.375rem; } }
@media only screen and (min-width: 1024px) { nav ul li { font-size: 1.125rem; padding: 0 1.4375rem; } }
nav ul li:last-child { border-right: 0px; }
#home nav ul li:last-child { border-right: 0px; }
nav ul li > a { /* nav ul li > a */ color: white; text-decoration: none; padding: 0; display: block; text-transform: uppercase; font-weight: 700; }
#home nav ul li > a { color: #373f55; }
nav ul li:hover, nav ul li.current-menu-item, nav ul li.current-page-ancestor, nav ul li.current_page_parent { background: rgba(255, 255, 255, 0.15); }
#home nav ul li:hover, #home nav ul li.current-menu-item, #home nav ul li.current-page-ancestor, #home nav ul li.current_page_parent { background: #f7f8fa; }
nav ul li:hover > a, nav ul li.current-menu-item > a, nav ul li.current-page-ancestor > a, nav ul li.current_page_parent > a { /*Top level link when hovered*/ }
nav ul li ul { /*nav ul li ul*/ position: absolute; left: 0px; top: -9999px; opacity: 0; z-index: 1000; visibility: hidden; transition: opacity 0.3s ease-in-out; }
nav ul li:hover { /*End of submenu ul*/ }
nav ul li:hover ul { /*nav ul li:hover ul*/ opacity: 1.0; position: absolute; left: 0; top: 100%; display: block; height: auto; white-space: nowrap; margin-top: 0; text-align: left; padding-top: 0px; visibility: visible; /*End of submenu ul li*/ }
nav ul li:hover ul li { border: 0; display: block; margin: 0; height: 1.875rem; line-height: 1.875rem; background: #373f55; font-size: 0.875rem; padding: 0 0.625rem; /*End of submenu ul li a*/ }
#home nav ul li:hover ul li { background: #373f55; border: none; }
@media only screen and (min-width: 960px) { nav ul li:hover ul li { font-size: 1rem; padding: 0 0.625rem; } }
nav ul li:hover ul li a { /*nav ul li ul li a*/ color: white; padding: 0; margin: 0; display: block; }
#home nav ul li:hover ul li a { color: white; }
nav ul li:hover ul li.current-menu-item, nav ul li:hover ul li:hover, nav ul li:hover ul li:focus { background: #2d3446; }
#home nav ul li:hover ul li.current-menu-item, #home nav ul li:hover ul li:hover, #home nav ul li:hover ul li:focus { background: #2d3446; }

/*end of nav */
/*=================================================================================
	CONTENT
=================================================================================*/
#home section#content { background: url(img/backgrounds/home.jpg) top center fixed no-repeat; background-size: cover; }
section#content .row { padding-top: 1.5625rem; padding-bottom: 1.5625rem; }
section#content .row.article { padding: 0 !important; }
section#content .blue { background: rgba(5, 106, 165, 0.8); color: white; }

/*==============================================
	HOMEPAGE SPECIFIC STYLES
==============================================*/
#our-services { background: rgba(31, 29, 30, 0.9); padding: 1.25rem 0.9375rem; }
#our-services h4 { display: block; text-align: left; font-size: 1.75rem; font-weight: 700; color: white; text-transform: uppercase; margin-bottom: 0.9375rem; padding: 0 0.3125rem; }
#our-services ul.row { display: block; text-align: center; margin: 0; padding: 0 !important; }
#our-services ul.row li.one-third.column { margin: 0; padding: 0 0.3125rem 0.625rem; font-size: 0.9375rem; }
@media only screen and (min-width: 600px) { #our-services ul.row li.one-third.column { width: 33.33%; font-size: 0.75rem; } }
@media only screen and (min-width: 768px) { #our-services ul.row li.one-third.column { font-size: 1rem; } }
@media only screen and (min-width: 960px) { #our-services ul.row li.one-third.column { font-size: 1.25rem; } }
#our-services ul.row li.one-third.column a { display: block; text-decoration: none; color: white; padding-top: 60%; width: 100%; background: #00507a; }
#our-services ul.row li.one-third.column a span { display: block; font-weight: 700; font-style: italic; text-transform: uppercase; background-color: rgba(0, 80, 122, 0.8); font-size: inherit; line-height: 1; padding: 0.625rem; }
#our-services ul.row li.one-third.column.bending a { background: url(img/services/bending.jpg) no-repeat top center; background-size: cover; }
#our-services ul.row li.one-third.column.plasma-cutting a { background: url(img/services/plasma-cutting.jpg) no-repeat top center; background-size: cover; }
#our-services ul.row li.one-third.column.laser-cutting a { background: url(img/services/laser-cutting.jpg) no-repeat top center; background-size: cover; }
#our-services ul.row li.one-third.column.guillotining a { background: url(img/services/guillotining.jpg) no-repeat top center; background-size: cover; }
#our-services ul.row li.one-third.column.rolling a { background: url(img/services/rolling.jpg) no-repeat top center; background-size: cover; }
#our-services ul.row li.one-third.column.fabrication a { background: url(img/services/fabrication.jpg) no-repeat top center; background-size: cover; }
#our-services ul.row li.one-third.column:hover { opacity: 0.5; transition: 0.3s ease-in-out; }

#video.container { padding-top: 1.5625rem; padding-bottom: 0.3125rem; }
@media only screen and (min-width: 768px) { #video.container .nine.columns { padding-right: 1.25rem; } }
#video.container p { font-size: 1.125rem; }
#video.container p strong { font-size: inherit; text-transform: uppercase; color: #066aa6; }
#video.container p img { float: right; margin: 0 0 0.3125rem 0.625rem; max-width: 90px; }
#video.container p a { background: #066aa6; color: white; font-size: 1rem; display: block; font-style: italic; font-weight: 700; padding: 0.3125rem; text-align: center; text-decoration: none; text-transform: uppercase; width: 130px; }
#video.container p a:hover { background: #044b75; }

/*=================================================================================
	ARTICLE
=================================================================================*/
article { position: relative; /*==============================================
	LISTS
==============================================*/ /*==============================================
	SMALL
==============================================*/ /*==============================================
	BLOCKQUOTES
==============================================*/ /*End of blockquote*/ /*==============================================
	TABLES
==============================================*/ /*End of table*/ /*==============================================
	EXTRAS
==============================================*/ }
article h1 { font-size: 1.5625rem; margin-bottom: 0.9375rem; color: #373f55; text-transform: uppercase; }
#home article h1 { color: white; }
article h2 { font-weight: 700; font-size: 1.375rem; margin-bottom: 0.625rem; color: #373f55; }
#home article h2 { color: white; }
article h3 { font-size: 1.25rem; margin-bottom: 0.3125rem; font-weight: 700; color: #373f55; }
#home article h3 { color: white; }
article h4, article h5, article h6 { font-size: 1.125rem; text-transform: uppercase; font-weight: 700; }
article p { line-height: 1.25rem; }
article ul, article ol { margin: 0.9375rem 0.9375rem 1.5625rem 1.25rem; }
article ul li, article ol li { /*all list items*/ margin-bottom: 0.3125rem; }
article ul ul, article ul ol, article ol ul, article ol ol { /*list inside list*/ }
article ul { list-style: disc; }
article ul li { margin-bottom: 0.3125rem; }
article ol { list-style: decimal; }
#clients article ol { list-style: none; margin: 0 0 1.5625rem; font-size: 0; }
#clients article ol li { width: 33.33%; display: inline-block; vertical-align: middle; padding: 0 0.625rem 0.625rem; }
#clients article ol li img { width: 100%; height: auto; }
@media only screen and (min-width: 600px) { #clients article ol li { width: 20%; } }
@media only screen and (min-width: 768px) { #clients article ol li { width: 16.66%; } }
article small { /*article .page small, article .post small, .single article small*/ font-size: 0.75rem; margin: 0 0 10px; opacity: 0.7; text-transform: uppercase; }
article .date { display: block; }
article blockquote { position: relative; padding: 0; }
article blockquote:before { content: "\f10d"; opacity: 0.5; position: absolute; top: 0; left: -18px; clear: both; }
article table { margin: 0 0 20px 0; border-collapse: collapse; width: 100%; border: 1px solid #cccccc; }
article table th, article table td { border: 1px solid #cccccc; }
article table th { padding: 3px 10px 3px; text-align: left; }
article table td { padding: 3px 10px 3px; text-align: left; }
article hr { border-color: #cccccc; height: 1px; }

/*End of article section*/
/*=================================================================================
	POSTS & CHILDREN
=================================================================================*/
article .page.row, article .post.row { clear: both; padding: 1.25rem 0 0 !important; margin: 1.25rem 0 0 !important; border-top: 1px solid #c9cedc; /* End of h2.title */ }
article .page.row:first-of-type, article .page.row:only-of-type, article .post.row:first-of-type, article .post.row:only-of-type { padding-top: 0 !important; margin-top: 0 !important; border-top: none; }
article .page.row h2.title, article .post.row h2.title { /*article .page h2.title, article .post h2.title */ background: none; padding: 0; margin: 0 0 5px; }
article .page.row h2.title a, article .post.row h2.title a { /* article .page h2.title a, article .post h2.title */ text-decoration: none; padding: 0; margin: 0; border-color: transparent; color: inherit; }
article .page.row h2.title a:hover, article .page.row h2.title a:focus, article .post.row h2.title a:hover, article .post.row h2.title a:focus { /* article .page h2.title a:hover, article .post h2.title a:hover */ background: none; border-color: #066aa6; }
article .page.row p, article .post.row p { /*article .page p, article .post p*/ display: inline; }
article .page.row .thumbnail, article .post.row .thumbnail { /*article .page .thumbnail, article .post .thumbnail*/ margin-bottom: 1.25rem; }
article .page.row .thumbnail a, article .page.row .thumbnail a:hover, article .page.row .thumbnail a:focus, article .post.row .thumbnail a, article .post.row .thumbnail a:hover, article .post.row .thumbnail a:focus { /*article .page .thumbnail a, article .post .thumbnail a, article .page .thumbnail a:hover, article .post .thumbnail a:hover*/ border: none; text-decoration: none; padding: 0; margin: 0; }

/*End of article .post and article .page*/
/*=================================================================================
	IFRAMES
=================================================================================*/
article iframe { margin: 0 0 20px; display: block; width: 100% !important; }

/*=================================================================================
	SIDEBAR
=================================================================================*/
aside.columns { /*End of aside ul */ }
@media only screen and (max-width: 767px) { aside.columns { margin-top: 1.25rem !important; border-top: 1px solid #c9cedc; } }
aside.columns ul.sidebar { /*End of aside li*/ }
@media only screen and (max-width: 767px) { aside.columns ul.sidebar { padding-top: 1.875rem; } }
aside.columns ul.sidebar li { line-height: 1.875rem; /* End of aside link*/ }
aside.columns ul.sidebar li h3 { font-size: 1.5625rem; font-family: "Hind", "Verdana", "Tahoma", sans-serif; color: #373f55; text-transform: uppercase; margin: 0; }
aside.columns ul.sidebar li a { text-decoration: none; }
aside.columns ul.sidebar li a:before { content: "■"; font-size: 0.75rem; display: inline-block; vertical-align: middle; color: #066aa6; margin-right: 0.5rem; line-height: 1.75rem; }

/*End of aside section*/
/*=================================================================================
	FOOTER
=================================================================================*/
footer { background: #201b19; text-align: left; padding: 1.25rem 0; line-height: 1; text-transform: uppercase; color: white; }
@media only screen and (max-width: 767px) { footer { float: none; display: block; margin-left: auto; margin-right: auto; text-align: center; width: 100%; max-width: 100%; } }
footer a { color: white; text-decoration: none; text-transform: uppercase; }
footer a:hover, footer a:focus { color: rgba(255, 255, 255, 0.8); }
footer .details { font-size: 0.75rem; }
footer .details strong { font-size: inherit; padding-right: 0.3125rem; }

/*=================================================================================
	GOOP CREDIT
=================================================================================*/
ul.goop { list-style: none; font-size: 0; text-align: right; /*End li*/ }
@media only screen and (max-width: 767px) { ul.goop { float: none; display: block; margin-left: auto; margin-right: auto; text-align: center; width: 100%; max-width: 100%; } }
ul.goop li { display: inline-block; font-size: 0.75rem; padding: 0; line-height: 1; vertical-align: middle; margin: 0 4px; /*End link*/ }
ul.goop li a { padding: 0; margin: 0; display: block; }
ul.goop li a span { font-size: 0.6875rem; display: block; }
ul.goop li.logo a:hover { border: none; text-decoration: none; }

/*End of Goop section*/
/*Overrides*/
/*=================================================================================
	IE
=================================================================================*/
.lt-ie9 #responsive { display: none; }
.lt-ie9 nav { display: block !important; }
.lt-ie9 #home section#content { background: none !important; }
.lt-ie9 #home section#content .blue { color: #373f55; }
.lt-ie9 #home section#content article h1, .lt-ie9 #home section#content article h2, .lt-ie9 #home section#content article h3, .lt-ie9 #home section#content article h4, .lt-ie9 #home section#content article h5, .lt-ie9 #home section#content article h5 { color: #373f55; }

/*=================================================================================
	BROWSER WARNING
=================================================================================*/
#browser { text-align: center; padding: 0; background: #ffffcc; margin: 0; font-size: 70%; width: 100%; border-bottom: 1px solid #cccccc; font-family: "Hind", "Verdana", "Tahoma", sans-serif; z-index: 10000; position: relative; }

#browser span { display: block; width: 960px; margin: 0 auto; padding: 3px; color: #666666; }

#browser span a { color: #000; text-decoration: none; }

#browser span a:hover, #browser span a:focus { background: none; color: #000; text-decoration: underline; }