@charset "utf-8";

/* ELEMENT DEFAULTS */
body {margin:0; font-family: 'Arial', 'Helvetica', serif !important; font-size:20px; color:#FFFFFF; background-color:#1c335a; min-height: 100dvh;}
img {border: 0 none;}
hr {border: 1px solid #000000; margin: 0 auto; width: 90%;}
p, li, ul, td, th, label, span {font-size:24px;}
td {font-size:12px; color: #000000; border:1px solid #CACFD2;}
input,textarea,select {vertical-align:middle; font-size:24px; color:#000000;}
input:focus::placeholder {color: transparent;}
h1 {font-size:16px; padding-bottom:2px;}
h2 {font-size:14px;}
a:focus, a:link, a:active, a:hover, a:visited {color: #29c7ff;}
select:required:invalid {color: gray;}
select {width:100%; height:40px; box-sizing:border-box; border-radius:10px; border:0 solid #FFFFFF; text-align:center;text-align-last:center; background-color:#FFFFFF;}
option[value=""][disabled] {display: none;}
option {color: #000000;}
input[type="text"], input[type="password"] {width:100%; height:40px; border-radius:10px; border: none; text-align:center;}
input[type="radio"] {width: 40px; height: 40px; margin-right: 40px; accent-color: #ff0000;}
input[type="checkbox"] {width: 50px; height: 50px; margin-right: 40px; accent-color: #ff0000; border-radius: 10px;}
label {font-size: 16px; display:block; padding: 10px 10px 5px 10px; text-align:left;}

/* CSS CLASSES */
.fields {padding: 0 0 15px 0; display: flex; width:100%;}
.field {padding: 0 15px 0 15px; display: block; margin: 0 auto; width:100%;}
.radio_field {padding: 10px 0 10px 0; display: flex; margin: 0 auto; width:90%; align-items: center;}
.table {display: table; margin: 0 auto;}
.msg_alert, .msg_error, .msg_success, .msg_info, .msg_help {color: #FF0000; display: block; padding:10px 10px 10px 50px; background-repeat:no-repeat; background-position:10px center; margin: 10px 15px;}
.msg_alert { background-image:url('../images/ic_warning.png')}
.msg_error {background-image:url('../images/ic_error.png')}
.msg_success {background-image:url('../images/ic_ok.png')}
.msg_info {background-image:url('../images/ic_info.png')}
.msg_help {background-image:url('../images/ic_help.png')}

/* SPECIFIC ELEMENT IDS */
#header {display: flex; justify-content: space-between; align-items: stretch; margin: 0 auto; width: 650px; background-color: #ffffff;}
#header #logo {display: block; height: 120px; padding: 0;}
#header #contact {display: flex; flex-direction: column; justify-content: flex-end; color: #1c335a; font-size: 14px; text-align: right; padding: 0 20px 10px 20px;}
#content {margin: 0 auto; padding-bottom: 0; max-width: 650px;}
#footer {display: table; margin: 0 auto; width: 650px; background-color:#1c335a; text-align: center; padding: 20px 0 20px 0;}
#footer #slogan {color:#29c7ff; font-size: 10px; }
#footer #copyright {color:#FFFFFF; font-size: 10px;}
#qr {display: block; width: 350px; padding: 0;}

#full { display: table; margin: 0 auto; width:100%; background-color:#29c7ff; }
#blank { display: flex; flex-direction: column; justify-content: center; align-items: center; width:100%; min-height: 300px; background-color:#29c7ff; padding: 20px;}
#form { display: table; margin: 0 auto; width:100%; background-color:#29c7ff; padding: 10px 0 10px 0;}

/* JQUERY OVERRIDES */
input.error, select.error, textarea.error {border: 2px solid #ff0000;}
/**label.error {color: #ff0000; display: block; margin: 1px;}*/
label.error {display: none;}
/*label input[type="image"], label input[type="checkbox"], label input[type="radio"] {vertical-align: text-bottom;}*/

#button {
    background-color:#000000;
    border-radius:20px;
    border:3px solid #FFFFFF;
    display:flex;
    align-items: center;
    justify-content: center;
    cursor:pointer;
    color:#FFFFFF;
    font-size:20px;
    padding:8px 8px;
    margin: 0 auto;
    text-decoration:none;
    text-shadow:0 1px 0 #000000;
    width:150px;
    height: 50px;
}
#button:hover {background-color:#003C57;}

/* GOOGLE STYLES */
.material-symbols-outlined {
     font-variation-settings:
             'FILL' 0,
             'wght' 400,
             'GRAD' 0,
             'opsz' 24;
}


* { box-sizing: border-box; }

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
    margin-right: 20px;
}

/* Hide default HTML checkbox */
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider {
    background-color: #000000;
}

input:focus + .slider {
    box-shadow: 0 0 1px #000000;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

@media(max-width:650px){

    #header {width: auto;}
    #footer {width: auto;}

    #full {display: block; width: auto;}
    #form {display: block; width: auto;}
    input,textarea,select {vertical-align:middle; font-size:18px;}

}