/* CSS by dyersmith-frey.com */

/* Reset Styles
***********************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q demo
blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
strong {font-weight: bold;}
em {font-style: italic;}
img {border: 0px; vertical-align: bottom;}


/* start general styles */
html { overflow-y: scroll; }

body {
	background: #fff; 
	font-family: 'Bodoni MT W01',Times,serif;
	-webkit-font-smoothing: antialiased; 
	text-rendering: optimizeLegibility;
	height: auto;
	color:#000;
	}
	
p {font-size: 16px; line-height: 19px; margin-top:10px;}
.small {font-size:11px;}

h1 {font-family:'Transport W01 Bold D',Arial,sans-serif; font-size:20px; font-weight:300; color:#000; margin:0px; padding:0px; line-height:20px; letter-spacing:-0.02em;}
h2 {font-size:20px; font-weight:300; color:#5ba674; margin:0px; padding:0px; line-height:24px;}
h3 {font-family:'Transport W01 Bold D',Arial,sans-serif; font-size:20px; font-weight:300; color:#000; margin:0px; padding:0px; line-height:20px; letter-spacing:-0.02em; display:inline;}

.trans {-webkit-transition:all 0.4s ease 0s; transition:all 0.4s ease 0s; -moz-transition:all 0.4s ease 0s; -o-transition:all 0.4s ease 0s; -ms-transition:all 0.4s ease 0s;}
.trans:hover {-webkit-transition:all 0.4s ease 0s; transition:all 0.4s ease 0s; -moz-transition:all 0.4s ease 0s; -o-transition:all 0.4s ease 0s; -ms-transition:all 0.4s ease 0s;}

/* end general styles */

/* start link styles */
a:link, a:visited {
	color:#313131;
	font-style:normal;
	text-decoration:none;
	}
a:hover {
	text-decoration:underline;
	}
	
/* end link styles */


/* start sitebuild styles */
#bg { position: fixed; top: 0; left: 0; }
.bgwidth { width: 100%; }
.bgheight { height: 100%; }

#container {padding:10px 10px 30px; margin:30px 0 30px 30px; z-index:1; position:relative; max-width:1140px;}

#logo {max-width:443px; margin:10px 0 10px 20px;}
#logo img {max-width:100%;}

#logofooter {max-width:106px; margin:10px 0 10px 20px;}
#logofooter img {max-width:100%;}

#langnavi {position:absolute; top:24px; right:30px; text-align:right; font-family:'Transport W01 Bold D',Arial,sans-serif; line-height:22px; color:#000;}
#langnavi a {color:#000;} #langnavi a:hover {text-decoration:underline;}
#langnavi a.active {text-decoration:underline;}

/* header */
#header {height:145px; padding:0px; font-size:24px; color:#333; font-weight:300;}
#headerleft {width:100px;; height:145px; float:left; text-align:left;}
#headerright {position:relative; height:145px; margin-left:105px; text-align:right;}

#langtop {position:absolute; width:50px; right:5px; font-size:12px;}
#langtop a, #langtop a:hover {color:#808080; text-decoration:none;}
#langtop a.active {color:#5ba674; text-decoration:none;}

#claimtop {position:absolute; width:300px; height:40px; right:5px; top:90px;}
#claimtopmobile {position:absolute; width:165px; height:20px; right:5px; top:108px;}

#headerimgwrapper {height:305px;}
#headerimg {padding:0px; z-index:1;}
#headerimg img {width:100%;}


/* navigation */
#navigationwrapper {height:64px;}
#navigation, #navigationmobile {position:relative; height:64px; padding-top:0px; background:url(../img/bg_navi.gif) repeat-x; z-index:7;}
#navigation li, #navigationmobile li {margin: 20px 23px 0 0; font-size:14px; float:left;}
#navigation li a, #navigationmobile li a {color:#808080; text-decoration:none; font-weight:300;}
#navigation li a:hover, #navigation li a.active, #navigationmobile li a:hover, #navigationmobile li a.active {color:#000; text-decoration:none; font-weight:300;}
#navigation li a.active, #navigationmobile li a.active {cursor: default; }

/* content */
#contentwrapper {position:relative; padding:20px 0; margin:0px -7px; background:#FFF; z-index:5;}
.textwrapper {padding:0 7px 20px;}


	
#copyright {text-align:center; font-size:12px; padding:30px 0;}


/* home */
.masoncontainer {width:100%; z-index:4; margin-left:-10px;}	
.box {
	margin:10px;
	float:left;
	background-color:#fff;
	width:340px;
	padding:10px;
	}
.boxtext {padding:0 8px 12px;}
.boxtextbottom {padding:10px 10px 0px; position:relative;}
.boxtextbottom p a {text-decoration:underline;}
.box img {width:100%;}
.box p {margin:3px 0 0 0;}
.box a.box a:hover {font-size:16px; font-weight:300; color:#000; margin:0px; padding:0px; text-decoration:none;}
.box a:hover {text-decoration:underline;}

#boxaddress {background:none; font-family:'Transport W01 Bold D',Arial,sans-serif; line-height:22px; color:#000;}
#boxaddress a {color:#000;} #boxaddress a:hover {text-decoration:underline;}
#boxaddress img {max-width:106px; padding:20px 0 0 0;}
.boxtextaddress {padding:0;}

.momcontainer {max-width:720px; z-index:4; margin-left:-10px;}	
.mombox {
	margin:10px;
	float:left;
	background-color:#fff;
	max-width:700px;
	padding:10px;
	}
.mombox2 {
	margin:10px;
	float:left;
	background-color:#fff;
	max-width:1040px;
	padding:10px;
	}
.momboxtitle {padding:5px 10px 15px;}
.mombutton {padding:10px 10px 0px; text-align:right; margin-top:-100px;} .mombutton img {width:130px;}

#socialwrapper {display:none;}
.socialbox {width:32px; height:32px; overflow:hidden; margin:7px 10px 0 0; background:#F00; float:left;}
.socialbox img {height:32px; width:64px;}
.socialbox img:hover {height:32px; width:64px; margin-left:-32px;}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top:0px;
	margin:0;
	height:0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}	

#surfbox {width:320px;}

.thumbwrapper {margin:0;}
.galleryimg {width:60px; height:60px; float:left; margin:6px 6px 0 0; overflow:hidden;}
.boximgq {width:60px;}
.boximg {height:60px;}

.socialblog {font-size:11px; margin:6px 0 0 0; padding:0 0 8px 0; line-height:18px;}

#instabox {min-height:230px;}
#instalink {position:absolute; width:340px; height:230px; z-index:99;}
#instalink:hover {background:#FFF; opacity:0.5;}

#instagram {background:rgba(0,0,0,0); box-sizing:border-box; min-height:340px; display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;}
#instagram:hover a{opacity:.5}
#instagram a{padding:1%; -webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-flex-basis:calc(94%/3);-ms-flex-preferred-size:calc(94%/3);flex-basis:calc(94%/3);line-height:0;-webkit-transition:opacity .2s ease-in-out;transition:opacity .2s ease-in-out;}
#instagram a:hover{opacity:1}
#instagram img{width:100%;}

#aboutwrapper {display:none; padding:10px 0 0 0;}
	
/* --Mobile */
#mobile {display:none;}

/* Newsletter Form */
fieldset {margin-top:10px; font-family: 'Bodoni MT W01',Times,serif; font-size: 16px; line-height: 20px; font-weight:400; border:0; padding:0;}
label {display:block;}
input {border:1px solid #999; margin:1px 0 6px; padding:6px; width:300px;}
.btn {width:105px; display:block; border:0; color:#000; margin-top:6px; font-family: 'Bodoni MT W01',Times,serif; font-size:16px;}
.btn:hover {background:#CCC; border:0; color:#000;}
#response {color:#f30; font-style:italic;}

/* Image Overlay */
.tintimg {display:block;}
.tint {
    position: relative;
    cursor: pointer;
    -webkit-shadow: rgba(0,0,0,.2) ;
    -moz-shadow: rgba(0,0,0,.2);
    box-shadow: rgba(0,0,0,.2) ;
  }
.tint:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -moz-transition: all .2s linear;
    -webkit-transition: all .2s linear;
    -ms-transition: all .2s linear;
    -o-transition: all .2s linear;
    transition: all .2s linear;
  }
.tint:hover:before {background: rgba(255,255,255, 0.5);}

/* Form Styles */



/* --Clearfix */
.cf:before,
.cf:after {content:""; display:table;}
.cf:after {clear:both;}
.cf {zoom:1;}
.clear {clear:both;}


/* Start Signature Styles */
#dyersmithfrey-signature {
	position:fixed;
	width:15px;
	height:15px;
	right:2px;
	bottom:1px;
	z-index:1000;
	}
/* End Signature Styles */


/* Media Queries
***********************/

@media screen and (max-width: 1200px) {
	#container {margin:30px 26px 30px 10px;}
 	.masoncontainer {width:100%; z-index:4; margin-left:-10px;}	
	.box {
		margin:8px;
		float:left;
		background-color:#fff;
		width:294px;
		padding:10px;
		}
	.boxtext {padding:0 8px 12px;}
	.boxtextbottom {padding:10px 10px 0px;}
	.box img {width:100%;}
	.box p {margin:3px 0 0 0;}
	
	.socialbox img {height:32px; width:64px;}
	.socialbox img:hover {height:32px; width:64px; margin-left:-32px;}
	
	#instabox {min-height:200px;}
	#instalink {position:absolute; width:294px; height:200px; z-index:99;}
	
	input {width:230px;}
	
	#surfbox {width:274px;}
}

@media screen and (max-width: 750px) {
	.mombutton {padding:0px 10px 0px; text-align:right; margin-top:0px;} .mombutton img {width:100px;}
}

@media screen and (max-width: 672px) {
	#mobile {display:inherit;}
	
	#langnavi {position:relative; top:0px; right:0px; text-align:right; margin:-20px 0 20px; font-family:'Transport W01 Bold D',Arial,sans-serif; line-height:22px; color:#000;}
	
	#container {margin:30px 26px 30px 10px;}
 	.masoncontainer {width:100%; z-index:4; margin-left:-10px;}	
	.box {
		margin:8px;
		float:none;
		background-color:#fff;
		width:100%;
		padding:10px;
		}
	.boxtext {padding:0 8px 12px;}
	.boxtextbottom {padding:10px 10px 0px;}
	.box img {width:100%;}
	.box p {margin:3px 0 0 0;}
	.box a, .box a:hover {font-size:16px; font-weight:300; color:#000; margin:0px; padding:0px; text-decoration:none;}
	
	.socialbox img {height:32px; width:64px;}
	.socialbox img:hover {height:32px; width:64px; margin-left:-32px;}
	.socialblog {font-size:11px; margin:6px 0 0 0; padding:0 0 8px 0; line-height:18px;}
	
	#surfbox {width:100%;}
	
	#instabox {min-height:200px;}
	#instalink {position:absolute; width:97%; height:200px; z-index:99;}
	
	#dyersmithfrey-signature {display:none;}
}