/*
Bootstrap Customized
===================================== */
.btn-success {
	background-color: #3E7F2D;
}

/*
FONTS
====================================== */
@font-face
{
font-family: Signika-Regular;
src: url(Fonts/Signika-Regular.ttf);
}

/*
GENERAL STYLES
====================================== */
body {
	background: url(../img/bg.png);
}

h2 {
    text-align: center;
}

#timer {
	display: none;
}

.transError {
	display: none;
}

#eventPanel div.row, #ploegPanel div.row, #confirmPanel div.row, #playerPanel div.row, #endPanel div.row, #pinReferee div.row, #foulPanel div.row {	
	margin: 25px 0;
}

#eventPanel, #endPanel, #playerPanel, #ploegPanel, #foulPanel, #confirmPanel {
	display: none;
	border: 1px solid #BFA590;
}
/*
ERRORS
======================================= */
.error{display: none; margin-top: 5px;}

/*
LOGIN STYLES
====================================== */
#langselector, #gameBackHome {
	margin-top: 15px;
	text-align: center;
}

.selectedLang {
	color: #ff932b;
	text-decoration: underline;
}

#login {
	margin-top: 30px;
}
#loginForm{
        display: block;
        padding-top: 50px; 
        font-family: "Signika-Regular";
}

/*
CONTROL panel
====================================== */
#controlPanel {
	margin-top: 15px;
}

#controlPanel div div {
	margin-top: 7px;
	text-align: center;
}

/*
MATCH panel
====================================== */
#matchPanel h1 {
	text-align: center;
}

#logForm table{
	border: 1px solid #9EB4E5;
	border-radius: 10px;
}

#matchOverlayBtn:hover {
	cursor: pointer;
}

#matchPanel {
	min-height: 500px;
	z-index: -1;
}

.eventRemove {
	color: red;
	text-align: center;
}

.deleteIcon {
	text-align: center;
}

.eventRemove:hover {
	cursor: pointer;
}
.eventRow {
	background-color: white;
	opacity: 0.7;
	color: #1e2a36;
}

#overlayTimer {
	width: 100%;
        background: rgba(0,0,0,0.2);
        text-align: center;
        color:#fff;
        font: 95px/1 "Impact";
        text-transform: uppercase;
        display: block;
        text-shadow:#253e45 -1px 1px 0,
        #253e45 -2px 2px 0,
        #d45848 -3px 3px 0,
        #d45848 -4px 4px 0;
}

.img-Icon {
	max-height: 25px;
	min-width: 15px;
	width: auto;
}
.img-Icon.inline {
	display: inline;
	margin-right: 10px;
}
.eventRowMain {
	background-color: #1e2a36;
	color: white;
}

.eventRowMain th.deleteColumn {
	text-align: center;
}

/*
EventPanel
====================================== */
#eventPanel div.bottomRow {
	margin-top: 65px;
}

/*
FoulPanel
====================================== */
#foulIcons input[type="radio"] {
	display: none;
}

.foulImages {
	background-color: transparent;
	border: none;
}

#foulIcons {
	width: 100%;
}
div.fouls {
	width: 30%;
	margin: 5px;
	float: left;
	height: 200px;
	text-align: center;
	font-size: 1.1em;
	border: 2px solid lightGray;
	border-radius: 30px;
	cursor: pointer;
}

div.fouls.selected {
	border: 2px solid orange;
}

div.fouls img {
	max-height: 170px;
	max-width: 100%;
	
}

@media (max-width: 940px) {
	div.fouls {
		width: 45%;
	}
}

@media (max-width: 520px) {
	div.fouls {
		width: 95%;
	}
}

/*
Playerspanel
====================================== */
.speler {
	margin-bottom: 20px;
}

/*
PeriodPanel
====================================== */
#endGame {
	margin-top: 15px;
}

/*
Comment game popup
======================================= */
#commentGameBegin h3 {
	padding: 10px;
	margin: 10px;

}

#commentGameBegin p {
	text-align: center;
}

#noGames{
	display: none;
}

/*
Modals
====================================== */
#dialog-message, #dialog-delete, #dialog-comment {
	display: none;
}

.modal {
    overflow-y: auto;
}

/*
END Panel
====================================== */
#endPanel {
	margin-bottom: 20px;
	padding-bottom: 20px;
}

#commentEndGame {
	margin-bottom: 20px;
}

/*
ERROR Page
======================================= */
#errorInfoPanel {
	display: none;
}


/*
MEDIAQUERIES
================================================= */
@media (min-width: 769px) and (max-width: 992px) {
  #timer {
  	font-size: 90%;
  	padding: 4px 9px;
  	margin-top: 7px;
  }
}

@media (max-width: 768px) {
	#matchPanel h1{
		font-size: 140%;
	}
}

@media (max-width: 479px) {
	#matchPanel h1 {
		font-size: 120%;
	}
}

/* Overwrite some dialogs */
.ui-widget-content {
	background: white;
	border: 0;
}

#dialog-comment {
	min-width: 400px;
	max-width: 100%;
}

.d-block {
	display: block;
}

.d-none {
	display: none;
}

.background-red {
	background-color: #e84c3d;
}

.background-green {
	background-color: #71BF46;
}


.btn-lg, .btn-group-lg>.btn {
	padding:18px 10px;
}
