/*
Theme Name: Curtis Bikes
*/


/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 *
 * Detailed information about this CSS: h5bp.com/css
 *
 * ==|== normalize ==========================================================
 */


/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { font-family: sans-serif; color: #555; }

body { margin: 0; font-size: 1em; line-height: 1.4; }

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate
 * Also: hot pink! (or customize the background color to match your design)
 */

::-moz-selection { background: white; color: #FFC300; text-shadow: none; }
::selection { background: white; color: #FFC300; text-shadow: none; }


/* =============================================================================
   Links
   ========================================================================== */

a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }


/* =============================================================================
   Typography
   ========================================================================== */

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

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

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

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

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
 */

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/*
 * Correct overflow not hidden in IE9
 */

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


/* =============================================================================
   Figures
   ========================================================================== */

figure { margin: 0; }


/* =============================================================================
   Forms
   ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/*
 * 1. Correct color not inheriting in IE6/7/8/9
 * 2. Correct alignment displayed oddly in IE6/7
 */

legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 */

button, input { line-height: normal; }

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
 */

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

/*
 * Re-set default cursor for disabled elements
 */

button[disabled], input[disabled] { cursor: default; }

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/*
 * Remove inner padding and border in FF3/4: h5bp.com/l
 */

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

/*
 * 1. Remove default vertical scrollbar in IE6/7/8/9
 * 2. Allow only vertical resizing
 */

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

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }


/* =============================================================================
   Tables
   ========================================================================== */

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }


/* ==|== primary styles =====================================================
   Author:
   ========================================================================== */
















/* ==|== media queries ======================================================
   EXAMPLE Media Query for Responsive Design.
   This example overrides the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}



/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */
/*.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }*/



/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}

/* Colours and type styles */
/* Include any elements with default weight applied, if using fonts.com or unusual Typekit weights. */
/* It's convenient to deal with image replaced elements here too.  I'm taking advantage of h5bp's helper classes, so the styling here should look simple and minimal.  Would it be better to identify uses of helper classes and consolidate them later, I wonder? */

body {
background: white;
font-family: sans-serif;
}

body.home {
background: url(images/bg.jpg)no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

strong {
font-family: sans-serif;
font-weight: bold;
}

em {
font-family: sans-serif;
}

strong em,
em strong {
font-family: sans-serif;
font-weight: normal;
}

a,
a:link,
a:visited,
a:focus,
a:hover,
a:active {
color: inherit;
}

a:focus {
outline: none;
}

.entry-content a:hover,
.entry-content a:active {
color: black;
}

blockquote {
font-size: 1em;
line-height: 1.6;
color: black;
font-style: italic;
/* margin: 2em 0; */
margin: 100px 0;
}





h1, h2, h3, h4, h5, h6, h7 {
font-family: sans-serif;
font-weight: normal;
font-size: 1em;
}

h1 {
text-transform: uppercase;
}

h1 {
font-size: 1.2em;
color: #333;
}

h2 {
font-size: 1em;
color: #333;
}

h3 {
font-size: 1em;
color: #767676;
}

hgroup {
margin: 1em 0;
}


hgroup * {
margin: 0;
line-height: 1.1;
}

/* Layout */

header.banner {
	position: relative;
	z-index: 100;
	box-sizing: border-box;
	padding: 0 calc( 50vw - 605px );
	padding: 20px 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
@media only screen and (max-width: 1250px) {
	header.banner {
		padding: 0 20px;
		padding: 20px 30px;
	}
}

header.banner h1 a {
max-width: 869px;
width: 90%;
height: 41px;
height: 59px;
background: url(images/logostrap.svg) center center no-repeat;
-webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  background-size: contain;

}

header.banner h1 {
margin: 0;
padding: 0;
display: inline-block;
}


header.banner nav {
	display: inline-block;
}

header.banner hgroup {
margin: 0;
}

header.banner h1 a {
margin: 94px auto 48px;


margin: 0;
width: 340px;
}

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

header.banner h1 a {
margin: 10% auto 3.9%;
}

}

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

header.banner {
	padding: 4px 20px;
}

header.banner h1 a {
margin: 5% auto 0;
}

}

header.banner,
footer {
background: black;
clear: both;
}
/*
body.home header.banner {
background: rgba(0, 0, 0, 0.67);
}
*/
header.banner {
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
	background: transparent;
	position: fixed;
	width: 100%;
}

body.header-image header.banner::after,
body.home header.banner::after {
display: block;
width: 100%;
position: absolute;
z-index: -1;
background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
content: '';
top: 0;
bottom: -70px;
left: 0;
right: 0;
}

header.banner.scrolled,
body.home header.banner.scrolled {
	background: black;
}

header.banner.scrolled::after,
body.header-image header.banner.scrolled::after,
body.home header.banner.scrolled::after {
	display: none;
}


/*img {
max-width: 100%;
height: auto;
width: 100%;
}*/

h1, h2, h3, h4, h5, h6, h7 {
text-align: left;



margin-left: auto;
margin-right: auto;
}

/* Press

body.page-id-27 h1,
body.page-id-27 h2,
body.page-id-27 h3,
body.page-id-27 h4,
body.page-id-27 h5,
body.page-id-27 h6 {
max-width: 920px;
max-width: 720px;
}
*/

.page-template-page-frame h1, .page-template-page-frame h2, .page-template-page-frame h3, .page-template-page-frame h4, .page-template-page-frame h5, .page-template-page-frame h6, .page-template-page-frame h7 {
text-align: center;
}

.page-template-page-overview  h1, .page-template-page-overview  h2, .page-template-page-overview  h3, .page-template-page-overview  h4, .page-template-page-overview  h5, .page-template-page-overview  h6, .page-template-page-overview  h7 {
text-align: center;
}



body.page .entry-content {

}

/* Toggle menu */

ul.nav-menu,
div.nav-menu ul {
display: none;
}

div.nav-menu ul.toggled-on {
display: block;
}

ul.nav-menu {
position: absolute; /* as at narrow width, want to overlay it.  This will destroy all natural dimensions. */
z-index: 3000;
}

div.nav-menu ul {
left: -999em;
}

div.nav-menu ul.toggled-on {
left: 0;
}

.menu-toggle,
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
	cursor: pointer;
}




/* Nav menu structure & layout */

nav.main-navigation h3 {
text-align: center;
text-transform: uppercase;
color: white;

margin: 0;
line-height: 1;
padding: 21px 0;
}

div.nav-menu,
div.menu-main-menu-container {
color: white;
}

div.nav-menu ul,
ul.nav-menu {
width: 100%;
}

div.nav-menu ul li,
ul.nav-menu li {
padding: 0 16px;

}

div.nav-menu,
div.menu-main-menu-container {
display: none;
}

@media only screen and (min-width: 1156px) {

.menu-toggle {
		display: none;
}

div.nav-menu ul li,
ul.nav-menu li {
display: inline-block;
}

div.nav-menu,
div.menu-main-menu-container {
display: block !important;
}

}

div.nav-menu ul a,
ul.nav-menu a {
text-align: center;
text-decoration: none;
font-size: 1em;
font-weight: bold;
text-transform: none;
border-bottom: 2px solid transparent;
padding: 0 0 2px;
line-height: 1;
}

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

.menu-toggle::before {
content: "\f0c9";
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
-webkit-font-smoothing: antialiased;
*margin-right: .3em;
text-decoration: inherit;
display: inline-block;
speak: none;
padding-right: 2px;
}

div.nav-menu ul a,
ul.nav-menu a {
text-align: center;
font-size: 1.3em;
padding: 1em 0;
display: block;
}

div.nav-menu ul li.current_page_item a, div.nav-menu ul li.current_page_parent a, div.nav-menu ul li.current_page_ancestor a, ul.nav-menu li.current-menu-item a, ul.nav-menu li.current-page-ancestor a {
border-bottom: none !important;
text-decoration: underline !important;
}

div.nav-menu ul li,
ul.nav-menu li {
border-top: 1px solid white !important;
border-top: none !important;
}

div.nav-menu ul,
ul.nav-menu {
padding-bottom: 0 !important;
}

}



div.nav-menu ul li.current_page_item a,
div.nav-menu ul li.current_page_parent a,
div.nav-menu ul li.current_page_ancestor a,
ul.nav-menu li.current-menu-item a,
ul.nav-menu li.current-page-ancestor a {
color: white;
border-bottom: 2px solid white;
}

div.nav-menu a:focus,
div.nav-menu a:hover,
div.nav-menu a:active,
ul.nav-menu a:focus,
ul.nav-menu a:hover,
ul.nav-menu a:active {
color: white;
}

/* Slideshow */

.cycle-slideshow,
.no-touch .swipe-wrap {
width: 100%;
height: auto;
overflow: hidden;
/*max-width: 500px;*/
max-width: 852px;
margin: 0 auto;
}

#custom-pager {
max-width: 856px;
margin: 0 auto;
}

body.home .cycle-slideshow,
body.home .no-touch .swipe-wrap {
max-width: 100%;
height: 100%;
}

body.home .cycle-slideshow img,
body.home img.cycle-slide {

height: 100%;
width: auto;
}

@media (min-aspect-ratio:3/2) {

body.home .cycle-slideshow img,
body.home img.cycle-slide {
width: 100%;
height: auto;
}

}

/* fix FOUC */

img.cycle-slide, div.cycle-slide img, div.cycle-slide, div.swipewrap > div, div.swipewrap > div img {
display: none;
display: block; /* amb 2014-01-28 fix slides not showing at all */
width: 100%;
height: auto; /* amb - added for blended slides which now have height attributes */
}

img.cycle-sentinel + img.cycle-slide {
display: block;
}

#custom-pager {
margin: 10px auto;
text-align: center;
}

#custom-pager a {
/*width: 100px;
height: 100px;
overflow: hidden;
text-align: center;*/

width: 73px;
display: inline-block;
margin: 0 3px 6px;
}

html.no-touch #custom-pager a {
border: 1px solid white;
}

#custom-pager a img {
/*height: 100%;*/
width: 100%;
}

#custom-pager a:after {
/* 50% black overlay */
}

html.no-touch #custom-pager a.cycle-pager-active,
html.no-touch #custom-pager a:hover {
/* remove overlay */
border: 1px solid black;
}

.no-touch #pagination, #pagination { display: none; }
.touch .cycle-next, .touch .cycle-prev { display: none; }

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

#custom-pager a img {
display: none;
}

#custom-pager a {
width: 16px;
border-radius: 8px;
height: 16px;
background: #ccc;
/*
pointer-events: none;
cursor: default;
*/
}

#custom-pager a.cycle-pager-active {
background: #444;
}


}

html.touch #custom-pager a img {
display: none;
}

html.touch #custom-pager a {
width: 16px;
border-radius: 8px;
height: 16px;
background: #ccc;
/*
pointer-events: none;
cursor: default;
*/
}

html.touch #custom-pager a.cycle-pager-active {
background: #444;
}

.cycle-wrap {
position: relative;
max-width : 852px;
margin: 0 auto;
}

.cycle-prev,
.cycle-next {
width: 47px;
height: 47px;
margin-top: -23px;
cursor: pointer;
position: absolute;
top: 50%;
z-index: 500;
}

.cycle-prev:hover {
background: url(images/prev-slide.png) no-repeat 50% 50%;
}

.cycle-next:hover {
background: url(images/next-slide.png) no-repeat 50% 50%;
}

.cycle-wrap:hover .cycle-prev {
background: url(images/prev-slide.png) no-repeat 50% 50%;
}

.cycle-wrap:hover .cycle-next {
background: url(images/next-slide.png) no-repeat 50% 50%;
}

.cycle-prev {
left: 5%;
}

.cycle-next {
right: 5%;
}

html.touch .cycle-prev,
html.touch .cycle-next {
background: none;
width: 1px;
height: 1px;
}

@media only screen 
and (min-width : 1040px) {

.cycle-wrap {
max-width : 1040px;
}

.cycle-prev {
left: 0;
background: url(images/prev-slide.png) no-repeat 50% 50%;
}

.cycle-next {
right: 0;
background: url(images/next-slide.png) no-repeat 50% 50%;
}

/*.cycle-slideshow {
overflow: visible;
}

body.home .cycle-slideshow {
overflow: hidden;
}*/

}

                .touch .swipe {
  overflow: hidden;
  visibility: hidden;
  position: relative;
 
}
.touch .swipe-wrap {
  overflow: hidden;
  position: relative;
}
.touch .swipe-wrap > div {
  float:left;
  width:100%;
  position: relative;
}
.touch .swipe img {
width:100%;
}

/* Generic type */

h1 {


}

h1.entry-title {
font-size: 1.3em;
font-weight: 600;
}

body.page-template-page-contact-php h1.entry-title,
body.page-template-page-contact-php .entry-title,
body.page-template-page-contact-php .entry-content *:not(textarea):not(input) {
color: white;
}

body.page-template-page-contact-php .entry-content * {
text-align: left;
}

body.page-template-page-contact-php .entry-content h2 {
margin-top: 1em;
}

.entry-content {
font-size: 1.3em;
line-height: 1.35;
font-weight: 100;
margin: 1.6em auto;
max-width: 1250px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0 20px;
}

/* Press

body.page-id-27 .entry-content {
max-width: 960px;

text-align: center;
} /* Should I have a Feature selection box on a page that adds classes, to save making extra templates to choose from? * /

body.page-id-27 .entry-content > p {
max-width: 720px;
margin-left: auto;
margin-right: auto;
}
*/

.wp-caption {
/*float: left;*/
display: block;
vertical-align: top;
/*width: 29%;*/
margin: 100px 0;
font-size: 0.6em;


position: relative;
left: 50%;
-ms-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
transform: translateX(-50%);
float: none !important;
}

.wp-caption img {
width: 100%;
height: auto;
}

.wp-caption p {
margin: 0.3em 0 1.7em;
}

.size-windowwidth + .wp-caption-text {
width: 100vw;
max-width: 100vw;
position: relative;
left: 50%;
-ms-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
transform: translateX(-50%);
float: none !important;
}

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

.wp-caption {
font-size: 0.7em;
}

}

/*@media only screen 
and (max-width : 550px) {

.wp-caption {
font-size: 0.7em;
display: block;
width: 65%;
margin: 0 auto;
}



}*/


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

.wp-caption {
font-size: 0.7em;
display: block;
/* width: 65%; */ /* breaking wide images - amb - 2018-11-21 */
margin: 0 auto;
}

}

.entry-content h2 {
font-size: 1.6em;
font-weight: 400;

margin-top: 2em;
}

.entry-content h3 {

}

.entry-content h4 {

}

.profile-summary h2 {
font-size: 1.3em;
line-height: 1;
margin: 0.8em 0;
text-transform: none;
text-align: left;
font-weight: 700;
}

.profile-summary h3 {
font-size: 1.15em;
line-height: 1.3;
text-align: left;
}

.profile-summary a {
text-decoration: none;
}

.profile-summary hgroup {
margin: 0.8em 0 1.8em;
}

.profile-summary {
float: left;
margin: 0 0 0 2%;
width: 49%;
}

.profile-summary img {
width: 100%;
height: auto;
}

.profile-summary:nth-child(odd) {
margin: 0;
clear: left;
}

.profile-wrap {
max-width: 1250px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
margin: 0 auto;
padding: 0 20px;
}

/*.profile-wrap {
max-width: 970px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
margin: 0 auto;
text-align: justify;
}

.profile-summary {
display: inline-block;
margin: 0;
width: 49%;
}

.profile-summary img {
width: 100%;
height: auto;
}

.profile-summary:nth-child(even) {
margin-right: 0;
}

.profile-wrap:after {
  content: '';
  width: 100%; /* Ensures there are at least 2 lines of text, so justification works 
  display: inline-block;
}*/


.page-template-pagetestimonials-php .entry-content h2 {
text-transform: none;
font-size: 1em;
}

/* Special page layouts */



/* Portfolio */

/* Press */

/* Add " (PDF)" text after links that go to PDFs 
a[href$=".pdf"]:after { content: " PDF"; }*/

/* If file size specified as data attribute, use that too
a[href$=".pdf"][data-size]:after { content: " PDF (" attr(data-size) ")"; } */

a.press-article-link {
text-decoration: none;
color: inherit;
display: block;
text-align: center;
margin-top: 1em;
position: relative;
z-index:1000;
}



/* Footer stuff */


footer {
text-align: center;
font-size: 0.8em;
padding: 0 16px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #B3B3B3;
}

footer a {
text-decoration: none;
color: inherit;
}

footer a:hover {
text-decoration: underline;
color: white;
}

div#sharing {
text-align: center;
margin: 0 -16px;
}



ul.nav-menu, div.nav-menu ul {
display: block !important;
position: static;
}

div.nav-menu ul li,
ul.nav-menu li {
width: auto;
}

/* 333 links, 767676 on state */

div.nav-menu {
background: transparent;
}

div.nav-menu ul li,
div.nav-menu ul li.current_page_item,
div.nav-menu ul li.current_page_parent,
div.nav-menu ul li.current_page_ancestor {
background: transparent;
border: none;
}

div.nav-menu ul {
text-align: center;
padding: 6px 0 12px;
}

div.menu-main-menu-container {
background: transparent;
}

ul.nav-menu li,
ul.nav-menu li.current-menu-item,
ul.nav-menu li.current-page-ancestor {
background: transparent;
border: none;

}

ul.nav-menu {
text-align: center;
padding: 6px 0 12px;
padding: 0;
}

.picstrip {
text-align: center;
}

.picstrip img {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0 1%;
width: 33.33%;
height: auto;
}





/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

}


@media only screen 
and (min-width : 768px) {




}

/*@media only screen 
and (min-width : 1000px) {*/

@media only screen and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation:landscape),
only screen 
and (min-width : 1000px) {





} /* end media query for landscape ipad and medium screens */

/*body.home .main,
body.home #wrap,
body.home,
html {
padding: 0;
height: 100%;
}*/

body.home,
html {
padding: 0;
height: 100%;
}

body.home {
background: white;
}

body.home header.banner {

z-index: 50000; /* always in front of chevron */
/*
position: absolute;
left: 0;
right: 0;
*/
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}





/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {


}



/* 2-up overviews */

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


footer {
clear: both;
}


}


/* Sharing icons */

@font-face {
  font-family: 'FontAwesome';
  src: url('font/fontawesome-webfont.eot?v=3.2.1');
  src: url('font/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'), url('font/fontawesome-webfont.woff?v=3.2.1') format('woff'), url('font/fontawesome-webfont.ttf?v=3.2.1') format('truetype'), url('font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg');
  font-weight: normal;
  font-style: normal;
}

footer .social {
padding: 10px 0;
line-height: 2.5;
}

footer .social a {
display: inline-block;
width: 8em; /* just remove this width to use natural text widths */

margin: 0 6px;

text-align: center;

text-transform: uppercase;
font-weight: 100;
font-size: 0.9em;

 /* font-family: FontAwesome;*/
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em;
}

footer .social a::before {
width: 34px;
height: 34px;
content: '';
display: block;
font-family: FontAwesome;
margin: 0 auto;

-webkit-border-radius: 17px;
border-radius: 17px;

vertical-align: middle;
background: #424242;
color: white;

font-size: 2em;
line-height: 34px;

  text-decoration: inherit;
/*  display: inline-block;*/
  speak: none;
}

footer .social a:hover {
text-decoration: none;
}





footer .social a.facebook:before {
content: "\f09a";
}

footer .social a.facebook:hover:before {
background: #406FA7;
}

footer .social a.twitter:before {
content: "\f099";
}

footer .social a.twitter:hover:before {
background: #0099C5;
}

footer .social a.pinterest:before {
content: "\f0d2";
/*font-size: 3.6em;
color: #424242;
background: white;*/

background: #424242;
color: white;
}

footer .social a.pinterest:hover:before {
background: #CF1B2C;
}

footer .social a.vimeo:before {
background-position: -255px 0;
}

footer .social a.vimeo:hover:before {
background-position: -255px -53px;
}

footer .social a.youtube:before {
content: "\f167";
}

footer .social a.youtube:hover:before {
background: #E81B20;
}

footer .social a.instagram:before {
content: "\f16d";
}

footer .social a.instagram:hover:before {
background: #5851DB;
}

footer .social a.flickr:before {
content: "\f16e";
background: #424242;
color: white;
}

footer .social a.flickr:hover:before {
background: #E83A7B;
color: white;
}

footer img {
display: inline-block;
max-width: 90%;
width: 212px;
padding: 30px;
}

footer h3 {
color: inherit;
}

/*footer a:link,
footer a:visited,
footer a:focus,
footer a:hover,
footer a:active {
color: white;
}*/






/* Social Icons */

/* FONT PATH
 * -------------------------- */


/* FONT AWESOME CORE
 * -------------------------- */


.icon-twitter:before {
  content: "\f099";
}

.icon-facebook:before {
  content: "\f09a";
}

.icon-linkedin:before {
  content: "\f0e1";
}

.icon-envelope:before {
  content: "\f0e0";
  font-size: 0.9em * 2.4 * 0.92 !important;
}

.icon-google-plus:before {
  content: "\f0d5";
}

.icon-youtube:before {
  content: "\f167";
}

.icon-flickr:before {
  content: "\f16e";
}

.icon-border {
  border: solid 1px #eeeeee;
  padding: .2em .25em .15em;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}




.hi-icon {
	display: inline-block;
	font-size: 0px;
	cursor: pointer;
	margin: 15px 30px;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	text-align: center;
	position: relative;
	z-index: 1;
	color: #fff;
}









body.page-template-page-contact-php .main {
background: url(images/contact-bg.jpg) no-repeat;
/*-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;*/
-webkit-background-size: 120% auto;
-moz-background-size: 120% auto;
-o-background-size: 120% auto;
background-size: 120% auto;
padding: 1px 0;
color: white;
}

body.page-template-page-contact-php .entry-content {

max-width: 970px; /* match frames overview */
}

body.page-template-page-contact-php .entry-content > div {
width: 50%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 1px 20px; /* enclose margins */
background: rgba(0,0,0,0.5);
border-radius: 10px;
}

@media only screen 
and (max-width : 898px) { /* this should be aspect ratio, but need also to combine with widths */

body.page-template-page-contact-php .main {
background: url(images/contact-bg-middling.jpg) no-repeat;
-webkit-background-size: auto 100%;
-moz-background-size: auto 100%;
-o-background-size: auto 100%;
background-size: auto 100%;
background-position: 50%;
}
}

@media only screen 
and (max-width : 520px) { /* this should be aspect ratio, but need also to combine with widths */
/* tried 636, but got white band on left due to scale */
body.page-template-page-contact-php .main {
background: url(images/contact-bg-narrow.jpg) no-repeat;
-webkit-background-size: auto 100%;
-moz-background-size: auto 100%;
-o-background-size: auto 100%;
background-size: auto 100%;
background-position: 100% 0;
}

body.page-template-page-contact-php .entry-content > div {
width: 100%;
}
}

/* Forms */

input, textarea {
background-color: #EEEEEE;
border: 1px solid #444444;
border-radius: 3px 3px 3px 3px;
font-size: 16px;
margin-bottom: 5px;
padding: 3px;
color: #222222;
text-shadow: none;

padding: 8px;
font-family: sans-serif;
margin-bottom: 16px;
border: 1px solid #d9d9d9;
border-radius: 4px;
margin-top: 4px;
background-color: #fafafa;
}

.wpcf7 input[type="text"]:focus-visible,
.wpcf7 input[type="email"]:focus-visible,
.wpcf7 textarea:focus-visible,
.wpcf7 select:focus-visible {
  outline: #FFC300;
  border-color: #FFC300;
}

input:invalid, textarea:invalid {
background-color: #ffdd66;
}

form ::selection { background: #FFC300; color: black; text-shadow: none; }

input:not([type=submit]):not([type=reset]), textarea {
width: 100%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

/* http://css-tricks.com/styling-texty-inputs-only/ */


img.size-team,
.entry-content img {
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
}

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

.entry-content img.alignleft {
	margin: 0 10px 10px 0;
	float: left;
	clear: left;
}

.entry-content img.alignright {
	margin: 0 0 10px 10px;
	float: right;
	clear: right;
}

.size-blogfull { width: 100%; }
.size-blogquarter { width: 25%; }
.size-bloghalf { width: 50%; }

.size-windowwidth,
img.size-windowwidth,
.entry-content .size-windowwidth,
.entry-content img.size-windowwidth {
	width: 100vw;
	max-width: 100vw;
	position: relative;
	left: 50%;
	-ms-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	transform: translateX(-50%);
	
	float: none !important;
}

.size-extrawidth,
img.size-extrawidth,
.entry-content .size-extrawidth,
.entry-content img.size-extrawidth {
	width: 1250px;
	max-width: none;
	position: relative;
	left: 50%;
	-ms-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	transform: translateX(-50%);
	
	float: none !important;
}

.entry-content {
text-align: left;
}


/*div.gallery img*/
div.gallery figure {
width: 25%;
box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;

/* the floated way:
float: left;
padding: 0 0 12px 12px; */


/* the inline-block way: */
display: inline-block;
vertical-align: top;
padding: 0 6px 12px 6px;
}

div.gallery figcaption {
/*display: none;*/
font-size: 0.7em;
height: 2.7em;
padding: 3px;
overflow: hidden;
}

div.gallery figure:hover figcaption {
background: #333;
color: white;
}

div.gallery figure:hover .gallery-icon {
background: black;
}

div.gallery figure:hover .gallery-icon img {
opacity: 0.5;
}

div.gallery {
/* the floated way:
margin-left: -12px;*/

margin-left: -6px;
margin-right: -6px;
text-align:center;
}

div.gallery.style-window,
div.gallery.style-windowwidth {
margin-left: 0;
margin-right: 0;
width: calc( 100vw + 6px );
left: 50%;
position: relative;
transform: translateX(-50%);
}

div.gallery.style-extrawidth {
margin-left: 0;
margin-right: 0;
width: 1250px;
max-width: calc( 100vw + 6px );
left: 50%;
position: relative;
transform: translateX(-50%);
}

div.gallery:before, div.gallery:after { content: ""; display: table; }
div.gallery:after { clear: both; }
div.gallery { *zoom: 1; }
/* clearfix for gallery */

@media only screen 
and (max-width : 600px) {
div.gallery figure {
width: 33.3333%;
}
}

@media only screen 
and (max-width : 480px) {
div.gallery figure {
width: 50%;
}
}

@media only screen 
and (max-width : 320px) {
div.gallery figure {
width: 100%;
}
}

#cboxOverlay{position:fixed; width:100%; height:100%; top:0; left: 0; background: rgba(0,0,0,0.5); display: none !important;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
#cboxPrevious:focus, #cboxNext:focus, #cboxClose:focus, #cboxSlideshow:focus{outline:none;}
#cboxPrevious:hover, #cboxNext:hover, #cboxClose:hover, #cboxSlideshow:hover{color:#333;background:white;border-radius:50%;}

#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding: 1px 0 0 1px; margin:0; overflow:visible; text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; }
#cboxNext {padding-left: 4px;}
#cboxClose {padding-left: 2px;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
        #cboxContent{margin-top:32px; overflow:visible; background:#000;}
        #cboxContent{margin-top: 0; padding-top: 27px;background:#333; border-bottom: 27px solid white;}
        #cboxTitle{ bottom:-25px;top: auto; left: 5px; }
        #cboxCurrent, #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose{top: 5px;color: white;}
        #cboxContent{position:relative;}
                #cboxPrevious{right:49px;}
        #cboxPrevious:hover{}
        #cboxNext{right:27px;}
        #cboxNext:hover{}
        #cboxClose{right:5px;}
        #cboxClose:hover{}


/*#cboxTopLeft,
#cboxTopCenter,
#cboxTopRight,
#cboxMiddleLeft,
#cboxMiddleRight,
#cboxBottomLeft,
#cboxBottomCenter,
#cboxBottomRight {
	display: none;
}*/

#cboxTitle {
float: none;
display: block;
text-align: center;
width: 100%;
}

/* img.cboxPhoto, */

#cboxLoadedContent,
#cboxContent,
#cboxWrapper {
	width: 100% !important;
	height: 100% !important;
}

#colorbox {
	width: 78% !important;
	height: 52vw !important;

	max-height: 78%;
	max-width: 117vh;
	left: 50% !important;
	top: 47% !important;
/*	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
-webkit-backface-visibility: hidden;	*/
	outline-color: rgb(0, 0, 0);
outline-style: none;
outline-width: 0px;

position: fixed !important;
/*top: 0 !important;
left: 0 !important;*/
/*z-index: 10000; makes it all blurry because if transform & webkit bug */


}

#cboxContent {
-webkit-box-shadow: 0 8px 10px 7px rgba(0,0,0,0.4);
box-shadow: 0 8px 10px 7px rgba(0,0,0,0.4);
}

#cboxWrapper {
position: relative;
left: -50%;
top: -50%;
}

#cboxWrapper > div {
	/*float: left; /* try to force dimensions to wrap */
}

#cboxPrevious, #cboxNext, #cboxClose {
	text-indent: 0;
	background: transparent;
}

#cboxPrevious:before,
#cboxNext:before,
#cboxClose:before {
content: "\f060";
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
-webkit-font-smoothing: antialiased;
*margin-right: .3em;
text-decoration: inherit;
display: inline-block;
speak: none;
padding-right: 2px;

}

#cboxNext:before {
content: "\f061";
}

#cboxClose:before {
content: "\f00d";
}

img.cboxPhoto {

width: auto !important;
height: auto !important; /* not sure important is needed, as long as other important rules are removed for image */
max-width: 100%;
max-height: 100%;
display: block;
margin: 0 auto;

}



body.home div.cycle-slideshow {
  height: 100%;
  overflow: hidden;
}
body.home div.cycle-slideshow p {
  display: inline;
}
@media only screen and (max-width: 600px) {
  body.home div.cycle-slideshow p {
    display: none;
  }
}
body.home div.cycle-slideshow p + p, /* breaks if no middle caption entered */
body.home div.cycle-slideshow p:last-child {
  display: inline;
}

body.home img.cycle-slide, body.home
div.cycle-slide img {
  height: 100%;
  width: 100%;
  max-width: none;
  object-fit: cover;
}

.cycle-pager {
position: absolute;
left: 20px;
bottom: 80px;
z-index: 1000;
}
@media only screen and (max-width: 750px) {
.cycle-pager {
	display: none;
}
}
.cycle-pager span {
font-family: arial;
font-size: 30px;
width: 9px;
height: 9px;
display: inline-block;
color: white;
cursor: pointer;
border: 2px solid white;
background: white;
text-indent: -90px;
overflow: hidden;
border-radius: 50%;
margin: 0 6px;
}
.cycle-pager span.cycle-pager-active {
background: transparent;
}
.cycle-pager a {
display: none;
}

body.home div.cycle-slide {
  height: 100%;
  width: 100%;
}
body.home div.cycle-slide::after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 70%;
	height: 100%;
	display: block;
	background: linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
}
body.home div.cycle-slide div {
  position: absolute;
  z-index: 999999;
  left: 0;
  bottom: 100px;
  color: white;
  /*background: rgba(0,0,0,0.7);*/
  
  padding: 1em 0 1em 20px;
  box-sizing: border-box;
  width: 50%;
  max-width: 100%;
  font-weight: 700;
  font-size: 55px;
  line-height: 1.1;
}
body.home div.cycle-slide div h2 {
  font-size: 1em;
  font-weight: 700;
  margin: 0;
  color: white;
  display: inline;
}
body.home div.cycle-slide div h2:after {
	content: '  ';
}
body.home div.cycle-slideshow p:last-child {
display: block;
margin: 18px 0 0;
}
body.home div.cycle-slide div a {
  white-space: nowrap;
  display: inline-block;
  float: left;
  text-decoration: none;
  font-size: 15px;
  line-height: 2;
  padding: 8px 28px;
  border-radius: 100px;
  background: white;
  color: black;
}

body.home div.cycle-slide div a:hover {
	text-decoration: none;
	background: black;
  color: white;
}
/*
body.home div.cycle-slide div a:after {
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em;
  content: " \f138";
}
*/
@media only screen and (max-width: 900px) {
  body.home div.cycle-slide div {
    
    padding: 20px;
    width: 67%;
    
    
  }

}
@media only screen and (max-width: 750px) {
  body.home div.cycle-slide div {
    
    font-size: 55px;
    width: 67%;
    bottom: 100px;
    
    
  }
  body.home div.cycle-slide div a {
  	line-height: 1.5;
  }
}
@media only screen and (max-width: 600px) {
  body.home div.cycle-slide div {
    padding: 20px;
    
    font-size: 35px;
    width: 100%;
  }
  body.home div.cycle-slide div a {
  	line-height: 1.2;
  }
}


body.home div.cycle-slide-active img {
-webkit-animation: zoom 5s ease-in-out;
animation: zoom 5s ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}

@keyframes zoom {
    0% {
        -webkit-transform: scale(1.2);
        transform:scale(1.2)
    }

    to {
        -webkit-transform: scale(1);
        transform:scale(1)
    }
}

/* this will override any other transforms, including the one for centering the slide image in the frame */



.entry-content table {
height: auto !important;
width: 100% !important;
margin-bottom: 2em;
}

.entry-content table td {
  padding: 5px 0;
}
.entry-content table td.product-delete {
  padding-left: 5px;
}
.entry-content table td.product-thumb,
.entry-content table td.product-name,
.entry-content table td.product-delete {
  text-align: left;
}
.entry-content table td.product-price,
.entry-content table td.product-subtotal {
  text-align: right;
}
.entry-content table td.product-quantity {
  text-align: right;
  padding-left: 20px;
}
.entry-content table td.product-quantity .control {
  display: inline-block;
  padding-left: 3px;
}
.entry-content table tr.total td,
.entry-content table tr.delivery td {
  text-align: right;
}
.entry-content table tr {
  border-bottom: 1px solid;
  border-top: 1px solid;
}
.entry-content table img {
  max-width: 75px;
}




/* 
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media only screen and (max-width: 760px) {
  /* Force table to not be like tables anymore */
  .entry-content table {
    display: block;
    /* Hide table headers (but not display: none;, for accessibility) */
    /*
    Label the data
    */
  }
  .entry-content table thead, .entry-content table tbody, .entry-content table th, .entry-content table td, .entry-content table tr {
    display: block;
  }
  .entry-content table thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  .entry-content table tbody tr:first-child {
  	position: absolute;
    top: -9999px;
    left: -9999px;
  }
  .entry-content table thead + tbody tr:first-child {
  	position: static;
    top: auto;
    left: auto;
  }
  .entry-content table tr {
    border: none;
    border-top: 1px solid;
    border-bottom: 1px solid;
    margin-bottom: -1px;
  }
  .entry-content table td {
    /* Behave  like a "row" */
    border: none;
    position: relative;
    padding-left: 0;
  }
  .entry-content table td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 6px;
    left: 0;
    width: 30%;
    padding-right: 10px;
    white-space: nowrap;
    text-align: left;
    
    color: black;
  }

  .entry-content table td:nth-of-type(2):before {
    content: "Small";
  }
  .entry-content table td:nth-of-type(3):before {
    content: "S/M";
  }
  .entry-content table td:nth-of-type(4):before {
    content: "M/L";
    /*line-height: 44px;
  }
  .entry-content table td:nth-of-type(4) {
    line-height: 44px;
    vertical-align: middle;*/
  }
  .entry-content table td:nth-of-type(5):before {
    content: "Large";
  }
  .entry-content table tr.delivery td:nth-of-type(3):before, .entry-content table tr.total td:nth-of-type(3):before {
    content: "";
  }
  
  .entry-content table tr {
    position: relative;
  }
  .entry-content table td.product-delete {
    position: absolute;
    top: 2px;
    right: 2px;
    padding: 0 !important;
  }
  .entry-content table .control {
    font-size: 22px;
  }
  .entry-content table td.product-name {
    padding-right: 48px !important;
    min-height: 2.2em;
  }
  .entry-content table td.product-quantity span {
    position: relative;
    top: -10px;
  }
  .entry-content table td {
	text-align: right;
	}
	.entry-content table td div {
		display: inline;
	}
	  .entry-content table td:nth-of-type(1) { /* Row heading */
  	text-align: left;
  	font-weight: 700;
  }
}

th {
	color: black;
}

@media only screen and (max-width: 760px) {
	.entry-content table.framegeometry td:before {
		content: attr(data-header);
	}
	.entry-content table.framegeometry td[data-header=row_label]:before {
		content: '';
	}
}

/****** Portfolio Overview ******/
a.portfolio-summary {
  display: inline-block;
  width: 33.333%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  
  padding: 0 5px;
  vertical-align: top;
  background: transparent;
  margin: 0 0 10px;
  
  text-decoration: none;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-backface-visibility: hidden;
  /* http://stackoverflow.com/questions/12980153/image-moves-on-hover-chrome-opacity-issue */
}

a.portfolio-summary h2, a.portfolio-summary h2 + p {
  font-size: 1em;
  line-height: 1.2;
  margin: 3px 0;
  margin: 0;
  background: transparent;
  padding: 6px 12px 9px;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
a.portfolio-summary h2 {
  height: 5em;
}
a.portfolio-summary img {
  
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-backface-visibility: hidden;
  
  -webkit-filter: brightness(1);
	-moz-filter: brightness(1);
	filter: brightness(1);


}
a.portfolio-summary:hover {
  text-decoration: none;
}
a.portfolio-summary:hover img {
  	-webkit-filter: brightness(0.8);
	-moz-filter: brightness(0.8);
	filter: brightness(0.8);
}
a.portfolio-summary:hover h2, a.portfolio-summary:hover h2 + p {
  text-decoration: none;
  
}
@media screen and (max-width: 790px) {
  a.portfolio-summary {
    width: 33.333%;
    font-size: 0.9em;
  }
}
@media screen and (max-width: 550px) {
  a.portfolio-summary {
    width: 50%;
    font-size: 0.9em;
}
}
@media screen and (max-width: 350px) {
  a.portfolio-summary {
    width: 100%;
    font-size: 0.8em;
}
}

div.portfolio-wrap {
  margin-left: -5px;
  margin-right: -5px;
  /* @media screen and (min-width: 1050px) {
  	width: 1050px;
  	margin: 0 -150px;
  } */
}

/* Home Widget Effects */
.md-modal {
  position: absolute;
  top: 0;
  left: 0;
}

.md-content {
  padding: 2.5em;
  box-sizing: border-box;
  text-align: left;
}

.md-perspective,
.md-perspective body {
  height: 100%;
  overflow: hidden;
}

.md-perspective body {
  background: #222;
  -webkit-perspective: 600px;
  -moz-perspective: 600px;
  perspective: 600px;
}

.container {
  background: #e74c3c;
  min-height: 100%;
}

.md-modal,
.textwidget {
  /*	position: fixed;
  	top: 50%;
  	left: 50%;*/
  /*	width: 50%;
  	max-width: 630px;
  	min-width: 320px;
  	height: auto;*/
  width: 100%;
  height: 100%;
  left: 0;
  top: 100px;
  height: auto;
  background: transparent;
  padding: 30px;
  z-index: 2000;
  visibility: hidden;
  /*	-webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  /*-webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);*/
}

@media only screen and (min-width: 680px) {
  .md-modal .leftbit {
    width: 48%;
    float: left;
  }

  .md-modal .rightbit {
    width: 48%;
    float: right;
  }
}
.md-show {
  visibility: visible;
}

.md-overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  visibility: hidden;
  top: 0;
  left: 0;
  z-index: 1000;
  opacity: 0;
  background: transparent;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

.md-show ~ .md-overlay {
  opacity: 0.7;
  visibility: visible;
  background: #59676f;
}

/* Content styles */
.md-content {
  margin: 0 auto;
  width: 100%;
  max-width: 960px;
  background: black;
  height: auto;
  box-sizing: border-box;
  padding: 1px 0 1em;
}

.md-content button {
  display: block;
  margin: 0 auto;
  font-size: 0.8em;
}

.md-content .cross {
  /*-webkit-appearance: none;
  -webkit-box-align: center;
  text-align: center;
  cursor: pointer;
  color: $logogrey;
  padding: 0;
  border: none;
  background: transparent;
  position: absolute;
  top: 6px;
  right: 32px;
  font-size: 0.8em;
  font-family: FontAwesome;
  
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em;
    
    text-decoration: inherit;
  display: block;
  speak: none;*/
  cursor: pointer;
  font-family: FontAwesome;
  font-size: 2em;
  display: block;
  float: right;
  text-align: right;
  margin-right: 5px;
  /*position: absolute;
  right: 30px;
  top: 30px;
  z-index: 2000;*/
}
.md-content .cross:hover,
.md-content a:hover {
  color: #ccc;
}

/*.cross:before {
  //content: "\f05c";
  content: "\f057";
  
  font-family: FontAwesome;
font-weight: normal;
font-style: normal;
text-decoration: inherit;
-webkit-font-smoothing: antialiased;
*margin-right: .3em;
  
  text-decoration: inherit;
display: block;
speak: none;

width: 100%;
height: 100%;

text-align: center;
font-size: 2.4em;
line-height: 1.7;
text-indent: 0;

z-index: 2000;

}*/
#modal img {
  
  display: block;
  margin: 0 auto;
  clear: both;
}

#modal h1 {
  color: white;
}

#modal form {
  max-width: 420px;
  margin: 0 auto;
  text-align: center;
}

/* Effect 9: 3D flip vertical */
.md-effect-9.md-modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}

.md-effect-9 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateX(-70deg);
  -moz-transform: rotateX(-70deg);
  -ms-transform: rotateX(-70deg);
  transform: rotateX(-70deg);
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
  opacity: 0;
}

.md-show.md-effect-9 .md-content {
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  transform: rotateX(0deg);
  opacity: 1;
}

/* Effect 16:  Blur */
.md-show.md-effect-16 ~ .md-overlay {
  background: rgba(20, 20, 20, 0.5);
  background: transparent;
}

.md-show.md-effect-16 ~ .container {
  -webkit-filter: blur(3px);
  -moz-filter: blur(3px);
  filter: blur(3px);
}

.md-effect-16 .md-content,
.textwidget .md-content {
  -webkit-transform: translateY(-5%);
  -moz-transform: translateY(-5%);
  -ms-transform: translateY(-5%);
  transform: translateY(-5%);
  opacity: 0;
}

.md-show.md-effect-16 ~ .container,
.md-effect-16 .md-content,
.textwidget .md-content {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

.md-show .md-content {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}

#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

#modal {
  position: absolute;
  padding: 8px;
}

#modalcontent {
  background: black;
  color: white;
  padding: 20px;
  border: 2px solid white;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  text-align: center;
}
#modalcontent div.wpcf7 img.ajax-loader {
  display: none !important;
}
#modalcontent div.wpcf7-mail-sent-ok,
#modalcontent div.wpcf7-validation-errors {
  border: none !important;
}
#modalcontent div.wpcf7-response-output {
  margin: 0 0.5em 0;
  color: #fef001 !important;
}

/*#close {
    //position:absolute;
    //background:url(close.png) 0 0 no-repeat;
    width:100px;
    height:100px;
    display:block;
    border: 1px solid red;
    //text-indent:-9999px;
    
}*/
.md-modal {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.button {
background-color: rgb(238, 238, 238);
border: 1px solid rgb(68, 68, 68);
border-radius: 0.2em;
color: rgb(34, 34, 34);
cursor: pointer;
display: inline-block;
margin: 0 0 5px;
padding: 0.2em 0.4em;
}

.entry-content h2.button {
margin: 0 0 5px;
}

.button:hover,
button:hover, 
input[type="button"]:hover, 
input[type="reset"]:hover, 
input[type="submit"]:hover {
color: rgb(238, 238, 238);
background-color: rgb(34, 34, 34);
border-color: rgb(34, 34, 34);
}

a.chevron {
display: block;
margin: 0 auto;
width: 34px;
height: 34px;
border-radius: 50%;
border: 1px solid #333;
text-align: center;
text-decoration: none;
position: relative;
z-index: 10000;
margin: -4em auto 4em;
}

a.chevron::before {
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
text-decoration: inherit;
-webkit-font-smoothing: antialiased;*
margin-right: .3em;
text-decoration: none;
display: block;
margin: 0 auto;
vertical-align: middle;
width: 1.2em;
height: 1.2em;
speak: none;
padding: 7px 5px 3px;
-webkit-border-radius: 50%;
border-radius: 50%;

content: "\f078";
font-size: 1.2em !important;
line-height: 0.9;
padding: 7px 9px 3px;
padding: 7px 5px 3px;
width: 0.9em;
height: 0.9em;
line-height: 1.3;
line-height: 1.2;
}

a.chevron:link,
a.chevron:visited {
color: white;
background: #888;
border-color: #888;
}

a.chevron:hover,
a.chevron:active {
color: #888;
background: white;
border-color: white;
}



hgroup.entry-title {
	margin: 100px 0;
}

.entry-content > img.size-windowwidth,
.entry-content > a > img.size-windowwidth,
.entry-content > img.size-contentwidth,
.entry-content > a > img.size-contentwidth,
.entry-content > img.size-extrawidth,
.entry-content > a > img.size-extrawidth {
	margin: 100px 0 !important;
}

div.gallery,
.picstrip {
	margin: 100px 0;
}

.entry-content {
	margin: 100px auto;
}

body, html, main {
	overflow-x: hidden !important;
	max-width: 100vw !important;
}

div.main,
main {
	overflow-x: hidden;
}



@media only screen and (min-width: 1156px) {

ul#menu-main-menu > li {
	position:relative;
}

ul#menu-main-menu ul.sub-menu {
	padding: 7px 0;
}

ul#menu-main-menu > li > ul.sub-menu {
	position: absolute;
	background: black;
	left: 50%;
	transform: translate( -50%, 0 );
}

ul#menu-main-menu a {
	display: block;
	text-align: center;
	white-space: nowrap;
}

ul#menu-main-menu ul.sub-menu a {
	margin: 12px;
	display: inline-block; /* shrink to fit for underline width */
}

ul#menu-main-menu ul.sub-menu li {
	display: block; /* stretch to ul for hover to reveal child */
}

ul#menu-main-menu > li > ul.sub-menu > li > ul.sub-menu {
	position: absolute;
	background: black;
	left: 100%;
	top: 0;
}

ul#menu-main-menu a:focus,
ul#menu-main-menu a:hover,
ul#menu-main-menu a:active {
	color: white;
	border-bottom: 2px solid white;
}

div.nav-menu ul li.current_page_item a, 
div.nav-menu ul li.current_page_parent a, 
div.nav-menu ul li.current_page_ancestor a, 
ul.nav-menu li.current-menu-item a, 
ul.nav-menu li.current-page-ancestor a {
	color: inherit;
	border-bottom: 2px solid transparent;
} /* reset old styles */

ul#menu-main-menu li.current-menu-item > a,
ul#menu-main-menu li.current-menu-ancestor > a,
ul#menu-main-menu li.current-menu-parent > a {
	color: white;
	border-bottom: 2px solid white;
}

ul#menu-main-menu ul.sub-menu {
	display: none;
}

ul#menu-main-menu li:hover > ul.sub-menu {
	display: block;
}

}


footer div.nav-menu ul a, footer ul.nav-menu a {
	font-size: 1em;
	
}

footer div.nav-menu ul, footer ul.nav-menu {
	margin-top: 0;
	padding-top: 0;
}

footer ul.nav-menu,
footer div.nav-menu ul,
footer div.nav-menu li {
	list-style: none;
}

footer div.nav-menu li,
footer ul.nav-menu li {
	border-top: none !important;
}




h1.entry-title,
footer h3 {
	text-align: center;
}






/* Speed up */

body.home div.cycle-slideshow {
height: 100vh;
width: 100vw;
overflow: hidden;
}


@media only screen and (min-width: 1040px) {
	.cycle-wrap {
		margin-top: 50px;
	}
}



img.header-image {
width: 100vw;
aspect-ratio: 3 / 1;
aspect-ratio: 16 / 9;
object-fit: cover;
height: auto;
}
@media only screen and (max-width: 799px) {
	img.header-image {
		aspect-ratio: 1 / 1;
	}
}

header.page-title {
	margin: 100px 0;

}

header.page-title h1 {
	font-size: 1.3em;
font-weight: 600;
text-align: center;
margin: 0 auto;
line-height: 1.1;
}

body.home header.page-title {
	
	margin: 100px auto;
	max-width: 1250px;
	box-sizing: border-box;
	padding: 0 20px;
}




body.home header.page-title h1 {
text-align: left;
text-transform: none;
font-size: 2em;
}

.header-image + header.page-title {
width: 100vw;
aspect-ratio: 16 / 9;
margin: 0;
margin-top: -33.333vw;
margin-top: -56.25vw;
position: relative;
}
@media only screen and (max-width: 799px) {
	.header-image + header.page-title {
		aspect-ratio: 1 / 1;
		margin-top: -100vw;
	}
}

.header-image + header.page-title h1 {
	color: white;
	font-size: 3em;
	position: absolute;
	bottom: 100px;
	width: 1210px;
	text-align: left;
	text-transform: none;
	padding-left: calc( 50vw - 605px );
}

@media only screen and (max-width: 1250px) {
	.header-image + header.page-title h1 {
		padding-left: 20px;
		width: 100%;
		box-sizing: border-box;
		bottom: 15%;
	}
}

header.page-title h2 {
	display: none;
}







body div.gallery figure:hover .gallery-icon img {
	opacity: 0.9;
}

div.gallery .gallery-item img {
	object-fit: cover;
	font-family: 'object-fit: cover;' /* IE fix */ 
	max-width: none;
	max-height: none;
	width: 100%;
	min-width: none;
	min-height: none;
	
}
div.gallery.aspect-square .gallery-item img {
	aspect-ratio: 1 / 1;
}
div.gallery.aspect-three-two .gallery-item img {
	aspect-ratio: 3 / 2;
}
div.gallery.aspect-two-three .gallery-item img {
	aspect-ratio: 2 / 3;
}


main:before, main:after { content: ""; display: table; }
main:after { clear: both; }
main { *zoom: 1; }


a.button:link,
a.button:visited,
a.button:focus,
.entry-content h2.button,
span.button,
button.button, 
input[type="button"], 
input[type="reset"], 
input[type="submit"] {
  white-space: nowrap;
  display: inline-block;
  
  text-decoration: none;
  font-size: 15px;
  line-height: 2;
  padding: 8px 28px;
  border-radius: 100px;
  background: black;
  color: white;
}

.button:hover,
.entry-content h2.button:hover,
.button:active,
.entry-content h2.button:active,
button.button:hover, 
span.button:hover,
input[type="button"]:hover, 
input[type="reset"]:hover, 
input[type="submit"]:hover {
	text-decoration: none;
	background: white;
  color: black;
}

.md-content button, 
.md-content input[type="button"], 
.md-content input[type="reset"], 
.md-content input[type="submit"] {
	text-decoration: none;
	background: white;
  color: black;
  border: white 1px solid;
  float: none;
}
.md-content button:hover, 
.md-content input[type="button"]:hover, 
.md-content input[type="reset"]:hover, 
.md-content input[type="submit"]:hover {
	text-decoration: none;
	background: black;
  color: white;
}

body .wpcf7-spinner {
	display: block;
}

form > p {
	margin: 0 0 3px 0;
	font-size: 16px;
}
.wpcf7-form-control-wrap {
	margin-bottom: 1em;
	display: block;
}

.entry-content h2.button {
	margin: 1em 0;
}




body.no-header-image header.banner {
	background: black;
}
body.no-header-image main {
padding-top: 59px;
}



.header-image + header.page-title h1,
header.page-title h1 {
	font-size: 55px;
}
@media only screen and (max-width: 600px) {
	.header-image + header.page-title h1,
	header.page-title h1 {
		font-size: 35px;
	}
}


body.home header.page-title {

	margin-bottom: 0.83em;
}
body.home .entry-content {
		margin-top: 0;
}

body.home header.page-title h1 { /* like an h2 */
	font-size: 55px;

}

.entry-content h2 {
	font-size: 1.6em; /* 33.28px */
	font-size: 38px;
	font-weight: 700;
}

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

body.home header.page-title h1 { /* like an h2 */
	font-size: 26px;

}

.entry-content h2 {
	font-size: 1.6em; /* 33.28px */
	font-size: 26px;
	font-weight: 700;
}

}


.header-image + header::before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 70%;
height: 100%;
display: block;
background: linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
}




/* New mobile nav */

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

body > header > nav {
padding: 0;
background-color: black;
position: fixed !important;
padding-bottom: 60px;
top: -100%;
bottom: auto;
height: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
left: 0;
right: 0;
z-index: 10000 !important;
transition: 0.3s;
}

body > header > nav ul.nav-menu {
padding: 66px 0 0;
}

body.admin-bar > header > nav {
	padding-top: 32px;
}



body > header > nav.open {
	top: 0;
}

body > header > nav .menu-toggle {
display: block;
cursor: pointer;
color: white;
width: 42px;
height: 42px;
font-size: 2em;
overflow: hidden;
margin: 2px 10px;
position: fixed;
top: 17px;
right: 0px;
padding: 0;
}

body.admin-bar > header > nav .menu-toggle {
	margin-top: 32px;
}


.sub-menu {
	position: relative;
	cursor: pointer;
}

.sub-menu li {
	display: none;
}

.sub-menu.visible li {
	display: block;
}


.sub-menu::before {
content: "\f054";
font-family: FontAwesome;
font-weight: 400;
-webkit-font-smoothing: antialiased;
display: inline-block;
speak: none;
display: block;

text-align: center;
font-size: 1.3em;
padding: 1em;
line-height: 1;



position: absolute;
right: 0;
top: 0;
transform: translateY(-100%);

left: 0;
text-align: right;
}
.sub-menu.visible::before {
	/*transform: translateY(-100%) rotate(90deg);*/
	content: "\f078";
}



body > header nav .menu-toggle span, body > header nav .menu-toggle span::before, body > header nav .menu-toggle span::after {
cursor: pointer;
border-radius: 1px;
height: 3px;
width: 21px;
background: #353535;
background: #eeeeee;
position: absolute;
display: block;
content: '';
}

body > header nav .menu-toggle span::before {
top: -6px;
}
body > header nav .menu-toggle span::after {
bottom: -6px;
}

body > header nav .menu-toggle span, body > header nav .menu-toggle span:before, body > header nav .menu-toggle span:after {
transition: all 250ms ease-in-out;
}

body > header nav .menu-toggle span, body > header nav .menu-toggle span::before, body > header nav .menu-toggle span::after {
height: 2px;
width: 30px;
}

body > header nav .menu-toggle span::before {
top: -10px;
}
body > header nav .menu-toggle span::after {
bottom: -8px;
}

body > header nav .menu-toggle.active span:before, body > header nav .menu-toggle.active span:after, body > header nav.open .menu-toggle span:before, body > header nav.open .menu-toggle span:after {
top: 0;
}

body > header nav .menu-toggle.active span:before, body > header nav.open .menu-toggle span:before {
transform: rotate(45deg);
}

body > header nav .menu-toggle.active span:after, body > header nav.open .menu-toggle span:after {
transform: rotate(-45deg);
}

body > header nav .menu-toggle span {
top: 12px;
left: 0;
text-indent: -9999em;
}

body > header nav .menu-toggle span, body.home > header nav .menu-toggle span, body > header nav .menu-toggle:hover span, body.home > header nav .menu-toggle:hover span {
background-color: transparent;
top: 14px;
}

body > header nav .menu-toggle.active span, body > header nav.open .menu-toggle span {
background-color: transparent;
}

.menu-toggle::before {
	display: none;
}

header.banner h1 a {

width: 250px;
}

}

@media screen and (max-width:782px) {
body.admin-bar > header > nav {
	padding-top: 46px;
}
body.admin-bar > header > nav .menu-toggle {
	margin-top: 46px;
}
}




@media only screen and (max-width: 1155px) {
header.banner h1 a {
margin: 0 auto 0;
}
}





a.chevron {
	display: none;
}







@media only screen and (min-width: 800px) {
#wpcf7-f120-p2511-o1 {
	width: 50%;
	float: left;
	margin-top: 50px;
}

#wpcf7-f120-p2511-o1 + img,
#wpcf7-f120-p2511-o1 + .wp-caption {
	width: 45%;
	float: right !important;
	margin: 0;
	margin-left: 5%;
	position: static;
	transform: none;
	margin-top: 50px;
}

}





body div.gallery {
margin-left: -10px;
margin-right: -10px;
text-align: center;
}

body div.gallery .gallery-item {
padding: 10px;
width: 50%;
display: inline-block;
/* display: block; */
}


body div.gallery figcaption {
width: calc( 100% - 52px );
bottom: 10px;
}

div.gallery.style-window.layout-three-column, div.gallery.style-windowwidth.layout-three-column {
	width: calc( 100vw + 60px );
	padding: 0;
}




/*
#modal form {
max-width: 100%;
margin: 0 auto;
text-align: left;

}
@media only screen and (min-width: 800px) {
#modal form {

column-count: 2;
}
}
#modal form > p {
	display: inline-block;
	width: 100%;
	font-size: 15px;
}
#modal form > p:nth-of-type(7) {
	break-before: column;
}
#modal input:not([type=submit]), 
#modal textarea {
	background-color: transparent;
	margin-bottom: 10px;
}
#modal .wpcf7-submit {
	float: right;
}
*/

#modalcontent {
background: white;
color: black;
padding: 30px 30px;
border: none;
border-radius: 11px;
text-align: left;
}

#modalcontent form {
max-width: 100%;
margin: 0 auto;
text-align: left;
}

#modalcontent h2 {
text-align: left;
font-size: 72px;
font-weight: bold;
line-height: 0.9;
margin: 0 0 50px;
}

#modalcontent > div {

	clear: right;
	font-size: 22px;
	line-height: 1.5;
}

.md-content .cross {
	right: 0;
}

#modalcontent > div.wpcf7 {

	margin-top: 20px;
}


@media only screen and (min-width: 660px) {
#modalcontent > div {
	width: 48%;
	float: left;
	clear: right;
	font-size: 22px;
	line-height: 1.5;
}
#modalcontent > div.wpcf7 {
	float: right;
	/*
	width: 38%;
	margin-right: 10%;
	*/
	margin-top: 0;
}
#modalcontent {
background: white;
color: black;
padding: 40px 80px;
border: none;
border-radius: 11px;
text-align: left;
}
.md-content .cross {

	right: -47px;
}
}

#modalcontent form p {
	font-size: 19px;
	font-weight: bold;
	margin: 0 0 3px 0;
}

#modalcontent input:not([type="submit"]), 
#modalcontent textarea {

font-size: 16px;

color: #222222;
text-shadow: none;
padding: 8px;
font-family: sans-serif;
margin-bottom: 16px;
border: 2px solid #bfbfbf;
border-radius: 6px;
margin-top: 1px;
background-color: white;
}

#modalcontent .wpcf7-form-control-wrap {
margin-bottom: 0;
}

#modalcontent:before, #modalcontent:after { content: ""; display: table; }
#modalcontent:after { clear: both; }
#modalcontent { *zoom: 1; }

.md-content button, 
.md-content input[type="button"], 
.md-content input[type="reset"], 
.md-content input[type="submit"] {
text-decoration: none;
background: black;
color: white;
border: black 1px solid;
float: none;

font-size: 16px;
line-height: 1;
padding: 10px 32px;
font-weight: bold;
}

.md-content button:hover, 
.md-content input[type="button"]:hover, 
.md-content input[type="reset"]:hover, 
.md-content input[type="submit"]:hover {
text-decoration: none;
background: white;
color: black;
border: black 1px solid;
float: none;
}

.md-content .cross {
	width: 30px;
	/* border: 1px solid red; */
	height: 30px;
	position: relative;
	
}

.md-content .cross::before, 
.md-content .cross::after {
	position: absolute;
	top: 13px;
}


.md-content .cross::before, 
.md-content .cross::after {
cursor: pointer;
border-radius: 1px;
height: 2px;
width: 30px;

background: black;

display: block;
content: '';
}




.md-content .cross::before {

transform: rotate(45deg);
}
.md-content .cross::after {

transform: rotate(-45deg);
}



#modalcontent div.wpcf7-response-output {
margin: 0 0.5em 0;
color: black !important;
border-color: black !important;
}



.profile-summary {
	overflow: hidden;
}

.profile-summary div {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	display: block;
}

.profile-summary img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	
	transform: scale(1);
	transition: transform 0.3s;
}

.profile-summary:hover img {

	transform: scale(1.05);
	transition: transform 0.3s;
}





header.page-title h1 {
	text-transform: none;
}


@media only screen and (min-width: 1156px) {
	.cycle-pager {
		left: 30px;
	}
	body.home div.cycle-slide div {
		padding-left: 30px;
	}
	
}

.gallery-detail .owl-carousel .owl-item .galleryrest h2 {
	text-align: center;
}