body {
  /*font-size: .875rem;*/
  overflow-x: hidden;
}

.container-fluid{
  overflow-x: auto;
  overflow-y: auto;
}

*::-webkit-scrollbar-thumb {
    /*-webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
    background-color: #555;*/
    border-radius: 10px;
    background-color: #fff;
    border: 2px solid #bdc2c4;
}
*::-webkit-scrollbar-track {
  /*-webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
  background-color: #F5F5F5;*/
  background-color: #bdc2c4;
  border-color: #bdc2c4;
}
*::-webkit-scrollbar {
  /*width: 12px;
  background-color: #F5F5F5;*/
  background-color: #4f5e65;
  border-color: #4f5e65;
  width: 9px;
  height: 9px;
}

.feather {
  width: 20px;
  height: 16px;
  vertical-align: text-bottom;
  margin: auto;
  height: 1.5rem;
}



.sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 2; 
  padding: 0;
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
  overflow-x: hidden;
  overflow-y: hidden;
}

.sidebar-sticky {
  position: -webkit-sticky;
  position: sticky;
  /*height: calc(100vh - 15vh);*/
  /*padding-top: 7rem;*/
  overflow-x: hidden;
  overflow-y: hidden; 
}

.nav-small-item{
  padding-left: 2rem;
    font-size: 1rem;
}

.feather-small{
  width: 16px;
  height: 16px;
  vertical-align: text-bottom;
  margin: auto;
  height: 1.3rem;
}


.sidebar .nav-link {
  font-weight: 600;
  color: #333;
  font-size: 1.2rem;
}

.sidebar .nav-link .feather {
  margin-right: 4px;
  color: #999;
}

.sidebar .nav-link.active {
  color: #007bff;
}

.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
  color: inherit;
}

.sidebar-heading {
  font-size: .75rem;
  text-transform: uppercase;
}

.navbar-brand {
  /*padding-top: .75rem;
  padding-bottom: .75rem;*/
  font-size: 1.2rem;

}

.navbar .form-control {
  padding: .75rem 1rem;
  border-width: 0;
  border-radius: 0;
}

.form-control-dark {
  color: #fff;
  background-color: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .1);
}

.form-control-dark:focus {
  border-color: transparent;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}


.border-top { border-top: 1px solid #e5e5e5; }
.border-bottom { border-bottom: 1px solid #e5e5e5; }



/*/////////////////////////////////////////////////警告(輪播器管理) */ 
.alert_manage_carousel_upload_ok {
  /*padding: 20px;
  background-color: #4CAF50;
  color: white;*/
  position: fixed;
    z-index: 1151;
    bottom: 10%;
    display: none;
}
.alert-success {
  background-color: #b4e7c0;
}

.alert-danger {
  background-color: #ecbbbf;
}

.closebtn_manage_carousel,.closebtn_manage_ad_style {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn_manage_carousel:hover,.closebtn_manage_ad_style:hover {
  color: black;
}

/*////////////////////////////////*/

.alert_manage_carousel_upload_notok {
  /*padding: 20px;
  background-color: #f44336;
  color: white;*/
  position: fixed;
    z-index: 1151;
    bottom: 10%;
    display: none;
}

.closebtn_notok_manage_carousel,.closebtn_notok_manage_ad_style {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn_notok_manage_carousel:hover,.closebtn_notok_manage_ad_style:hover {
  color: black;
}

/*////////////////////////////////*/


.jFiler.jFiler-theme-dragdropbox{
  width: 100%;
}




td.details-control {
  background: url(../css/img/more.png) no-repeat center center;
  cursor: pointer;
  background-size: 20px 20px;}


  tr.shown td.details-control {
    background: url(../css/img/minus.png) no-repeat center center;
    background-size: 20px 20px;}





    #datepicker02 + span {
      padding-right: 30px;
    }
    
    #datepicker02:invalid+span:after {
      position: absolute;
      content: '❌';
      padding-left: 5px;
    }
    
    #datepicker02:valid+span:after {
      position: absolute;
      content: '✔️';
      padding-left: 5px;
    }


.toggle-group > label {
  position: absolute !important;
}

.form-check-inline {
  display: -ms-inline-flexbox;
  -ms-flex-align: center;
  align-items: center;
  padding-left: 0;
  margin: .75rem;
}

.footer {
  width: 100%;
  height: 25px;
  background: #34384A;
  color: #fff;
  float: left;
  bottom: 0;
  left: 0;
  text-align: center;
  line-height: 30px;
  z-index: 2;
  margin-top: 1.7%;
  position: absolute;
}

.navbar-toggler{
  display: none;
}


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

  .sidebar{
    position: fixed;
    top: 8vh;
    z-index: 3;
    top:unset;
    bottom:unset;
    left: unset;
  }

  .sidebar-sticky{
    height: 100%;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .navbar-toggler{
    display: block;
  }

  #ad_style_group_Modal>.modal-dialog.modal-lg{
    max-width: 95vw !important ;
  }
  
  }

  @media screen and (max-width:550px){
    .jquery-grid-picker-widget{
      display: block;
    }
  }



.right_slider_div{
  height: calc(83vh);
  border-left: #e9e5e5 solid;

}


 .edition_type_select_preview{
  border: 2px solid #000000;height: 75px;width: 100px;
  margin-right: 0px;
  margin-left: 0px;
  padding-right: 0px;
  padding-left: 0px;
 }  


 #setting_edition_type_div_mode_select{
  height: 35vh;
  margin: auto;
  aspect-ratio: 16/9;
  min-height: 35vh;
}

@media (max-width: 700px) {
  #setting_edition_type_div_mode_select{
    aspect-ratio: auto;
  }
}

 #setting_edition_type_div_mode_select > .edition_type_select_preview.row  {

    width: 100%;
    height: 100%;
 }


 

 .edition_type_select_main_div{
  display:flex
 }
 
 .edition_type_select_sec_div{
  display:flex
}

.edition_type_select_thr_div{
  display:flex
}

.checkbox-lg .custom-control-label::before, 
.checkbox-lg .custom-control-label::after {
  top: .8rem;
  width: 1.55rem;
  height: 1.55rem;
}

.checkbox-lg .custom-control-label {
  padding-top: 13px;
  padding-left: 6px;
}


.checkbox-xl .custom-control-label::before, 
.checkbox-xl .custom-control-label::after {
  top: 1.2rem;
  width: 1.85rem;
  height: 1.85rem;
}

.checkbox-xl .custom-control-label {
  padding-top: 23px;
  padding-left: 10px;
}


table.dataTable tbody tr {
  font-size: 1.2rem;
  /*height: 2rem;*/
}



.edition_type_vertical_select_preview{
  border: 2px solid #000000;height: 100px;width: 75px;
  margin-right: 0px;
  margin-left: 0px;
  padding-right: 0px;
  padding-left: 0px;
 }  

 #setting_edition_type_div_mode_select >  .edition_type_vertical_select_preview.row  {
  border: 2px solid #000000;height:480px ;width: 270px;
 
  padding-right: 0px;
  padding-left: 0px;
  margin:20 auto;
 }


 #setting_group_div{
  max-height: 25rem;
 }


 .list-group-item{
  background-color: unset;
 }

 #ad_group_owner_style_list{
  margin: auto;
 }


 .content__wrapper_inner{
  width: 100%;
  overflow-y: auto;
  height: 80vh;
  overflow-x: hidden;
 }

 .right_slider_div{
  overflow-y: auto;
 }
 .custom-control-input-check-box {
  left: 0;
  width: 1rem;
  height: 1.25rem;
 }

 .fade:not(.show) {
  opacity: 0;
  display: none;
}
.modal
{
  overflow-y: auto !important;
  /*margin-top: 54px;*/
}




.input-group-text{
  background-color: unset; 
   border: unset;
}
.edition_type_div_selected{
  border: 5px solid blue !important;
}
.edition_type_select{
  display: flex;
}
/*////////////////////////////////////////////////////////////////////////////////////*/
.tooltip {
  position: relative;
  display: inline-block;
  /*border-bottom: 1px dotted black;*/
  opacity: 1;
}

.tooltip .tooltiptext_bottom {
  visibility: hidden;
  width: 200px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  top: 110%;
  left: 20%;
  margin-left: -60px;
}

.tooltip .tooltiptext_bottom::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent black transparent;
}

.tooltip:hover .tooltiptext_bottom {
  visibility: visible;
}

/*//////////////////////////////////////////////////////////*/
.fc .fc-scrollgrid-liquid {
  height: 70vh;
}

/*///////////////////////////////////////////////////////////*/
#ad_style_group_Modal>.modal-dialog.modal-lg{
  max-width: 75vw;
}

/*///////////////////////////////////////////////*/
#fullCalendar a{
color: unset;
}

.fc-timegrid-event{
  min-height: 20px!important;;
}

#login_div{
  
    position: absolute;
    top: 20%;
    left: 0;
    width: 100%;
    height: 500px;
    overflow: hidden;
}

.tab-pane{
  padding:0 1%;
  margin: auto;

}

/*//////////////////////////////////////////////////////////////////////////////////////////////*/

 .device_ststus_online{
  border-color: rgba(57,204,100,0.5); 
  color: #39cc64;
 }
   
 .device_ststus_offline{
     border-color: rgba(240,58,62,0.5);
    color: #f03a3e;
 }

 .device_ststus_unknown{
  border-color: rgba(104, 102, 102, 0.5);
 color: #a7a7a7;
}

.device_ststus_wait{
  border-color: rgba(15, 15, 15, 0.5);
 color: #585757;
}

.appBadge {
      display: inline-block;
      position: relative;
      border-style: solid;
      border-width: 1px;
      background-color: transparent;
      font-size: 0.6em;
      font-weight: 800;
      padding: 0.3em 0.6em 0.35em;
      text-transform: uppercase;
      letter-spacing: .0714285714em;
      border-radius: .2142857143rem;
      white-space: nowrap;
  }

  #nav-tabContent{
    background-color: #f6f6f6; 
    max-height: 52vh;
    overflow-y: auto;
  }


  @media screen and (min-width:991px){
  .div_inner_row{
    height: 57vh;
    border-bottom: 2px solid #dbd8d8;
    
  }
}



.jFiler-input-dragDrop {
  display: block;
  height: 100%;
  margin: 10px;
  padding: 10px;

}

.jFiler-items-grid .jFiler-item .jFiler-item-container{
  margin: 15px;
    padding: 10px;
}

.jFiler-input-text> span{
  margin: 5px 0;
}

#uploadForm{
  margin: 0;
}

.bi-volume-up:hover{
  color: red;
}

/*///////////////////////////////////////////////*/


.form-control::placeholder { 
  color: rgba(131, 131, 131, 0.459);
  opacity: 1; 
}

.form-control:-ms-input-placeholder { 
  color: rgba(131, 131, 131, 0.459);
}

.form-control::-ms-input-placeholder { 
  color: rgba(131, 131, 131, 0.459);
}


/*/////////////////////////////////////////////*/
.program_feedback_option_input{
  margin: 3%;
  width: 20vh;
}

#program_feedback_result{
  overflow-y: auto;
  max-height: 35vh;
  background-color: white;
  padding: 5%;
 }

 /*//////////////////////////////////////*/
 .grabbing * {
  cursor: grabbing;
}


/*//////////////////////////////////////////////*/
.card-box {
  position: relative;
  color: #fff;
  padding: 20px 10px 40px;
  margin: 20px 0px;
  box-shadow: 2px 2px 2px #bbbbbb, -1px -1px 1px #bbbbbb;
  border-radius: 3px;
}
.card-box:hover {
  text-decoration: none;
  color: #f1f1f1;
}
.card-box:hover .icon i {
  font-size: 100px;
  transition: 1s;
  -webkit-transition: 1s;
}
.card-box .inner {
  padding: 5px 10px 0 10px;
}
.card-box h3 {
  font-size: 3rem;
  font-weight: bold;
  margin: 0 0 8px 0;
  white-space: nowrap;
  padding: 0;
  text-align: left;
}
.card-box p {
  font-size: 1.5rem;
  font-weight: 600;
}
.card-box .icon {
  position: absolute;
  top: auto;
  bottom: 5px;
  right: 5px;
  z-index: 0;
  font-size: 72px;
  color: rgba(0, 0, 0, 10%);
}
.card-box .card-box-footer {
  position: absolute;
  left: 0px;
  bottom: 0px;
  text-align: center;
  padding: 3px 0;
  color: rgba(255, 255, 255, 0.8);
  background: rgba(0, 0, 0, 0.1);
  width: 100%;
  text-decoration: none;
}
.card-box:hover .card-box-footer {
  background: rgba(0, 0, 0, 0.3);
}
.bg-blue {
  background-color: #00c0ef !important;
}
.bg-green {
  background-color: #00a65a !important;
}
.bg-orange {
  background-color: #f39c12 !important;
}
.bg-red {
  background-color: #d9534f !important;
}
.bg-white {
 
  background-color: #fafafa !important;
}

/*/////////////////////////////////////////////////////////*/
.list-group-item-top-bottom{
  position: relative;
  display: block;
  padding: .75rem 1.25rem;
  border-top: 1px solid rgba(0,0,0,.125);
  border-bottom: 1px solid rgba(0,0,0,.125);
}


.has-search .form-control-feedback {
  position: absolute;
  z-index: 2;
  display: block;
  width: 2.375rem;
  height: 2.375rem;
  line-height: 2.375rem;
  text-align: center;
  pointer-events: none;
  color: #aaa;
}

.has-search .form-control {
  padding-left: 2.375rem;
}



.centered {
	overflow: hidden;
	max-width: var(--ck-sample-container-width);
	margin: 0 auto;
	padding: 0 var(--ck-sample-base-spacing);
}

.editor-container {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  position: relative;
  width: 100%;
  justify-content: center;
}

.ck.ck-reset.ck-editor.ck-rounded-corners{
  width: 100%;
}


.ck.ck-content.ck-editor__editable.ck-rounded-corners.ck-editor__editable_inline{
  height: 40vw;
  overflow: hidden;
}


.modal-content{
  border:0;
}

.modal-header{
  background: #40709f;
  color: #fff;
}

.modal-body{
  background: #eee;
}

.close{
  opacity: 1; 
    color: #fff;
}



/*//////////////////////////////////////*/
.acc_table_css_div{
	float:left;
	background:#fff;
	width:100%;
	margin-top:1%;
	border-radius:1px;
}
.acc_table_css {
	width: 100%;
	table-layout: fixed;
}


.acc_table_css_td_input{
	width:95%;
	border:none;
	padding:2% 0 2% 5%;
	font-size:1em;
}

.acc_table_css_td{
	text-align: left;
	border:1px solid #ebebeb;
  padding:2%;
}

.acc_table_css_th{
  background: #40709f;
  color: #fff;
  text-align: center;
  padding: 8px;
  width: 100%;
}

.acc_edit_site_btn{
	cursor:pointer;	
	font-weight:bold;
	padding:1.5% 20%;
	border-radius:2px;
	background:#ff5c26;
	color:#fff;
	box-shadow:1px 1px 1px #666666;
}

.acc_setting_permission_btn{
	cursor:pointer;	
	font-weight:bold;
	padding:5%;
	border-radius:2px;
	background:#009688;
	color:#fff;
	box-shadow:1px 1px 1px #666666;
}

.acc_del_site_btn{
	cursor:pointer;	
	font-weight:bold;
	padding:5%;
	border-radius:2px;
	background:#d15454;
	color:#fff;
	box-shadow:1px 1px 1px #666666;	
}

.acc_save_btn_0{
	font-weight:bold;
	padding:5%;
	border-radius:2px;
	background:#dddddd;
	color:#fff;
}

.acc_save_btn_1{
	cursor:pointer;
	font-weight:bold;
	padding:5%;
	border-radius:2px;
	background:#4baf7b;
	color:#fff;
	box-shadow:1px 1px 1px #666666;
}


.hide_control_div_css{
	position:absolute;
	z-index:3;
	width:30%;
	left:35%;
	top:30%;
	background:#fff;
	border-radius:10px;
}

.hc_main_div{
	float:left;
	background:#eee;
	width:100%;
	height:80%;
	border-radius:1px;
	overflow-y: auto;
    overflow-x: hidden;
    max-height: 60vh;
}

.create_acc_input{
	width:95%;
	/*padding:5% 2.5%;*/
	border-radius:2px;
	border:none;
	border-bottom:1px solid #ccc;
	text-align:left;
	color:#555555;
	background:#fff;
}
input:focus{
    outline: none;
}

.site_table_css {
	width: 100%;
	background: #fff;
	table-layout: fixed;
}

.site_table_css tr:nth-child(even){
	background:#dddddd;
}

.site_table_css_td{
	text-align: left;
	border:1px solid #ebebeb;
  padding:2%;
}

.site_table_css_th{
	background:#888;
	color:#fff;
	text-align: left;
	padding: 8px;
}



.save_site_control_btn:active {
	background:#2e4b89;
}


.my_acc_input{
	padding:1% 2.5%;
	border-radius:2px;
	border:none;
	text-align:left;
	border-bottom:1px solid #ccc;
	color:#555555;
	background:#fff;
}
.save_my_acc_btn{
	float:left;
	/*width:8%;*/
	margin-top:2%;
	text-align:center;
	background:#4baf7b;
	color:#fff;
	cursor:pointer;
	box-shadow:1px 1px 1px #777;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 0.25rem;
}

.save_my_acc_btn_0{
	float:left;
	/*width:8%;*/
	margin-top:2%;
	text-align:center;
	background:#dddddd;
	color:#fff;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 0.25rem;
}
.save_my_acc_btn:active{
	background:#2f6c4d;
}



/*///////////////////////////////////////////////////////////*/
.input-group-addon2 {
  padding: .5rem .75rem;
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.25;
  color: #495057;
  text-align: center;
  background-color: #fff;
  border: 1px solid rgba(0,0,0,.15);
}
/*//////////////////////////////////////////////////////////////////////////////////////*/
#ad_backstage_auth01_select_site ~ .dropdown-menu.show .dropdown-item.active,
#ad_backstage_auth01_select_site ~ .dropdown-menu.show  .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #343a40;
}

#ad_backstage_ad_scheduling_auth01_select_site ~ .dropdown-menu.show .dropdown-item.active,
#ad_backstage_ad_scheduling_auth01_select_site ~ .dropdown-menu.show  .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #343a40;
}


/*////////////////////////////////////////////////////////*/
.page-item.active .page-link {
  z-index:auto;
}

.channel_view{
  height: 80px;
    width: 100px;
    margin: 10px;
    border-radius: 3px;
    background-color: rgba(138, 138, 138, 0.3);
    display: none;
}

/*/////////////////////////////////////////////////////////////////////*/
#manage_carousel_ad_group_edit .modal-footer{
  background-color: #eee;
}

#manage_carousel_ad_group_edit .modal-body{
  background-color: #fff;
}

.group_apply_style_list_delete_style_group_button:hover{
  color: #f03a3e;
}

.group_apply_style_list_edit_style_group_button:hover{
  color: #f03a3e;
}



/*///////////////////////////////////////////////////////*/
#manage_carousel_table > thead > tr > th{
  background-color: #FFADAB;
}

#manage_ad_style_table > thead > tr > th{
  background-color: #FFC76E;
}

#manage_ad_device_table > thead > tr > th{
  background-color: #c9ead8;
}

#manage_ad_device_enable_table > thead > tr > th{
  background-color: #69b5ff;
}
/*////////////////////////////////////////////////////////////*/
.btn-FFADAB {
  color: #fff;
  background-color: #d9534f;
  border-color: #d9534f;
}
.btn-FFADAB:hover, .btn-FFADAB:focus, .btn-FFADAB:active:hover{
  color: #fff;
  background-color: #961512;
  border-color: #961512;
}
/*////////////////////////////////////////////////////////////*/
.btn-C9D9EA {
  color: #fff;
  background-color: #65a0de;
  border-color: #65a0de;
}
.btn-C9D9EA:hover, .btn-C9D9EA:focus, .btn-C9D9EA:active:hover{
  color: #fff;
  background-color: #4880bd;
  border-color: #4880bd;
}
/*//////////////////////////////////////////////////////////*/
.btn-FFC76E {
  color: #fff;
  background-color: #f39c12;
  border-color: #f39c12;
}
.btn-FFC76E:hover, .btn-FFC76E:focus, .btn-FFC76E:active:hover{
  color: #fff;
  background-color: #975D00;
  border-color: #975D00;
}
/*//////////////////////////////////////////////////////////*/
.btn-C9EAD8 {
  color: #fff;
  background-color: #00A65B;
  border-color: #00A65B;
}
.btn-C9EAD8:hover, .btn-C9EAD8:focus, .btn-C9EAD8:active:hover{
  color: #fff;
  background-color: #006738;
  border-color: #006738;
}
/*//////////////////////////////////////////////////////////*/
.btn-EC8F6A{
  background: #ec8f6a;
    border-color: #ec8f6a;
    color: #fff;
}



/*////////////////////////////////////////////*/
.manage_ad_gp_data_group_device_list_delete_btn:hover{
  color: #f03a3e;
}

.manage_ad_gp_data_group_device_list_edit_btn:hover{
  color: #f03a3e;
}


/*///////////////////////////////////////////////////*/
#edition_type_select_main_div{
position: relative;
}

#edition_type_select_sec_div{
  position: relative;
}

#edition_type_select_thr_div{
  position: relative;
}


/*////////////////////////////////////////////*/
.disable_div{
  pointer-events: none;
    opacity: 0.4;
}

@media screen and (min-width:950px){
  .modal-dialog.modal-lg_for65vw{
    max-width: 65vw!important;
  }
}


.modal-dialog.modal-lg{
  max-width: 85vw;
}

.bd-example-modal-lg{
  padding-right:12px;
}

@media screen and (max-width:600px){
.modal-dialog.modal-lg{
  max-width: 100vw;
}

.bd-example-modal-lg{
  padding-left:12px;
}


}









article {
  width: 100%;
  max-width: 700px;
}

.customLooktag {
  --tag-bg: #b8d7ff;
  --tag-hover: #03a9f4;
  --tag-text-color: #000;
  --tags-border-color: silver;
  --tag-text-color--edit: #111;
  --tag-remove-bg: var(--tag-hover);
  --tag-pad: 0.5em 1em;
  --tag-inset-shadow-size: 1.3em;
  --tag-remove-btn-bg--hover: black;
  display: inline-block;
  min-width: 0;
  border: none;
  font-weight: 700;
  font-size: 1rem;
}

.customLooktag .tagify__tag {
  margin-top: 0;
}

.customLooktag .tagify__tag > div {
  /*border-radius: 25px;*/
}


.customLooktag .tagify__tag:only-of-type .tagify__tag__removeBtn {
  display: none;
}

.customLooktag .tagify__tag__removeBtn {

  margin-left: auto;
  transition: 0.12s;
}

.customLooktag .tagify__tag:hover .tagify__tag__removeBtn {
  transform: none;
  opacity: 1;
  margin-left: auto;
}

.customLooktag + button {
  /*color: #0052bf;
  font: bold 1.65em/1.65 Arial;
  border: 0;
  background: none;
  box-shadow: 0 0 0 2px inset currentColor;
  border-radius: 50%;
  width: 1.65em;
  height: 1.65em;
  cursor: pointer;
  outline: none;
  transition: 0.1s ease-out;
  margin: 0 0 0 5px;
  vertical-align: top;*/
  color: #0052bf;
  font: icon;
  border: 0;
  font-size: 1.5rem;
  font-weight: 700;
  background: none;
  box-shadow: 0 0 0 2px inset currentColor;
  border-radius: 50%;
  width: 1.8rem;
  height: 1.8rem;
  cursor: pointer;
  outline: none;
  transition: 0.1s ease-out;
  margin: 0 0 0 5px;
  vertical-align: top;
}

.customLooktag + button:hover {
  box-shadow: 0 0 0 5px inset currentColor;
}

.customLooktag .tagify__input {
  display: none;
}


.tooltip .selecttagtooltip{
  visibility: hidden;
  width: 200px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -100px;
  opacity: 0;
  transition: opacity .3s;
}

.tooltip:hover .selecttagtooltip {
  visibility: visible;
}
.tooltip .selecttagtooltip::after{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.tooltip .copybuttontooltip {
  visibility: hidden;
  width: 200px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 110%;
  left: 0%;
  margin-left: -60px;
}

.tooltip .copybuttontooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent black transparent;
}

.tooltip:hover .copybuttontooltip {
  visibility: visible;
}


#ad_backstage_show_classroom_select_div .bootstrap-select .dropdown-menu{
  z-index: 2000;
}


#manage_carousel_backstage_added_new_style_delivery_table > thead > tr > th {
  /*background-color: #abc9ff;*/
  background-color: #FFADAB;
}

#manage_carousel_backstage_deleted_style_delivery_table > thead > tr > th {
  background-color: #d4d4d4;
}

.table_hight{
  height:5rem;
}
.search{
  position: absolute;
  z-index: 2;
  display: block;
  width: 2.375rem;
  height: 2.375rem;
  line-height: 2.375rem;
  text-align: center;
  pointer-events: none;
  color: #aaa;
}
.input_broadcast{
  width:50%;
  display: flex;
  flex-direction: column;
}
.input_broadcast_title{
  width:100%;
  height: 30px;
  
}
#input_broadcast_text{
  height:100%;
  padding:2%;
}
.input_broadcast_text{
  resize:none;
  width:100%;
}
.choose_tv{
  width:50%;
  height:65vh;
  
}
.search_input{
  padding-left: 2.375rem;
}
.flex{
  width: 100%;
  height: auto;
  display: flex;
}
.font_center{
  display: flex;
  align-items: center;
  margin:0px;
}
.margin_1{
  margin-bottom:0.75rem;
}
#input_number:focus {
  outline-width: 0;
}
.emergency_message_delete_text:focus{
  outline-width: 0;
}
.emergency_message_h5{
  margin:0px; 
  margin-right: auto; 
  font-weight:bold;
}
.btn_sec{
  padding:2px; 
  margin-right:5px;
}
.btn_type{
  padding:2px; 
  margin-right:5px;
}
/*.checkbox_cannot_checked{
  background-color: rgba(247, 0, 0, 0.719);
}
.checkbox_cannot_checked:hover{
  background-color: rgba(247, 0, 0, 0.719);
}*/
.checkbox_cannot_checked{
  background: repeating-linear-gradient(-45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 5px, rgba(255, 0, 0, 0.3) 0, rgba(255, 0, 0, 0.3) 10px);
  /*background-color: rgba(255, 0, 0, 0.3);*/
  
}
.input_time{
  border:none;
  text-align:center;
  width:45px;
}
.input_time:focus {
  outline-width: 0;
}
#select_time:focus{
  outline-width: 0;
}

.future_broadcast_title{
  margin:0px; 
  font-size:0.9rem;
  /*padding:0px;*/
}

.future_broadcast_show_time{
  margin:0px;
  font-size:0.9rem;
  /*padding:0px;*/
}
.is_playing{
  background:#ff000055;
}
.is_playing:hover{
  background:#ff000055;
}
.conflict_device{
  background:#ff000088;
}
.conflict_device:hover{
  background:#ff000088;
}

/*.style_btn{
  border-color: #66A3FF;
  color: #3a8bdb;
}
.style_btn:hover{
  background-color: #66A3FF;
  color:#FFFFFF;
}*/

.cancel_btn{
  border-color: #66A3FF;
  color: #3a8bdb;
}
.cancel_btn:hover{
  background-color: #3a8bdb;
  color:#FFFFFF;
}

/*.modal_btn{
  background-color: #3a8bdb;
  color:#FFFFFF;
}
.modal_btn:hover{
  background-color: #3a8bdb;
  color:#FFFFFF;
}*/

.select_btn{
  border-color: #ddd;
  color: gray;
}
.select_btn:hover{
  border-color: #3a8bdb;
  background-color: #3a8bdb;
  color: #FFFFFF;
}

.selected_btn{
  border-color: #3a8bdb;
  background-color: #3a8bdb;
  color: #FFFFFF;
}
.selected_btn:hover{
  border-color: #3a8bdb;
  background-color: #3a8bdb;
  color: #FFFFFF;
}

.input_select_btn{
  border-color: #ddd;
  color: gray;
}

.input_selected_btn{
  border-color: #3a8bdb;
  background-color: #3a8bdb;
  color: #FFFFFF;
}

/*//////////////////////////////////////////////////////////*/
.style_btn {
  color: #fff;
  background-color: #66A3FF;
  border-color: #66A3FF;
}
.style_btn:hover, .style_btn:focus, .style_btn:active:hover{
  color: #fff;
  background-color: #3e639b;
  border-color: #3e639b;
}
/*//////////////////////////////////////////////////////////*/
/*//////////////////////////////////////////////////////////*/


#multiple_select_day_of_the_week_for_time_switchpoweron_div > .jquery-grid-picker-widget{
  grid-gap: 0.5em;
}

#multiple_select_day_of_the_week_for_time_switchpoweroff_div > .jquery-grid-picker-widget{
  grid-gap: 0.5em;
}

@media (max-width: 1100px) {
  #multiple_select_day_of_the_week_for_time_switchpoweron_div > .jquery-grid-picker-widget{
    display: block;
  }
  
  #multiple_select_day_of_the_week_for_time_switchpoweroff_div > .jquery-grid-picker-widget{
    display: block;
  }
}


@media (max-width: 500px) {
#manage_carousel_backstage_added_new_style_delivery_table_wrapper{
  overflow-x: auto;
}
#manage_carousel_backstage_deleted_style_delivery_table_wrapper{
  overflow-x: auto;
}
#manage_carousel_table_wrapper{
  overflow-x: auto;
}
}

.tooltip-inner {
  max-width: none;
  white-space: nowrap;
}



.bootbox-alert,
.bootbox-confirm{
  background-color: #0000004d;
}

.bootbox-alert .modal-content,
.bootbox-confirm .modal-content{
  position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.5rem;
    outline: 0;
}

.bootbox-alert .modal-body,
.bootbox-confirm .modal-body{
  position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 1rem;
  background: #fff;
  border-radius: 0.5rem;
  font-size: 1rem;
}

.bootbox-alert .modal-footer,
.bootbox-confirm .modal-footer{
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: end;
  justify-content: center;
  padding: 1rem;
  border-top: 1px solid #e9ecef;
}

.bootbox-close-button{
  color: #000;
}

.bootbox.modal {z-index: 1080 !important;}


@media (max-width: 992px) {
  #setting_edition_type_div_radio_select{
    overflow-y: hidden;
     height: 100%;
  }
  }

  @media (min-width: 993px) {
#setting_edition_type_div_radio_select{
  overflow-y: auto;
  height: 45vh;
}
}


.input-group-append .btn, .input-group-prepend .btn{
  z-index: 0;
}

.bg-084a4e{
  background-color: #084a4e!important;
}

.bg-437B7F{
  background-color: #437B7F!important;
}



.card-item:hover{
  /*background-color: #ccc;*/
  color: #007bff;
}
.card-item{
  cursor: pointer;
}



.back_to_ad_menu_list_btn{
  cursor :pointer;
  color: #f44336;
}

.back_to_ad_menu_list_btn:hover{
  color: #f4433678;
}


#manage_ad_silent_broadcast_Table_filter{
  text-align: right;
  margin: 0px
}

/*.btn-outline-blue{
  border-color: #3a8bdb;
  color: #3a8bdb;
}

.btn-outline-blue:hover{
  border-color: #3a8bdb;
  background-color: #3a8bdb;
  color: #ffffff;
}
.btn-outline-blue:focus{
  box-shadow: 0 0 0 0.2rem hsl(210, 69%, 54%, 50%)
}*/

.btn-outline-skyblue{
  border-color: #3a8bdb;
  color: #3a8bdb;
}

.btn-outline-skyblue:hover{
  border-color: #3a8bdb;
  background-color: #3a8bdb;
  color: #ffffff;
}
.btn-outline-skyblue:focus{
  box-shadow: 0 0 0 0.2rem hsl(210, 69%, 54%, 50%)
}


#div_show_statistic_chart{
  border-top: 1px solid rgba(0,0,0,.2);
  margin-bottom: 1rem;
}

/*.broadcast_nav{
  font-weight: 600;
  color: #495057!important;
  border-top-left-radius: 0.25rem!important;
  border-top-right-radius: 0.25rem!important;
}

.broadcast_nav.active{
  color: #66A3FF!important;
  
}*/

#manage_ad_broadcast_photo_and_video_Table_filter{
  text-align: right;
  margin: 0px
}




  .btn-ios-inspired {
  color: #084a4e;
  background-color: #fff;
  border-color: #04b4b4;
  }
  .btn-ios-inspired:hover, .btn-ios-inspired:focus, .btn-ios-inspired:active, .btn-ios-inspired.active, .open > .btn-ios-inspired.dropdown-toggle {
  color: #fff;
  /*background-color: #084a4e;*/
  background-color: #437B7F!important;
  border-color: #04b4b4;
  }


  .ellipsis1 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}



/*****************************************************************************************************/
.btn-broadcast-type-style{
  border-color: #57B490;
  color: #57B490;
  background-color: #fff;
}

.btn-broadcast-type-style:hover{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn-broadcast-type-style:focus{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-broadcast-type-style.selected{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.border-gray{
  border: 1px solid #dee2e6!important;
}

.border-gray:focus{
  outline: none !important;  
}

.fw-600{
  font-weight: 600;
}

.btn-b-input-mode-style{
  border-color: #437B7F;
  color: #437B7F;
}

.btn-b-input-mode-style:hover{
  border-color: #437B7F;
  background-color: #437B7F;
  color: #ffffff;
}

.btn-b-input-mode-style:focus{
  border-color: #437B7F;
  background-color: #437B7F;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-b-input-mode-style.selected{
  border-color: #437B7F;
  background-color: #437B7F;
  color: #ffffff;
}



.fs-08{
  font-size: 0.8rem;
}

.fs-09{
  font-size: 0.9rem;
}

.fs-10{
  font-size: 1rem;
}

.fs-11{
  font-size: 1.1rem;
}

.fs-12{
  font-size: 1.2rem;
}


.fs-13{
  font-size: 1.3rem;
}

.nav-b-tab-style{
  font-weight: 600;
  color: #495057!important;
  border-top-left-radius: 0.25rem!important;
  border-top-right-radius: 0.25rem!important;
}

.nav-b-tab-style.active{
  color: #437B7F!important;
  
}

.div_isShow{
  display: none;
}

.div_isShow.show{
  display: flex!important;
  flex-direction: column!important;
}

.font_equal{
  font-family: Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;
}

.btn-qa-input-mode-style{
  border-color: #1F8179;
  color: #1F8179;
}

.btn-qa-input-mode-style:hover{
  border-color: #1F8179;
  background-color: #1F8179;
  color: #ffffff;
}

.btn-qa-input-mode-style:focus{
  border-color: #1F8179;
  background-color: #1F8179;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-qa-input-mode-style.selected{
  border-color: #1F8179;
  background-color: #1F8179;
  color: #ffffff;
}

.btn-qa-q-type-style{
  border-color: #57B490;
  color: #57B490;
  background-color: #fff;
}

.btn-qa-q-type-style:hover{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn-qa-q-type-style:focus{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-qa-q-type-style.selected{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn-qa-a-type-style{
  border-color: #57B490;
  color: #57B490;
  background-color: #fff;
}

.btn-qa-a-type-style:hover{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn-qa-a-type-style:focus{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-qa-a-type-style.selected{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.fade:not(.show) {
  opacity: 0;
  display: none!important;
}

.ellipsis1 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.checkbox_qa_a_options{
  width: 25px;
  height: 25px;
  margin: 0rem 0rem 0rem 0.35rem;
  accent-color: #817DAD;
}

.div_qa_a_options{
  display: none;
}

.div_qa_a_options.show{
  display: flex;
}

.lh-12{
  line-height: 1.2;
}

.show_qa div{
  line-height: 1.2;
}

.span-search-icon{
  position: absolute;
  z-index: 2;
  display: block;
  width: 2.375rem;
  height: 2.375rem;
  line-height: 2.375rem;
  text-align: center;
  pointer-events: none;
  color: #aaa;
}

/*.show_tag{
  max-height:0px;
  transition: max-height 2s linear;
  overflow:hidden;
}

.show_tag.show{  
  max-height:100%;
}*/


.show_tag {
  display: none;
  max-height: 0px;
  /* transition: max-height 2s linear; */
  overflow: hidden;
}

.show_tag.show {
  /*display: table;*/

  display: table;
  max-height: 100%;
}

.last_label:last-child{
  margin: 0px!important;
}


.btn-template-tag{
  border-color: #817DAD;
  color: #817DAD;
}

.btn-template-tag:hover{
  border-color: #817DAD;
  background-color: #ffffff;
  color: #817DAD;
}

.btn-template-tag:focus{
  border-color: #817DAD;
  background-color: #ffffff;
  color: #817DAD;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-template-tag.selected{
  border-color: #817DAD;
  background-color: #817DAD;
  color: #ffffff;
}

.btn-padding{
  padding: 0.18rem 0.3rem;
}

.btn-padding:focus {
  box-shadow: 0 0 0 0 rgb(108 117 125 / 50%)!important;
}

.no-focus-shadow:focus {
  box-shadow: 0 0 0 0 rgb(108 117 125 / 50%)!important;
}


/*#btn_filters_b_tag{
  color: #6c757d;
  border-color: #dee2e6;
}

#btn_filters_b_tag:hover {
  color: #6c757d;
  border-color: #6c757d;
}

#btn_filters_b_tag:focus {
  color: #6c757d;
  border-color: #6c757d;
  box-shadow: 0 0 0 0 rgb(108 117 125 / 50%)!important;
}

#btn_filters_b_tag.isFilter{
  border-color: #6c757d;
  background-color: #6c757d;
  color: #ffffff;
}*/

.search-hide{
  display:none!important;
}

.filters-hide{
  display:none!important;
}

.checkbox_user_selected {
  width: 1rem;
  height: 1rem;
  /*margin: 0rem 0rem 0rem 0.35rem;*/
  /*#817DAD*/
  accent-color: #000;

  /*style="margin:0.3rem 0.4rem 0.3rem 0.2rem; width:1rem; height:1rem;"*/
}

.user_is_play_broadcast{
  background-color: #FF8A44;
}

.bg-gray {
    background-color: #f1f1f1!important;
}

.border-white {
  border-color: #fff!important; 
}

.border-bottom.border-white:last-child {
  border-bottom: 0px solid #fff!important;
}

.stu-name-style{
  border: 1px solid #6AB874!important;
  background-color: #6AB874!important;
  color: #FFFFFF;
}

.qa-correct-answer{
  color:green;
}

.btn_filters_tag{
  color: #6c757d;
  border-color: #dee2e6;
  background-color: #fff;
}

.btn_filters_tag:hover {
  color: #6c757d;
}

.btn_filters_tag:focus {
  color: #6c757d;
  box-shadow: 0 0 0 0 rgb(108 117 125 / 50%)!important;
}

.btn_filters_tag.isFilter{
  border-color: #324B4B;
  background-color: #324B4B;
  color: #ffffff;
}

input[name="radio_select_a_choose_type[]"]{
  width: 18px;
  height: 18px;
  margin: 0rem /*0rem 0rem 0.35rem*/;
  accent-color: #817DAD;
  
}

.select-more-q-list-btn{
  width: 22px;
  height: 22px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  font-size: 1.1rem;
  border: 2px solid #817DAD!important;
  border-radius: .25rem!important;
  color: #817DAD;
}

/*.select-more-q-list-btn:hover{
  border: 1px solid #817DAD!important;
  background-color: #817DAD;
  color: #FFFFFF;

}*/

.select-more-q-list-btn:focus{
  outline: unset;

}


.select-more-q-list-btn.selected{
  border: 1px solid #817DAD!important;
  background-color: #817DAD;
  color: #FFFFFF;

}

.circle-num{/*修改*/
  line-height: 24px;
  width: 24px;
  height: 24px;
  
  border-radius: 50%;
  text-align: center;
  margin-right:0.25rem;

  color: #324B4B;
  background-color: rgb(255, 255, 255);
}

.circle-num:last-child{
  margin-right:0rem;
}

.circle-num:hover{/*修改*/
  color: #fff;
  background-color: #00C598;
}

.circle-num.selected{/*修改*/
  color: #fff;
  background-color: #00C598;
}



.div_show_qa_list{
  display: none;
}

.div_show_qa_list.show{
  display: block;
}

.user_is_play_qa{
  background-color: #FF8A44;
}



.btn-canvas-control {
  color: #fff;
  background-color: #57B490;
  border-color: #57B490;
}

.btn-canvas-control:hover {
  color: #fff;
  background-color: #57B490;
  border-color: #57B490;
}

.btn-canvas-control:focus {
  color: #fff;
  background-color: #57B490;
  border-color: #57B490;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}




.bg-gradient-danger {
  background: #dc3545 linear-gradient(180deg,#e15361,#dc3545) repeat-x!important;
}


.checkbox_qa_a_options_one{
  width: 25px;
  height: 25px;
  margin: 0rem 0rem 0rem 0.35rem;
  accent-color: #817DAD;
}

.div_qa_a_options_one{
  display: none;
}

.div_qa_a_options_one.show{
  display: flex;
}

input[name="radio_select_a_choose_one_type[]"]{
  width: 18px;
  height: 18px;
  margin: 0rem /*0rem 0rem 0.35rem*/;
  accent-color: #817DAD;
  
}

.qa-stu-correct-answer{
  color:green;
}

.qa-stu-wrong-answer{
  color:rgb(217, 68, 27);
}

.set-padding-left-2{
  padding-left: 0.5rem!important;
}


@media (max-width: 767.98px) {
  .title-border-style{
    
    border-bottom: 1px solid #fff!important;
  }

  .set-padding-left-2{
    padding-left: 0rem!important;
  }
  
}

.last-no-pb:last-child{
  padding-bottom: 0px!important;
}


.text-security-none{
  -webkit-text-security: none;
}

.text-security-square{
  -webkit-text-security: disc;
}

/**************************************************************************************/


.btn-orange{
  background-color: #FF8A44;
  color:#FFFFFF;
}
.btn-orange:hover{
  background-color: #FF8A44;
  color:#FFFFFF;
}
.btn-orange:focus{
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}

.btn-outline-orange{
  border-color: #FF8A44;
  color: #FF8A44;
}
.btn-outline-orange:hover{
  border-color: #FF8A44;
  background-color: #FF8A44;
  color: #ffffff;
}
.btn-outline-orange:focus{
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}

.no-shadow:focus{
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}


.btn-media-b-type{
  border-color: #57B490;
  color: #57B490;
  padding:2px 0.25rem;
}

.btn-media-b-type:hover{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn-media-b-type:focus{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-media-b-type.selected{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}



.btn-media-b-type-revise{
  border-color: #57B490;
  color: #57B490;
  padding:2px 0.25rem;
}

.btn-media-b-type-revise:hover{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn-media-b-type-revise:focus{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-media-b-type-revise.selected{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}


.btn_delete_media_b_template_tag{
  color: #fd3e50;
}

.btn_delete_media_b_template_tag_revise{
  color: #fd3e50;
}


.btn-media-qa-q-type-style{
  border-color: #57B490;
  color: #57B490;
  padding:2px 0.25rem;
}

.btn-media-qa-q-type-style:hover{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn-media-qa-q-type-style:focus{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-media-qa-q-type-style.selected{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn_delete_media_qa_template_tag{
  color: #fd3e50;
}

.btn_delete_media_qa_template_tag_revise{
  color: #fd3e50;
}

.btn-media-qa-a-type-style{
  border-color: #57B490;
  color: #57B490;
  padding:2px 0.25rem;
}

.btn-media-qa-a-type-style:hover{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.btn-media-qa-a-type-style:focus{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
  box-shadow: 0 0 0 0rem rgba(255, 255, 255, 0);
  outline: none !important;
}

.btn-media-qa-a-type-style.selected{
  border-color: #57B490;
  background-color: #57B490;
  color: #ffffff;
}

.div_media_qa_a_options{
  display: none;
}

.div_media_qa_a_options.show{
  display: flex;
}

.div_media_qa_a_options_one{
  display: none;
}

.div_media_qa_a_options_one.show{
  display: flex;
}

.checkbox_media_qa_a_options{
  width: 25px;
  height: 25px;
  margin: 0rem 0rem 0rem 0.35rem;
  accent-color: #817DAD;
}

.checkbox_media_qa_a_options_one{
  width: 25px;
  height: 25px;
  margin: 0rem 0rem 0rem 0.35rem;
  accent-color: #817DAD;
}

input[name="radio_select_media_a_choose_one_type[]"]{
  width: 18px;
  height: 18px;
  margin: 0rem /*0rem 0rem 0.35rem*/;
  accent-color: #817DAD;
  
}

input[name="radio_select_media_a_choose_type[]"]{
  width: 18px;
  height: 18px;
  margin: 0rem /*0rem 0rem 0.35rem*/;
  accent-color: #817DAD;
  
}

.svg_white_border{
  /*fill: none;*/
  stroke: #FFFFFF;
  stroke-width: 1px;
  /*stroke-dasharray: 2,2;*/
  stroke-linejoin: round;
}

#mCSB_1_container{
  min-height: 500px;
}

.refreshicon {
  fill: #04b4b4;
  transform: rotate(0deg);
  transition: fill .25s ease, transform .25s ease;
}

.refreshicon:hover {
cursor: pointer;
fill: #437B7F;
transform: rotate(180deg);
}

/*************************************/
.div-template-tag-style{

  background-color: #6D71C2;
  color: #fff;
}

.table-td-style{
  background-color: #04b4b4;
  color:#fff;
}

/*2022-12-08 16:03************************************/


.btn-04b4b4{
  color: #fff;
  background-color: #04b4b4;
  border-color: #04b4b4;
}

.btn-04b4b4:hover{
  color: #fff;
  background-color: #089d9d;
  border-color: #089d9d;
}

.btn-04b4b4:focus{
  color: #fff;
  background-color: #04b4b4;
  border-color: #04b4b4;
  box-shadow: 0 0 0 0rem rgb(58 176 195 / 50%);
}

.btn-00A6EC{
  color: #fff;
  background-color: #00A6EC;
  border-color: #00A6EC;
}

.btn-00A6EC:hover{
  color: #fff;
  background-color: #018dc9;
  border-color: #018dc9;
}

.btn-00A6EC:focus{
  color: #fff;
  background-color: #00A6EC;
  border-color: #00A6EC;
  box-shadow: 0 0 0 0rem rgb(58 176 195 / 50%);
}

.border-bottom-2 { 
  border-bottom: 2px solid #e5e5e5; 
}

.border-bottom-2.border-white:last-child {
  border-bottom: 0px solid #fff!important;
}

.info-bg-gray-style{
  background-color: #f3f4f6;
  border-radius: 0.5rem;
}

.no_highlight {
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}

.fg-1{
  flex-grow: 1;
}

.lh-15{
  line-height: 1.5;
}

.no-outline:focus{
  outline: unset;
}

/*2022-12-13 11:17********************************************************/

.bg-dark-gray{
  background-color: #324B4B;
  color: #fff;
}

#div_show_qa_list > div{
  height: 100%;
  word-break: break-all;
}

.div_show_choose_analysis_chart{
  height:calc(40% - 8px);
}

@media (max-width: 767.98px) {
  .mh-md-unset{
    max-height:unset!important;
  }
  #div_show_qa_list > div{
    height: unset;
  }
  .h-md-auto{
    height: auto!important;
  }

  .div_show_choose_analysis_chart{
    height: 190px;;
  }
  
}

/*2022-12-13 11:45********************************************************/

input[name="radio_select_a_answer_sheet_type[]"]{
  width: 18px;
  height: 18px;
  margin: 0rem /*0rem 0rem 0.35rem*/;
  accent-color: #817DAD;
  
}

.btn_answer_sheet_topics_num{

  width: 34px;
  height: 34px;
  padding: 0px;
  line-height: 1.2;
  font-size: 1.2rem;
}

/*.btn_answer_sheet_topics_num > button:hover{
  color: #FF8A44;
  background-color: #fff;
}

.btn_answer_sheet_topics_num > button:focus{
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}

.btn_answer_sheet_topics_num > button.selected{

  background-color: #FF8A44;
  border-color: #FF8A44;
  color: #fff;
}*/


.btn_answer_sheet_options_num{

  width: 34px;
  height: 34px;
  padding: 0px;
  line-height: 1.2;
  font-size: 1.2rem;
}

/*.btn_answer_sheet_options_num > button:hover{
  color: #50ACE4;
  background-color: #fff;
}

.btn_answer_sheet_options_num > button:focus{
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}

.btn_answer_sheet_options_num > button.selected{

  background-color: #50ACE4;
  border-color: #50ACE4;
  color: #fff;
}*/


.answer_sheet_choose_style > button{
  background-color: #fff;
  border-color: #c4c4c4;
  color: #324B4B;
}

.answer_sheet_choose_style > button:focus{
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}

.answer_sheet_choose_style > button.selected{

  background-color: #FF8A44;
  border-color: #FF8A44;
  color: #fff;
}

.answer_sheet_choose_style{
  margin-left: 0.5rem;
  width: calc(100% - 82.65px);
}

.answer_sheet_choose_title_style{
  width:74.65px;
}

#div_answer_sheet_show_options{
  display: none;
}

#div_answer_sheet_show_options.show{
  display: flex;
  align-items: flex-start;
}


.answer_sheet_set_choose_list > button{
  background-color: #fff;
  border-color: #c4c4c4;
  color: #324B4B;
}

.answer_sheet_set_choose_list > button:focus{
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}

.answer_sheet_set_choose_list > button.selected{

  /*#00A873*/
  background-color: #41C05E;
  border-color: #41C05E;
  color: #fff;
}

.btn_answer_sheet_set_answer_num {
  width: 34px;
  height: 34px;
  padding: 0px;
  line-height: 1.2;
  font-size: 1.2rem;
}

.div_answer_sheet_choose_list{
  display: none;

}

.div_answer_sheet_choose_list.show{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.btn-blue{
  background-color: #058DD2;
  color:#FFFFFF;
}
.btn-blue:hover{
  background-color: #058DD2;
  color:#FFFFFF;
}
.btn-blue:focus{
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}



/*2022-12-19 10:45********************************************************/

input[name="checkbox_media_b_cloud_template_selected[]"]{
  width: 22px;
  height: 22px;
  accent-color: #817DAD;
}

input[name="checkbox_media_qa_template_selected[]"]{
  width: 22px;
  height: 22px;
  accent-color: #817DAD;
}

/*2022-12-28 17:19********************************************************/

input[name="checkbox_use_word_cloud[]"]{
  width: 20px;
  height: 20px;
  accent-color: #817DAD;
}

.div_show_word_cloud{
  height:calc(50% - 8px);
}

@media (max-width: 767.98px) {

  .div_show_word_cloud{
    height: 250px;;
  }
  
}

input[name="checkbox_media_use_word_cloud[]"]{
  width: 20px;
  height: 20px;
  accent-color: #817DAD;
}

/*2022-12-27 09:42********************************************************/
.no-shadow:focus{
  box-shadow: 0 0 0 0 #fff!important;
}

.bootstrap-select .no-outline:focus{
  outline: unset!important;
}

.b-type-style{
  width: fit-content;
  color: #fff;
  padding: 0.25em 0.45em;
  white-space: nowrap;
}

.TextSpanColor{
  background-color: #5DBE7C!important;
}

.PhotoSpanColor{
  background-color: #E9B231!important;
}

.VideoSpanColor{
  background-color: #d03e00!important;
}

.QASpanColor{
  background-color: #00B7DB!important;
}




.btn-b-text-style{
  border-color: #5DBE7C;
  color: #5DBE7C;
  background-color: #fff;
}

.btn-b-text-style:hover{
  border-color: #5DBE7C;
  background-color: #5DBE7C;
  color: #ffffff;
}

.btn-b-text-style:focus{
  border-color: #5DBE7C;
  background-color: #5DBE7C;
  
}

.btn-b-text-style.selected{
  border-color: #5DBE7C;
  background-color: #5DBE7C;
  color: #ffffff;
}


.btn-b-photo-style{
  border-color: #E9B231;
  color: #E9B231;
  background-color: #fff;
}

.btn-b-photo-style:hover{
  border-color: #E9B231;
  background-color: #E9B231;
  color: #ffffff;
}

.btn-b-photo-style:focus{
  border-color: #E9B231;
  background-color: #E9B231;
  
}

.btn-b-photo-style.selected{
  border-color: #E9B231;
  background-color: #E9B231;
  color: #ffffff;
}

.btn-b-video-style{
  border-color: #d03e00;
  color: #d03e00;
  background-color: #fff;
}

.btn-b-video-style:hover{
  border-color: #d03e00;
  background-color: #d03e00;
  color: #ffffff;
}

.btn-b-video-style:focus{
  border-color: #d03e00;
  background-color: #d03e00;
  
}

.btn-b-video-style.selected{
  border-color: #d03e00;
  background-color: #d03e00;
  color: #ffffff;
}



.btn-b-qa-style{
  border-color: #00B7DB;
  color: #00B7DB;
  background-color: #fff;
}

.btn-b-qa-style:hover{
  border-color: #00B7DB;
  background-color: #00B7DB;
  color: #ffffff;
}

.btn-b-qa-style:focus{
  border-color: #00B7DB;
  background-color: #00B7DB;
  
}

.btn-b-qa-style.selected{
  border-color: #00B7DB;
  background-color: #00B7DB;
  color: #ffffff;
}

.btn-b-template-style{
  border-color: #598AD7;
  color: #598AD7;
  background-color: #fff;
}

.btn-b-template-style:hover{
  border-color: #598AD7;
  background-color: #598AD7;
  color: #ffffff;
}

.btn-b-template-style:focus{
  border-color: #598AD7;
  background-color: #598AD7;
  
}

.btn-b-template-style.selected{
  border-color: #598AD7;
  background-color: #598AD7;
  color: #ffffff;
}

.border-black{
  border-color:  #353535!important;
}

.border-w-2{
  border-width: 2px!important;
}

.btn_select_b_user{
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
}

#div_b_show_user_list_body > div{
  display: none;
  
}

#div_b_show_user_list_body > div.show{
  display: flex;
  
}

.div_create_template_modal_page{
  display: none;
}

.div_create_template_modal_page.show{
  display: block;
}

#div_qa_more_template_message_list > div{
  cursor: pointer;
}

/*2023/02/01 15:22*/

.div_broadcast_history_show_qa_list{
  display: none;
}

.div_broadcast_history_show_qa_list.show{
  display: block;
}

@media (max-width: 767.98px) {
  
  #div_broadcast_history_show_qa_list > div{
    height: unset;
  }
  
}

/*2023/02/03 11:07*/

.div_b_type_easy{
  border-right:2px #ccd0d4 solid;
  padding-right: 0.5rem;
  margin-right: 0.5rem;
}

#div_show_step2{
  height: calc(100% - 89.6px);
  overflow-y:auto;
}

@media (max-width: 767.98px) {
  
  .div_b_type_easy{
    border-right:unset;
    padding-right: 0rem;
    margin-right: 0rem;

    border-bottom:2px #ccd0d4 solid;
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
  }

  #div_show_step2{
    height: calc(100% - 140.8px);
  }
  
}

.btn-b-qa-quick{
  border-color: #CE7137;
  color: #CE7137;
  background-color: #fff;
}

.btn-b-qa-quick:hover{
  border-color: #CE7137;
  background-color: #CE7137;
  color: #ffffff;
}

.btn-b-qa-quick:focus{
  border-color: #CE7137;
  background-color: #CE7137;
  
}

.btn-b-qa-quick.selected{
  border-color: #CE7137;
  background-color: #CE7137;
  color: #ffffff;
}

.QAQuickSpanColor{
  background-color: #CE7137!important;
}

#ad_account_manage_logout{
  float: right;
    /* width: 8%; */
    margin-top: 2%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
}

/*2023/02/13 10:28*/
.show-zoom{
  cursor: zoom-in;
}

.div_qa_show_history_show_stu_list_not_answer > div {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  padding-top: 0rem;
  padding-bottom: 0.25rem;
}

.div_qa_show_history_show_stu_list_answered > div {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  padding-top: 0rem;
  padding-bottom: 0.25rem;
}

.choose_answer{
  display: flex;
  justify-content: space-between;
}

.choose_answer.expand{
  flex-direction: column;
}

.checkbox_select_b_history_info_setting{
  width: 22px;
  height: 22px;
  accent-color: #817DAD;
}


.show-stu-name {
  display: none!important;
}

.show-stu-name.show {
  display: flex!important;
}

.show-answer {
  display: none!important;
}

.show-answer.show {
  display: flex!important;
}

.show-answer.block.show {
  display: block!important;
}

.qa_answer_statistics{
  visibility: hidden;
}


.checkbox_select_qa_answer{
  width: 22px;
  height: 22px;
  accent-color: #029e02;
  display: none;
}

.checkbox_select_qa_answer.show{
  width: 22px;
  height: 22px;
  accent-color: #029e02;
  display: block;
}

.qa-correct-answer.hide{
  color:unset;
}

.qa-stu-correct-answer.hide{
  color:unset;
}

.qa-stu-wrong-answer.hide{
  color:unset;
}

.checkbox_is_show_correct_answer{
  width: 22px;
  height: 22px;
  /*margin: 0rem 0rem 0rem 0.35rem;*/
  accent-color: #817DAD;
}

.btn-dark-gray {
  color: #fff;
  background-color: #364955;
  border-color: #364955;
}

.btn-dark-gray:hover {
  color: #fff;
  background-color: #25333b;
  border-color: #25333b;
}

.btn-dark-gray:focus {
  box-shadow: 0 0 0 0rem rgba(255, 255, 255);
}

/*20230510*/

.btn-b-url-style{
  border-color: #007CED;
  color: #007CED;
  background-color: #fff;
}

.btn-b-url-style:hover{
  border-color: #007CED;
  background-color: #007CED;
  color: #ffffff;
}

.btn-b-url-style:focus{
  border-color: #007CED;
  background-color: #007CED;
  
}

.btn-b-url-style.selected{
  border-color: #007CED;
  background-color: #007CED;
  color: #ffffff;
}

.URlSpanColor{
  background-color: #007CED!important;
}

.VoteSpanColor{
  background-color: #007CED!important;
}


/*20230628*/

.rounded-05{
  border-radius: 0.5rem;
}

.rounded-075{
  border-radius: 0.75rem;
}

.border-2{
  border-width: 2px!important;
}

.report_modal{
  min-height: calc(100% - 3.5rem);
  
  margin: 1.75rem auto;

  position: relative;
  width: 95%;

}

@media screen and (min-width: 576px){

  .report_modal{
    max-width: 530px;
    width: 100%;
  }

}

.btn_open_web_cam_in_excalidraw{
  position: absolute;
  right: 0px; 
  top: 220px; 
  z-index: 9; 
  height: 36px; 
  width: fit-content; 
  background-color: #fff;
  padding:5px;

  color: #7f7e7e;
  cursor: pointer;
  border: 1px solid #ebebeb; 
  border-right: unset;
  border-radius: 0.5rem 0 0 0.5rem;

}

@media screen and (min-width: 520px){

  .btn_open_web_cam_in_excalidraw{
    right: 0px; 
    top: 35px; 
  }

}

@media screen and (min-width: 768px){

  .btn_open_web_cam_in_excalidraw{
    right: 65px; 
    top: 16px; 
    border: 1px solid #d6d6d6; 
    border-right: 1px solid #d6d6d6; ;
    border-radius: 0.5rem;
  }

}

@media screen and (min-width: 1024px){

  .btn_open_web_cam_in_excalidraw{
    right: 110px; 
    top: 16px; 
    border: 1px solid #d6d6d6; 
    border-right: 1px solid #d6d6d6; ;
    border-radius: 0.5rem;
  }

}