@font-face { font-family: "montserratmedium"; src: url("assets/fonts/montserratmedium.ttf"); }
@font-face { font-family: "montserratbold"; src: url("assets/fonts/montserratbold.ttf"); }
@font-face { font-family: "montserratsemibold"; src: url("assets/fonts/montserratsemibold.ttf"); }
@font-face { font-family: "kenyancoffeerg"; src: url("assets/fonts/kenyancoffeerg.otf"); }

body{font-family:'montserratbold', sans-serif; line-height:1.2; min-height:100vh;}
.container, .container-lg, .container-md, .container-sm, .container-xl{max-width:88.21vw !important;}
a, a:hover, a.focus{text-decoration:none}

.blue_bg{background-color:#55beb7;} .green_bg{background-color: #0d5853;} .pink_bg{background-color:#9B265D;} 

.landing{
	background:#9B265D url('assets/images/landing.jpg') no-repeat; background-size:100% auto;background-position:right;
  min-height:100vh;
}
.landing-l{ background:url('assets/images/landing-l.png') no-repeat; background-size:cover; }
.l_pad_top{padding:3.43vh 6.18vw;}
.logo-l img{max-width:18.98vw; width:100%; height:auto;}
.white_font, .white_font *{color:#fff !important;}

.landing_right_text{padding:7.789vw 0 10vw}
.landing h1{font-size:118px; font-family:'montserratbold'; color:#fff; margin-bottom:75px}
.landing h3{font-size:67px; font-family:'montserratbold'; color:#fff; margin-bottom:46px}
.landing p, p{font-size:50px; font-family:'montserratmedium'; color:#fff; margin-bottom:68px}
.button-5{ font-size:58px; line-height:88px; color:#5e1539; padding:1.1vh 2vw;
	display:inline-block; width:auto; text-align:center;
	border-radius:79px; background-color:#e8952e; border: 12px solid #5e1539;
	margin-bottom:68px;
}

.l_sos_area{display:flex;}
.l_sos_area a img{max-width:2.99vw}

.form_section{border-radius:40px;padding:5%;margin:5%;}
.login_form h2, .register_form h2{color:#fff;margin-bottom:2vw;font-size:82px}
.form_section form > div{margin-bottom:1vw}
.form_section label{display:block;margin-bottom:0.5vw;font-size:58px;}
.form_section input{width:100%;border-radius:40px;padding: 0.7vw 2vw;font-size:58px;line-height:1.2; border:none;}
.white_label label{color:#fff}

.create{min-height:100vh;background-color:#55beb7;padding:2vw 0}
.create h2{font-size:83px; font-family:'montserratbold'; color:#fff;}
.green_form_area{width:100%;max-width:60.34vw;margin:0 auto; border-radius:40px; background-color:#0d5853;padding:3.99vw 8.21vw}

.green_form_area form{margin-top:3.99vw;}
.green_form_area form label{font-family:"montserratsemibold";font-size:58px;line-height:1.2;display:block;margin-bottom:0.8vw;color:#fff}

.green_form_area form input[type="text"], .green_form_area form textarea, .green_form_area form select{
	width:100%; border-radius:20px; background-color:#ffffff; margin-bottom:1.4vw;
	padding:0.9vw; font-size:1.68vw; color:#557d7a !important; max-width:100%; border:none;
}

.green_form_area form input[type="text"]{}
.green_form_area form textarea{}
.green_form_area form select{}
.green_form_area form hr{border:1px solid #55beb7;background-color:#f29919;margin-bottom:1.4vw;}

.dgreen_area{background:#0a3e3b; padding:3vw 2vw 2vw 2vw; margin-bottom:2vw; border-radius:20px}

.create .group_area, .groupsBlocks{display:flex; flex-wrap:wrap; gap:4%}
.create .group_area label{flex:0 0 100%}
.create .group_area .groupsBlocks > div{flex:0 0 48%}
.create .group_area .group_blocks label{font-size:50px}

.button_yellow{font-size:83px; width:100%; border:none; border-radius:40px; background-color:#f29919;
  margin-top:40px; padding:0.9vw; color:#fff;}
  
.full_screen_div{min-height:100vh}
.pink_bg{background-color:#9c255d}
.left_sidebar{padding:2vw 2vw 2vw 5vw;background-color:#e8952e;overflow:hidden}
.side_logo{margin-bottom:2.2vw}
.side_logo img{max-width:100%}
.red{color:#ef0000;text-align: center;}
.right_sidebar{padding:2vw 1vw;overflow:hidden;color:#fff} .host_screen_page .main_content{position:relative}
.right_sidebar h2{text-align:center;font-size:167px;line-height:1;font-family:'kenyancoffeerg';margin-bottom:3rem}
.right_sidebar h4{text-align:center;font-size:70px;line-height:1.5;font-family:'kenyancoffeerg';}

.ls_content{display:flex; flex-direction:column; flex-wrap:nowrap; height:100%;overflow:hidden; max-height:calc(100vh - 6vh);}
.side_logo{ flex: 0 0 7%;}
.ls_catbox{flex: 0 0 88%; overflow-x: hidden; overflow-y: auto;}
.ls_content h3{font-size:63px;font-family:'kenyancoffeerg';color:#fff;flex:0 0 5%;}
.cat_list{list-style:none;padding:0 0.7vw 5vw 0}
.cat_list li{display:block;border-radius:20px; background-color: #ffffff; padding:0 1vw; margin-bottom:1vw}
.cat_list li a{font-family:'montserratbold';color:#5e193d;font-size:50px;line-height:2.6;display:block}

.main_content{padding:3vw 5vw 2vw 5vw;flex:1 1 auto;}
.game_rule_h1{font-family:'kenyancoffeerg'; font-size:167px; line-height:1; color: #ffffff; margin-bottom:2vw}
.gr_white_box{padding:2vw;border-radius:30px; background-color:#ffffff;}
p.game_rule_p{font-family:"montserratmedium";color:#381525;font-size:25px;letter-spacing:1px; line-height:42px; margin-bottom:0}

.white_button{font-family:'montserratbold'; font-size:74px; line-height:83px; color:#381525;
	padding:1vw 4vw; background-color:#fff; border-radius:40px; display:inline-block}

.float_menu_button{position: absolute; top: 10%; z-index: 100; width: 4vw; height: 4vw;
  background:#fff; border-top-right-radius: 20px; border-bottom-right-radius: 20px; text-align: center;
}
.float_menu_button a{display:block;font-size:2.4vw;line-height:4vw;color:#5e193d;}

h5.score_title{font-size:67px; letter-spacing:1px; line-height:121px; color:#ffffff; font-family: "kenyancoffeerg";}

.scoring_table{color:#fff;width:100%;padding:3rem 0;}
.stbl_thead{font-family:'montserratbold';font-size:50px;line-height:1.5;display:flex;flex-wrap:nowrap;justify-content:space-between;}
.stbl_thead > div:first-child{flex: 0 0 42%;padding-left:3%}
.stbl_thead > div:nth-child(2){flex: 0 0 42%;text-align:left;}
.stbl_thead > div:last-child{flex: 0 0 16%;text-align:center;padding-right:3%;white-space:nowrap;}

.stbl_tbody{display:flex;flex-wrap:nowrap;justify-content:space-between; padding:2rem 0;
	font-family:'kenyancoffeerg';font-size:58px;line-height:2}
.stbl_tbody.odd_row{background:#aa4977; border-radius:20px;}
.stbl_tbody .stbl_td:first-child{flex: 0 0 42%;padding-left:3%;letter-spacing:1px}
.stbl_tbody .stbl_td:nth-child(2){flex: 0 0 42%;text-align:left;display:flex;flex-wrap:nowrap;gap:4%}
.stbl_tbody .stbl_td:last-child{flex:0 0 16%;text-align:center;padding-right:3%}

.stbl_tbody .stbl_td:nth-child(2) > a{flex:0 0 20%; display:block;background:#fff;border-radius:15px;text-align:center;
	font-size:58px; line-height:1.8; color:#381525; font-family:'montserratbold'; display:flex; align-items:center; justify-content:center; }

.host_screen_page .main_content{padding:2vw 2.5vw; flex:1 1 auto; max-width:2450px; margin:0 auto; background:#388782;}
.host_screen_page .game_rule_h1{margin-bottom:1vw}
.qa_div{margin-top:3%}
.qa_div label{font-family:'montserratbold'; font-size:83px; line-height:1.5; color:#ffffff;}
.answer_options{display:flex;flex-wrap:wrap;padding:0;list-style:none;justify-content:space-between;}
.answer_options li{flex:0 0 48%;font-size:51px; line-height:3; border:12px solid #5e1539; background:#fff;
	text-align:center; color:#5e1539; margin-top:3%; border-radius:100px; display:flex; align-items:center; justify-content:center; }
.answer_options li.right_ans{background:#e8952e; color:#5e1539}

.button_div{ display:flex; flex-wrap:nowrap; justify-content:space-between; width:98%; margin:5rem auto;}
.button_div a{ font-family:'montserratbold'; font-size:55px; line-height:1.4; color:#ffffff; text-align:center; padding:1.3vw 1vw;
	border-radius:40px; background-color:#0d5853; flex:0 0 32%; display:flex; align-items:center; justify-content:center;
}
body .button_div_single{ justify-content:center; margin:5rem auto 3rem;}
body .button_div_single .display_next_on_tv{flex:0 0 auto; padding:1.3vw 3vw; transition:all .2s ease; box-shadow:4px 4px 8px 1px #fff;}
body .display_next_on_tv.disabled{box-shadow:none;color:#ffffff85;cursor:not-allowed}
body .action_btn_div a.disabled{color:#ffffff85;cursor:not-allowed}

.action_btn_div{position:relative}
.action_btn_div.act::before{ content:''; position:absolute; width:100%; height:100%; z-index:9; cursor:not-allowed; }

.leaderboard_table{font-family:'kenyancoffeerg';font-size:78px;line-height:1.8;color:#fff; width:100%}
.leaderboard_table tr td:first-child{width:10%}
.leaderboard_table tr td:nth-child(2){}
.leaderboard_table tr td:last-child{width:15%}
.read_rules_button{ display:block; width:100%; text-align:center; color: #ffffff; font-family:'montserratbold';
	border-radius:30px; background-color:#381525; font-size:80px; line-height:2.2; margin-top:2rem
}

.timer_box{background-color:#0d5853;padding:1.5rem 3rem;color:#fff;display:flex;justify-content:space-between;
	position:absolute;top:2rem;right:3rem;border-radius:40px;align-items:center; }
.timer_icon{flex:0 0 44%} .timer_icon img{max-width:100%}
.timer_text{flex:0 0 52%; text-align:center;}
.timer_text span{font-family:'montserratbold';font-size:67px; line-height:1.15;}
.timer_text div{font-family:'kenyancoffeerg';font-size:114px; line-height:1.15;}

.result_table{font-family: 'montserratsemibold';min-width:75%; color:#fff; border-collapse:collapse; margin:1vw 0 2vw}
.result_table th,.result_table td{padding:1vw 2vw}
.result_table th{font-family: 'montserratbold';border:2px solid #55beb7;background:#55beb7;}
.result_table td{border:2px solid #fff;}
.result_table tbody tr th:first-child, .result_table tbody tr th:last-child,
.result_table tbody tr td:first-child, .result_table tbody tr td:last-child{width:20%;text-align:center}

.manage_score_div p a{color:#5e1539; font-weight:600; border-radius:20px; display:inline-block;
  box-shadow:2px 2px 5px 0px #5e1539; padding:0.5vw 1vw; background:#fff;
}
.login_page .form_section{height:100%}

.loading_dots{ margin:5vw auto;
	width:3vw; aspect-ratio: 1; background:#9C255D; border-radius:50%; animation: d6 1s infinite linear alternate; }
@keyframes d6 { 0%  {box-shadow: 3vw 0,-4.5vw 0} 50% {box-shadow: 3vw 0,-3vw 0} 100%{box-shadow: 4.5vw 0,-3vw 0} }

.crt_chkbox_div input[type="checkbox"]{width:38px;height:auto;margin-left:2rem;}

.maximize_btn{position:absolute;bottom:1vw;right:1vw;color:#fff;text-align:center;}
.html_fullscreen .maximize_btn{visibility:hidden}

@media (min-width:1921px){
  .login_page{padding-top:4rem}
  body .crt_chkbox_div input[type="checkbox"]{width:58px;height:58px;margin-left:2rem;}
  .maximize_btn{font-size:62px;}
}
@media (min-width:1441px) and (max-width:1920px){
  .white_button{font-size:44px;line-height:1.5;border-radius:30px;}
  .stbl_thead{font-size:32px;padding-bottom:1rem}
  .stbl_tbody{font-size:40px;padding:1rem 0;}
  .stbl_tbody .stbl_td:nth-child(2) > a{flex:0 0 20%; font-size:40px;line-height:1.8;}
  .game_rule_h1{font-size:56px}

	.qa_div label{font-size:36px;margin-bottom:20px}
	.answer_options li{font-size:42px;line-height:2;border-width:6px}
	.host_screen_page .button_div a{font-size:24px;line-height:4;border-radius:30px;}
	.right_sidebar h4{font-size:40px}
	.right_sidebar h2{font-size:60px}
	.leaderboard_table{font-size:24px}
	.read_rules_button{font-size:32px;border-radius:20px}

  .timer_box{padding:1rem 1.5rem;justify-content:center;}
  .timer_icon{flex:0 0 35%;}
  .timer_text{flex: 0 0 60%;text-align:center;}
  .timer_text span{font-size:28px;}
  .timer_text div{font-size:54px;}
  
  h5.score_title{font-size:30px;line-height:2;}
  .maximize_btn{font-size:44px;}
}
@media (min-width:1441px){
	.left_sidebar{flex:0 0 27vw;border-right:12px solid #5e1539; min-height:100vh;}
	.right_sidebar{border-left:12px solid #5e1539; min-height:100vh;}
	.side_logo{flex: 0 0 7%;}
	.host_screen_page .left_sidebar{flex:0 0 25vw;} .host_screen_page .right_sidebar{flex:0 0 25vw;}
	.result_table{font-size:80px;}
}
@media (max-width:1440px){
	.right_sidebar{border-left:6px solid #5e1539; min-height:100vh; height:auto}
	.left_sidebar{flex:0 0 24vw;border-right:6px solid #5e1539; min-height:100vh; height:auto;padding:2vw 2vw 2vw 3vw}
	.side_logo{flex:0 0 auto; margin-bottom:1.2vw}
	.ls_content h3{flex:0 0 auto; margin-bottom:15px;}
	p.game_rule_p{font-size:16px;line-height:1.5;}
	.white_button{font-size:24px;border-radius:15px;line-height:1.2;}
	.scoring_table{padding:1rem 0}
	.stbl_thead{font-size:24px;line-height:1.4;margin-bottom:15px;}
	.stbl_tbody{font-size:28px;line-height:1.5;}
	.stbl_tbody .stbl_td:nth-child(2) > a{flex:0 0 26%; font-size:28px;line-height:2;}
	.game_rule_h1{font-size:36px;margin-top:2rem}
  h5.score_title { font-size: 24px; line-height: 2; }
	
	.host_screen_page .left_sidebar{flex:0 0 24vw;} .host_screen_page .right_sidebar{flex:0 0 24vw;}
	.qa_div label{font-size:30px;margin-bottom:20px} body .button_div{margin:2rem auto;}
	.answer_options li{font-size:24px;line-height:1.4;border-width:3px;padding:1vw;}
	.host_screen_page .button_div a{font-size:16px;line-height:1.5;border-radius:20px;padding:1.7vw 1vw;}
	.right_sidebar h4{font-size:24px}
	.right_sidebar h2{font-size:44px}
	.leaderboard_table{font-size:20px}
	.read_rules_button{font-size:24px;border-radius:15px}

  .timer_box{padding:1rem;justify-content:center;right:1.5rem;border-radius:30px;}
  .timer_icon{flex:0 0 40%;} .timer_icon img{max-height:80px}
  .timer_text{flex: 0 0 60%;text-align:center;}
  .timer_text span{font-size:24px;}
  .timer_text div{font-size:44px;}
  
  body .button_div_single .display_next_on_tv{line-height:3;padding:1vw 3vw;}
  .maximize_btn{font-size:32px;right:2vw}
  .result_table{font-size:54px;}
}
@media (min-width:1024px) and (max-width:1920px){
	.green_form_area{max-width:70.34vw;}
	.green_form_area form label{font-size:2.08vw;}
	.button_yellow{font-size:2.81vw;border-radius:30px;}
	.green_form_area form input[type="text"], .green_form_area form textarea, .green_form_area form select{
		border-radius:15px; margin-bottom:2vw; padding:1vw 0.9vw; font-size:1.87vw;
	}
  .create .logo-l img{max-width:25vw;}

	.form_section{border-radius:40px;padding:5%;margin:5%;}
	.login_form h2, .register_form h2{color:#fff;margin-bottom:2vw;font-size:44px}
	.form_section form > div{margin-bottom:25px}
	.form_section label{font-size:28px;}
	.form_section input{border-radius:20px;padding: 0.7vw 2vw;font-size:28px;line-height:1.2}
	
	.cat_list li a{font-size:24px}
	.ls_content h3{font-size:36px}
  .stbl_tbody{padding:2rem 0}
	.stbl_tbody .stbl_td:nth-child(2), .stbl_thead > div:nth-child(2){flex: 0 0 36%;}
  .stbl_thead > div:last-child, .stbl_tbody .stbl_td:last-child{flex:0 0 22%;}

}
@media (min-width:768px) and (max-width:1023px){
	.create .logo-l img{max-width:50vw;}

	.green_form_area{max-width:88vw;}
		.green_form_area form input[type="text"], .green_form_area form textarea, .green_form_area form select{
		padding:1.4vw 2vw; line-height:1.6; border-radius:15px; font-size: 24px; margin-bottom:25px;
	}
	.green_form_area form label{font-size:4.16vw;}
  .button_yellow{border-radius:20px; margin-top:20px; font-size:36px; line-height:1.5;}
  body .green_form_area form select{ padding:1.8vw 2vw !important; }
  .create .group_area label{margin-bottom:20px}
  .dgreen_area{padding:3vw 3vw 2vw 3vw}
  .login_form h2, .register_form h2{font-size:32px}
  .ls_content h3{font-size:24px}
  .stbl_tbody{padding:1rem 0;}
  .stbl_thead > div:first-child, .stbl_tbody .stbl_td:first-child{flex:0 0 33%;}
	.stbl_thead > div:nth-child(2), .stbl_tbody .stbl_td:nth-child(2){flex: 0 0 34%;text-align:center;justify-content:center;}
  .stbl_thead > div:last-child, .stbl_tbody .stbl_td:last-child{flex:0 0 33%;}

  
}
@media (max-width:1023px){
	.form_section form > div{margin-bottom:25px}
	.form_section label{font-size:20px;margin-bottom:7px}
	.form_section input{border-radius:15px;padding:10px 2vw;font-size:16px;line-height:1.2}
	.login_form .button_yellow, .register_form .button_yellow{margin-top:10px;}
	.cat_list li{border-radius:12px;} .cat_list li a{font-size:20px}
	.side_logo{padding-top:7%}
	.white_button{font-size:18px; line-height:1.5; border-radius:15px; margin-bottom:40px;}
}	
@media (min-width:768px) and (max-width:1920px){
	.create .logo-l{margin:2rem auto !important; padding-bottom:1rem !important;}
	
	.landing h1{font-size:44px; margin-bottom:15px}
	.landing h3{font-size:24px; margin-bottom:15px}
	.landing p, p{font-size:14px; margin-bottom:20px}
	.button-5{ font-size:20px; line-height:30px; margin-bottom:40px; border-width:2px}
	.landing_right_text{padding:5vw 0 3vw}
	
	.create h2{font-size:42px}
	.green_form_area form{margin-top:2.99vw;}
	.create .group_area .group_blocks label { font-size: 28px; }
	.login_page{padding-top:1rem}
	.form_section{border-radius:20px;}
}
@media (max-width:767px){
	.logo-l img{max-width:80vw;}
	.landing h1{font-size:32px; margin-bottom:20px}
	.landing h3{font-size:16px; margin-bottom:20px}
	.landing p, p{font-size:12px; margin-bottom:20px}
	.button-5{ font-size:20px; line-height:1.2; padding:10px 30px; margin-bottom:40px; border-width:2px}
	.landing_right_text{padding:40px 0} .l_sos_area a img{max-width:40px;}
	.login_page{padding-top:1rem}
	.form_section{border-radius:20px;margin:5% auto;}
	.login_form h2, .register_form h2{font-size:32px}
}
@media (min-width:768px){
}
@media (max-width:560px){
	.login_form h2, .register_form h2{font-size:24px}
	.form_section label{font-size:16px;margin-bottom:7px;padding-left:10px;}
	.form_section input{border-radius:10px;padding:10px;font-size:16px}
}