html, body {
    -webkit-text-size-adjust: none;
    margin: 0;
    padding: 0;
    user-select: none;
}

.logo{width: 150px;}

.container {
width: 100%;
padding-left: 0.5rem;
padding-right: 0.5rem;
margin-left: auto;
margin-right: auto;
}

@media (min-width:475px){.container {max-width: 475px;}}
@media (min-width:640px){.container {max-width: 640px;}}
@media (min-width:768px){.container {max-width: 768px;}}
@media (min-width:1024px){.container {max-width: 1024px;}}
@media (min-width:1536px){.container {max-width: 1536px;}}


@font-face {

font-family: 'fontku';
src:  url(fonts/Ubuntu-Bold.ttf);
}

body {background: #010f27;font-family: 'fontku', sans-serif;font-weight: 50;justify-content: center;align-items: center}
header {background: #02193f;right: 0;left: 0;z-index: 1030;min-height: 50px;width: 100%;padding: 5px;position: fixed;border-bottom: 1px solid #f7c200;text-align: center;justify-items: center;}

.wrapp{display: block;background: #02193f;border-radius: 4px;margin:4px;border: 0.002vh solid #065e5e;width: 100%;}

.wrapcontent{padding-top: 70px;margin: auto;width: 100%;}

.bigmatch {
display: flex;
padding: 6px 6px 6px 6px;
}

.flexy{
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
.flexy .stylea{
text-align: right;
color: #dcdcdc82;
font-size: 8px;
}



.flexy>a{
text-align: right;
color: #065075;
font-size: 6px;
}


.bigmatch span {
font-size: 14px;
color: #ff3029;
font-weight: bold;
text-align: justify;
padding: 4px 0px;
}


.headline span {font-size: 10px;color: #f7c200;text-align: left;padding: 4px 0px;}

.headline {display: flex;padding: 6px 6px 6px 6px;justify-content: space-between;height: 25px;}

.main-button {




background: linear-gradient(0,#99ff00ce 0,#82d900b7 32%,#68ad00bb 100%);
position: relative;


}

.deskrip>a{
color: #dcdcdc;
font-size: 14px;
text-transform: uppercase;
background: linear-gradient(0,#99ff00ce 0,#82d900b7 32%,#68ad00bb 100%);
padding: 10px 8px;
border-radius: 3px;
border: .4px solid #f7c200;
cursor: pointer;
}



svg{fill: #065075;}


.butoninfo {padding: 10px;font-size: 11px;color: #083838;text-align: center;background-image: radial-gradient(circle at top center,#f7c200 0,#0f3d3d 85%,rgb(8 56 56) 100%);}


.butoninfo>a {padding: 5px 15px;font-size: 11px;color: #03b6e8;text-align: center;margin: 10px 0px;text-decoration: none;background: #00314a;border-radius: 6px;border: 1px solid #02193f;}


.butoninfo>a:hover {

 font-size: 11px;
color: #f7c200;
text-align: center;
text-decoration: none;


}



.flexstart{display: flex;justify-content: space-between;}



.popup-link{
display:flex;
flex-wrap:wrap;
}

.popup-link a{
background: #333;
color: #fff;
padding: 10px 30px;
border-radius: 5px;
font-size:12px;
cursor:pointer;
margin:20px;
text-decoration:none;
}


.popup-container:target{
    visibility: visible;
    transform: scale(1);
    }

.popup-container {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000b10d4;
    opacity: 8;
    visibility: hidden;
    transition: all 0.2s ease-in-out;
    transform :scale(1);
}

.popup-content {
    background-color: #0b3558bf;
    padding: 10px;
    border: 1px solid #f7c200;
    margin-top: 80px;
    width: 80%;
    margin-bottom: 80px;
    margin-left: auto;
    margin-right: auto;
    }
.popup-content p{
font-size: 10px;
line-height: 12px;
color: #c7c7c7;
}
.popup-content a.close{
color: #ebaa24;
float: right;
font-size: 12px;
font-weight: bold;
background: none;
padding: 0;
margin: 0;
text-decoration:none;
}

.popup-content a.close:hover{
color:rgba(13, 121, 209, 0.749);
}

.popup-content span:hover,
.popup-content span:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}



.popup-container h3{
color: #c7c7c7;
margin:0px;
font-size: 12px;
}



/*End popup styles*/

/* Additional styles */
.popup-style-2{
transform: scale(0.3);

}

.popup-style-2:target{
transform: scale(1);
}

.popup-style-3{
left:100%;

}

.popup-style-3:target{
left:0;
}

.popup-style-4{
transform: rotate(180deg);
}

.popup-style-4:target{
transform: rotate(0deg);
}

.popup-style-5{
top:100%;

}

.popup-style-5:target{
top:0;
}

.popup-style-6{
transform: scale(15.3);

}

.popup-style-6:target{
 transform: scale(1);
 }

.popup-style-7{
transform: skewY(180deg);
 transition: all 0.7s ease-in-out;
}

.popup-style-7:target{
 transform: skewY(0deg);

 }

 .popup-content h4{font-size: 16px;text-align: center;color: #ebaa24;}

.greeting {
    font-size: 14px;
    text-align: left;
    color: #ebaa24;
    padding: 2px 0px;
}

ul{
list-style-type: square;
font-size: 10px;
color: #ebaa24;
padding-inline-start: 15px;
}


.flexcont{
display: flex;
justify-content: space-around;
}

.butcont{background: #065075;padding: 7px 20px;border-radius: 4px;border: 1px solid #f7c200;}

.butcont:hover{
background: #033c58;
padding:  7px 20px;
border-radius: 4px;
border: 1px solid #f7c200;
cursor: pointer;
}

.titlecont{
font-size: 8px;
color: #ebaa24;
text-align: center;
}
a{
text-decoration: none;
color: #c7c7c7;
}


table {
font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
border-collapse: collapse;
color: #00350b;
margin:8px 0px;
border-left: 1px solid #00141d;
border-right: 1px solid #00141d;
border-bottom: 1px solid #00141d;
}

td {
font-family: 'fontku';
padding: 2px 4px;
border-left:  1px solid #00141d;
border-right: 1px solid #00141d;
font-size: 8px;
}
tr:nth-child(odd) {
background: white;

}
tr:nth-child(even) {
background: #cce9ff;
}

.bg1 {
background: #ebaa24;
border-bottom: 1px solid #00141d;
}


.formptliga {display: flex;place-items: center;padding-top: 8px;padding-bottom: 8px;align-items: center;justify-content: space-between;flex-wrap: nowrap;width: 100%;box-sizing: border-box;margin: auto;}

button {position: relative;height: 45px;width: 50%;margin: 0 6px;border-radius: 5px;text-transform: uppercase;border: 1px solid transparent;outline: 0;cursor: pointer;background: #061414;overflow: hidden;transition: .3s;letter-spacing: 3px;font-family: 'Roboto',sans-serif}

button:first-child {
color: #f7c200;
border-color: #f7c200
}

button:last-child {
color: #fad400;
border-color: #f7c200
}

button:before,button:after {
position: absolute;
content: '';
left: 0;
top: 0;
height: 100%;
filter: blur(30px);
opacity: .4;
transition: .6s
}

button:before {
width: 60px;
background: rgba(255,255,255,0.6);
transform: translateX(-130px) skewX(-45deg)
}

button:after {
width: 30px;
background: rgba(255,255,255,0.6);
transform: translateX(-130px) skewX(-45deg)
}

button:hover:before,button:hover:after {
opacity: .6;
transform: translateX(320px) skewX(-45deg)
}

button:first-child a {color: #f7c200;text-decoration: none;font-size: 12px;font-family: 'fontku';}

button:last-child a {color: #f7c200;text-decoration: none;font-size: 12px;font-family: 'fontku';}

button a:hover {
color: #f7c200;
text-decoration: none
}

button {
text-decoration: none
}

button:hover:first-child {
color: #f7c200
}

button:hover:last-child {
color: #f7c200
}

footer{
background: #001425f7;
right: 0;
left: 0;
z-index: 1030;
min-height: 50px;
width: 100%;
padding: 5px;

border-top: 1px solid #f7c200;
text-align: center;
justify-items: center;

}

footer>p{
color: #f7c200;
font-size: 11px;

}