/**
Theme Name: Astra Child
Author: Think Big Media Services
Author URI: https://thinkbigservices.co.uk
Description: Custom Wordpress Theme
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/
input#game_name {
    padding: 11px;
}
.form-container {
    text-align: center;
    margin-top: 50px;
}
.message {
    text-align: center;
    background: #e6e6e6;
    padding: 20px;
    margin-top: 20px;
}
.message.error {
    background: #ef4d4d;
    color: #fff;
}
.message.success {
    background: #499a35;
    color: #fff;
}
input#roll {width:100%;text-align:center;}
.message a {color:#fff;}
img.dice_image, img.plus {
    width: 40px;
    cursor: pointer;
} 
div#result-container {
    padding: 10px;
    border: 9px solid #dcdcdc;
    text-align: center;
    margin: 20px 0 0 0;
}
div#result-container-outer {
    clear: both;
    top: 10px;
    position: relative;
}
div#score-container-outer {
    text-align: center;
    border: 9px solid #dcdcdc;
    border-top: 0;
}
div#status {
    background: #4e4e4e;
    padding: 0px;
    text-align: center;
    color: #fff;
    margin-top: 10px;
}
div#status.success {
    background: #ccffcb;
    color: #2e8c07;
}
div#status.failed {
    background: #ffc5c5;
    color: #212121;
}
div#dice-container {
    width: 50%;
    float: right;
    text-align: right;
}
div#name-container {
    float: left;
    margin-right: 30px;
}
input#your_name {
    padding: 10px;
}
div#score-container {
    padding-top: 10px;
}
/*div#history-container div.history-row:nth-child(odd) {
    background: #f7f7f7;
}*/
div.history-row {
    padding: 5px 10px;border-bottom: 1px solid #afafaf;
}
span.history-name {
    font-weight: bold;
    width: 80%;
    display: inline-block;
}
span.history-roll_info {
    display: inline-block;
    width: 90px;
}
.ast-row h3 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}
span.history-score {
    display: inline-block;
    width: 75px;
}
img.result_dice {
    max-width: 20%;
}
div.history-row.red {background: #ffe4e4;}
div.history-row.green {    background: #ccffcb;}
div.history-row.blue {background: #97e8fb;}
div.history-row.orange {background: #d8d8d8;}
div.history-row.chat {
    background: #505050;
    color: #fff;
}
span.history-chat-msg {
    display: block;
    width: 100%;
}
span.chat-date {
    font-size: 10px;
    color: #ccc;
}
input#toggle-chat {
    width: 49%!important;
    float: left;
    background: #656565;
}
input#submit-chat {
    background: #62a562;
}
div#scoreboard-container input[type="submit"] {
    width: 49%;
    margin-bottom: 3px;
}
input#clear_scores {
    background: #ff3212;
}
input#clear_history {
    background: #783e79;
}
input[disabled] {background:#ccc;}
input[disabled]:hover {
    background: #ccc;
}
div#scoreboard-container-inner {
padding: 0 20px 20px 0;
    border: 0px solid #ccc;
    margin-top: 10px;
    clear:left;
}
div#history-container-inner {
    max-height: 259px;
    overflow-y: scroll;
}
.elementor-element.elementor-element-ffb99e8.elementor-widget.elementor-widget-shortcode {
    margin: 0;
}
input#change_name {
    padding: 9px 30px;
    background: #6a9c75;
    margin-right: 10px;
}
select#user_list {
    width: 50%;
    float: left;
}
div#scoreboard-container input#new_score {
    width: 50%;
    float: left;
    padding: 12px;
}
span.scorenumber {
    font-size: 20px;
    font-weight: bold;
    line-height: 19px;
    top: 2px;
    position: relative;
    color: green;
}

@keyframes shake {
0% { transform: translate(1px, 1px) rotate(360deg); }
10% { transform: translate(-1px, -2px) rotate(-360deg); }
20% { transform: translate(-3px, 0px) rotate(360deg); }
30% { transform: translate(3px, 2px) rotate(360deg); }
40% { transform: translate(1px, -1px) rotate(360deg); }
50% { transform: translate(-1px, 2px) rotate(-360deg); }
60% { transform: translate(-3px, 1px) rotate(360deg); }
70% { transform: translate(3px, 1px) rotate(-360deg); }
80% { transform: translate(-1px, -1px) rotate(360deg); }
90% { transform: translate(1px, 2px) rotate(360deg); }
100% { transform: translate(1px, -2px) rotate(-360deg); }
}

.result_dice.shake{
/* Start the shake animation and make the animation last for 0.5 seconds */
animation: shake 1s;

/* When the animation is finished, start again */
animation-iteration-count: infinite;
}

@media screen and (max-width:1100px){
	div#scoreboard-container input {
	    padding: 5px 10px;
	    font-size: 12px;
	}
}
@media screen and (max-width:850px){
	span.history-name {
	    width: 80px;
	}

}
@media screen and (max-width:653px){
	div#scoreboard-container input {
    	width: 100%;
    	margin-bottom: 2px;
	}
    input#clear_scores, input#clear_history, input#edit_scores {width:100%;margin-top:10px;}
section.elementor-section.elementor-top-section.elementor-element.elementor-element-0ae3a0d.elementor-section-boxed.elementor-section-height-default.elementor-section-height-default .elementor-widget-container {
    z-index: 9999;
}
}
@media screen and (max-width:500px){

	div#dice-container {
	    width: 75%;
	    float: none;
	    text-align:center;
	}
	div#name-container {
	    width: 100%;
	    float: none;
	    text-align: center;
	}

	span.history-name {width:80%;}
	span.history-roll_info {width:50%;}
	span.history-score {width:80px;}
	div#scoreboard-container input[type="submit"] {
	    width: 49%;
	    float: left;
	    padding: 5px;
	    margin-right: 2px;
	}
    div#scoreboard-container {
        padding: 0;
    }    
	.elementor.elementor-location-single.type-games.ast-article-single {
	    top: -60px;
	    position: relative;
	}
    div#history-container {
        padding: 0;
        margin-top: 10px;
    }    
	div#history-container-inner {font-size:12px;}
}