﻿@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400');
@font-face {
    font-family: Helvetica-Condensed;
    src: url(/fonts/Helvetica-Condensed.otf);
}
@font-face {
    font-family: Helvetica-Condensed-Light;
    src: url(/fonts/Helvetica-Condensed-Light.otf);
}

@font-face {
    font-family: Helvetica-Condensed-Bold;
    src: url(/fonts/Helvetica-Condensed-Bold.otf);
}
/* CSS Document */

/* --------------------
		Reset Styles
-------------------- */

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, a, em, img, q, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}

html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

input {
  border-radius: 0;
  -webkit-border-radius:0px;
  -webkit-appearance: none;
  @include border-radius(0);
}

@font-face {
  font-family: 'Helvetica-Condensed';
  src: url('../../fonts/Helvetica-Condensed.woff') format('woff'),
       url('../../fonts/Helvetica-Condensed.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Helvetica-Condensed-Light';
  src: url('../../fonts/Helvetica-Condensed-Light.woff') format('woff'),
       url('../../fonts/Helvetica-Condensed-Light.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Helvetica-Light';
  src: url('../../fonts/Helvetica-Light.woff') format('woff'),
	   url('../../fonts/helvetica-light.woff2') format('woff2'),
       url('../../fonts/Helvetica-Light.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Helvetica-Condensed-Bold';
  src: url('../../fonts/Helvetica-Condensed-Bold.woff') format('woff'),
       url('../../fonts/Helvetica-Condensed-Bold.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* --------------------
		Standard Styles
-------------------- */

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;	
}

ol, ul {
	list-style-position: inside;
}

a {
	text-decoration: none;
	cursor: pointer;
}

a:hover {
	text-decoration: underline;
}

strong {
	font-weight: bold;	
}

.strong {
    font-family: Helvetica-Condensed-Bold, sans-serif;
}

.italic {
    font-style: italic;
}

em {
	font-style: italic;	
}

p {
	padding-bottom: 1em;	
}

.clear {
	clear: both;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

.aligncenter {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

strong {
	font-family: 'Helvetica-Condensed-Bold';
	font-weight: normal;
}

/* --------------------
		Main Styles
-------------------- */

html, body {
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
	height: 100%;
}

html, body {
	overflow: auto;
	background-image: url(images/bg.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.wrapper {
	margin: 0 auto;
}

.main .content {
	position: fixed;
	z-index: 100;
	top: 0;
	right: 0;
	bottom: 0;
	width: 30%;
	overflow: auto;
	max-width: 100%;
	min-height: 100%;
	background-color: rgba(0, 0, 0, 0.8);
	padding-top: 9vh;
	text-align: center;
}

.inner .main .content {
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	bottom: auto;
	width: auto;
	min-height: auto;
	background: none;
	padding: 0;
	text-align: left;
}

.inner .main:before {
	content: '#OWNTHEZONE';
	color: #404042;
	font-family: 'Helvetica-Condensed-Bold';
	font-style: italic;
	font-size: 3vh;
	position: absolute;
	bottom: -4.5vh;
	right: 4px;
	line-height: 3vh;
}

.inner .main.hasRightbar .content {
	float: left;
	width: 70%;
	text-align: justify;
}

.inner .main  {
	left: 15vw;
	width: 70vw;
	right: auto;
	bottom: auto;
	top: 28vh;
	background-color: rgba(255, 255, 255, 0.9);
	height: auto;
	min-height: 0;
	padding: 7vh 7.5vh;
	text-align: left;
	font-family: 'Helvetica-Light';
	font-size: 1.6vh;
	position: relative;
}

.ios-fix .main  {
	width: 70vw;
    margin: auto;
}

.inner .main:after {
	content: '';
	clear: both;
	display: block;
}

.inner .main .content h1 {
	font-family: 'Helvetica-Condensed-Bold';
	font-style: italic;
	font-size: 4vh;
	padding-bottom: 3vh;
	color: #000;
}

.inner .rightbar {
	float: right;
	width: 25%;
	position: relative;
	overflow: hidden;
}

.rightbar * {
	max-width: 100%;
}

.main .logo {
	height: 10.6vh;
	display: inline-block;
	margin-bottom: 4vh;
}

.main .logo img {
	max-width: 100%;
	max-height: 100%;
}

.header {
	position: fixed;
	z-index: 111;
	top: 5.5vh;
	left: 5.5vh;
}

.inner .header {
	width: 100%;
	height: 13.5vh;
	padding: 5.5vh 0 0 5.5vh;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
}

.header .logo {
	background-image: url(images/logo.png);
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 15vw;
	height: 60%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.header li {
	list-style: none;
	float: left;
	padding-right: 3vh;
	position: relative;
	vertical-align: top;
	height: 2.5vh;
}

.header a {
	font-size: 1.85vh;
	line-height: 2vh;
	float: left;
	color: #fcfcff;
	text-transform: uppercase;
	position: relative;
	font-family: 'Helvetica-Condensed';
}

.header ul li:hover a {
	text-decoration: none;
}

.header ul li:hover a:before {
	content: '';
	width: 100%;
	height: 3px;
	background-color: #2EF021;
	position: absolute;
	top: 2.3vh;
	left: 0;
}

.header li ul {
	display: none;
	position: absolute;
	top: 2.5vh;
	left: 0;
	padding: 3vh 3.5vh;
	background-color: #1B1B1B;
}

.header li:hover ul {
	display: block;
}

.header ul li ul li {
	line-height: 2vh;
	height: 3vh;
	padding: 0.5vh 0;
}

.header ul li ul li a {
	white-space: nowrap;
	color: #8C8C8D;
	line-height: 2vh;
}

.header ul li ul li a:before {
	display: none !important;
}

.header ul li ul li a:hover {
	color: #fff;
}

.header .social {
	float: right;
	padding-right: 2vw;
}

.social a {
	display: inline-block;
	width: 20px;
	vertical-align: middle;
	height: 20px;
	margin: 0 10px;
}

.social .fb {
	background-image: url(images/fb.png);
}

.social .tw {
	background-image: url(images/tw.png);
}

.social .in {
	background-image: url(images/in.png);
}

.social a:hover {
	background-position: 0 -20px;
}

.footer {
	font-family: 'Helvetica-Condensed-Light';
	clear: both;
	text-align: center;
	font-size: 1.5vh;
	line-height: 1.7vh;
	color: #9b9b9b;
	text-transform: uppercase;
	position: absolute;
	bottom: 15vh;
	left: 0;
	width: 100%;
	padding: 0 10px;
}

h1 {
	font-family: 'Helvetica-Condensed-Bold';
	color: #fff;
	font-size: 4vh;
	margin: 0;
	padding: 0;
	text-transform: uppercase;
}

h2 {
	font-family: 'Helvetica-Condensed-Bold';
	font-weight: normal;
	font-size: 3.4vh;
	font-style: italic;
	color: #9b9b9b;
}

h3 {
	font-family: 'Helvetica-Condensed';
	font-weight: normal;
	font-size: 1.7vh;
	color: #9b9b9b;
}

h4 {
	font-family: 'Helvetica-Condensed-Bold';
	color: #fff;
	font-size: 2.2vh;
	margin: 0;
	padding: 0 0 1.5vh;
	text-transform: uppercase;
	color: #000;
	font-style: italic;
}

div.select {
	padding: 11vh 0 0 0;
}

div.select a {
	display: block;
	width: 8.75vw;
	height: 5vh;
	font-family: 'Helvetica-Condensed-Light';
	text-align: center;
	line-height: 5vh;
	border-radius: 3px;
	color: #fff;
	font-size: 2.3vh;
	margin: 0 auto 3vh auto;
	background-color: #8c8c8c;
}

div.select a:hover {
	text-decoration: none;
	background-color: #2ada1e;
}

.content form {
	display: block;
	padding: 9vh 0 7vh 0;
	margin: 0 auto;
	width: 16.66vw;
}

.line {
	clear: both;
	text-align: center;
	padding-bottom: 2.5vh;
	color: #9b9b9b;
	font-size: 1.8vh;
	font-family: 'Helvetica-Condensed-Light';
}

.line a {
	color: #9b9b9b;
}

form input {
	border: none;
	border-bottom: 1px solid #fff;
	background: none;
	padding: 0 1vh 0 5vh;
	height: 5vh;
	width: 100%;
	font-size: 1.8vh;
	color: #fff;
	font-family: 'Roboto', sans-serif;
	outline: none;
}

::-webkit-input-placeholder { opacity: 1; color: #fff; }
::-moz-placeholder { opacity: 1; color: #fff; }
:-ms-input-placeholder { opacity: 1; color: #fff; }
:-moz-placeholder { opacity: 1; color: #fff; }

input.icon-email {
	background-image: url(images/icon-email.png);
	background-size: auto 50%;
	background-position: 1vh center;
	background-repeat: no-repeat;
}

input.icon-password {
	background-image: url(images/icon-password.png);
	background-size: auto 50%;
	background-position: 1vh center;
	background-repeat: no-repeat;
}

.button, input[type="submit"] {
	width: 8vw;
	height: 4.2vh;
	display: inline-block;
	line-height: 4.2vh;
	border-radius: 3px;
	background-color: #8c8c8c;
	font-size: 1.8vh;
	color: #fff !important;
	text-align: center;
	font-family: 'Helvetica-Condensed';
	border: none;
	padding: 0;
	cursor: pointer;
	margin: 2.3vh 0 -1vh 0;
}

.button:hover, input[type="submit"] {
	background-color: #2ada1e;
	text-decoration: none;
}

table {
	font-size: 2vh;
}

table.partners td {
	text-align: center;
	padding-bottom: 3vh;
}

table td img {
	max-width: 100%;
	max-height: 100%;
}

table.partners td img {
	max-width: 150px;
}

hr {
	border: none;
	border-top: 1px solid #d6d6d6;
	margin: 2.5vh 0 2.8vh 0;
}

.info {
	float: left;
	width: 30%;
}

.content a {
	color: #000;
}

.content form a {
	color: #fff;
}

.content ul li {
	list-style: none;
	display: block;
	position: relative;
}

.validation-summary-errors ul li {
    color: #c00;
    font-family: 'Nunito', sans-serif;
    font-weight: 300;
}

/*.content ul li:before {
	content: "вЂ“";
	margin-right: 5px;
}*/

.content > * {
	z-index: 50;
}

.content .footer {
	z-index: 49;
}

#contact-details-container {
    display: flex;
    flex-direction: column;
    font-family: Helvetica-Condensed, sans-serif;
}

.contacts-container {
    display: flex;
    flex-direction: row;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -o-justify-content: space-between;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.single-contact {
    display: flex;
    flex-direction: column;
    -ms-flex-basis: 30%;
    -o-flex-basis: 30%;
    -webkit-flex-basis: 30%;
    flex-basis: 30%;
}

.single-contact > a {
    cursor: pointer;
}

.single-contact > span {
    padding-bottom: 1vh;
    font-size: 2vh;
}

.single-contact > p, a {
    font-size: 1.7vh;
}

.sm-link {
    padding-bottom: 1.5vh;
}

@media only screen and (max-width: 960px) {
	table.partners, table.partners tbody, table.partners tr, table.partners td { display: block; }
	table.partners td { float: left; width: 33.33%; padding-left: 20px; padding-right: 20px; }
}

@media only screen and (max-width: 600px) {
	table.partners td  { text-align: center; width: 100%; }
}

@media only screen and (max-width: 500px) {
	.header { position: absolute; top: 0; left: 0; width: 100%; z-index:3333; }
	.mobile-nav-trigger { background-image: url(images/burger.png); width: 16.66vw; height: 16.66vw; position: absolute; top: 5vh; left: 0; z-index: 3333; cursor: pointer; background-size: contain; max-width: 10vh; max-height: 10vh; }
	.navigation  ul { display: none; }
	.navigation.opened { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-image: url(images/mobile-nav-bg.jpg); background-size: cover; background-position: center center; z-index: 2222; }
	/*.navigation.opened:before { content: ''; position: absolute; left: 50%; webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); background-image: url(images/logo.png); width: 176px; height: 110px; top: 60px; } */
	.navigation.opened .mobile-nav-trigger { background-image: url(images/burger-close.png); }
	.navigation.opened ul { display: block; position: absolute; top: 30vh; left: 0; width: 100%; }
	.navigation.opened ul li { margin: 0.4vh 0; padding: 0.3vh 0; height: auto !important; clear: both; width: 100%; text-align: center; }
	.navigation.opened ul li a { font-size: 4vh; float: none; display: inline-block; line-height: 4vh; height: 4vh; padding: 0 3vh; position: relative; text-decoration: none !important; }
	.navigation.opened ul li ul li { padding: 1vh 0; margin: 0; }
	.navigation.opened ul li ul li a { font-size: 2.5vh; line-height: 2.5vh; height: 2.5vh; }
	.navigation.opened ul li.selected a:before { content: ''; position: absolute; width: 100%; left: 0; top: 3.7vh; height: 0.5vh; background-color: #2bdc21; }
	body { background-image: url(images/mobile-bg.png); background-color: #000; }
	.header ul li:hover a:before { top: 3.7vh; }
	.navigation ul li ul { display: none !important; position: relative !important; top: auto !important; left: auto !important; }
	.navigation ul li.showSubnav ul { display: block !important; padding: 0 !important; }
	.main .content { width: 100%; background: none; position: static; top: auto; right: auto; bottom: auto; z-index: 1; padding-top: 8vh; padding-bottom: 0; }
	.content form { width: 72vw; padding: 0 0 0 0; }
	.button, input[type="submit"] { width: 33.33vw; }
	.main .logo { position: relative; z-index: 3333; width: auto; height: 11vh; margin-bottom: 0px; }
	div.select { padding: 3vh 0 0 0; }
	div.select a { width: 37vw; height: 6vh; line-height: 6vh; }
	.footer { clear: both; width: 100%; height: 32vh; position: absolute; left: 0; background-image: url(images/mobile-footer-bg.png); background-repeat: no-repeat; background-position: center bottom; background-size: cover; background-position: top center; bottom: -20px; padding-top: 23vh; color: #fff; z-index: 1111; }
	.inner .rightbar { width: 100%; text-align: center; padding-bottom: 3vh; }
	.inner .rightbar * { max-height: 20vh; }
	.inner .main { padding: 3vh 6vw; margin-bottom: 10vh; }
	.inner .main.hasRightbar .content { width: 100%; }
	.inner .mobile-nav-trigger { top: 1.5vh; }
	table td { display: block; clear: both; }
	.info { width: 100%; float: none; padding-bottom: 20px; }
	.content a { background-position: 0 -40px; }
	.button, input[type="submit"] { max-width: 120px; }
	.zcontent form { position: relative; z-index: 2222; }		
	.hideOnMobile { opacity: 0 !important;}
}