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, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight:400;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
*, :after, :before, html {
    box-sizing: border-box;
}
img{
    max-width:100%;
    height:auto;
}

body {
    background-image: url(images/bg.webp);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
    background-color: #020219;
    background-attachment: fixed;
}
.container,
.row,
.main{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.main{
    min-height: 100vh;
}
.container{
    max-width:1600px;
    margin:0 auto;
    width:100%;
    align-items: center;
}

.left-container,
.right-container{
    flex: 0 0 auto;
    width: 50%;
    text-align: center;
    order:10;
}
.left-container img{
    max-height:1000px;
}

.logo-form img{
    max-width:300px;
}
.logo-form{
    margin-bottom: 20px;
    margin-top:30px;
}
.right-container{
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: row;
}
/*
.form-register{
    position: relative;
    background-image: url(images/form.webp);
    background-size: 100% 100%;
    background-position: center;
    width: 100%;
    padding-top:100px;
    padding-bottom: 100px;
}
.form-register .header-form-register img{
    max-width: 250px;
    margin: 0 auto 15px auto;
    width:80%;
}
.form-register input{
    display: block;
    width:100%;
    height: 50px;
    background: transparent;
    border:0px;
    box-shadow: none;
    outline: none !important;
    padding-left:20px;
    padding-right:20px;
    color:#FFF;
}
.form-register .form-group{
    display: block;
    width:100%;
    position: relative;
    background-image: url(images/input.webp);
    background-size: 100% 50px;
    background-repeat: no-repeat;
    margin-bottom: 10px;
}
*/
.form-register a.button{
    display: block;
    width: 80%;
    animation: pulse .5s linear infinite;
    margin:20px auto 15px auto;
}
.slogan-form{
    text-transform: uppercase;
    line-height: 150%;
        color: #ffbc08;
    font-weight: 900;
    font-size: 25px;
}
.alert-form{
   font-size: 25px;
  font-weight: bold;
  display: inline-block;
  line-height:150%;
  /* Hiệu ứng chữ: */
  background-image: linear-gradient(90deg, red 0%, #ffdb47 50%, red 100%);
  background-size: 200% auto;
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
  animation: animateText 5s linear infinite;
}
@keyframes animateText {
  0% {
    background-position: 200% center;
  }
  100% {
    background-position: -200% center;
  }
}
@keyframes pulse {
    0% {
        transform: scale(1.05);
        -webkit-filter: brightness(1.1);
        filter: brightness(1.1);
    }
    50% {
        transform: scale(1);
        -webkit-filter: brightness(1);
        filter: brightness(1);
    }
    100% {
        transform: scale(1.05);
        -webkit-filter: brightness(1.1);
        filter: brightness(1.1);
    }
}
.content-form-register{
    width:70%;
    margin:0px auto;
}


@media (max-width:992px){
    .left-container,
    .right-container{
        width: 100%;
    }
    .right-container{
        order:1;
    }
    .logo-form img{
        max-width:250px;
    }

    .form-register{
        padding-bottom:30px;
    }
}




.support-telegram{
 position: fixed;
  bottom: 20px; right: 20px; 
  background: #0088cc; 
  color: #fff;
   padding: 10px 15px; 
   border-radius: 8px; 
   text-decoration: none; 
z-index: 9999;
display: flex;
flex-direction: row;
align-items: center; 
}
.support-telegram svg{
    margin-right:5px;
}