* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
*:focus{ outline: none;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
img { border:none;}
strong, b { font-weight:700;}
em, i { font-weight:400; font-style:italic;}
textarea,
input[type="text"],
input[type="button"],
input[type="submit"],
button {
     -webkit-appearance: none;
     border-radius: 0;
}

h1 { padding:0; margin:0; font-weight:700; font-size:9.375rem;}
h2 { padding:0; margin:0; font-weight:700; font-size:3.75rem;}
h3 { padding:0; margin:0; font-weight:400; font-size:4.375rem;}
h4 { padding:0; margin:0; font-weight:400; font-size:1.625rem;}

html { font-size:100%;}
body { padding:0; margin:0;font-family: 'Ubuntu', sans-serif; font-size:1rem; font-weight:400; color:#ffffff; background: #12428d}

/* HEADER */
header {padding: 0; margin: 0; width: 100%; display: block; background:#ffffff; text-align:center;}
header .wrapper { width:100%; max-width:1370px; margin:0 auto; padding:12px 10px; position:relative;}
header .wrapper:after { content:''; display:block; clear:both; margin:0}
.logo { position:relative; z-index:5;}
.seal { position:absolute; left:14%; z-index:4; }
.partner-logo { position:absolute; right:14%; z-index:3}

@media only screen and (max-width: 1050px) {
.seal { position:absolute; left:5%}
.partner-logo { position:absolute; right:5%}
}

@media only screen and (max-width: 799px) {
.seal { position:absolute; left:10px;}
.partner-logo { position: relative; float:right; right:0; width:100%; text-align:right; margin-top:10px}
}

@media only screen and (max-width: 600px) {
.seal { position:absolute; left:10px; top:65px}
}

@media only screen and (max-width: 374px) {
.seal img{ width:130px;}
}
@media only screen and (max-width: 340px) {
.seal img{ width:110px;}
}

/* CONTENT */
.content {padding: 0; margin: 0; width: 100%; display: block; clear: both;}
.content .wrapper { width:100%; max-width:1370px; margin:0 auto; padding:0; position:relative;}
.content .wrapper:after { content:''; display:block; clear:both; margin:0}
.main { width:438px; position:absolute; z-index:2; left:50%; transform:translateX(-50%); text-align:center; padding-top:75px;}
a.button { display:block; width:80%; margin:55px 0 40px 45px; background:#d30303; border-radius:5px; font-weight:700; color:#ffffff; text-decoration:none; font-size:2.25rem; padding:30px 0; -webkit-box-shadow: 0 5px 0 0 #960000; box-shadow: 0 5px 0 0 #960000; transition:all .4s ease-in-out}
a.button:hover { background:#f71212; color:#ffffff; text-decoration:none; -webkit-box-shadow: 0 0 0 0 #960000; box-shadow: 0 0 0 0 #f71212; margin:60px 0 35px 45px}
a.terms {color:#ffffff; text-decoration: underline; font-size:.875rem;}

.images { display:flex; flex-wrap:wrap; justify-content:space-between; padding-bottom:60px}
.image1 { width:45%; height:610px; position:relative;}
.image2 { width:45%; height:610px; position:relative;}
.image1 img, .image2 img { width:100%;  position:absolute; left:0; top:0;}
.circle { width:345px; height:345px; text-align:center; background:#185bbd; border-radius:50%; position:absolute; bottom:-60px; left:50%; transform:translateX(-50%); color:#ffffff; text-decoration:none; padding-top:40px; z-index:3}


@media only screen and (max-width: 1280px) {
.circle { left:50%; transform:translateX(-70%);}
.images { padding-bottom:100px;}
.image2 .circle { left:50%; transform:translateX(-30%);}
}

@media only screen and (max-width: 1152px) {
.main {padding-top:55px;}
.image1 { width:48%;}
.image2 { width:48%;}
.circle { width:270px; height:270px; bottom:-30px;}
h1 {font-size:8.125rem;}
h2 {font-size:3.125rem;}
h3 {font-size:3.438rem;}
h4 {font-size:1.25rem;}
}

@media only screen and (max-width: 1050px) {
.image1 { width:100%; text-align:center; margin-bottom:20px}
.image2 { width:100%;text-align:center; margin-bottom:70px;}
.image1 img, .image2 img { width: auto; position: absolute; left:50%; transform:translateX(-50%)}
.circle, .image2 .circle {left:50%; transform:translateX(-50%);}
.main { position:relative; margin-bottom:20px;}

}

@media only screen and (max-width: 610px) {
body { overflow-x:hidden}
.image1 img, .image2 img { width: auto; height:470px}
.main {padding-top:75px;}
}

@media only screen and (max-width: 440px) {
a.button { width:80%; margin:20px 10%;}
}

.payments {display:flex; flex-wrap:wrap; justify-content:space-between; position:relative; z-index:3; text-align:center}
.payment { background: url(../images/logos.png); background-position: 0px 0px; background-repeat: no-repeat; position: relative; text-indent: -9999px; overflow: hidden; display: inline-block; margin:0 35px;}
.payment:hover { background-position: 0px -45px;}


.payment_1 { width:56px; height:45px; }
.payment_2 { width:65px; height:45px; background-position: -136px 0px;}
.payment_3 { width:61px; height:45px; background-position: -279px 0px;}
.payment_4 { width:97px; height:45px; background-position: -420px 0px;}
.payment_5 { width:90px; height:45px; background-position: -595px 0px;}
.payment_6 { width:80px; height:45px; background-position: -763px 0px;}
.payment_7 { width:115px; height:45px; background-position: -922px 0px;}
.payment_8 { width:85px; height:45px; background-position: -1111px 0px;}
.payment_9 { width:38px; height:45px; background-position: -1261px 0px;}

.payment_1:hover {background-position:0 -45px;}
.payment_2:hover { background-position: -136px -45px;}
.payment_3:hover { background-position: -279px -45px;}
.payment_4:hover { background-position: -420px -45px;}
.payment_5:hover { background-position: -595px -45px;}
.payment_6:hover { background-position: -763px -45px;}
.payment_7:hover { background-position: -922px -45px;}
.payment_8:hover { background-position: -1111px -45px;}
.payment_9:hover {background-position: -1261px -45px;}

@media only screen and (max-width: 1280px) {
.payments {display:flex; flex-wrap:wrap; justify-content: center; position:relative; z-index:3; padding:0 35px; text-align:center}
}

@media only screen and (max-width: 1050px) {
.images { padding-bottom:0;}
.payments { width:100%; max-width:610px; margin:0 auto 30px; padding:0}
.payment { margin:10px 15px;}
}