/*! 
    Theme Name: New Theme
    Version: 1.0
*/
@import url('https://fonts.googleapis.com/css2?family=Kanit&display=swap');
body{
    background-color: transparent;
    background-image: linear-gradient(180deg,#180f3a 0,#100928 100%);

}
*{
    font-family:"Kanit" ;
}
h1{
    font-size: 26px!important;
}

.section_one{
  
    border-style: solid;
    border-width: 3px;
    border-color: #25c1b6;
    border-radius: 8px 8px 8px 8px;
    box-shadow: 0 0 10px 0 #000;
}
.section_two h2{
        color: #e7b430 ;

}
.banner_two img{
    width: 90%;
    border-style: solid;
    border-width: 0 0 2px;
    border-color: #e7b430;

}

        
.section_three{
       

        border-left: 3px solid #e02a7d;
            
    padding-top: 15px;
    padding-bottom: 15px;

}
.section_three p{
    font-size: 20px;
 
    
}
.section_four h2{
    font-size: 22px!important;
    color: #e02a7d;
    font-weight: 600;
}
#title_four p{
    font-size: 20px!important;
    font-weight: 600!important;
}



progress::-webkit-progress-value { background: #25c1b6; }
progress {
    border-radius: 50px!important;

  text-align: center;
  color: white!important;

}
progress:after {
  content: attr(value)'%';
}

.custompanel-green{
 padding: 12px;
    background-color: #25c1b6;
    border-style: solid;
    border-width: 2px;
    border-color: #25c1b6;
    border-radius: 8px 8px 8px 8px;
}
.custompanel-pink{
   padding: 12px;
    background-color: #e02a7d;
    border-style: solid;
    border-width: 2px;
    border-color: #e02a7d;
    border-radius: 8px 8px 8px 8px;
}
.custompanel-yellow{
    padding: 12px;
    background-color: #e7b430;
    border-style: solid;
    border-width: 2px;
    border-color: #e7b430;
    border-radius: 8px 8px 8px 8px;
}

.custome_border-green{
    border-style: solid;
    border-width: 2px;
    border-color: #25c1b6;

}
.custome_border-pink{
    border-style: solid;
    border-width: 2px;
    border-color: #e02a7d;
}
.custome_border-yellow{
    border-style: solid;
    border-width: 2px;
    border-color: #e7b430;

}
.custom-radius{
    border-radius: 8px 8px 8px 8px;

}
.article_title{
        padding: 6px;
    background-color: #e02a7d;
    border-style: solid;
    border-width: 2px;
    border-color: #e02a7d;
    border-radius: 8px 8px 8px 8px;
}
.article_title-green{
        padding: 6px;
    background-color: #25c1b6;
    border-style: solid;
    border-width: 2px;
    border-color: #25c1b6;
    border-radius: 8px 8px 8px 8px;
}
.article_title-yellow{
        padding: 6px;
    background-color: #25c1b6;
    border-style: solid;
    border-width: 2px;
    border-color: #e7b430;
    border-radius: 8px 8px 8px 8px;
}
h2{
      font-weight:600;
      font-size: 23px!important;
}
.banner-mobile{ 
        display: none!important;
}

#menu-header li:hover {
   color: yellow!important;
} 
#menu-header li:hover {
   color: yellow!important;
} 

.form .form-control {
    color: #000!important;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: all .5s;
    background: #fff;
    border: 2px solid #fff!important;
    -webkit-box-shadow: 0 4px 4px rgba(0,0,0,.25), inset 0 4px 4px rgba(0,0,0,.25);
    box-shadow: 0 4px 4px rgba(0,0,0,.25), inset 0 4px 4px rgba(0,0,0,.25);
    position: relative;
    padding-left: 1rem!important;
    border-top-left-radius: 5px!important;
    border-top-right-radius: 5px!important;
    border-bottom-left-radius: 5px!important;
    border-bottom-right-radius: 5px!important;
    z-index: 0;
}
.btn_login {
    color: #fff!important;
    background: linear-gradient(180deg,#51f5e9 0,#25c1b6 100%);
    border: 2px solid #fff;
    -webkit-box-shadow: 0 4px 4px rgba(0,0,0,.25);
    box-shadow: 0 4px 4px rgba(0,0,0,.25);
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: all .5s;
}
.btn_register {
    color: #fff!important;
    background: linear-gradient(180deg,#ff4a9d 0,#e02a7d 100%);
    border: 2px solid #fff;
    box-shadow: 0 4px 4px rgba(0,0,0,.25)!important;
    -o-transition: .5s;
    transition: all .5s;
}

@media only screen and (max-width: 415px) {
    .banner-mobile{ 
        display: inline!important;
    }
   
    .banner-desktop{
        display: none!important;
    }
    .desktop{
        display:none!important;
        visibility: hidden!important;
    }
    #panel_one img{
        width: 290px;

    }
    #panel_two img{
        width: 290px;

    }
    #panel_three img{
        width: 290px;

    }

}



/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    color: #F827F6;
    padding: 0.9rem 0.0rem;
}
/* change the link color and add padding for height */
.navbar-custom .navbar-nav .nav-link {
    color: red;
    padding: 1rem 1rem;
}
/* change the color of active or hovered links */
.navbar-custom .nav-item .nav-link,
.navbar-custom .nav-item .nav-link {
    font-family: Kanit,Sans-serif;
    font-weight: 600;
        font-size: 15px!important;

}
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    font-family: Kanit,Sans-serif;
    font-weight: 600;
    font-size: 15px!important;
    color: #e7b430!important;
    fill: #E7B430!important;

}

/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    color: rgba(255,255,255,.8);
}

/* change the link color */
.navbar-custom .navbar-nav .nav-link {
    color: red;
}

/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    color: #ffffff;
}

/* for dropdown only - change the color of droodown */
.navbar-custom .dropdown-menu {
    background-color: #ff5500;
}
.navbar-custom .dropdown-item {
    color: #ffffff;
}
.navbar-custom .dropdown-item:hover,
.navbar-custom .dropdown-item:focus {
    color: #333333;
    background-color: rgba(255,255,255,.5);
}
.header-section{
    border-style: groove;
    border-width: 0 0 3px;
    border-color: #e7b315;
    transition: background .3s,border .3s,border-radius .3s,box-shadow .3s;
}

.section_seven h2{
    color: #25c1b6;
}
.section_eight h2{
    color: #e7b430;
}
.section_nine h2{
    color: #e02a7d
}

.section_eleven h2 {
    color: #25c1b6;
}
 
h3{
     font-family: Kanit,Sans-serif;
    font-size: 20px;
}
.card{
    border: none!important;
    background-color: transparent;
    background-image: linear-gradient(180deg,#180f3a 0,#100928 100%);
}
.sectionlist2 h5{
    color: #e02a7d!important;
    font-family: Kanit,Sans-serif!important;
    font-size: 18px!important;
    font-weight: 400!important;
}
 #footer_panel h5{
    font-family: Kanit,Sans-serif;
    font-size: 1.1rem;
    font-weight: 600;
 }
#footer_panelone{
    border-radius: 9px 9px 9px 9px;
    border-style: solid; 
    border-width: 0 2px 0 3px;
    border-color: #e7b430;
 
}
#footer_paneltwo{
    border-radius: 9px 9px 9px 9px;
    border-style: solid; 
    border-width: 0 2px 0 3px;
    border-color: #e02a7d;
 
}
#footer_panelthree{
    border-radius: 9px 9px 9px 9px;
    border-style: solid; 
    border-width: 0 2px 0 3px;
    border-color: #25c1b6;
 
}
.left-border_one{
    margin-left: 15px;
    border-style: solid;
    border-width: 0 0 0 3px;
    border-color: #e7b430;
}
.left-border_two{
    margin-left: 15px;
    border-style: solid;
    border-width: 0 0 0 3px;
    border-color: #e02a7d   ;
}
.left-border_three{
    margin-left: 15px;
    border-style: solid;
    border-width: 0 0 0 3px;
    border-color: #25c1b6;
}
#list_one a{
    color: white;

}
#list_two a{
    color: white;

}
#list_three a{
    color: white;

}
#list_one span{
    color: #e7b430;

}
#list_two span{
    color: #e02a7d;

}
#list_three span{
    color: #25c1b6;

}
#copyright{
    background-color: #e7b430 ;
    width: 100%!important;
}
#copyright span{
    color: #fff;
    font-family: Kanit,Sans-serif;
    font-weight: 400;
}

.text-justify{
    text-align: justify;;
}
.title-green{
    color: #25c1b6!important;
}
.title-pink{
    color: #e02a7d!important;
}
.title-yellow{
    color: #e7b430!important;
    
}
h5{
    font-family: Kanit,Sans-serif!important;
    font-size: 17px!important;
    font-weight: 600!important;

}
/*summary {

 font-weight: 600;

 color: rgb(255, 255, 255);

 background-color: rgb(7, 185, 255);

 padding: 1.2rem;

 margin-bottom: 1.2rem;

 border-radius: 0.5rem;

 cursor: pointer;

}*/
#footer_section{
    border-style: groove;
    border-width: 3px 0 0;
    border-color: #e7b315;
    transition: background .3s,border .3s,border-radius .3s,box-shadow .3s;
    padding: 10px;
}
.article{
    padding: 15px 10px;
    background-color: #160f35;
    border: 2px solid #E7B430;
    border-radius: 9px 9px 0 0;
}
#article_content h2{
    font-weight: 400!important;
}

#article_content ul{
    list-style-type: square;
    color: #e02a7d!important;
}
#article_content a{
    text-decoration: none;
}
#category_list a{
    text-decoration: none;
    color: white!important;
}
#category_list li{
    background: #161036!important;
    font-size: 0.9rem!important;
    text-align: left!important;
    list-style-type: none!important;
    border: 2px solid #DDD!important;
    border-radius: 10px 0px!important;
    padding: 5px!important;
    margin: 7px!important;
}
#category_list li:before {
    color: #FFF;
  
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    padding: 0.2rem;
}