@charset "UTF-8";

/* CSS Document */

@font-face {
    font-family: 'din_alternatebold';
    src: url('din_alternate_bold-webfont.woff2') format('woff2'),
         url('din_alternate_bold-webfont.woff') format('woff'),
         url('DIN-Alternate-Bold.otf') format('otf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'din_alternateregular';
    src: url('din_alternate_regular-webfont.woff2') format('woff2'),
         url('din_alternate_regular-webfont.woff') format('woff'),
         url('DIN-Alternate-Regular.otf') format('otf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'din_alternatelight';
    src: url('din-lightalternate-webfont.woff2') format('woff2'),
         url('din-lightalternate-webfont.woff') format('woff'),
         url('DIN-LightAlternate.otf') format('otf');
    font-weight: normal;
    font-style: normal;
}

body {font-family: 'din_alternateregular',sans-serif; font-style: normal; font-weight: normal; font-size:15px; color:#707070; position: relative; }

#page { background: #fff; overflow: hidden; position: relative; }
#formShow {display:none}

.black-bg {background: #58585a;}
.grey-bg {background: #eeeeee;}

.holder { height: 88px; -webkit-transition: -webkit-height 0.4s ease; transition: height 0.4s ease; }
header { background: #fff; width: 100%; height: 88px; position: fixed; top: 0px; left: 0px; z-index: 1010; -webkit-transition: -webkit-opacity 0.4s ease; transition: opacity 0.4s ease; }
header img {width: auto}
.mm-opened header { opacity: 0; }
.mm-opened .holder { height: 0px; }
.log { position: fixed; top: 88px; left: 0; background: #fff; z-index: 1000; }
figure.logo { margin: 70px 0 0 0; text-align: center; -webkit-transition: -webkit-translate 0.1s ease; transition: translate 0.1s ease; }
figure.logo img { width: 100%; max-width: 203px; margin: 0 auto; display: inline-block; }
.mm-opened figure.logo { position: relative; margin: 0px; }

.item-title {cursor:pointer;}
div.item div {display:none;}
#tabs ul { list-style: none; margin: 0px; padding: 0px; }

/* Nav */

.intro {display: block; overflow:hidden; padding:30px;}
.intro h3 {color:#000000; font-size:31px; text-transform:uppercase}
.intro p {font-size:19px; color:#000000;}
.intro hr { height:1px; border-top: 1px #ddd solid; margin:10px 0 15px}
.int h1 { margin-bottom: 10px !important; }

.nav { list-style:none; margin:0; padding:0; height: 88px; }
.nav li {display: block; float:left; position:relative; width: 50%;}
.nav li a {display: block; text-align:center; text-decoration: none;}
.nav:hover { background: #222222; }
.nav li a.menu-btn {padding: 33px 0 33px 38px; position:relative}
.nav li a span {display: block;color:#fff; font-family:'din_alternatebold',sans-serif; font-size:16px; text-transform:uppercase; letter-spacing:3px; bottom:14px; padding: 35px 0 33px 0; }

.tag div { padding: 30px 0 0 0; color: #000000; font-family:'din_alternateregular',sans-serif; font-size:24px; text-transform: uppercase; text-align: center; letter-spacing: 2px; }
.sect { height: 88px; background-color: #86a76e; position: relative; overflow: hidden; }
.sect:before {background-image: url('/img/te-mara-bg-logo.png'); width: 100%; height: 100%; top:0px; opacity: 0.3; position: absolute; content:''; left:0; background-position: center center; background-repeat: no-repeat; background-size: 400px; z-index: 1; }
.sect a { display: block; padding: 35px 0 0 0; height: 58px; text-align: center;  color: #fff; font-family:'din_alternateregular',sans-serif; font-size:16px; text-transform: uppercase; text-decoration: none; letter-spacing: 3px; }
.sect:hover { background: #72925b; transition:all 0.4s ease-in-out; }
.sect > div { position: relative; z-index: 2; }

.text-link > a {color:#004186; text-align:center; font-weight:700; text-transform:uppercase; font-size:18px; letter-spacing:3px; text-decoration:none; padding:56px 0 57px; -webkit-font-smoothing: antialiased;}

.banner { margin: 0 auto 0 auto; position: relative; z-index: 1000; }
.banner p { font-family:'din_alternatelight',sans-serif; font-size:82px; text-transform: uppercase; color: #fff; position: absolute; top: 29%; left: 6%; }
.banner span { font-family:'din_alternatelight',sans-serif; font-size:24px; line-height: 30px; text-transform: uppercase; color: #fff; position: absolute; bottom: 10%; left: 6%; }
.instructions p {color:#fff; font-weight:400; font-size:15px; padding:30px 0}

.content {display: block; position:relative; }
.home { background: url(../img/te-mara-bg-logo.png) 40% -87px no-repeat; }
.content article { padding: 20% 0 20% 30%; }
.content article.int { padding: 10% 15% 10% 15%; }
.content h1 { -webkit-font-smoothing: antialiased; font-size: 23px; color: #000; line-height: 1.9; font-family: 'din_alternatebold',sans-serif; text-transform: uppercase; letter-spacing: 0.09em; margin: 0 0 30px 0; padding-right: 13%; }
.content p { font-family: 'din_alternateregular',sans-serif; font-size: 16px; line-height: 1.5; margin: 6px 0; padding: 6px 0; color: #4d4b4b; } 
.content p.col-6, .content p.col-12 { margin:0 0; padding:0 0; }
.content strong {font-family:'din_alternatebold',sans-serif;}
.content p a, .content ul li a {color:#000;}
.content h4 { font-family:'din_alternatebold',sans-serif; font-size:20px; color:#004186; padding:10px 0}

.midcol div { padding: 20% 25% 20% 0; }
.feature { background: #58585a; }
.feature span { font-family:'din_alternateregular',sans-serif; font-size:21px; line-height: 30px; text-transform: uppercase; color: #fff; padding: 16% 0 16% 15%; text-align: left; display: block; letter-spacing: 1px; }

.houseland div { padding: 20% 23% 15% 15%; }
.houseland div h3 {-webkit-font-smoothing: antialiased; font-size:30px; color:#000; line-height:35px; font-family:'din_alternatebold',sans-serif; text-transform: uppercase; letter-spacing: 5px; margin: 0 0 20px 0; }
.houseland h2 {color:#000; font-size:17px; line-height: 25px; font-family:'din_alternatebold',sans-serif; text-transform: uppercase; margin: 0 0 20px 0; }
.houseland p { font-family:'din_alternateregular',sans-serif; font-size: 18px; line-height: 1.9; margin:6px 0; padding:6px 0; color: #4d4b4b;}
.houseland a { display: block; }

.haere a { background: #000; }
.haere a { display: block; height: 281px; width: 100%; font-family:'din_alternatebold',sans-serif; text-transform: uppercase; font-size: 16px; color: #fff; text-decoration: none; text-align: center; transition: all 0.5s ease; position: relative; }
.haere a span { padding: 37% 0; display: block; }
.haere .linktahi a { background-color: #000; background-image: url(../img/location.jpg); background-position: top center; background-repeat: no-repeat; background-size: cover; }
.haere .linkrua a { background-color: #000; background-image: url(../img/sections.jpg); background-position: top center; background-repeat: no-repeat; background-size: cover; }
.haere .linktoru a { background-color: #000; background-image: url(../img/packages.jpg); background-position: top center; background-repeat: no-repeat; background-size: cover; }
.haere .linkwha a { background-color: #000; background-image: url(../img/luxury.jpg); background-position: top center; background-repeat: no-repeat; background-size: cover; }
.haere a:hover:after{ content:""; width:0; height:0; position: absolute; bottom: -20px; left: 50%; margin: 0 0 0 -10px; z-index: 1000; border-top:10px solid black; border-bottom:10px solid transparent; border-left:10px solid transparent; border-right:10px solid transparent; }
.haere a:hover { background-image: none; }

#map { height: 600px; margin: 0px; position: relative; width: 100%; }

.content h2 {color:#000; font-size:17px; line-height: 30px; font-family:'din_alternatebold',sans-serif; text-transform: uppercase; }
.content h3 {font-weight: 500; color:#02b8f8; font-size:19px; display:block; margin:40px 0 15px 0}

.button {background:#004186; display:inline-block; border-radius:30px; color:#fff !important; text-decoration:none; text-transform:uppercase; font-weight:500; font-size:13px; letter-spacing:1px; padding:7px 15px; margin:2px;}
.button:hover {background:#02b8f8}

@-webkit-keyframes rainbow {
  0% {border-color: hsl(196, 99%, 50%);}
  100% {border-color: hsl(196, 0%, 100%);}
}


.table td {padding: 7px 20px 7px 0 !important;}
.table {margin-top: 40px;}

footer {padding: 0 0; display:block; overflow:hidden}
footer div.black-bg {padding: 30px 0; line-height: 20px; }
footer div.grey-bg {padding: 30px 0 30px 0; line-height: 20px; }
footer div.grey-bg img { float: right; margin: 0 5% 0 0; }
footer a {color:#fff; text-decoration:none}
footer p { font-family:'din_alternateregular',sans-serif; font-size:12px; line-height: 20px; text-transform: uppercase; color:#fff; margin:0 0 0 0}
footer img {width: auto}/* Form Fields */
	
form input::-webkit-input-placeholder { color: #79716f !important; font-family: "proxima-nova", sans-serif; font-weight: 400; }
form input:-moz-placeholder { color: #79716f !important; font-family: "proxima-nova", sans-serif; font-weight: 400; }
form input::-moz-placeholder { color: #79716f !important; font-family: "proxima-nova", sans-serif; font-weight: 400; }
form input:-ms-input-placeholder { color: #79716f !important; font-family: "proxima-nova", sans-serif; font-weight: 400; }
form textarea::-webkit-input-placeholder { color: #79716f !important; font-family: "proxima-nova", sans-serif; font-weight: 400; }
form textarea:-moz-placeholder { color: #79716f !important; font-family: "proxima-nova", sans-serif; font-weight: 400; }
form textarea::-moz-placeholder { color: #79716f !important; font-family: "proxima-nova", sans-serif; font-weight: 400; }
form textarea:-ms-input-placeholder { color: #79716f !important; font-family:'din_alternateregular',sans-serif; }
form .col-6 input[type="text"] { background: #fff; border: 0; border: 3px solid #86a76e; color: #666; font-family:'din_alternateregular',sans-serif; font-size:14px; height: 20px; outline: none; display: block; text-indent: 20px; padding: 15px 0 15px 0; resize: none; width: 95%; }
form .col-12 input[type="email"] { background: #fff; border: 0; border: 3px solid #86a76e; color: #666; font-family:'din_alternateregular',sans-serif; font-size:14px; height: 20px; outline: none; display: block; text-indent: 20px; padding: 15px 0 15px 0; resize: none; width: 97%; }
form .col-6 input[type="text"].highlight_field, form .col-12 input[type="email"].highlight_field, form .col-12 textarea.highlight_field { border: 2px solid #E74C3C; color: #E74C3C; }
form p { margin: 0px; }
form label { padding: 5px 0 0 0; display: block; font-family:'din_alternatebold',sans-serif; font-size:14px; color: #86a76e; text-decoration: none; }
form textarea { background: #fff; border: 0; border: 3px solid #86a76e; color: #666; font-family:'din_alternateregular',sans-serif; font-size:14px; height: 130px; outline: none; display: block; text-indent: 20px; padding: 15px 0 15px 0; resize: none; width: 98%; }
#systemMessage p { background: #86a76e; color: #fff; padding: 15px 10px; text-align: center; text-decoration: none; font-family:'din_alternatebold',sans-serif; font-size:14px; border-radius: 5px; }
#play-button {width: 100%; left:0; right: 0; 0; margin: 0 auto; cursor: pointer; z-index: 99; }
/* Buttons */

.button-big { background: #86a76e; display: inline-block; color: #fff !important; font-family:'din_alternatebold',sans-serif; font-weight:normal; font-size: 16px; outline: 0; text-decoration: none; padding: 15px 25%; margin:40px 0 0 0; border: 3px #86a76e solid; text-transform: uppercase; text-align: center; }
#formButton.button-big { margin:10px 0 0 0;}
.button-big:hover { background:none; color: #86a76e !important; }

.gm-err-icon, .gm-style-cc { display: none !important; }
.mm-list > li > a.menuactive { background:#86a76e !important; color:#fff !important; }

.home-slider li { height: 850px; position: relative !important; overflow: hidden; }
.home-slider li p, .home-slider li span { z-index: 99; }
#play-button { position: absolute; min-width: 100%; min-height: 100%; z-index: 0; background-image:url('/img/banner-play.jpg'); background-position: center; background-size: cover; }
#videoContainer {position: absolute; width: 100%; height: 100%; top: 0; left: 0; bottom: 0; right: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; display: none;  }
#videoContainer iframe {  width: 100vw;  height: 56.25vw;   margin-top: -100px; }








/* RESPONSIVE */

@media only screen and (max-width: 1600px) {	
	.banner p { font-size:70px; }
	.banner span { font-size:24px; line-height: 30px; }
	.feature span { font-size: 18px; padding: 12% 0 12% 12%; }
	.content p { font-size: 17px; line-height:29px; }
	.tag div { padding: 30px 0 0 0; font-size:20px; }
	.haere a { height: 240px; }
	.content article.int { padding: 10% 10% 10% 3%; }
	.g-recaptcha { transform: scale(0.8); position: relative; margin-left: -32px; display: inline-block; }
	form .col-6 input { height: initial;min-height: 15px; }
	form .col-6 input[type="text"], form .col-12 input[type="email"] { padding: 10px 0; }
	#formButton.button-big { text-align: center; margin-top: 0; }
	figure.logo img { max-width: 180px; }
	.home-slider li { height: 850px; position: relative !important; overflow: hidden; }
	.home-slider li { height: 650px; }
	.banner p { top: 20%; }
}
@media only screen and (max-width: 1550px) {	
}
@media only screen and (max-width: 1450px) {
	.banner p { font-size:60px; }
	.banner span { font-size:22px; }
	.feature span { font-size: 17px; }
	.content h1 { font-size: 26px; color:#000; line-height:35px; margin: 0 0 20px 0; }
	.content p { font-size: 14px; line-height:23px; }
	.haere a { height: 220px; }
}
@media only screen and (max-width: 1380px) {
	.home-slider li { height: 590px; position: relative !important; overflow: hidden; }
}
@media only screen and (max-width: 1290px) {
	.banner p { font-size:50px; text-transform: uppercase; color: #fff; position: absolute; top: 15%; left: 10%; }
	.banner span { font-size:22px; }
	.content h1 { font-size: 22px; color:#000; line-height:30px; margin: 0 0 20px 0; }
	.content h2 { font-size: 14px; line-height: 25px; }
	.content p { font-size: 13px; line-height:20px; }
	.feature span { font-size: 14px; padding: 12% 0 12% 12%; }
	.button-big { display: block;  margin: 20px 0 0 0; }
	.tag div { padding: 30px 0 0 0; font-size:16px; }
	.haere a { height: 200px; }
	.houseland p { font-size: 14px; line-height: 25px; }
	.banner p { top: 21%; left: 5%; } 
	.home-slider li { height: 590px; position: relative !important; overflow: hidden; }

}

@media only screen and (max-width: 970px) {
	.banner p { font-size:30px; text-transform: uppercase; color: #fff; position: absolute; top: 15%; left: 10%; }
	.banner span { font-size:22px; }
	.content h1 { font-size: 16px; color:#000; line-height:25px; margin: 0 0 15px 0; }
	.content h2 { font-size: 13px; line-height: 20px; }
	.content p { font-size: 14px; line-height:15px; }
	.feature span { font-size: 12px; line-height: 20px; padding: 12% 0 12% 0; text-align: center; }
	.button-big { display: block;  padding: 15px 0; margin: 20px 0 0 0; }
	.tag div { padding: 34px 0 0 0; font-size:13px; }
	.sect a { font-size: 12px; }
	.haere a { height: 150px; font-size: 13px; }
	.midcol div {  padding: 12% 10% 15% 0px; }
	.content article { padding: 12% 5% 10% 5%; }
	figure.logo img { width: 80%; }
	footer div.grey-bg img { float: none; margin: 0 auto 0 auto; }
	.houseland p { font-size: 12px; line-height: 19px; }
	#map { height: 450px; }
	.houseland div h3 { font-size: 24px; line-height: 26px; margin: 0 0 14px 0; }
}

@media only screen and (max-width: 840px) {
	.nav li a span { font-size: 13px; }
}
@media only screen and (max-width: 820px) {
	.holder, .black-bg.col-1, .content h1 br, .content h2 br, .banner span br, .haere, .banner p br, .grey-bg.col-3 { display: none; }
	.nav li a span { text-align: right; padding: 35px 10% 33px 0; }
	figure.logo { margin: 30px 0 0 0; }
	header { position: relative; height: auto; }
	.log { position: relative; top: auto; left: auto; }
	.tag div { padding: 34px 0 34px 0; font-size: 13px; }
	.content article { padding: 4% 10% 0 10%; }
	.midcol div { padding: 4% 10% 4% 10%; }
	footer p { text-align: center; font-size: 11px; }
	.home-slider li { height: 390px; }
}
@media only screen and (max-width: 820px) {
	.banner span { display: none; }
}
@media only screen and (max-width: 480px) {
	.sect a { font-size: 18px; }
	.home { background: url(../img/te-mara-bg-logo.png) 44% 20px no-repeat; background-size: 119%; }
	.houseland div { padding: 14% 20% 15% 15%; }  
	.houseland p { font-size: 14px; line-height: 24px; } 
	.content article.int { padding: 10%; }
	form label { padding: 15px 0 6px 0; }
	.g-recaptcha { transform: scale(1); margin-left:0px; } 
	#formButton.button-big { padding:15px 25%; margin-top: 10px; }   
	.banner p { font-size: 29px; line-height: 1.1; }
	.home-slider li { height: 290px; } 
	.banner p { font-size: 21px; }
	#videoContainer iframe { margin-top: 0px; }
} 
@media only screen and (max-width: 320px) {
	.home-slider li { height: 200px; } 
}