
    .font_c{
        font-family: 'Kanit', sans-serif;
        font-size:22px;
    }
    .font_c_error{
        font-family: 'Kanit', sans-serif;
        color: #ff0000;
        font-size:30px;
        font-weight: bold;
    }
    .font_submit{
        font-family: 'Kanit', sans-serif;
        font-size:18px;
    }

    .font_detail{
        font-family: 'Kanit', sans-serif;
        font-size:14px;
    }

    .font_1{
        font-family: 'Kanit', sans-serif; 
    }

    .font_topic{
        font-family: 'Kanit', sans-serif;
        font-size:16px;
    }
    .page-break  { 
        display: block; page-break-before: always; 
        margin:0 auto;
        padding:0px;
        
    }
    .font_body{
        font-family: 'Kanit', sans-serif;
        font-size:15px; 
    }
    .font_topic_b{
        font-family: 'Kanit', sans-serif;
        font-size:22px;
        font-weight: bold;
        color: red;
    }
    .font_topic_bb{
        font-family: 'Kanit', sans-serif;
        font-size:30px;
        font-weight: bold;
        color: #4CAF50;
    }
    .font_topic_bc{
        font-family: 'Kanit', sans-serif;
        font-size:30px;
        font-weight: bold;
        color: #FFFFFF;
    }

    .font_sub{
        font-family: 'Kanit', sans-serif;
        font-size:13x;
        font-weight: bold;
        color: red;
    }
    .font_text{
        font-family: 'Kanit', sans-serif;
        font-size:13px;
    }
    .font_text1{
        font-family: 'Kanit', sans-serif;
        font-size:12px;
    }
    .font_text11{
        font-family: 'Kanit', sans-serif;
        font-size:11px;
    }
    .font_topic_back{
        font-family: 'Kanit', sans-serif;
        font-size:22px;
        font-weight: bold;
        color: #000000;
    }
    .font_topic_back1{
        font-family: 'Kanit', sans-serif;
        font-size:20px;
        font-weight: bold;
        color: #000000;
    }
    .font_topic_back2{
        font-family: 'Kanit', sans-serif;
        font-size:18px;
        font-weight: bold;
        color: #000000;
    }
    .button {
        font-family: 'Kanit', sans-serif;
        background-color: #4CAF50; /* Green */
        border: none;
        color: white;
        padding: 10px 20px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 30px;
        margin: 4px 2px;
        -webkit-transition-duration: 0.4s; /* Safari */
        transition-duration: 0.4s;
        cursor: pointer;
    }
    .button_read {
        font-family: 'Kanit', sans-serif;
        background-color: #ff0000; /* Green */
        border: none;
        color: white;
        padding: 10px 20px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 15 px;
        margin: 4px 2px;
        -webkit-transition-duration: 0.4s; /* Safari */
        transition-duration: 0.4s;
        cursor: pointer;
    }
    
    .button1 {
        background-color: white; 
        color: black; 
        border: 2px solid #4CAF50;
    }

    .button1:hover {
        background-color: #4CAF50;
        color: white;
    }

    .button2 {
        background-color: white; 
        color: black; 
        border: 2px solid #008CBA;
    }

    .button2:hover {
        background-color: #008CBA;
        color: white;
    }

    .button3 {
        background-color: white; 
        color: black; 
        border: 2px solid #f44336;
    }

    .button3:hover {
        background-color: #f44336;
        color: white;
    }

    .button4 {
        background-color: white;
        color: black;
        border: 2px solid #e7e7e7;
    }

    .button4:hover {background-color: #e7e7e7;}

    .button5 {
        background-color: #212121;
        color: white;
        border: 2px solid #212121;
    }

    .button5:hover {
        background-color: #424242;
        color: white;
        border: 2px solid #424242;
    }

    .button6 {
        background-color: #7B1FA2;
        color: white;
        border: 2px solid #7B1FA2;
    }

    .button6:hover {
        background-color: #7B1FA2;
        color: white;
        border: 2px solid #7B1FA2;
    }

    .border_bottm{
        border-top: 0px; 
        border-right: 0px;
        border-bottom: 2px solid #ef5350;
        border-left: 2px solid #ef5350;
        -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
        box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    }
    
    .border_left{
        border-top: 0px; 
        border-left:  2px solid #ef5350;
        border-bottom: 0;
        border-right: 0;
            
    }

    .border_top{
        border-top:  2px solid #ef5350;
        border-right: 0px;
        border-bottom: 0px; 
        border-left: 2px solid #ef5350;
    
    }

    .select_rate{ 
        background: rgba(0,0,0,0.1);
        color:#ff0000;
        text-shadow:0 1px 0 rgba(0,0,0,0.1);
        border: 1px solid transparent;
    }

    /*------------------ Loading -----------------------*/
    .loading {
        display: none;
        position: fixed;
        z-index: 999;
        height: 2em;
        width: 2em;
        overflow: visible;
        margin: auto;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
    }

    /* Transparent Overlay */
    .loading:before {
        content: '';
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.3);
    }

    /* :not(:required) hides these rules from IE9 and below */
    .loading:not(:required) {
        /* hide "loading..." text */
        font: 0/0 a;
        color: transparent;
        text-shadow: none;
        background-color: transparent;
        border: 0;
    }

    .loading:not(:required):after {
        content: '';
        display: block;
        font-size: 10px;
        width: 1em;
        height: 1em;
        margin-top: -0.5em;
        -webkit-animation: spinner 1500ms infinite linear;
        -moz-animation: spinner 1500ms infinite linear;
        -ms-animation: spinner 1500ms infinite linear;
        -o-animation: spinner 1500ms infinite linear;
        animation: spinner 1500ms infinite linear;
        border-radius: 0.5em;
        -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
        box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
    } 
    #popup_cookie
    {
        position: fixed;
        width: 100%;
        bottom: 0;
        z-index: 999;
    }
    #popup_cookie .background
    {
        background-color: #fff;
        color: #000;
        padding: 20px 30px;
        box-shadow: 0px -5px 20px grey;
    }
    #popup_cookie .div_txt
    {
        width: calc(100% - 90px);
        display: inline-block;
    }
    #popup_cookie .div_btn
    {
        width: 80px;
        height: 100% !important;
        display: inline-block;
        text-align: right;
        vertical-align: top;
    }
    #popup_cookie a
    {
        color:#2ae149;
    }
    .coloreee{
        background-color: #2ae149;
    }
