body {font-family: Roboto-Regular; background-image: url('../../image/bg-seagames.png'); background-repeat:no-repeat; background-position:center; background-size:cover; min-height:100vh}

.seagames-container {height:100vh; padding:0 15%;}
.seagames-container .seagames-titles {text-transform:uppercase; color:#fff; font-size:58px; font-weight:bold;}
.seagames-container .seagames-titles div:first-child {font-size:24px; margin-bottom:16px;}

.account {width:435px; background-color:#fff; border-radius:24px; z-index:5; padding:36px 20px;}
.account .titles {text-align:center; font-size:24px; font-weight:bold;}
.account .custom-label-input {min-height:55px; border:1px solid #ccc; border-radius:6px; background-color:#ccc; padding: 5px 14px}
.account .custom-label-input label {height:14px; line-height:14px; font-size:12px; color:#000; margin-bottom:0!important; width:100%}
.account .custom-label-input input {height:19px; line-height:19px; padding:unset; width:100%; background:none; color:#F01522}
.account .custom-checkbox .checkmark {top:3px}
.account .color-link {color:#F01522!important}
.account .color-active {color:#F01522!important}

.custom-modal {width:325px; background-color:#fff; border-radius:5px; z-index:5; margin:0 auto}
.custom-modal .modal-header {height:25px; line-height:25px; text-align:left; padding:0 20px; background-color:#ececec; border-radius:5px 5px 0 0}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    border: none !important;
    -webkit-text-fill-color: #F01522 !important;
    -webkit-box-shadow: 0 0 0px 1000px #ccc inset !important;
    transition: unset !important;
    background: #ccc !important;
    color: #F01522 !important
}

input::-webkit-input-placeholder{color:rgba(240, 21, 34, 0.7)}
input::-moz-placeholder{color:rgba(240, 21, 34, 0.7)}
input:-ms-input-placeholder{color:rgba(240, 21, 34, 0.7)}
input:-moz-placeholder{color:rgba(240, 21, 34, 0.7)}

.input-default.input-validation-error {border-color:#F01522}
.color-yellow {color:#F01522!important}
.btn-default {background-color:#F01522; color:#fff;}
.text-supper {
    vertical-align: super;
    font-size: 50%;
}
.copy-right {height:100px;padding-left:50px; color: #fff; font-size: 16px; position:absolute; bottom:0px; z-index:999}
.fix-logo {position:absolute; right:15%; top:5%}

/*-------mobile-------*/
@media only screen and (max-width: 768px) {
    .seagames-container {flex-direction:column; padding:20px 0; min-height:100vh; height:auto; justify-content:center!important;}
    .seagames-container .seagames-titles {font-size:20px; text-align:center; margin-bottom:16px;}
    .seagames-container .seagames-titles div:first-child {font-size:16px; margin-bottom:4px;}
    .account {width:345px; border-radius:16px; padding:16px 0px;}
    .copy-right {height:auto;padding-left:20px; color: #fff; font-size: 12px; position:absolute; bottom:0px; z-index:999}
    .fix-logo {right:0;}
}

@media only screen and (max-width: 320px) {
    .seagames-container {flex-direction:column; padding:10px 0; min-height:100vh; height:auto; justify-content:center!important;}
    .seagames-container .seagames-titles {font-size:20px; text-align:center; margin-bottom:16px;}
    .seagames-container .seagames-titles div:first-child {font-size:16px; margin-bottom:4px;}
    .account {width:320px; border-radius:8px; padding:16px 0px;}
    .copy-right {height:auto;padding-left:10px; color: #fff; font-size: 12px; position:absolute; bottom:0px; z-index:999}
    .fix-logo {right:0;}
}