body { padding-top:80px; padding-bottom:30px; background:#ffffff; font-family: 'Open Sans', sans-serif; }
body.home { background: #191818; }

a,
a:hover,
a:focus,
a:active,
a.active { outline: 0;}

a { color: #FF432E; text-decoration: none; }

a:hover,
a:focus{ text-decoration: none; }

.btn-default { padding: 20px; margin-top: 30px; font-size: 16px; text-transform: uppercase; font-weight: 400; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; border-radius:3px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }

/* animation */
@-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); } }
@-moz-keyframes wobble { 0% { -moz-transform: translateX(0%); } 15% { -moz-transform: translateX(-25%) rotate(-5deg); } 30% { -moz-transform: translateX(20%) rotate(3deg); } 45% { -moz-transform: translateX(-15%) rotate(-3deg); } 60% { -moz-transform: translateX(10%) rotate(2deg); } 75% { -moz-transform: translateX(-5%) rotate(-1deg); } 100% { -moz-transform: translateX(0%); } }
@-o-keyframes wobble { 0% { -o-transform: translateX(0%); } 15% { -o-transform: translateX(-25%) rotate(-5deg); } 30% { -o-transform: translateX(20%) rotate(3deg); } 45% { -o-transform: translateX(-15%) rotate(-3deg); } 60% { -o-transform: translateX(10%) rotate(2deg); } 75% { -o-transform: translateX(-5%) rotate(-1deg); } 100% { -o-transform: translateX(0%); } }
@keyframes wobble { 0% { transform: translateX(0%); } 15% { transform: translateX(-25%) rotate(-5deg); } 30% { transform: translateX(20%) rotate(3deg); } 45% { transform: translateX(-15%) rotate(-3deg); } 60% { transform: translateX(10%) rotate(2deg); } 75% { transform: translateX(-5%) rotate(-1deg); } 100% { transform: translateX(0%); } }
.wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -o-animation-name: wobble; animation-name: wobble; }



.buttons { padding-top: 50px; padding-bottom: 30px; }
.buttons .menu-item { color: #fff; padding-top: 20px; text-align:center; padding-bottom: 20px; margin-bottom: 30px; -webkit-transition: all 0.3s; transition: all 0.3s; }
.buttons .menu-item a { color: #fff; display: block; -webkit-transition: all 0.3s; transition: all 0.3s; }
.buttons .menu-item a p { font-family: 'Oswald', sans-serif; font-weight: 300; font-size: 20px; }
.buttons .menu-item a i { font-size: 50px; padding-bottom: 20px; }
.buttons .menu-item:hover a { text-decoration: none; animation: wobble; -webkit-animation: wobble; animation-duration: 1000ms; -webkit-animation-duration: 1000ms; }

@media only screen and (max-width : 500px) {
   	.buttons .col-xs-6 { width:100%; }    
}
@media only screen and (max-width : 767px) {
	.buttons { padding-top: 20px; }
}


/* heading */
.section-title h1,
.section-title h2,
.section-title h3{ color: #666 !important; text-align:center; font-size: 28px; font-family: 'Oswald', sans-serif; text-transform: none; }
.section-title p { padding-bottom: 60px; text-align:center; color: #999; font-size: 18px; font-weight: 300; }


/* vorige button */
.back { position: absolute; top: 15px; right: 15px; width: 75px; height: 75px; background-color: transparent; cursor: pointer;}
.back:hover { opacity: .3;}
.back .lr { z-index: 1051;  width: 1px;  height: 75px; margin-left: 35px; background-color: #222; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.back .lr .rl { z-index: 1052; width: 1px; height: 75px; background-color: #222; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }

.btn-custom { min-width:200px; margin: 20px 0 20px 0; text-align:center; color: #fff; display: inline-block; padding: 20px; -webkit-transition: all 0.3s; transition: all 0.3s; }
.btn-custom span { font-family: 'Oswald', sans-serif; display:block; font-weight: 300; font-size: 20px; }
.btn-custom i { margin: 0 auto; font-size: 28px; padding-bottom: 10px; display:block; }
.btn-custom:hover span,
.btn-custom:hover i{ text-decoration: none; animation: wobble; -webkit-animation: wobble; animation-duration: 1000ms; -webkit-animation-duration: 1000ms; }



.chuck{ padding:20px; background: #0ECEAB; color: #ffffff; font-style: italic; } 




    

/**** APP Info ****/
.info { margin-bottom:50px; }    

@media only screen and (max-width : 500px) {
    .info .col-xs-4 { margin-left: 20%; width:60%; }    
}

/**** APP Connect ****/
.connect { margin-bottom: 20px; }
.connect .form-group { margin-bottom: 25px; }
.connect .form-group .form-control { padding: 15px; }
.connect .form-group .form-control:focus { border-color: rgba(114,191,72,0.6); -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px rgba(114,191,72,.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px rgba(114,191,72,.6); }
.connect .form-group input.form-control { height: auto; }
.connect .btn-link { padding: 5px; }

.connect .btn-default { margin-top:10px; color: #fff; border-color: #72bf48; background: #72bf48; }
.connect .btn-default:hover,
.connect .btn-default:focus,
.connect .btn-default:active,
.connect .btn-default.active,
.connect .btn-default.active:hover,
.connect .btn-default.active:focus,
.connect .btn-default.active:active{ color: #72bf48; border-color: #72bf48; background: none; }

@media only screen and (max-width : 500px) {
    .connect .col-xs-8 { margin-left: 0%; width:100%; }    
}

/**** APP Change ****/
.change { margin-bottom: 20px; }
.change .form-group { margin-bottom: 25px; }
.change .form-group .form-control { padding: 15px; }
.change .form-group .form-control:focus { border-color: rgba(14, 206, 171,0.6); -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px rgba(14, 206, 171,.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px rgba(14, 206, 171,.6); }
.change .form-group input.form-control { height: auto; }

.change .btn-default { margin-top:10px; color: #fff; border-color: #0ECEAB; background: #0ECEAB; }
.change .btn-default:hover,
.change .btn-default:focus,
.change .btn-default:active,
.change .btn-default.active,
.change .btn-default.active:hover,
.change .btn-default.active:focus,
.change .btn-default.active:active{ color: #0ECEAB; border-color: #0ECEAB; background: none; }

@media only screen and (max-width : 500px) {
    .change .col-xs-8 { margin-left: 0%; width:100%; }    
}


/**** APP Contact ****/
.contact { margin-bottom: 20px; }
.contact .form-group { margin-bottom: 25px; }
.contact .form-group .form-control { padding: 15px; }
.contact .form-group .form-control:focus { border-color: rgba(234,50,30,0.6); -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px rgba(234,50,30,.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px rgba(234,50,30,.6); }
.contact .form-group input.form-control { height: auto; }
.contact .form-group textarea.form-control { height: 206px; }

.contact .btn-default { color: #fff; border-color: #FF432E; background: #FF432E; }
.contact .btn-default:hover,
.contact .btn-default:focus,
.contact .btn-default:active,
.contact .btn-default.active,
.contact .btn-default.active:hover,
.contact .btn-default.active:focus,
.contact .btn-default.active:active{ color: #FF432E; border-color: #FF432E; background: none; }


.rikken .box{ overflow:hidden; border:solid 1px #cccccc; border-radius: 4px; padding:20px; margin-bottom:50px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.rikken h3{ color: #666 !important; text-align:center; font-size: 24px; font-family: 'Oswald', sans-serif; text-transform: none; margin-top: 0px; }
.rikken .box .btn { margin-top:10px; padding:10px; font-size:16px; }
.rikken .box .btn:first-child { float:left; }
.rikken .box .btn:last-child { float:right; }

.rikken .form-group label { text-align:left; display:block; padding-top: 10px; color: #000; font-size: 18px; font-weight: 300;  }

.rikken .btn-default { color: #fff; border-color: #FA6900; background: #FA6900; }
.rikken .btn-default:hover,
.rikken .btn-default:focus,
.rikken .btn-default:active,
.rikken .btn-default.active,
.rikken .btn-default.active:hover,
.rikken .btn-default.active:focus,
.rikken .btn-default.active:active{ color: #FA6900; border-color: #FA6900; background: none; }




.riklijst {
	margin-bottom:100px;
}
.riklijst.total {
	margin-bottom:0px;
}
.riklijst>tbody>tr>td {
	text-align:center;
	white-space: nowrap;
}
.riklijst>tbody>tr:first-child>td {
	font-size:11px;
}
.riklijst>tbody>tr:last-child>td {
	border-bottom:solid 1px #ddd;
}
.riklijst>tbody>tr>td:nth-child(1) {
	border-left:solid 1px #ddd;
	border-right:solid 1px #ddd;
}
.riklijst.top>tbody>tr>td:nth-child(2) {
	border-right:solid 1px #ddd;
}
.riklijst.top>tbody>tr>td:nth-child(3) {
	border-right:solid 1px #ddd;
}
.riklijst.top>tbody>tr>td:nth-child(4) {
	border-right:solid 1px #ddd;
}
.riklijst>tbody>tr>td:first-child {
	border-right:solid 1px #ddd;
	text-align:left;
}
.riklijst>tbody>tr>td:last-child {
	border-right:solid 1px #ddd;
}
.riklijst>tbody>tr.meer>td {
	padding:8px 0;
	border:none!important;
	border-top:solid 1px #ddd!important;
	background-color: #ffffff;
}

.riklijst>tbody:nth-child(2) {
	border-top: 1px solid #ddd;
}
.riklijst>tbody:nth-child(2)>tr:nth-child(odd)>td {
	background-color: #ffffff;
}
.riklijst>tbody:nth-child(2)>tr:nth-child(even)>td {
	background-color: #f9f9f9;
}
.riklijst>tbody:nth-child(2)>tr:last-child>td {
	border-bottom:solid 1px #ddd;
}
@media (max-width: 525px) { 
    
	.riklijst.strip>tbody>tr>td:nth-child(2){
		display:none;
	}
	
}
@media (max-width: 450px) { 
    
	.riklijst.strip>tbody>tr>td:nth-child(3){
		display:none;
	}
	
}
@media (max-width: 400px) { 
    
	.riklijst.strip>tbody>tr>td:nth-child(4){
		display:none;
	}
	
}



/* Game */
.game {  }
.game .deelnemer { background: #DBDBDB; color: #fff; padding-top: 15px; text-align:center; padding-bottom: 15px; -webkit-transition: all 0.3s; transition: all 0.3s; }
.game .deelnemer.active { background: #72bf48; color:#ffffff; }
.game .deelnemer.win:before { content: "+"!important; font-size:28px; position: absolute; line-height: 20px; top:10px; right:25px;}
.game .deelnemer.deler:after { content: "."!important; font-size:50px; position: absolute; line-height: 20px; bottom:20px; right:20px;}

.game .deelnemer.active .fa-user-o:before {content: "\f007"!important;}
.game .deelnemer p { font-family: 'Oswald', sans-serif; font-weight: 300; font-size: 20px; margin:0; }
.game .deelnemer i { font-size: 32px; padding-bottom: 5px; }

.game .single-card { height:140px; box-shadow: 1px 1px 4px #a7a7a7; }
.game .card { height:115px; margin-right:5px; box-shadow: 1px 1px 4px #a7a7a7; }
.game .card:hover { cursor:pointer; }

.game .row.table { display: flex; align-items: center; justify-content: center; flex-direction: row; }
.game .row.table .col-xs-2 { width:20%!important; text-align: center; }
.game .row.table .col-xs-4 { width:40%!important; }
.game .row.table .col-xs-12 { text-align: center; }

.game .btn { border-radius: 0; }
.game .alert { border-radius:0; border:none; margin:0; }








/* kleur */
.red { background: #FF432E;}
.blue { background: #28ABE3;}
.green { background: #72bf48;}
.light-red { background: #FB6648;}
.light-orange { background: #FA6900;}
.light-green { background: #0ECEAB;}
.light-blue { background: #2e9eff;}






p { font-family: 'Open Sans', sans-serif; font-size: 13px; line-height: 28px; }