.boldtext{
	font-weight: bold;
	
}


label{
	margin-bottom:0px!important;
	
}


#highscorecontainer{
height:80vh;
width:100%;
overflow:auto;	
}

#modalPrizeDrawBox{
	
	font-family: 'apercu_regular';
	
}

 #modalTutorial, #modalGameResult, #modalExitGame, #modalGameLevel{
	font-family: 'apercu_regular'; 
	font-size:20px;
 }

#modalPrizeDrawBox-alert-info{
	background-color: #cfcfcf!important;
	border-color:#cfcfcf!important;
	color:#000000!important;
}

#modalGameResultText, #modalGameLevelText{
	
	padding-top:30px;
	padding-bottom:30px;
	padding-left:10px;
	padding-right:10px;
	text-align:center;
	font-size:26px;

}






#submitRegister, #startGameButton, #openRegisterButton, #nextLevelButton, #modalExitGame_Yes, #modalExitGame_No{
	 background: -webkit-gradient(linear,0% 50%,0% 100%,from(#E3032D),to(#A30D1E));
	 border: 2px solid #A30D1E;
	font-family: 'hestina';
	font-size:42px;
	padding:0px;
	color: #ffffff;
	border-radius:10px;
	outline: none;   
	padding-top: 8px;
	
	outline: none;
	box-shadow: none !important;
	-webkit-appearance: none;
  
  
}

#newStartButton{
	 background: -webkit-gradient(linear,0% 50%,0% 100%,from(#6d6d6d),to(#555555))!important;
	 border: 2px solid #555555;
	font-family: 'hestina';
	font-size:42px;
	padding:0px;
	color: #ffffff;
	border-radius:10px;
	outline: none;   
	padding-top: 8px;
	width:240px;
	margin:10px;
	
	outline: none;
	box-shadow: none !important;
	-webkit-appearance: none;
	
	
}

#openRegisterButtonLevel{
	
	background: -webkit-gradient(linear,0% 50%,0% 100%,from(#6d6d6d),to(#555555))!important;
	border: 2px solid #555555;
	font-family: 'hestina';
	font-size:42px;
	padding:0px;
	color: #ffffff;
	border-radius:10px;
	outline: none;   
	padding-top: 8px;
	width:240px;
	margin:10px;

	outline: none;
	box-shadow: none !important;
	-webkit-appearance: none;

}



#submitRegister:hover, #startGameButton:hover, #openRegisterButton:hover, #nextLevelButton:hover, #modalExitGame_Yes:hover, #newStartButton:hover, #openRegisterButtonLevel:hover, #modalExitGame_No:hover{

     border:2px solid #ffffff;
}
	
	
.modal-content{
	border:0px;
	border-radius:0px!important;
}


#modalGameResult .leaderboard-header{
	background-color:none!important;
}

#modalGameLevel .leaderboard-header{
	background-color:none!important;
}

#scorePrizeDrawBox{
 font-size: 22px;	
 padding-top:10px;
 padding-bottom:10px;
	
}

#leaderboard-closebutton{
	border-radius: 0!important;
	box-shadow: none!important;
	outline: 0!important;
	float: right;
	padding-right: 0!important;
	color:#ffffff;
}

#leaderboard-closebutton-image{

	float: right;
	padding-top: 12px;
	cursor: pointer;
}

#prizedraw-closebutton-image{

	float: right;
	padding-top: 6px;
	cursor: pointer;
}

.leaderboard-playername{
 margin-top:8px;
 font-size: 22px;
font-family: 'apercu_regular';
padding-left:0px !important;
}

.leaderboard-header{
	background-color:#e2042e;
	color:#ffffff;
	font-family: 'apercu_regular';
	font-size: 28px;
	text-align: center;

}

.leaderboard-header-transparent{
	background-color:none;
	color:#e2042e;
	font-family: 'apercu_regular';
	font-size: 28px;
	text-align: center;

}

.highscore-header{
	font-family: 'hestina';
	 display: inline-block;
	   font-size:46px;
	   margin-top: 8px;
}

.formsmall{
	
display: inline;
font-size: 14px;
margin-left: 6px;
line-height: 25px;

}


.tutorial-header{

font-family: 'hestina';
	 display: inline-block;
	  font-size:46px;
	     margin-top: 8px;
}

#modalTutorialText, #modalExitGameText{
	
padding:30px;
text-align:center;

}

.leaderboard-select-button{
padding-right:0px !important;
}

.leaderboard-tabs {
	 background-color: #f2f2f2; 
	 padding-left:0px !important;
	  padding-right:0px !important;
	  padding-top:5px !important;
	  
}

.tab-pane{
	  padding-right:0px !important;
	    padding-left:0px !important;
	
}

.table {
	font-family: 'apercu_regular';
	border-collapse: separate;
    border-spacing: 10px 0px;
}

.table td{
	vertical-align:middle !important;
	padding:0rem !important;
	border-top:0px !important;
}

.table-num{
		color: #e2042e;
		 font-size: 22px;
}
.table-nick{
	 font-size: 22px;
}
.table-score{
	 font-size: 22px;
	color: #e2042e;
	
}

#reloadbutton{
	border-radius:0px !important;
	   box-shadow:none !important;
    outline:0px !important;
	float:right;
	width: 47px;
	height: 47px;
}

.nav-link {
	font-family: 'apercu_regular';
	font-size: 20px;
	padding-top:0.2rem !important;
	padding-bottom:0.2rem !important;
	border-width:0px !important;
}

.tab-pane{
	background-color: #ffffff;
}
.bg-gradient {
		 
	 background-color: #ffffff; 
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f3f3f3));
background-image: -webkit-linear-gradient(top, #ffffff, #f3f3f3);
background-image: -moz-linear-gradient(top, #ffffff, #f3f3f3);
background-image: -ms-linear-gradient(top, #ffffff, #f3f3f3);
background-image: -o-linear-gradient(top, #ffffff, #f3f3f3);
background-image: linear-gradient(to bottom, #ffffff, #f3f3f3);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffffff, endColorstr=#f3f3f3);
}



@media (max-width: 480px) {

.tutorial-header{
  font-size:40px;
}

#modalTutorialText, #modalExitGameText{
padding: 18px;
font-size: 18px;

}



}






@media (max-width: 900px) {

#submitRegister, #startGameButton, #openRegisterButton, #nextLevelButton, #newStartButton, #openRegisterButtonLevel, #modalExitGame_Yes, #modalExitGame_No{
	
	font-size:30px!important;
	padding-top: 4px!important;
}


#prizedraw-closebutton-image{
	width:40px!important;
}


#modalPrizeDrawBox-alert-info{
	display:none;
}
	
}


@media (min-width: 992px) {

#modalGameResultText, #modalGameLevelText{
padding-left:180px;
padding-right:180px;
}

#modalGameResult .modal-content {
background-image: url("../images/window_background.png");
background-position: 0px 0px;
}

#modalGameLevel .modal-content {
background-image: url("../images/window_background.png");
background-position: 0px 0px;
}



}


/* Mobile Browser ohne Viewport-Meta rechnen oft mit ca. 980 CSS-Pixeln.
   Deshalb vw/vh statt fester Pixel für die HTML-Dialoge verwenden.
   Die kürzere Fensterkante hält die Schrift in beiden Orientierungen lesbar.
   Maus-/Desktop-Ansichten behalten sämtliche bisherigen Größen. */
@media (hover: none) and (pointer: coarse) {
    .modal {
        --dialog-unit: 1vmin;
        font-size: calc(4 * var(--dialog-unit)) !important;
        line-height: 1.45;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .modal .modal-dialog {
        width: 90vw;
        max-width: 90vw;
        margin: 5vh auto;
    }

    .modal .modal-dialog-centered {
        min-height: 90vh;
    }

    .modal .modal-dialog-centered::before {
        display: none;
    }

    .modal .modal-content {
        width: 100%;
        max-height: 90vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Bootstrap begrenzt auch innere .container über Desktop-Breakpoints. */
    .modal .container,
    .modal .container-fluid {
        width: 100%;
        max-width: 100%;
        padding-left: calc(3 * var(--dialog-unit));
        padding-right: calc(3 * var(--dialog-unit));
    }

    #modalTutorialText,
    #modalExitGameText,
    #modalGameResultText,
    #modalGameLevelText {
        font-size: calc(4 * var(--dialog-unit));
        line-height: 1.45;
        padding: calc(4 * var(--dialog-unit));
        overflow-wrap: break-word;
    }

    .modal .leaderboard-header,
    .modal .leaderboard-header-transparent {
        font-size: calc(6 * var(--dialog-unit));
        padding: calc(1.5 * var(--dialog-unit));
    }

    .modal .tutorial-header,
    .modal .highscore-header {
        /* Überschreibt auch die dynamischen Inline-Größen der Registrierung. */
        font-size: calc(8 * var(--dialog-unit)) !important;
        margin-top: calc(1 * var(--dialog-unit));
    }

    #submitRegister,
    #startGameButton,
    #openRegisterButton,
    #nextLevelButton,
    #newStartButton,
    #openRegisterButtonLevel,
    #modalExitGame_Yes,
    #modalExitGame_No {
        width: calc(40 * var(--dialog-unit)) !important;
        max-width: 90%;
        font-size: calc(8 * var(--dialog-unit)) !important;
        line-height: 1.2;
        padding: calc(1.5 * var(--dialog-unit)) calc(2 * var(--dialog-unit)) !important;
        margin: calc(2 * var(--dialog-unit)) !important;
        border-radius: calc(2 * var(--dialog-unit));
    }

    #modalExitGame_Yes,
    #modalExitGame_No {
        width: calc(28 * var(--dialog-unit)) !important;
    }

    /* Registrierung: Eingaben, Beschriftungen und Rückmeldungen mitskalieren. */
    .modal .form-control {
        height: auto;
        font-size: calc(4 * var(--dialog-unit));
        line-height: 1.4;
        padding: calc(2 * var(--dialog-unit));
    }

    .modal label,
    .modal .alert,
    .modal .formsmall,
    .modal .form-check-label {
        font-size: calc(3.6 * var(--dialog-unit));
        line-height: 1.45;
    }

    .modal .form-group {
        margin-bottom: calc(3 * var(--dialog-unit));
    }

    .modal .form-check {
        padding-left: calc(5 * var(--dialog-unit));
    }

    .modal .form-check-input {
        width: calc(3.5 * var(--dialog-unit));
        height: calc(3.5 * var(--dialog-unit));
        margin-left: calc(-5 * var(--dialog-unit));
        margin-top: calc(0.8 * var(--dialog-unit));
    }

    #modalPrizeDrawBox-alert-info {
        display: block;
    }

    /* Highscores: Platz und Schrift anstelle der festen Desktop-Pixelwerte. */
    #highscorecontainer {
        height: auto;
        max-height: 65vh;
    }

    .modal .table {
        margin-bottom: calc(3 * var(--dialog-unit));
        border-spacing: calc(2 * var(--dialog-unit)) 0;
    }

    .modal .table-num,
    .modal .table-nick,
    .modal .table-score,
    .modal .leaderboard-playername,
    .modal .nav-link {
        font-size: calc(3.6 * var(--dialog-unit));
    }

    .modal .table-nick {
        overflow-wrap: anywhere;
    }

    #leaderboard-closebutton-image,
    #prizedraw-closebutton-image,
    #reloadbutton {
        width: calc(9 * var(--dialog-unit)) !important;
        height: auto;
        padding-top: calc(1 * var(--dialog-unit)) !important;
    }
}
