/*
Theme Name:     Loom Theme
Theme URI:      http://www.ambiondigital.com.au/
Description:    Loom theme for WordPress
Author:         Ambion Digital
Author URI:     http://www.ambiondigital.com.au/
Version:        1.0
*/

/* ============ General layout ============ */

html {
}

html, body {
	font-family: 'Montserrat', sans-serif;
	font-size: 17px;
	line-height: 24px;
	letter-spacing: 0.025em;
	background-color: #fff;
	background: #fff  no-repeat center top;
	color: #032F5E;
}

img {
	max-width: 100%;
	height: auto;
}

iframe, video {
	max-width: 100%;
}

a,
a:hover{
	color:#032F5E;
}
body {
}
.headerwrapper {
	padding: 5px 0 10px 0;
}
.headerwrapper header {
}
.headerwrapper .logo {
	display: block;
	width: 175px;
	height: 110px;
	margin-left: 180px;
}
.headerwrapper .logo a {
	display: block;
	width: 100%;
	height: 100%;
	background: url('img/logo.png') no-repeat;
	background-size: 100%;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.navwrapper {
	background-color: #04315e;
}
nav {
	font-weight:bold;
	font-size: 18px;
	color: #fff;
	text-transform: uppercase;
}
nav a {
	font: inherit;
	color: inherit;
}
.sectionwrapper {
	min-height: 540px;
	padding-bottom: 60px;
	background-color: #fff;
}
.poster {
    display: none;
}
.home .poster {
    display: block;
    width: 100%;
    height: 680px;
    padding-top: 250px;
    background: #04315e url('img/poster.jpg') center no-repeat;
}

.postercontent {
    height: 200px;
    display: block;
    width: 100%;
    text-align: center;
}


.postercontent h3 {
    font-size: 64px;
    color: #fff;
    line-height: 1.1;
}

@media (max-width: 991px) {
    
    .postercontent h3 {
        font-size: 38px;
        color: #fff;
        line-height: 0.8;
    }
}

.fpbutton {
    padding: 15px 30px;
    color: #fff;
    border: 2px solid #fff;
    width: auto;
    clear: both;
    display: inline-block;
}
.fpbutton a {
    font-size: 24px;
    color: #fff;
    text-decoration: none;
}

.home .sectionwrapper {
	margin-top: 0px;
	min-height: 0px;
}
section {
}
.footerwrapper {
	margin-top: 0px;
	padding-top: 25px;
	padding-bottom: 15px;
	font-size: 12px;
	line-height: 14px;
	letter-spacing: 0em;
	color: #fff;
	background-color: #032F5E;
	bottom:0;
}
.footerwrapper footer {
	/*min-height:150px;*/
}
.widget_sp_image-description {
	display:none;
}

.row,
[class|="col"] {
	max-width: 100%;
}

@media (max-width: 991px) {
	.home .sectionwrapper {
		/*margin-top: 300px;*/
	}
}

@media (max-width: 550px) {
	.home .sectionwrapper {
		margin-top: 0px;
	}
	
	table {
		display: block;
		overflow-x: auto;
	}
}

/* ============ Header and footer content ============ */

.headerwrapper [class|="col"] {
	padding: 0px;
}

.footerwrapper [class|="col"] {
	padding-right: 0px;
}

.footerwrapper h3 {
	margin-top: 0px;
	margin-bottom: 10px;
	color: inherit;
	text-transform: uppercase;
}

.footerwrapper a {
	color: inherit;
	text-decoration: inherit;
}

.footerwrapper .contact {
	font-size: 15px;
	line-height: 15px;
}

.footerwrapper .contact h4 {
	font: inherit;
	font-weight: bold;
	text-transform: uppercase;
}

@media (max-width: 991px) {
	.headerwrapper .logo {
		margin-left: 0px;
		margin-right: 0px;
	}
	
	.headerwrapper .col-lg-4 {
		width: 50%;
	}
	
	.headerwrapper .col-lg-4:first-child {
		float: left;
	}
	
	.headerwrapper .col-lg-4:last-child {
		float: right;
	}
	
	.headerwrapper .col-lg-4:nth-of-type(2) {
		display: none;
	}
}

@media (max-width: 550px) {
	.headerwrapper .col-lg-4 {
		width: 100%;
	}
}

/* ============ Navigation ============ */

.navbar-nav > li > a {
	color: inherit;
}
ul.nav li a {
	width: 100%;
	padding: 20px 20px 15px;
	text-align: center;
        font-size: 11px;
        font-weight: 500;
	/*border-bottom: 3px solid;*/
}

ul.nav li a:hover, ul.nav li a:active {
    color: #ed1c25 !important;
}

ul.nav li:first-child {
    width: 100px;
    margin-left: 40px;
}
ul.nav li.current-menu-item a{
	color:#ed1c25;
}
ul.nav li a:hover,
ul.nav li a:focus,
.navbar-nav > li > a:focus,
ul.nav li.current-menu-item a:hover {
	background-color: transparent;
	color:#FFF;	
}
.navbar-nav > .active > a,
.navbar-nav > .active > a:hover,
.navbar-nav > .active > a:focus {
	background-color: transparent;
}

.navbar-brand {
    width: 285px;
    max-width: 285px;
    height: 60px;
    padding-top: 5px;
}

.navbar-brand > a {
    display: inline-flex;
}
.navbar-brand a {
    color: #fff;
}
.navbar-brand  img {
    width: 285px;
    height: 50px;
}

.navbar-brand div {
    display: inline-block;
    width: 285px;
    height: 50px;
}
.navbar-brand div span {
    clear: both;
    white-space: nowrap;
    color: #fff;
}

.navbar-brand div span.tit {
    font-size: 26px;
}

.navbar-brand div span.subtit {
    font-size: 10px;
}


@media (max-width: 350px) {
    div.navbar-brand img {
        display: none;
    }
}

@media (max-width: 767px) {
   .navbar-brand div span.tit {
        font-size: 26px;
    }

    .navbar-brand div span.subtit {
        font-size: 10px;
    } 
    
    div.navbar-brand {
        text-align: left;
        margin:0px;
    }
    
    .navbar-brand div {
        width: 215px;
    }
}

.navicons {
    padding-top: 15px;
}

.navicons a:first-child {
    margin-left:60px;
}
.navicons a {
    margin-left:20px;
}
/* ---------- Dropdown ---------- */

.navbar-toggle {
	padding: 8px 12px !important;
}

.navbar-toggle .icon-bar {
	background-color: #555;
}

.navbar-toggle:hover {
	background-color: #ddd !important;
}

#menu-services {
    padding-left: 0px;
}
    
#menu-services > li > a
{
    display: block;
    background: transparent url('img/menu_item.png') no-repeat right center;
    padding-right: 10px;
}
#menu-services > li > a {
    font-size: 18px;
    text-transform: uppercase;
    color: #032F5E;
    margin-bottom: 10px;
}

#menu-services > li > ul.sub-menu {
    padding-left: 25px;
}

#menu-services > li > ul.sub-menu > li {
    margin-bottom: 10px;
}

#menu-services > li > ul.sub-menu > li > a {
    font-size: 14px;
    color: #000;
    text-transform: capitalize;
}




ul.nav li.current-menu-item ul > li a,
ul.nav li.current-menu-item ul.dropdown-menu li a,
ul.nav li ul.dropdown-menu li a {
	color:#999;
	background-color:white;
}
ul.nav li.current-menu-item ul.dropdown-menu li a:hover,
ul.nav li ul.dropdown-menu li a:hover {
	background:#999 !important;
	color:#FFF;	
}
ul.nav li.current-menu-item ul.dropdown-menu li.current-menu-item a,
ul.nav li ul.dropdown-menu li.current-menu-item a {
	background:#14b796;
	color:#FFF;	
}

@media (max-width: 1080px) {
	ul.nav {
		font-size: 16px;
	}
	
	ul.nav li a {
		padding-left: 25px;
		padding-right: 25px;
	}
}

@media (min-width: 992px) {
    div.navbar > div.container {
        max-width: 1000px;
    }
    
    nav.container {
        max-width: 90%;
    }
    
}

@media (min-width: 768px) and (max-width: 1080px) {
    .navbar-brand {
        width: 700px;
        max-width: 700px;
        
        float: none;
        margin:0 auto;
    }
}

@media (min-width: 1200px) {
    div.navbar > div.container {
        max-width: 1250px;
    }
    
    nav.container {
        max-width: 1250px;
    }
    
}

@media (max-width: 991px) {
	ul.nav {
		font-size: 14px;
	}

	ul.nav li a {
		padding: 10px 19px;
	}
	ul.nav li:first-child {
		width: auto;
	}
        
        div.navbar > div.container {
            max-width: 991px !important;
        }
}

@media (max-width: 1199px) {
        .navicons {
            display: none;
        }
}
@media (max-width: 768px) {
	.nav-collapse #menu-menu li {
		/*width: 100%;*/
	}
	.nav-collapse #menu-menu a {
		border: none;
	}
}

@media (min-width: 768px) and (max-width: 1080px) {
    .navbar-nav {
        float: none;
        margin-top: 0;
        margin-bottom: 0;
        margin: 0 auto;
        width: 750px;
    }   
}


/* ============ Content ============ */

h1, h2, h3, h4, h5, h6 {
	font-family: inherit;
	color: #032F5E;
}
h1 {
	
}
h2 {
	margin-bottom: 30px;
	font-size: 32px;
	line-height: 50px;
	font-weight: bold;
}
.internal h2 {
	text-transform: uppercase;
	margin-top: 30px;
	margin-bottom: 20px;
}
h3 {
	font: inherit;
	margin-bottom: 20px;
	font-weight: bold;
}
h4 {
}
h5 {
}
h6 {
}
a {
}
p {
	margin-top: 0px;
	margin-bottom: 18px;
}
article p {
}

.internal aside {
	padding-top: 0.01%;
}

.internal aside > :first-child {
	/*margin-top: 100px;*/
}

#map-canvas {
	color: #000;
	font-weight: bold;
}

.internal aside > #map-canvas {
	margin-top: 100px;
}

.internal aside > h2:first-child {
	margin-top: 30px;
}

/* ---------- Lists ---------- */

article li {
}
article ul > li,
article ol > li {
}
article ul li:before {
	background:#14b796;
}
article ol > li:before {
    color:#14b796;
}
article li ol,
article li ul {
}
article ol ol li:last-child {
}

/* ---------- Pictures ---------- */
a.page-pics img{
	border:none;
	padding:0;
	-webkit-border-radius:0;
	moz-border-radius:0;
	border-radius:0;
	display:block;
	overflow:hidden;
}
.sectionwrapper .alignleft {
	margin: 0 20px 20px 0;
}
.sectionwrapper .alignright {
	margin: 0 0 20px 20px;
}

.team img {
	margin-bottom: 15px;
}

@media (max-width: 450px) {
	.sectionwrapper .alignleft,
	.sectionwrapper .alignright {
		margin:0;
		width:100% !important;
	}
}

@media (max-width: 768px) {
	body {
		text-align: center;
	}
	
	h2,
	.internal h2 {
		font-size: 23px;
		line-height: 30px;
		margin-top: 10px;
		margin-bottom: 15px;
	}
	
	.team {
		text-align: left;
	}

	article.text .team img {
		width: auto !important;
	}
	
	.wp-caption {
		max-width: 100%;
	}
}



/* ============ Social Media Icons ============ */

.social-media-icons {
	margin-top: 90px;
	text-align: right;
}

.social-media-icons.regular a {
	width: 38px;
	height: 38px;
	margin-left: 10px;
	background-repeat: no-repeat;
	background-size: 100%;
}

.regular .facebook {
	background: url('img/social/facebook.png');
}

.regular .twitter {
	width: 37px;
	background: url('img/social/twitter.png');
}

.regular .instagram {
	width: 37px;
	background: url('img/social/instagram.png');
}

.regular .vimeo {
	background: url('img/social/vimeo.png');
}

.facebook-like {
	text-align:left;	
}

@media (max-width:992px){
	header img {
		margin-bottom:15px;
	}
}

@media (max-width: 768px) {
	.headerwrapper .logo {
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	
	.social-media-icons {
		max-width: 120px;
		margin-top: 50px;
	}
}

@media (max-width: 550px) {
	.social-media-icons {
		margin-top: 0px;
		width: 100%;
		max-width: none;
	}
	
	.social-media-icons.regular a:first-of-type {
		margin-left: 0px;
	}
}


/* ============ Forms ============ */

.wpcf7-form {
	font-size: 14px;
	font-family: 'Arial', sans-serif;
	font-weight: bold;
}
label {
	font: inherit;
}
input,
textarea {
}

.captcha-elements {
	/* HACK: this is here because for some reason there are <br> elements
	         in the WordPress form */
	line-height: 0;
}

.captcha-elements label {
	line-height: normal;
}

.captcha-elements:after {
	content: '';
	display: block;
	clear: both;
}

.captcha {
	float: left;
	width: 30%;
}

.wpcf7-captcha-captcha {
	float: left;
	height: 34px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 6px;
}

/* Stylizes all the buttons in the website. Contact form 7, WooCommerce, and WP */
input.wpcf7-submit,
a.button,
input#submit,
button,
button.custom-button,
input.custom-button,
a.custom-button {
	font-family: 'Arial', sans-serif !important;
	font-size: 14px !important;
	color: #000000 !important;
	font-weight: normal;
	padding: 10px 22px !important;
	background: #42aaff !important; /* Fallback for IE9 and below */
	background: -ms-linear-gradient(top,#ffffff 0%,#a0a0a0)!important;
	background: -o-linear-gradient(top,#ffffff 0%,#a0a0a0)!important;
	background: -moz-linear-gradient(top,#ffffff 0%,#a0a0a0)!important;
	background: -webkit-gradient(linear, left top, left bottom, from(#ffffff),to(#a0a0a0)) !important;
	-moz-border-radius: 15px !important;
	-webkit-border-radius: 15px !important;
	border-radius: 15px !important;
	border: 1px solid #003366 !important;
	-moz-box-shadow:
		0px 1px 2px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.5) !important;
	-webkit-box-shadow:
		0px 1px 2px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.5) !important;
	box-shadow:
		0px 1px 2px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.5) !important;
	text-shadow: none !important;
	position:relative;
}
input.wpcf7-submit:hover,
a.button:hover,
input#submit:hover,
button:hover ,
button.custom-button:hover,
input.custom-button:hover,
a.custom-button:hover {
	background: #003366 !important; /* Fallback for IE9 and below */
	background: -ms-linear-gradient(top,#003366 0%,#42aaff) !important;	
	background: -o-linear-gradient(top,#003366 0%,#42aaff) !important;
	background: -moz-linear-gradient(top,#003366 0%,#42aaff) !important;
	background: -webkit-gradient(linear, left top, left bottom, from(#003366),to(#42aaff)) !important;
}
.woocommerce a.button:active, 
.woocommerce button.button:active, 
.woocommerce input.button:active, 
.woocommerce #respond input#submit:active, 
.woocommerce #content input.button:active, 
.woocommerce-page a.button:active, 
.woocommerce-page button.button:active, 
.woocommerce-page input.button:active, 
.woocommerce-page #respond input#submit:active, 
.woocommerce-page #content input.button:active {
	top:0px !important;
}
.navbar-toggle .icon-bar {
	background-color:#fff;
}


@media (max-width: 991px) {
	.contact-page .sectionwrapper .row {
		/* we want the content to be reversed on mobile, so the contact form
		   will be displayed first */
		display: flex;
		flex-wrap: wrap-reverse;
	}
	
	.contact-page .sectionwrapper .col-lg-4 {
		width: 100%;
		max-width: 600px;
		margin: auto;
	}
	
	form.wpcf7-form {
		max-width: 400px;
		margin: auto;
	}
	
	.captcha {
		width: 48%;
		width: calc(100% - 110px);
	}
	
	.wpcf7-captcha-captcha {
		width: auto;
		float: right;
	}
}

/* ============ Slideshow ============ */

.myCarousel,
.carousel {
}
.carousel-indicators li.active,
.carousel-indicators li {
	border:none;
	width:10px;
	height:10px;
	margin:0;
}
.carousel-indicators li{
	background-color: #FFF;	
}
.carousel-indicators li.active{
	background-color: #14b796;
}



/* ============ Blog ============ */

.postsonpage {
	border-bottom:solid 1px #DDD;
}

.blog h3 {
	font-size: 32px;
	line-height: normal;
}

.blog aside > img:first-child {
	margin-top: 0px;
}

.single aside > img:first-child {
	margin-top: 60px;
}

.postsonpage
.postsonpost .feature,
.postsonpage .feature {
	border:solid 1px #DDD;
	padding:4px;
	border-radius:4px;
	-webkit-border-radius:4px;
	moz-border-radius:4px;
	margin-top:10px;
}
.postsonpost,
.postsonpage {
	padding:20px 0;
}

.blog .content-wrap .row {
	padding-bottom: 20px;
	border-bottom: #9d9d9c 1px solid;
}

.blog .content-wrap .row + .row {
	padding-top: 20px;
}

.dateofpost {
	color: inherit;
	margin-bottom: 0px;
}

.dateofpost + h3 {
	margin-top: 5px;
}

.more-link {
	display:block;
	margin:5px 0;
}

/* ---------- Blog navigation ---------- */

.pagenav {
	margin:20px 0;
	padding:10px 0;
	border-top:solid 1px #DDD;
}

/* ---------- Sidebar for Blog ---------- */

.miscsidebar {
	padding:20px 0;
	border-bottom:solid 1px #DDD;
	margin-top:20px;
}

/* ---------- Sidebar for homepage ---------- */

.home .sectionwrapper aside h2 {
	margin-bottom: 0px;
}

.home .sectionwrapper aside ul {
	padding: 0px;
}

.home .sectionwrapper aside ul li {
	display: block;
	padding-bottom: 15px;
	padding-top: 10px;
	border-bottom: #9d9d9c 1px solid;
}

.home .sectionwrapper aside a {
	display: block;
	font: inherit;
	font-weight: bold;
	color: inherit;
}

.home .sectionwrapper aside .post-date {
	font-size: 14px;
}

/* ---------- Comments list ---------- */

blockquote.comment {
	color:#333;
	border-left:solid 2px red;
}

@media (max-width: 768px) {
	.single aside > :first-child,
	.internal aside > :first-child,
	.single aside > img:first-child {
		margin-top: 5px;
	}
	
	.blog h3 {
		font-size: 20px;
	}
	
	.blog .content-wrap .row {
		margin-left: 0px;
		margin-right: 0px;
	}
	
	.blog .sectionwrapper .col-lg-12 {
		padding: 0px;
	}
}

/* ============ Gallery ============ */

.image-gallery .gallery-item a {
	border:solid 1px #DDD;
	padding:4px;
	border-radius:4px;
	-webkit-border-radius:4px;
	moz-border-radius:4px;
}

@media (max-width: 768px) {
	.gallery .gallery-item {
		width: 100% !important;
	}
}


/* ============ WooCommerce ============ */

/* ---------- Catalog page ---------- */

.product-feature-image {
	border:solid 1px #DDD;
	padding:4px;
	border-radius:4px;
	-webkit-border-radius:4px;
	moz-border-radius:4px;
}
.product-tile {
	border:solid 1px #DDD;
	padding:20px;
	border-radius:4px;
	-webkit-border-radius:4px;
	moz-border-radius:4px;
}

/* ---------- Product page ---------- */

.single-product .product-page  {
	padding:40px 0;
}
.single-product .images a {
	border:solid 1px #DDD;
	padding:4px;
	border-radius:4px;
	-webkit-border-radius:4px;
	moz-border-radius:4px;
}
.single-product .product-page span.onsale,
.single-product .product-page span.onsale {
	top: 46px;
	left: 6px;
}
.upsells h2 {
	font-size:1.5em;
	line-height:2em;
}

/* ---------- Siderbar for WooCommerce ---------- */

.shopsidebar {
	padding:20px 0;
	border-bottom:solid 1px #DDD;
	margin-top:20px;
}

/* and then style the buttons in settings */

.main_video {
    margin-top: 30px;
    margin-bottom: 10px;
}

@media (min-width: 1200px) {
    footer.container {
        max-width: 1250px;
    }
}

.social_icons {
    background: #032f5e;
    height: 50px;
    padding: 10px;
    color: #fff;
    margin-top: 50px;
}

.social_icons p {
    display: inline-block;
}

.social_icons a {
    margin-left: 25px;
}

.thumb_text {
    display: block;
    font-size: 15px;
    line-height: 1.15;
	padding:5px;
}

.cat_thumb {
    height: 250px;
	text-align:center;
}