/*!
 * Website : ERS PORTAL
 * Organization : E25HBX Amateur Radio Station
 * Copyright 2024
 * Create : 06-02-2024
 */

 @font-face {
    font-family: 'chulabhornlikittext-light';
    src: url(../fonts/chulabhornlikittext-light.eot);
    src: url(../fonts/chulabhornlikittext-light.woff2) format('woff2'),
         url(../fonts/chulabhornlikittext-light.woff) format('woff');
}

@font-face {
    font-family: 'chulabhornlikittext-medium';
    src: url(../fonts/chulabhornlikittext-medium.eot);
    src: url(../fonts/chulabhornlikittext-medium.woff2) format('woff2'),
         url(../fonts/chulabhornlikittext-medium.woff) format('woff');
}

:root {
    --green: #a6ce39;
    --grey1: #f4f4f8;
    --grey2: #58595b;
    --light-blue: #00aeef;
    --dark-blue: #1b1464;
    --power-blue: #2a2a86;
    --black1: #1a1a1a;
    --black2: #0f0f0f;
    --red: #ed1c24;
    --swiss-red: #da291c;
    --font1: "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font2: "Helvetica Neue Thin", "Helvetica Neue", Helvetica, Arial, san-serif;
}

.font-ilatic {
    font-style: italic;
}

.font-medium {
    font-family: 'chulabhornlikittext-medium', Arial, sans-serif;
}

.text-white {
    color: #ffffff;
}

@media only screen and (max-width:620px) {
    /* For mobile phones: */
    .div-description {display: none;}
}
           
@media screen and (max-width: 3840px) {

    #loginBox {
        width: 60%;
    }

    body {
        overflow: hidden; 
        background-color:#ecf0f1;
        background-image: url(../images/ms-bg.jpg);
        
        background-position: bottom right;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: 60%;
    }
    
    #loginBox{margin-top:10%}
}

@media only screen and (max-width: 1200px) {

    #idtext{
        display: none;
    }

    #loginBox {
        width: 100%;
    }
    
    body {
        background-position: bottom right;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: 100%;
    }

    #loginBox{
        margin-top:30%
    }
}

/* On screens that are 600px wide or less, the background color is olive */
@media screen and (max-width: 600px) {
    
    #idtext{
        display: none;
    }

    #loginBox {
        width: 100%;
    }

    body {
        background-position: bottom right;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: 100%;
    }
    
    #loginBox{
        margin-top:30%
    } 
}
        

body {
    font-family: 'chulabhornlikittext-light', sans-serif;
    font-size: 12pt;
    margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
    background: url(../images/ms-bg.jpg) center center / cover no-repeat fixed rgb(255, 255, 255);
}

a {
    text-decoration: none;
    color: var(--light-blue);
    padding: 2px;
    display: inline-block;
    border-radius: 2px;
}

.div-description {
    background: var(--swiss-red);
    color: #FFFF;
    height: 100vh;
}

#loginBox {
    padding: 50px;
    margin: 0 auto;
    background-color: #FFFF;
    border-radius: 10px;
}

input[name=userID], input[name=password] {
    font-size: 12pt;
}

.btn{
    border-radius: 2.5px !important;
    padding: 0 2rem !important;
    /* box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12); */
    height: 36px !important;
    line-height: 36px !important;
    vertical-align: middle !important;
}

.btn-blue {
    --bs-btn-color: #fff;
    --bs-btn-bg: #2196f3 ;
    --bs-btn-border-color: #2196f3 ;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #2196f3 ;
    --bs-btn-hover-border-color: #2196f3 ;
    --bs-btn-focus-shadow-rgb: 60,153,110;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #2196f3 ;
    --bs-btn-active-border-color: #2196f3 ;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #2196f3 ;
    --bs-btn-disabled-border-color: #2196f3 ;
}