@charset "utf-8";

* { box-sizing:border-box; }
html,body { margin:0; height:100%; width:100%; position:relative; top:0; left:0; overflow:hidden;  font-family: 'Quicksand';}
a { text-decoration:none; color:#aaa }
.wrapper { position:absolute; top:40px; left:40px; right:40px; bottom:40px; overflow: hidden;}


header { position:absolute; left:0; top:0; right:0; z-index:2;}
header .lg { font-size:3.6em; font-family: 'GFS Didot', serif; float:left }
header .lg span { color: #d8a462; }
header nav {
  float: right;
  position: relative;
  top: 26px;
}
header nav a { display:inline-block; text-transform:uppercase;  padding-left:12px; margin-left:12px; border-left:1px solid #eee; float:left; color:#000;  }
header nav a:first-child { border:0; padding:0; margin:0; }
header nav a.on { font-weight:bold; }

section { position:absolute; top:72px; left:0; right:0; bottom:0; }

.column { position:absolute; top:0; bottom:0;}
.g20 { width:20%; }
.g30 { width:30%; }
.g70 { width:70%; }
.g80 { width:80%; }

.leftside { left:0; }
.rightside { right:0; }

.pr40 { padding-right:40px;}

.bgfond { position:absolute; top:0; left:0; right:0; bottom:0;background-position:center; background-repeat:no-repeat; background-size:cover }

.slider { position:absolute; top:0;left:0; right:0; bottom:0; overflow:hidden;}
.slider div { position:absolute; top:0;background-position:center; background-repeat:no-repeat; background-size:cover }

.bar_text { position:relative; z-index:10;   margin-top: 100px;}
.bar_text span { padding:2px 8px; font-family: 'Quicksand'; font-size:2em;line-height: 1.36em; text-transform:uppercase; color:#FFF; background:#000 }

.gallery { overflow:auto; height:100% }
.gallery .thumbnail { float:left; position:relative; }
.gallery .thumbnail div{position:absolute; top:20px; left:20px; right:0; bottom:0;background-position:center; background-repeat:no-repeat; background-size:cover}

form { margin-top:20px;}
form input,form textarea {
  width: 100%;
  padding: 10px 0;
  text-indent: 10px;
  border: 0;
  background: #FFF;
  border-bottom: 1px solid #ccc;
  margin-bottom: 4px;
  resize:none;
  font-family: 'Quicksand';
  text-transform:uppercase;
  font-size: 1em;
  -webkit-appearance:none;
  border-radius:0;
  -webkit-appearance:none;
}
form textarea { height:100px;}
form input[type=submit] {
  background: #000;
  color: #fff;
  width: auto;
  padding: 10px;
  text-indent: inherit;
  float: right;
  margin-bottom: 0;
}
input[type="checkbox"] {
    display:none;
}
input[type="checkbox"] + label span {
    display:inline-block;
    width:19px;
    height:19px;
    vertical-align:middle;
    background:#fff;
	border:1px solid #aaa;
	border-radius:200px;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
    cursor:pointer;
	margin-right:6px;
}
input[type="checkbox"]:checked + label span {
	position:relative;
	-webkit-animation-name: rubberBand;
  	animation-name: rubberBand;
}
input[type="checkbox"]:checked + label span:after {
    position:absolute;
	top:6px; left:6px; right:6px; bottom:6px; background:#8dd7d8;
	content:"";
	border-radius:200px;
	
}


footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  background-color: #fff;
  padding-top: 10px;
}

.clear { clear:both; float:none; }

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

	html, body { height:auto; }
	html{padding: 20px;}
	body {
	  font-size: 0.8em;
	}
	
	.wrapper {
	  overflow: auto;
	  top: inherit;
	  left: inherit;
	  right: inherit;
	  bottom: inherit;
	  position: relative;
	}
	header,section,footer { position:relative; }
	
	header .lg,header nav { float:none; }
	header nav { top:0;}
	
	section {top: 0;min-height: 403px;}
	
	.column { position:relative; }
	
	.g30,.g70,.g20,.g80 { width:100%}
	
	.gallery .thumbnail div { top:5px; left:5px;right:5px; bottom:5px;}
	
	.bar_text { margin-top:40px; }
	
	.pr40 { padding:0;}
	
	header nav a {  padding-left: 6px;margin-left: 6px;}
	form input[type=submit] { width:100%; margin-top:20px;}
	
}