/*Futura*/
@font-face {
    font-family: 'Futura-Heavy';
    src: url('../fonts/futura-condensedbold-webfont.eot');
    src: url('../fonts/futura-condensedbold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/futura-condensedbold-webfont.woff') format('woff'), url('../fonts/futura-condensedbold-webfont.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
}

@font-face {
    font-family: 'Futura-Light';
    src: url('../fonts/FuturaStd-CondensedLight.eot');
    src: url('../fonts/FuturaStd-CondensedLight.eot?#iefix') format('embedded-opentype'),
    url('../fonts/FuturaStd-CondensedLight.otf') format('opentype'),
    url('../fonts/FuturaStd-CondensedLight.woff') format('woff'),
    url('../fonts/FuturaStd-CondensedLight.ttf') format('truetype'),
    url('../fonts/FuturaStd-CondensedLight.svg#FuturaStd-CondensedLight') format('svg');
    font-style: normal;
    font-weight: normal;
}

@font-face {
    font-family: 'futura-cond-light';
    src: url('../fonts/futura-condensedlight-webfont.eot');
    src: url('../fonts/futura-condensedlight-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/futura-condensedlight-webfont.woff') format('woff'),
    url('../fonts/futura-condensedlight-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'futura-cond-bold';
    src: url('../fonts/futura-condensedbold-webfont.eot');
    src: url('../fonts/futura-condensedbold-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/futura-condensedbold-webfont.woff') format('woff'),
    url('../fonts/futura-condensedbold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FuturaStd-Book';
    src: url('../fonts/FuturaStd-Book.eot');
    src: url('../fonts/FuturaStd-Book.eot?#iefix') format('embedded-opentype'),
    url('../fonts/FuturaStd-Book.otf') format('opentype'),
    url('../fonts/FuturaStd-Book.woff') format('woff'),
    url('../fonts/FuturaStd-Book.ttf') format('truetype'),
    url('../fonts/FuturaStd-Book.svg#FuturaStd-Book') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'futura-book';
    src: url('../fonts/futura-book-webfont.eot');
    src: url('../fonts/futura-book-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/futura-book-webfont.woff') format('woff'),
    url('../fonts/futura-book-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}



/*-----------------------RESET-----------------------*/
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,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

em, i {
    font-style: italic;
}

.no-touch img {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
}

input[type='submit'], button {
    -webkit-appearance: none;
    border-radius: 0;
}

input {
    border-radius: 0;
}

a, :visited {
    outline: 0;
    outline: none;
}

:hover, :active, :focus {
    outline: 0;
    outline: none;
}

::-moz-focus-inner {
    border: 0;
}

a::-moz-focus-inner {
    border: 0;
}

img.lft {
    float: left;
    margin: 0 10px 10px 0;
}

img.rght {
    float: right;
    margin: 0 0 10px 10px;
}

* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-focus-ring-color: rgba(0, 0, 0, 0);
    outline: none !important;
}

input::-webkit-input-placeholder {
    color: #9ae4ff;
}

input::-moz-placeholder {
    color: #9ae4ff;
    opacity: 1;
}

form .placeholder {
    color: #9ae4ff;
}

input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {
    opacity: 0;
}

input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {
    opacity: 0;
}

input:focus .placeholder, textarea:focus .placeholder {
    opacity: 0;
}

ul li {
    list-style: none;
}

/*a:hover, button:hover{
    opacity: .75 !important;
}*/
.clearfix:after {
    content: '';
    display: table;
    clear: both;
}

/*----------------------END RESET-------------------*/

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, menu, nav, section, main {
    display: block;
}

/*-----------------------STRUCTURE-----------------------*/
html {
    height: 100%;
}

body {
    height: 100%;
    font-family: 'Futura-Light', sans-serif;
    -webkit-text-size-adjust: none;
    min-width: 320px;
}

#wrapper {
    height: auto;
}

#indent {
    clear: both;
    height: 0;
}

main {
    border: 1px solid transparent;
}

footer {
    height: 0;
    margin-top: 0;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
}

/*-------------------------------------------------------*/
/*-----------------------HEADER--------------------------*/
header {
    position: relative;
    z-index: 2;
    margin-bottom: 60px;
}

header .container {
    position: relative;
    max-width: 1485px;
    margin: 0 auto;
    padding: 50px 50px 0;
    width: 100%;
}

@media screen and (max-width: 960px) {
    header .container {
        padding: 25px 15px 0;
        width: 100%;
    }
}

header .logo {
    background: url("../i/logo.png") no-repeat 0 0/100% auto;
    width: 189px;
    height: 53px;
    float: left;
}

header .logo a {
    display: block;
    width: 189px;
    height: 53px;
}

header .lang-sel-box {
    float: right;
    margin-top: -5px;
}

header .link {
    position: relative;
    top: -3px;
    font: normal 22px Futura-Light, sans-serif;
    float: right;
    color: #fff;
    text-decoration: none;
    text-shadow: 0 2px 5px rgba(0, 0, 0, .25);
}

.no-touch header .link:hover {
    opacity: .7;
}

@media screen and (max-width: 560px) {
    header .link {
        top: 0;
        font-size: 18px;
    }
}

@media screen and (max-width: 460px) {
    header .link {
        top: 4px;
        font-size: 14px;
    }
}

@media screen and (max-width: 420px) {
    header .logo {
        width: 150px;
        height: 33px;
    }

    header .logo a {
        width: 150px;
        height: 33px;
    }

    header .link {
        top: -1px;
        font-weight: 700;
        font-size: 15px;
    }
}

@media screen and (max-width: 360px) {
    header .link {
        top: 0;
        font-size: 14px;
    }
}

/*---------------------END HEADER------------------------*/
/*-------------------------MAIN---------------------------*/
.feedback {
	position: absolute;
	width: 500px;
	max-width: 100%;
	z-index: 9999;
	top: 320px;
	right: 50px;
	background: rgba(241,241,241,.4);
	padding: 10px;
}
.feedback p {
	color: #000;
	max-width: 100px;
	font-size: 20px;
	text-align: center;
	margin: 10px auto;
}
.feedback .btn {
	display: block;
	margin: 30px auto 10px auto;
	padding: 10px 30px;
	border: none;
	max-width: 150px;
	background: #fff;
	transition: all .2s ease;
	font-size: 15px;
	border: 1px solid #fff;
	text-align: center;
	text-decoration: none;
	color: #000;
}
.feedback .btn:hover {
	background: #000000;
	color: #fff;
}
#video-wrap {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    z-index: 1;
}
@media screen and (max-width: 1750px) {
	.feedback {
		width: 400px;
	}
}
@media screen and (max-width: 1550px) {
	.feedback {
		width: 300px;
	}
}
@media screen and (max-width: 1400px) {
	.feedback {
		position: relative;
		display: block;
		width: 500px;
		margin: 0 auto 50px auto;
		top: 20px;
		right: 0;
	}
}
@media screen and (max-width: 600px) {
	.feedback {
		width: 400px;
	}
	.feedback p {
		font-size: 17px;
	}
	.feedback .btn {
		padding: 8px 10px;
	}
}
@media screen and (max-width: 500px) {
	.feedback {
		width: 300px;
	}
}
.touch #video-wrap {
    background: url("../../video/poster-touch.jpg") no-repeat center;
    background-size: cover;
}

#video-wrap video {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#video-wrap #flashmovie {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.touch #video-wrap video, .touch #video-wrap #flashmovie {
    display: none !important;
}

#video-wrap:after {
    content: '';
    position: absolute;
    z-index: 3;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url("../i/video-pattern.png") repeat 100% 100%;
}

@media (min-aspect-ratio: 16/9) {
    #video-wrap > video {
        height: 300%;
        top: -100%;
    }
}

@media (max-aspect-ratio: 16/9) {
    #video-wrap > video {
        width: 300%;
        left: -100%;
    }
}

@supports (object-fit: cover) {
    #video-wrap > video {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

.wrap {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    padding: 150px 0 50px;
}

@media screen and (max-width: 480px) {
    .wrap {
        padding: 120px 0 0;
    }
}

.f-choice {
    max-width: 630px;
    padding: 0 15px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.f-choice table {
    width: 100%;
    table-layout: fixed;
    max-height: 550px;
    min-width: 280px;
    border-collapse: collapse;
    min-height: 280px;
    margin: 0 auto 30px;
    position: relative;
}

.f-choice table tbody {
    height: 100%;
    position: relative;
}

.f-choice table td {
    vertical-align: middle;
    text-align: center;
    width: 50%;
    padding-bottom: 50%;
    position: relative;
    border: 1px solid #fff;
}

.f-choice tr:first-child td:first-child, .f-choice tr.tr1 td.td1 {
    border-top: transparent;
    border-left: transparent;
}

.f-choice tr:first-child td:last-child, .f-choice tr.tr1 td.td2 {
    border-top: transparent;
    border-right: transparent;
}

.f-choice tr:last-child td:first-child, .f-choice tr.tr2 td.td1 {
    border-bottom: transparent;
    border-left: transparent;
}

.f-choice tr:last-child td:last-child, .f-choice tr.tr2 td.td2 {
    border-bottom: transparent;
    border-right: transparent;
}

.f-choice ul {
    margin: 0 auto;
    font-size: 0;
    max-height: 550px;
    min-width: 290px;
    min-height: 290px;
}

.f-choice ul li {
    position: relative;
    font-size: 16px;
    width: 50%;
    display: inline-block;
}

.f-choice ul li a {
    position: absolute;
    width: 100%;
    top: 0;
    text-align: center;
    display: table;
    table-layout: fixed;
    left: 0;
    padding: 0 15px;
    border: 1px solid #fff;
    text-decoration: none;
}

.f-choice ul li:first-child a {
    border-top: transparent;
    border-left: transparent;
}

.f-choice ul li:nth-child(2) a {
    border-top: transparent;
    border-right: transparent;
}

.f-choice ul li:nth-child(3) a {
    border-bottom: transparent;
    border-left: transparent;
}

.f-choice ul li:last-child a {
    border-bottom: transparent;
    border-right: transparent;
}

.f-choice table a {
    position: absolute;
    padding: 0 15px;
    width: 100%;
    text-align: center;
    text-decoration: none;
    top: 0;
    left: 0;
    height: 100%;
}

.f-choice table a:before {
    display: inline-block;
    content: '';
    vertical-align: middle;
    height: 100%;
}

.f-choice h2 {
    color: white;
    display: inline-block;
    vertical-align: middle;
    font-size: 40px;
    text-transform: uppercase;
}

@media screen and (max-width: 640px) {
    .f-choice h2 {
        font-size: 32px;
    }
}

@media screen and (max-width: 540px) {
    .f-choice h2 {
        font-size: 26px;
    }
}

@media screen and (max-width: 480px) {
    .f-choice h2 {
        font-size: 24px;
    }
}

@media screen and (max-width: 440px) {
    .f-choice h2 {
        font-size: 22px;
    }
}

@media screen and (max-width: 400px) {
    .f-choice h2 {
        font-size: 17px;
    }
}

.no-touch .f-choice table a:hover {
    background: rgba(255, 255, 255, .2);
}

.s-choice {
    position: relative;
    z-index: 2;
    max-width: 890px;
    padding: 0 15px;
    margin: 0 auto 30px;
}

.s-choice .title {
    margin-bottom: 21px;
}

.s-choice h2 {
    font-family: 'futura-cond-light';
    font-size: 40px;
    color: #fff;
    float: left;
    text-transform: uppercase;
    margin: 2px 0 0 0;
}

.s-choice .division-sel-box {
    float: right;
    margin-top: 0;
    width: 255px;
}

.country-box, .langs-box {
    background: rgba(0, 0, 0, .5);
    font-size: 0;
    padding: 14px 25px 0;
    font-family: 'futura-book';
    margin-bottom: 20px;
}

.country-box h3, .langs-box h3 {
    font-family: 'futura-cond-bold';
    text-transform: uppercase;
    font-size: 20px;
    text-align: left;
    color: #fff;
    margin: 0 0 25px;
}

.country-box .items-box {
    width: 35%;
    display: inline-block;
    vertical-align: top;
    padding-right: 5%;
    overflow: hidden;
}

.country-box .items-box:last-child {
    width: 30%;
    padding-right: 0;
}

.country-box .item {
    float: left;
    width: 100%;
    margin: 0 0 16px;
}

.country-box .item:after {
    content: '';
}

.country-box .country-wrap {
    float: left;
    font-size: 12px;
    line-height: 1.2em;
    margin: -2px 0 0 0;
    width: 100%;
    margin-right: -100px;
    padding-right: 100px;
}

.country-box .country {
    color: #fff;
    text-decoration: none;
}

.no-touch .country-box a.country:hover {
    text-decoration: underline;
}

.langs {
    font-size: 0;
    text-transform: uppercase;
    color: #fff;
    float: right;
    text-align: left;
    width: 84px;
    position: relative;
    z-index: 10;
}

.langs * {
    font-size: 10px;
}

.langs a {
    color: #35b8b9;
    text-decoration: none;
    line-height: 1.2em;
    display: inline-block;
    vertical-align: top;
    margin: 0 10px 4px 0;
}

.no-touch .langs a:hover {
    text-decoration: underline;
}

.langs .separator {
    position: relative;
    top: 4px;
    display: inline-block;
    vertical-align: top;
    width: 3px;
    height: 4px;
    background: url("../i/separator.gif") no-repeat 0 0;
    margin: 0 10px 0 0;
}

/*Langs box*/
.langs-box {
    display: none;
    padding: 14px 25px 25px;
}

.langs-box h3 {
    margin-bottom: 16px;
}

.sel-color {
    color: #35b8b9;
}

.select2-highlighted .sel-color {
    color: #fff;
}

@media screen and (max-width: 700px) {
    .country-box .items-box {
        width: 55%;
        padding-right: 5%;
    }

    .country-box .items-box:nth-of-type(2) {
        width: 45%;
        padding-right: 0;
    }

    .country-box .items-box:last-child {
        width: 55%;
        padding-right: 5%;
    }
}

@media screen and (max-width: 640px) {
    .country-box {
        display: none;
        padding: 14px 15px 0;
    }

    .langs-box {
        display: block;
        padding: 14px 15px 25px;
    }

    .s-choice .division-sel-box {
        width: 100%;
    }

    .s-choice .division-sel-box, .s-choice h2 {
        float: none;
    }

    .s-choice h2 {
        margin-bottom: 15px;
        font-size: 32px;
    }

    .country-box .items-box {
        max-width: 340px;
    }
}

@media screen and (max-width: 520px) {
    .country-box .items-box {
        width: 100% !important;
        padding: 0 !important;
    }

    .country-box .country-wrap {
        margin-right: -140px;
        padding-right: 140px;
    }

    .langs {
        width: 122px;
    }

    .langs a {
        margin: 0 19px 4px 0;
    }

    .langs .separator {
        margin: 0 19px 0 0;
    }

    .s-choice .division-sel-box {
        width: 100%;
    }
}

/*-----------------------END MAIN-------------------------*/
/*---------------------TRANSITIONS---------------------*/
a, input[type="submit"]:hover {
    -webkit-transition: background 0.2s ease-out;
    -moz-transition: background 0.2s ease-out;
    -o-transition: background 0.2s ease-out;
    transition: background 0.2s ease-out;
}

{
    -webkit-transition: none
;
    -moz-transition: none
;
    -o-transition: none
;
    transition: none
;
}
/*-----------------END TRANSITIONS---------------------*/
/*----------------RETINA GRAPHICS-----------------*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
    header .logo {
        background: url("../i/logo-x2.png") no-repeat 0 0/100% auto;
    }
}

/*---------------END RETINA GRAPHICS--------------*/
