body{
    background: #454041;
  }

.oz-checkbox{
    align-items: flex-start !important;
    text-align: left;
}

.oz-checkbox .MuiTypography-body1{
  font-size:0.8em !important;
}

.oz-checkbox .MuiCheckbox-colorPrimary.Mui-checked{
  color: white;
}

.oz-lamdalatsi{
    width: 300px;
    position: absolute;
    bottom: 40px;
    right: 50%;
    margin-right: -150px;
}

.oz-img-agalma{
  position: absolute;
  left:0px;
  bottom:0px;
  width: 20%;
  max-width: 300px;
}

.oz-img-kosmima{
  position: absolute;
  right: 0px;
  bottom: 15vw;
  width: 100%;
  min-width: 500px;
}

.oz-img-kosmima-live{
  position: absolute;
  right: 0px;
  top: 20vh;
  width: 100%;
  min-width: 500px;
}

.MuiButton-contained.oz-regbutton{
  background: rgb(203, 152, 51);
  color: white;
  font-size: 1.2em;
  padding: 10px 70px;
  border-radius: 10px;
  text-transform: none;
  font-weight: bold;
  margin: 50px;
}

.MuiButton-contained.oz-regbutton:hover{
  background: rgb(150 113 38);
}

.oz-footer{
  position: relative;
 /* height: 35vh;
  height: calc(var(--vh, 1vh) * 35); */
  min-height: 200px;
}

.oz-content{
  min-height: calc(100vh - 200px);
  min-height: calc(calc(var(--vh, 1vh) * 100) - 200px);
  z-index:10;
  position:relative;
}

.oz-top-logo{
  max-width: 70%;
  margin: 20px;
  width: 400px;
  margin-top: 6vh;
}

.oz-footer-buttons{
  position: absolute;
  bottom: 10px;
  left:20px;
  right: 20px;
  text-align: right;
  font-size: 0.9em;
}

.oz-footer-btn{
  color: white;
  text-decoration: none;
}

.oz-footer-btn:hover{
  color: rgb(203, 152, 51);
}

.oz-reg-msg{
  color: white;
  font-size: 1.4em;
  margin: auto;
  max-width: 500px;
  padding:10px;
}

.MuiButton-root.oz-questionBtn{
  text-transform: none;
  float: right;
  margin-top: 20px;
}

.oz-live-headerimg{
    width: 70%;
    margin: 2%;
}

.oz-livebox{
  transition: transform 1s;
  transform-origin: top left;
}

.oz-livediv-open .oz-livebox{
  transform: scale(0.75);
}

.MuiPaper-root.oz-live-textbox{
  padding: 20px;
  height: 14%;
  overflow: auto;
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  opacity: 0;
  transition: all  1s;
  transform: scaleY(0.1);
  transform-origin: bottom;
}

.oz-livediv-open .MuiPaper-root.oz-live-textbox{
  opacity: 1;
  transform: scaleY(1.0);
}

.oz-live-username{
  position: absolute;
  bottom: 25%;
  right:0px;
  width: 22%;
  padding: 1%;
  opacity: 0;
  transition: all  1s;
  transform: scaleX(0.01);
  transform-origin: right;
}

.oz-livediv-open .oz-live-username{
  opacity: 1;
  transform: scaleX(1.0);
}


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

  .oz-img-kosmima-live{
    top: auto;
    bottom: 5vh;
  }

  .oz-live-headerimg{
      width: 80%
  }

}


@media screen and (max-width: 550px) {
  .oz-footer-btn{
    font-size: 2.5vw;
  }

  .oz-img-agalma{
    width: 30%;
  }

  .oz-live-headerimg{
      width: 96%
  }

  .oz-live-username{
    font-size: 0.8em;
  }
}

@media screen and (max-width: 1000px) {
  .oz-lamdalatsi{
    margin-right: 0px;
    right: 30%;
    width: 40%;
  }
}

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

.MuiButton-contained.oz-regbutton{
  font-size: 1em;
}


.oz-reg-msg{
  font-size: 1.2em;
}

.oz-footer{
  min-height: 50vw;
}

.oz-content{
  min-height: calc(100vh - 50vw);
  min-height: calc(calc(var(--vh, 1vh) * 100) - 50vw);
}

}


.oz-quiz-logo{
    height: 35vh;
    top:2%;
    transition: opacity 0.5s;
}	

.oz-quiz-qna{
	width: 100%;
    position: absolute;
    left: 0px;
    top: 50%;
	padding-bottom:20%;
    transition: opacity 0.5s;
}	

.oz-quiz-board{
	  width: 100%;
    position: absolute;
    left: 0px;
    top: 10%;
    transition: opacity 0.5s;
    text-align: center;
}	

.oz-quiz-board-img{
  width:100%;
}

.oz-quiz-board-img-div{
  width:100%;
  max-width: 800px;
  position: relative;
  margin: auto;
}

.oz-quiz-popup .MuiPaper-root{
  background: #222;
  overflow-x: hidden;
  height: 80vh;
  max-width: 1400px;
}

.oz-quiz-popup .MuiDialogContent-root{
  overflow: hidden;
}



.oz-quizline {
    position: absolute;
    width: 100%;    
    left: 0px;
}

.oz-quizline-1 {top: 49%;}
.oz-quizline-2 {top: 24%;}
.oz-quizline-3 {top: 74%;}


.oz-cake-popup .MuiPaper-root{
  background: #222222ee;
  max-width: 1200px;
}

.oz-cake-popup .MuiDialogContent-root{
  overflow: hidden;
}

.oz-quiz-questionbox{
    position: absolute;
    width: 100%;
    left: 0%;
    top: 0px;
}

.oz-quiz-questionbox-img,
.oz-quiz-questionbox-img2{
    width:90%;
    margin: auto;
    position: relative;    
}

.oz-quiz-question{
    position: absolute;
    width: 80%;
    left: 10%;
    top: 0px;
    height: 100%;
    vertical-align: middle;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
	color: white;
	font-size: 1.3em;
}


.oz-quiz-answ{
    position: absolute;
    width: 43%;
    height: 45%;
    vertical-align: middle;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    color: white;
	font-size: 1.3em;
	cursor: pointer;
}

.oz-quiz-answ-1{top: 5%; left: 6%;}
.oz-quiz-answ-2{top: 5%; right: 6%;}
.oz-quiz-answ-3{top: 55%; left: 6%;}
.oz-quiz-answ-4{top: 55%; right: 6%;}

.oz-quiz-color{
	position: absolute;
	width: 43%;
	opacity: 0;
}

.oz-quizpos-1{opacity: 1; top: 5%; left: 6%;}
.oz-quizpos-2{opacity: 1; top: 5%; right: 6%;}
.oz-quizpos-3{opacity: 1; top: 55%; left: 6%;}
.oz-quizpos-4{opacity: 1; top: 55%; right: 6%;}



.oz-quiz-logo.oz-quiz-status-q, 
.oz-quiz-logo.oz-quiz-status-a,
.oz-quiz-qna.oz-quiz-status-q, 
.oz-quiz-qna.oz-quiz-status-a,
.oz-quiz-board.oz-quiz-status-s{
    opacity:1;
}

.oz-quiz-logo.oz-quiz-status-s,
.oz-quiz-qna.oz-quiz-status-s,
.oz-quiz-board.oz-quiz-status-a,
.oz-quiz-board.oz-quiz-status-q{
  opacity:0;
  transform: scale(0.1);
}

.oz-quiz-sb-name, .oz-quiz-sb-score{
  color: white;
  position: absolute;
  font-size:1.3em;
}

@keyframes oz-quiz-correct{0% {opacity: 0;} 25% {opacity: 1;} 100% {opacity: 0;}} 

.oz-quizpos-1.oz-quiz-correct,
.oz-quizpos-2.oz-quiz-correct,
.oz-quizpos-3.oz-quiz-correct,
.oz-quizpos-4.oz-quiz-correct{
    animation-name: oz-quiz-correct;
    animation-duration: 0.5s; 
    animation-iteration-count: 5;  
    animation-timing-function: linear;       
}

.oz-quiz-questionbox-img2,
.oz-quizline-4,
.oz-quizline-5{
    display: none
}

.oz-quiz-answerbox{
    position: absolute;
    top:45%;
    padding-bottom:10%;
    left: 0px;
    width: 100%;    
}


@media screen and (max-width: 750px) {
    .oz-quiz-answerbox{
        top:15vw;
        padding-bottom:50%;
    }

    
    .oz-quiz-questionbox-img{display: none}
    .oz-quiz-questionbox-img2{display: block}
    .oz-quiz-question{font-size: 3.5vw; }
    .oz-quiz-qna{top:30%}	
    
.oz-quizline-2 {top: 12%;}
.oz-quizline-3 {top: 37%;}
.oz-quizline-4 {display: block; top: 62%;}
.oz-quizline-5 {display: block; top: 87%;}   

.oz-quiz-answ{
    width: 80%;
    height: 20%;
    font-size: 4vw;
}
    
.oz-quiz-answ-1{top: 2.5%; left: 10%; right: auto;}
.oz-quiz-answ-2{top: 27.5%; left: 10%; right: auto;}
.oz-quiz-answ-3{top: 52.5%; left: 10%; right: auto;}
.oz-quiz-answ-4{top: 77.5%; left: 10%; right: auto;}

    

.oz-quiz-color{
	width: 84%;
    left: 8%;
    right: auto;
}
    
.oz-quizpos-1{top: 5%; }
.oz-quizpos-2{top: 30%; }
.oz-quizpos-3{top: 55%; }
.oz-quizpos-4{top: 80%; }
 

.oz-quiz-logo{height: 18vh;}	

   
}

@media screen and (max-width: 400px) {
    .oz-quiz-qna{top:40%}	
    .oz-quiz-logo{height: 18vh;}	    
}



@media screen and (max-width: 1000px) {
  .oz-quiz-sb-name, .oz-quiz-sb-score{
    font-size: 2vw;
  }
}

.oz-quiz-sb-name{
left: 20%;
}

.oz-quiz-sb-score{
  right: 20%;
  transform:scale(1.1);
  transform-origin: right
}

.oz-quiz-sb-row-0{top: 19%;}
.oz-quiz-sb-row-1{top: 27.44%;}
.oz-quiz-sb-row-2{top: 35.89%;}
.oz-quiz-sb-row-3{top: 44.33%;}
.oz-quiz-sb-row-4{top: 52.78%;}
.oz-quiz-sb-row-5{top: 61.22%;}
.oz-quiz-sb-row-6{top: 69.67%;}
.oz-quiz-sb-row-7{top: 78.11%;}
.oz-quiz-sb-row-8{top: 86.56%;}
.oz-quiz-sb-row-9{top: 95%;}

/* {[oz-livestream-play], [oz-prop-play_status]} */
.oz-zoom-dialog .MuiPaper-root{
  background: #000;
  height: 100vh;
   width: 100vw;
}

.oz-zoom-dialog .MuiDialogContent-root{
  overflow: hidden;
  padding: 0px !important;  
}