@font-face {
  font-family: Proxima Nova;
  src: url(../font/proxima.otf);
}

body{
    background-color: #F4F7FD;
}

.box_obal {
  height: 620px;
  width: 580px;
  border-radius: 16px;
  background-color: #FFFFFF;
  box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1), 0 16px 24px -16px rgba(0,0,0,0.1);
  margin-left: auto;
  margin-right: auto;
  font-family: "Proxima Nova";
}


.vnitrek {
  margin-left: auto;
  margin-right: auto;
  font-family: "Proxima Nova";
  padding: 20px;
}



.diky {
  margin-left: auto;
  margin-right: auto;
  font-family: "Proxima Nova";
  font-size: 20px;
  text-align:center;
}

.stat_nadpis {
  margin-left: auto;
  margin-right: auto;
  font-family: "Proxima Nova";
  font-size: 25px;
  text-align:center;
  text-decoration: underline;
}


.udajeucet {
  margin-left: auto;
  margin-right: auto;
  font-family: "Proxima Nova";
  font-size: 18px;
  text-align:center;
}


.logo
{
    display: block;
  margin-left: auto;
  margin-right: auto;
  padding-top: 50px;
  padding-bottom: 24px; 
}

.qr
{
  width:256px;
  height:256px;
}






.herni-plan {
  height: 72px;
  width: 250px;
  color: #210A3B;
  font-family: "Proxima Nova";
  font-size: 56px;
  letter-spacing: -0.9px;
  line-height: 72px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  padding-top: 48.65px ;
  padding-bottom: 23px;
}

.login_button {
  height: 64px;
  width: 288px;
  border-radius: 10px;
  background-color: #6441A5;
  margin-left: auto;
  margin-right: auto;
  
}

.login_button:hover {
    cursor: pointer;
    background-color: #5a3a94;
}

.box_info {
  height: 20px;
  width: 212px;
  margin-left: auto;
  margin-right: auto;
  padding: 24px;
}





.vice-informaci {
  height: 20px;
  width: 180px;
  color: #632CA0;
  font-family: "Proxima Nova";
  font-size: 16px;
  letter-spacing: -0.26px;
  line-height: 20px;
  text-align: center;
}

.vice-informaci:hover {
    cursor: pointer;
}

.prihlasit-se-twichtem {
  float: left; 
  height: 24px;
  width: 182px;
  color: #FFFFFF;
  font-family: "Proxima Nova";
  font-size: 20px;
  letter-spacing: -0.32px;
  line-height: 24px;
  text-align: center;
  padding: 20px 0px;
}

.vnitrek_login
{
    float: left; 
     
}

.info
{
    width: 16px;
    height: 16px;
    fill: #67D5C4;
    position: relative;
    top:3px;
    padding-right: 8px;
}

.info:hover {
    cursor: pointer;
}

.twitch
{
    width: 32px;
    height: 32px;
    fill: #FFFFFF;
    padding: 16px 24px;
}

.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgba(0,0,0,0.65); /* Black w/ opacity */
}

/* Modal Content/Box */
.informace-nadpis {
  height: 80px;
  width: 560px;
  border-radius: 16px 16px 0 0;
  background-color: #F4F7FD;
  margin-left: auto;
  margin-right: auto;
  margin-top: 50px;
}

.informace-nadpis-text {
  height: 32px;
  width: 416px;
  color: #210A3B;
  font-family: "Proxima Nova";
  font-size: 24px;
  line-height: 32px;
  float: left;
  padding: 24px 32px;
}

.informace-nadpis-krizek {
    float: left; 
    padding: 32px; 

}

.krizek {
    width: 16px;
    height: 16px;
    fill: #CAD3E6;
     
}

.krizek:hover
{
    cursor: pointer;
    fill: #B5BDCF;  
}

.informace-text {
  height: auto;
  width: 560px;
  border-radius:0 0 16px 16px ;
  background-color: #FFFFFF;
  box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1), 0 16px 24px -16px rgba(0,0,0,0.1);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50px;
}

.informace-text-text
{
    color: #210A3B;
  font-family: "Proxima Nova";
  font-size: 16px;
  letter-spacing: -0.26px;
  line-height: 20px;
  padding: 37px 32px;
  text-align: justify;
}

.ukazka-povoleni
{
   width: 320px;
   height: 477px;
   display: block;
   margin-left: auto;
   margin-right: auto;
   border-left: 2px solid #EEEDF0; 
   border-right: 2px solid #EEEDF0; 
}

.scale-in-center{-webkit-animation:scale-in-center .4s cubic-bezier(.25,.46,.45,.94) both;animation:scale-in-center .4s cubic-bezier(.25,.46,.45,.94) both}
@-webkit-keyframes scale-in-center{0%{-webkit-transform:scale(0);transform:scale(0);opacity:1}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes scale-in-center{0%{-webkit-transform:scale(0);transform:scale(0);opacity:1}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}
.scale-out-center{-webkit-animation:scale-out-center .4s cubic-bezier(.55,.085,.68,.53) both;animation:scale-out-center .4s cubic-bezier(.55,.085,.68,.53) both}
@-webkit-keyframes scale-out-center{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}100%{-webkit-transform:scale(0);transform:scale(0);opacity:1}}@keyframes scale-out-center{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}100%{-webkit-transform:scale(0);transform:scale(0);opacity:1}}