
/** for Debug */
.aa { border: dashed 1px #ff0000 !important; }
.bb { border: dashed 1px #0000ff !important; }
.cc { border: dashed 1px #008000 !important; }
.yy { border: dashed 1px #ffff00 !important; }
.ww { border: dashed 1px #FFF !important; }
.kk { border: dashed 1px #000 !important; }

/** WebFont : Default */
.font-default {
  font-family: 'Prompt', sans-serif !important;
}

/*
.fonttile{
  font-family: 'Prompt', sans-serif !important;
  color : #FA9602 !important;
}
*/

/** Website */
html, body {
    height: 100%;
    /*background-color: #200200 !important;*/
}
.cwc-css {
    border-radius: 999px;
    user-select: none;
    cursor: pointer;
    box-shadow: rgba(204, 204, 204, 0.5) 0px 2px 10px 0px;
    border: 1px solid rgb(232, 232, 232);
    background-color: rgb(255, 255, 255);
    line-height: 0;
    padding: 4px;
    width: 40px;
    height: 40px;
    z-index: -1;
    position: absolute;
    left: 0px;
    top: 0px;
    transition: transform 0.1s linear 0s, opacity 0.4s linear 0ms, visibility 0ms linear 0ms;
}

.section_body {
  background: black !important;

}
.panel_cover {
    padding-left: 2rem;
    padding-right: 2rem;
    font-size: 14px;
}
.panel_howto {

}

.panel_share {

}

.home_alpha{
    max-width: 1024px;
}

/** Override : Boostrap5 */
.container_max {
    max-width: 1024px;
}

.btn {
  position: relative;
  overflow: hidden;
}
.btn-warning {
  background: #FD9505;
  border-color: #FD9505;
}
.border-warning{
  border-color: #FA9602 !important;
}
.btn-primary{
  background: #3B5998;
  border-color: #3B5998;

}
.amtbtn{
  width: 25%;
}
.btn-lightyellow,
.btn-lightyellow:hover,
.btn-lightyellow:active,
.btn-lightyellow:visited,
.btn-lightyellow:focus {
    color: #4C9E41;
    background-color: #F3F1E9;
    border-color: #F3F1E9;
}
.form-check-lg {
    font-size: 150%;
}
.form-switch-success .form-check-input:focus {
    border-color: #8efe86;
    box-shadow: 0 0 0 0.25rem rgb(13, 253, 46, 0.35);
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(0,0,0,0.25)'/></svg>");
}
.form-switch-success .form-check-input:checked {
    background-color: #30D158;
    border-color: #30D158;
    border: none;
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(255,255,255,1.0)'/></svg>");
}


/** Override : Grid.js */
.gridjs-table{
    min-width: 100% !important;
}
.gridjs-table .gridjs-thead > tr > th,
.gridjs-table .gridjs-tbody > tr > td {
    border-left: 0 !important;
    border-right: 0 !important;
}
.gridjs-wrapper {
  border-radius: 2px 2px 0 0 !important;
}
.gridjs-footer {
  border-radius: 0 0 2px 2px !important;
}


/** Ripple : Action Click */
.default_ripple{
  position: absolute;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.5);
  transform: scale(0);
  animation: default_ripple 0.5s linear;
}
@keyframes default_ripple{
  to{
    transform: scale(2.5);
    opacity: 0;
  }
}

/** Disable select */
.no-select {
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none; /* Safari */
	-khtml-user-select: none; /* Konqueror HTML */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
	user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}

/** Disable drag */
.no-drag {
	-webkit-user-drag: none;
	-khtml-user-drag: none;
	-moz-user-drag: none;
	-o-user-drag: none;
	user-drag: none;
}

/** Loading : Default  */
.loading_hide { opacity: 0;}
.loading_checkmark { display: none;}
.loading_circle { display: inline-block; position: relative; width: 3.8rem; height: 3.8rem; border: 3px solid rgba(0, 0, 0, 0.2); border-left-color: #0d6efd; animation: loading_spin 0.75s infinite linear; vertical-align: top; border-radius: 50%;}
.loading_complete { animation: none; -webkit-animation: none; border-color: #5cb85c; transition: border 500ms ease-out;}
.loading_checkmark.loading_draw:after { animation-duration: 1000ms; animation-timing-function: ease; animation-name: loading_checkmark; transform: scaleX(-1) rotate(135deg);}
.loading_checkmark:after { position: absolute; left: 0.9rem; top: 1.9rem; width: 0.8rem; height: 1.8rem; transform-origin: left top; border-right: 3px solid #5cb85c; border-top: 3px solid #5cb85c; content: ''; opacity: 1;}
@keyframes loading_spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); }}
@keyframes loading_checkmark { 0% { height: 0; width: 0; opacity: 1; } 20% { height: 0; width: 0.8rem; opacity: 1; } 40% { width: 0.8rem; height: 1.8rem; opacity: 1; } 100% { width: 0.8rem; height: 1.8rem; opacity: 1; }}
.fontAwesome {
  font-family: Helvetica, 'FontAwesome', sans-serif;
}
.background-line {
    position: relative;
    z-index: 1;
    margin-top: 30px;
    text-align: center;
}
.f18px {
    font-size: 18px!important;
}

.modal-body,.modal-header {
  overflow-y: auto;

  border-radius: 14px #FA9602;
}
/* .modal-content{

} */
.modal-close {
  font-weight: bold;
  color: white;
  line-height: 50px;
  font-size: 80%;
  position: absolute;
  right: 0;
  text-align: center;
  top: 20;
  width: 70px;
  text-decoration: none;
  &:hover {
    color: white;
  }
}

div.stymodal {
  background-color: #21262a !important;
  color: white;
  border-radius: 15px !important;


}
.modal-backdrop.show {
    opacity: 0.9;
}
@media only screen and (min-width: 1080px) {
   .font-social {
        font-size: 16px !important;
    }
    .panel_cover{
        font-size: 16px !important;
    }

}

@media(max-width: 375px){
    .font-social {
        font-size: 12px !important;
    }
    .panel_cover{
        font-size: 12px !important;
    }

}
