/* Base */

@font-face {font-family: 'Nexa-BlackItalic';
    src: url('../fonts/372A7C_0_0.eot');
    src: url('../fonts/372A7C_0_0.eot?#iefix') format('embedded-opentype'),
         url('../fonts/372A7C_0_0.woff2') format('woff2'),
         url('../fonts/372A7C_0_0.woff') format('woff'),
         url('../fonts/372A7C_0_0.ttf') format('truetype');}

html,body{font-family:'Roboto', sans-serif, arial, verdana;font-size:100%;line-height:1.25rem;color:#fff;background-color: #000; margin:0;padding:0 !important;overflow-x:hidden;}

input:-webkit-autofill{-webkit-box-shadow:0 0 0px 1000px white inset}
::selection{background-color:#FFF9C4;text-shadow:none}

a{color:#4e7dff;text-decoration: none; transition: all .2s;display: inline-block;border-bottom:1px solid transparent;padding-bottom: 3px;}
a:hover,
a:focus{color:#4e7dff;border-color: #4e7dff; transition: all .2s;text-decoration: none;}
a:focus{outline:none;}

input,
button,
button:focus{outline:none}
select{-webkit-appearance:none;-moz-appearance:none;text-indent:1px;text-overflow:'';}
select::-ms-expand{display:none;}

/* Bootstrap modifications */

.btn{font-weight: 500;padding: .6875rem .875rem;margin-bottom: 1.5rem;border-radius: 4px;text-align: left;position: relative;}

.btn-primary{background-color: #1babf9;border-color: #1babf9;text-transform: uppercase;text-align: center;}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle,
.btn-primary:hover{background-color: #147DB6;border-color: #147DB6;}
.btn-primary.focus, .btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus{box-shadow: none;background-color: #147DB6;border-color: #147DB6;color: #fff;}

.btn-secondary{background-color: #fff;border-color: #fff;color: #333333;font-size: .875rem;padding: .8125rem .875rem .75rem;}
.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle,
.btn-secondary:hover{background-color: #fff;border-color: #1BABF9;color: #333333;}
.btn-secondary.focus, .btn-secondary:focus,
.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, .show>.btn-secondary.dropdown-toggle:focus{box-shadow: none;background-color: #fff;border-color: #147DB6;color: #fff;color: #333333;}

.btn-info{background-color: rgba(0, 0, 0, 0.5);border-color: rgba(0, 0, 0, 0.5);border: 0;padding: .8125rem .875rem .875rem 3rem;margin-bottom: 3rem;font-size: .875rem;font-weight: 400;}
.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, .show>.btn-info.dropdown-toggle,
.btn-info:hover{background-color: rgba(0, 0, 0, 0.5);border-color: rgba(0, 0, 0, 0.5);}
.btn-info.focus, .btn-info:focus,
.btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus, .show>.btn-info.dropdown-toggle:focus{box-shadow: none;background-color: rgba(0, 0, 0, 0.5);border-color: rgba(0, 0, 0, 0.5);color: #fff;}

.modal-backdrop{background-color: #282828;opacity: .8;}
.modal-backdrop.show{opacity: .8;}
.modal-content{border: 0;border-radius: 0;}
.modal-header{height: 80px;position: relative;border-bottom-color: #d7dcdf;color: #333333;margin-bottom: 2px;}
.modal-header h5{font-size: 1.25rem;line-height: 2rem;width: 100%;text-align: center;padding-top: .5rem;}
.modal-header .webshop{color: #798F9C;font-size: .75rem;line-height: 1.5rem;position: absolute;left: 37px;top: 50%;transform: translateY(-50%);margin-top: -1px;}
.modal-header .webshop .svg{width: 14px;height: 16px;position: relative;left: -4px;top: -1px;}
.modal-header .webshop .svg path{fill: #798F9C;}
.modal-header .close{position: absolute;right: 16px;top: 8px;opacity: 1;}
.modal-body{padding: 1rem 2.0625rem;}
.modal-body ul{margin: 0;padding: 0;list-style: none;margin-bottom: -6px;}
.modal-body a{height: auto;padding: 12px 0 10px 47px;font-weight: 500;font-size: .875rem;line-height: 1.5rem;color: #333;display: block;border: 1px solid #fff;border-radius: 4px;transition: all .3s;margin: 6px 0 16px;}
.modal-body a:hover{border-color: #1BABF9;transition: all .3s;}
.modal-body .flag:before{top: 13px;}
.modal-body .flag:after{display: none;}
.modal-body .webshop .flag:after{display: block;background: transparent url(../images/icon-webshop2.svg) left top no-repeat;width: 13px;height: 16px;top: 15px;right: 14px;}

/* Site */

h1{font-family: 'Nexa-BlackItalic';font-size: 3.5rem;line-height: 4rem;margin-bottom: 5.5rem;}
h1 i{font-style: normal;color: #1BABF9;}

.logo{width:160px;height: 24px;margin: 4rem 0 4.4375rem;}
.content{max-width: 352px;text-align: left;margin: 0 auto;padding-bottom: 2rem;}
.content p{line-height: 1.1875rem;margin-bottom: 1.125rem;}

.services:hover{cursor: default;}
.services .svg:first-child{position: absolute;left: 14px;top: 12px;width: 20px;height: 24px;}
.services .svg:last-child{position: absolute;right:14px;top:14px;width: 20px;height: 20px;}

.flag{padding-left: 2.9375rem;height: 48px;position: relative;}
.flag:before{content: "";width:20px;height:20px;display: block;position: absolute;left:13px;top:13px;background-position: left top;background-repeat: no-repeat;background-color: transparent;border-radius: 20px;box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);}
.flag:after{content: "";width:12px;height:12px;display: block;position: absolute;right:17px;top:17px;background: transparent url(../images/icon-plus.svg) left top no-repeat;}
.flag span:after{position: absolute;left:2.9375rem;top:13px;}
.at .flag span:after{content: "Austria - Deutsch";}
.de .flag span:after{content: "Germany - Deutsch";}
.es .flag span:after{content: "Spain - Español";}
.eu .flag span:after{content: "Other EU countries - English";}
.fr .flag span:after{content: "France - Français";}
.hr .flag span:after{content: "Croatia - Hrvatska";}
.hu .flag span:after{content: "Hungary - Magyar";}
.it .flag span:after{content: "Italy - Italiano";}
.pl .flag span:after{content: "Poland - Polski";}
.pt .flag span:after{content: "Portugal – Português";}
.ro .flag span:after{content: "Romanian - Română";}
.ru .flag span:after{content: "Russia – Pусский";}
.sk .flag span:after{content: "Slovakia - Slovenčina";}
.uk .flag span:after{content: "United Kingdom - English";}
.at .flag:before{background-image:url(../images/flag-at.svg);}
.de .flag:before{background-image:url(../images/flag-de.svg);}
.es .flag:before{background-image:url(../images/flag-es.svg);}
.eu .flag:before{background-image:url(../images/flag-eu.svg);}
.fr .flag:before{background-image:url(../images/flag-fr.svg);}
.hr .flag:before{background-image:url(../images/flag-hr.svg);}
.hu .flag:before{background-image:url(../images/flag-hu.svg);}
.it .flag:before{background-image:url(../images/flag-it.svg);}
.pl .flag:before{background-image:url(../images/flag-pl.svg);}
.pt .flag:before{background-image:url(../images/flag-pt.svg);}
.ro .flag:before{background-image:url(../images/flag-ro.svg);}
.ru .flag:before{background-image:url(../images/flag-ru.svg);}
.sk .flag:before{background-image:url(../images/flag-sk.svg);}
.uk .flag:before{background-image:url(../images/flag-uk.svg);}
.go{height: 48px;}
.go span:after{position: absolute;left:0;right: 0;text-align: center;top:11px;}
.at .go span:after{content: "Weiter";}
.de .go span:after{content: "Weiter";}
.es .go span:after{content: "Siguente";}
.eu .go span:after{content: "Go";}
.fr .go span:after{content: "Continuer";}
.hr .go span:after{content: "Sljedeći";}
.hu .go span:after{content: "Tovább";}
.it .go span:after{content: "Seguente";}
.pl .go span:after{content: "Dalej";}
.pt .go span:after{content: "Seguinte";}
.ro .go span:after{content: "Următorul";}
.ru .go span:after{content: "далее";}
.sk .go span:after{content: "Pokračovat'";}
.uk .go span:after{content: "Go";}

/* Custom Select 
   https://www.w3schools.com/howto/howto_custom_select.asp */
    
/* Responsive CSS */
.site{height: 100vh;}

@media (max-width:575.98px) {
    body{background: transparent url(../images/background.jpg) center no-repeat;background-size: cover;}
    .site{background: none;}
    .modal-header h5{font-size: 1.125rem;line-height: 1.25rem;}
    .modal-header .webshop{left: 0;right: 0;text-align: center;top: 60px;transform: none;}
    .modal-header .webshop .svg {top: -2px;}
}

@media (min-width: 576px) and (max-width:767.98px) {
    .modal-header h5 {padding-top: 1rem;}
}

@media (min-width: 576px) and (max-width:991.98px) {
    body{background: transparent url(../images/background.jpg) center no-repeat;background-size: cover;}
    .site{background: none;}
    .modal-header .webshop {left: 21px;}
}

@media (max-width:767.98px) {
    .logo {width: 130px;height: 20px;margin: 2rem 0 1.625rem;}
    h1 {font-size: 2.5rem;line-height: 3rem;margin-bottom: 2.3125rem;}
    h1 span{display: block;}
    .content {max-width: 280px;}
    .content p{letter-spacing: -.06px;}
    
    .modal-dialog{margin: 0;max-width: 100%;}
    .modal-body{padding:7.375rem 1.25rem 1rem;}
    .modal-header{position: fixed;width: 100%;background-color: #fff;z-index: 1;height: 100px;border-radius: 0;}
    .modal-content{min-height: 100vh;}
    .modal-body .webshop .flag:after {right: 13px;}
}

@media (min-width: 768px) and (max-width:991.98px) {
    /*.site{background: transparent url(../images/background.jpg) center no-repeat;background-size: cover;}*/
    .logo {width: 216px;height: 32px;margin-bottom: 3.5625rem;}
    h1 {font-size: 3rem;line-height: 3.5rem;margin-bottom: 4.375rem;}
    .content {max-width: 336px;}
    
    .modal-dialog {margin: 10rem auto 0;max-width: 624px;}
    .modal-body {padding: 1rem 1.5625rem;}
    .modal-body .webshop .flag:after {right: 10px;}
}

@media (min-width: 992px) {
    .modal-dialog {max-width: 992px;margin: 10.5rem auto 0;}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .site{background: transparent url(../images/background.jpg) center no-repeat;background-size: cover;}
}

@media (min-width: 1200px) {
    .site{background: transparent url(../images/background.jpg) center no-repeat;background-size: cover;}
}