/*
Theme Name: Maytain Cabinets
Author: Synchromedia Group
Author URI: https://www.smg.com.au/


*/



/**
 * 1.0 - Normalize
 *
 * Normalizing styles have been helped along thanks to the fine work of
 * Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
 */

html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}
body {
	margin: 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 16px;
	line-height: 1.6;

}

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

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
	    -webkit-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
    color: #0071ce;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: 700;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 0;
}

hr {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

code,
kbd,
pre,
samp {
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

select {
	text-transform: none;
}

button {
	overflow: visible;
}

button,
input,
select,
textarea {
	max-width: 100%;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
	opacity: .5;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input[type="checkbox"],
input[type="radio"] {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-right: 0.4375em;
	padding: 0;
}

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-outer-spin-button,
input[type="time"]::-webkit-inner-spin-button,
input[type="time"]::-webkit-outer-spin-button,
input[type="datetime-local"]::-webkit-inner-spin-button,
input[type="datetime-local"]::-webkit-outer-spin-button,
input[type="week"]::-webkit-inner-spin-button,
input[type="week"]::-webkit-outer-spin-button,
input[type="month"]::-webkit-inner-spin-button,
input[type="month"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #d1d1d1;
	margin: 0 0 1.75em;
	min-width: inherit;
	padding: 0.875em;
}

fieldset > :last-child {
	margin-bottom: 0;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
	vertical-align: top;
}

optgroup {
	font-weight: bold;
}
#header{ display: flex; flex-wrap: wrap; justify-content: space-between; }
#header.small{ position: fixed; width: 100%; background: rgba(255,255,255,0.9); z-index: 99; -webkit-transition: all 0.2s ease-in;
transition: all 0.2s ease-in; }
#logo{ padding: 30px; -webkit-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;   }
#logo img{ display: block; }
#header.small #logo{ padding: 10px;
    width: 180px;
    text-align: center;
    font-size: 13px; }


#menu{ align-self: center; -webkit-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;  }

#site-navigation{    }

.entry-title{ text-align: center; }

ul#menu-topnav{ margin: 0px; padding:0px;  }
ul#menu-topnav li{ list-style: none; display: inline-block; }
ul#menu-topnav li a{  background: rgba(0,0,0,0.82); margin-left: 1px; display: inline-block; text-transform: uppercase; line-height: 50px; padding: 0px 15px; font-weight: 400; color: #FFF; text-decoration: none; }
ul#menu-topnav li#menu-item-49 a{ background: #0071ce; color: #FFF; }

ul#menu-topnav li a:hover{ background: #FFF; color: #000;  }

ul#menu-topnav li.current-menu-item a{ background: #FFF; color: #000; }


ul#menu-topnav li ul.sub-menu		{  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);  position:absolute; margin:0; padding:0; background:#FFF; display:none; z-index:99999;  border:none; }
ul#menu-topnav li ul.sub-menu li							{ display:block; margin:0; padding:0; width:220px;}
ul#menu-topnav li ul.sub-menu li a							{ margin:0; padding:0px 15px; border:none;  display:block; }
ul#menu-topnav li ul.sub-menu li a:hover,
ul#menu-topnav li ul.sub-menu li.current-menu-item a		{  }


#primary{ padding-top: 30px; }
.page-template-page-sidecontent #primary{ max-width: 490px; padding: 30px; background: rgba(255,255,255,1); }

h1,h2,h3,h4,h5,p{ margin: 0px; padding: 0px; margin-bottom: 25px; }
h1{ font-weight: 400; font-size: 34px; line-height: 1.3; }
h2{ font-size: 18px; font-weight: 700; line-height: 1.3; }
h3{ font-size: 16px; font-weight: 400; line-height: 1.5; }

img{ max-width: 100%; height: auto; }
.project-template-default .entry-header{ text-align: center; }

.pswp__bg{ background: rgba(0,0,0,0.9) !important; }

.flex{ display: flex; flex-wrap: wrap; justify-content: space-between; }
.flex .entry-content{
    max-width: 390px;
    padding: 30px;
    flex: 0 0 490px;
}
.flex .galleryarea{ flex: 1; }

input[type="text"], input[type="email"], textarea{ width: 100%; padding: 5px; font-family: inherit; line-height: inherit; font-size: inherit; }
.wpcf7{ padding: 30px !important; background: #EEE !important;  border: 3px solid #222;}

.wpcf7 p{ margin-bottom: 10px; }

#bottomlogos{ position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: flex-end;  }
#bottomlogos img{ height: 60px; }


#bottomlogos ul{ display: flex; flex-wrap: wrap; margin: 0px; padding: 0px; }

#bottomlogos ul li{  color: #FFF; text-shadow: 1px 1px 10px rgba(0,0,0,0.7); font-weight: 400; padding: 0 10px; list-style:none;   align-self: center; }

#projects{ display: flex; flex-wrap: wrap; justify-content: flex-start; }
.project{ flex: 0 0 25%; border: 1.5px solid #FFF; position: relative;  }
.project img{ -webkit-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in; display: block; object-fit: cover; width: 100%; height: 400px;  }

.project a h3{ background: rgba(0,0,0,0.2); text-transform: uppercase; -webkit-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in; position: absolute; z-index: 99999; padding: 10px; font-weight: 400; color: #FFF; text-decoration: none;     text-shadow: 1px 1px 10px rgba(0,0,0,0.7);}

.project a:hover h3{ margin-top: 10px; background: rgba(0,0,0,0.82); }
.project img:hover{ opacity: 0.8; }
#map{ height: 300px; border: 1px solid #CCC; }

a.button{ padding: 10px 20px; background: #000; text-decoration: none; color: #FFF; display: inline-block; }
a.button:hover{ background: #AAA; }

hr{ border: 0px; margin: 0px; padding: 0px; margin: 30px 0px; border-bottom: 2px dotted #CCC; }

.dgwt-jg-effect-standard .dgwt-jg-caption {
    background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0 !important;
}

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

		.project{ flex: 0 0 33.333333%; }
		.project img{ height: 300px; }
}
@media only screen and (max-width: 767px) {
.flex .entry-content{
    max-width: 100%;
    padding: 30px;
    flex: 0 0 100%;
}.flex .galleryarea{ flex: 0 0 100%; }
.project{ flex: 0 0 50%; }
.project img{ height: 200px; }
#logo{ padding: 10px; }
ul#menu-topnav li a{ padding: 0 15px; font-size: 15px; }
}
@media only screen and (max-width: 600px) {
	#logo{ width: 100%; text-align: center; }
	#logo img{ margin: 0px auto; }
	#header.small #logo{ margin: 0px auto;  }

	.page-template-page-sidecontent #primary{ padding: 20px; }
	h1{ font-size: 25px; }
		h3{ font-size: 14px;  }

#bottomlogos ul li{ padding: 0px 5px; font-size: 12px; }
		#bottomlogos img{ height: 40px; width: auto !important; }
}
@media only screen and (max-width: 375px) {
	#bottomlogos ul li:first-child{ display: none; }
}
@media only screen and (max-width: 320px) {
	ul#menu-topnav li a{ padding: 0 10px; font-size: 14px; }

}