@font-face {
    font-family: 'Open Sans ExtraBold';
    src: url('../webfonts/OpenSans-ExtraBold.eot');
    src: url('../webfonts/OpenSans-ExtraBold.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/OpenSans-ExtraBold.woff2') format('woff2'),
         url('../webfonts/OpenSans-ExtraBold.woff') format('woff'),
         url('../webfonts/OpenSans-ExtraBold.ttf')  format('truetype'),
         url('../webfonts/OpenSans-ExtraBold.svg#Open Sans ExtraBold') format('svg');
}

@font-face {
    font-family: 'Open Sans Bold';
    src: url('../webfonts/OpenSans-Bold.eot');
    src: url('../webfonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/OpenSans-Bold.woff2') format('woff2'),
         url('../webfonts/OpenSans-Bold.woff') format('woff'),
         url('../webfonts/OpenSans-Bold.ttf')  format('truetype'),
         url('../webfonts/OpenSans-Bold.svg#Open Sans Bold') format('svg');
}

@font-face {
    font-family: 'Open Sans';
    src: url('../webfonts/OpenSans-Regular.eot');
    src: url('../webfonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/OpenSans-Regular.woff2') format('woff2'),
         url('../webfonts/OpenSans-Regular.woff') format('woff'),
         url('../webfonts/OpenSans-Regular.ttf')  format('truetype'),
         url('../webfonts/OpenSans-Regular.svg#Open Sans') format('svg');
}

body, html {
    height: 100%;
}
  
.bg {
    /* The image used */
    background-image: url("../images/background.jpg");
  
    /* Full height */
    height: 100%;
  
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.middle-extrabold {
    font-family: 'Open Sans ExtraBold';
    font-weight: Regular;
    font-size: 1.5em;
}

.middle-bold {
    font-family: 'Open Sans Bold';
    font-weight: Regular;
    font-size: 1.5em;
}

.middle-regular {
    font-family: 'Open Sans';
    font-weight: Regular;
    font-size: 1.5em;
}

.footer-extrabold {
    font-family: 'Open Sans ExtraBold';
    font-weight: Regular;
    font-size: 2.2em;
}

.footer-bold {
    font-family: 'Open Sans Bold';
    font-weight: Regular;
    font-size: 1.5em;
}

.footer-regular {
    font-family: 'Open Sans';
    font-weight: Regular;
    font-size: 1.50em;
}

.update-text {
    font-family: 'Open Sans';
    font-weight: Regular;
    font-size: 1.2em;
}

.rec {
    background-color: #003670;
    border-radius: 25px;
    line-height: 50px;
    text-align: center;
    height: 50px;
    font-family: 'Open Sans Bold';
    font-weight: Regular;
    font-size: 1.75em;
    vertical-align: middle;
}

.currency-text {
    position: relative;
    left:-10px;
}

.us-flag {
    position: relative;
    left:-10px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #eee;
    background-position: center center;
    background-size: 175%;
    background-image: url(../images/usa.webp);
    border: solid 1px #FFFFFF;
}

.eu-flag {
    position: relative;
    left:-10px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #eee;
    background-position: center center;
    background-size: 150%;
    background-image: url(../images/eu.png);
    border: solid 1px #FFFFFF;
}

.uk-flag {
    position: relative;
    left:-10px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #eee;
    background-position: center center;
    background-size: 150%;
    background-image: url(../images/uk.png);
    border: solid 1px #FFFFFF;
}

.middle-dot {
    font-size: 0.5em;
    line-height: 50px;
    vertical-align: middle;
    height: 50px;
    margin: 0 15px;
}

.footer-dot {
    font-size: 0.5em;
    line-height: 50px;
    vertical-align: middle;
    height: 50px;
    margin: 0 15px;
}

.logo {
    height: 300px;
    width: auto;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

.nostyle {
    text-decoration: none;
}

.footer {
    position:absolute;
    bottom: 20px;
    width: 100%;
}

@media only screen and (max-width: 576px) {
    .middle-bold {
        font-size: 1.2em;
    }
    .footer-extrabold {
        font-size: 1em;
    }
    .footer-bold {
        font-size: 1em;
    }
    .footer-regular {
        font-size: 1em;
    }
    .update-text {
        font-size: 1em;
    }
}

@media screen and (min-width:576px) and (max-width:768px) {
    .footer-extrabold {
        font-size: 1.2em;
    }
    .footer-bold {
        font-size: 1.2em;
    }
    .footer-regular {
        font-size: 1.2em;
    }
}

.buttons {
    background-color: #003670!important;
    color: #FFFFFF!important;
    border: none!important;
}