﻿/* starter */
body { padding-top: 5rem; }
body.gameindex { padding-top: 0rem; }

/* album */
:root { --jumbotron-padding-y: 3rem; }

.jumbotron {
	padding-top: var(--jumbotron-padding-y);
	padding-bottom: var(--jumbotron-padding-y);
	margin-bottom: 0;
	background-color: #fff;
	border-bottom: 1px solid #e5e5e5;
}

.jumbotron p:last-child { margin-bottom: 0; }
.jumbotron-heading { font-weight: 300; }
.jumbotron .container { max-width: 40rem; }

footer {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

footer p { margin-bottom: .25rem; }
.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }


/* custom */
div#question-block.gamecard {
	cursor: pointer;
	height: 100%;
}
div#question-block.gamecard .answer {
	color: #6c757d;
	text-indent: -99999px;
	padding-top: 2rem;
}

div#question-block.gamecard h5.qcategory.red { color: #fff; background-color: #e84646; padding: 20px; }
div#question-block.gamecard h5.qcategory.pink { color: #fff; background-color: #e84646; padding: 20px; }
div#question-block.gamecard h5.qcategory.orange { color: #fff; background-color: #ff8128; padding: 20px; }
div#question-block.gamecard h5.qcategory.yellow { color: #fff; background-color: #fac443; padding: 20px; }
div#question-block.gamecard h5.qcategory.green { color: #fff; background-color: #43c35e; padding: 20px; }
div#question-block.gamecard h5.qcategory.blue { color: #fff; background-color: #3498db; padding: 20px; }
div#question-block.gamecard h5.qcategory.purple { color: #fff; background-color: #806aa5; padding: 20px; }

.btn.dark { color: #343a40; border-color: #343a40; }
.btn.red { color: #e84646; border-color: #e84646; }
.btn.pink { color: #e84646; border-color: #e84646; }
.btn.orange { color: #ff8128; border-color: #ff8128; }
.btn.yellow { color: #fac443; border-color: #fac443; }
.btn.green { color: #43c35e; border-color: #43c35e; }
.btn.blue { color: #3498db; border-color: #3498db; }
.btn.purple { color: #806aa5; border-color: #806aa5; }



/**/

.btn-ovr-red { color: #dc3545; background-color: transparent; background-image: none; border-color: #dc3545; }
.btn-ovr-red:hover { color: #fff; background-color: #dc3545; border-color: #dc3545; }
.btn-ovr-red:focus, .btn-ovr-red.focus { box-shadow: 0 0 0 0.2rem #dc35467a; }
.btn-ovr-red.disabled, .btn-ovr-red:disabled { color: #dc3545; background-color: transparent; }
.btn-ovr-red:not(:disabled):not(.disabled):active, 
.btn-ovr-red:not(:disabled):not(.disabled).active,
.show > .btn-ovr-red.dropdown-toggle { color: #fff; background-color: #dc3545; border-color: #dc3545; }
.btn-ovr-red:not(:disabled):not(.disabled):active:focus, 
.btn-ovr-red:not(:disabled):not(.disabled).active:focus,
.show > .btn-ovr-red.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem #dc35457a; }

.btn-ovr-pink { color: #dc3545; background-color: transparent; background-image: none; border-color: #dc3545; }
.btn-ovr-pink:hover { color: #fff; background-color: #dc3545; border-color: #dc3545; }
.btn-ovr-pink:focus, .btn-ovr-pink.focus { box-shadow: 0 0 0 0.2rem #dc35467a; }
.btn-ovr-pink.disabled, .btn-ovr-pink:disabled { color: #dc3545; background-color: transparent; }
.btn-ovr-pink:not(:disabled):not(.disabled):active, 
.btn-ovr-pink:not(:disabled):not(.disabled).active,
.show > .btn-ovr-pink.dropdown-toggle { color: #fff; background-color: #dc3545; border-color: #dc3545; }
.btn-ovr-pink:not(:disabled):not(.disabled):active:focus, 
.btn-ovr-pink:not(:disabled):not(.disabled).active:focus,
.show > .btn-ovr-pink.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem #dc35457a; }

.btn-ovr-orange { color: #ff8128; background-color: transparent; background-image: none; border-color: #ff8128; }
.btn-ovr-orange:hover { color: #fff; background-color: #ff8128; border-color: #ff8128; }
.btn-ovr-orange:focus, .btn-ovr-orange.focus { box-shadow: 0 0 0 0.2rem #ff81287a; }
.btn-ovr-orange.disabled, .btn-ovr-orange:disabled { color: #ff8128; background-color: transparent; }
.btn-ovr-orange:not(:disabled):not(.disabled):active, 
.btn-ovr-orange:not(:disabled):not(.disabled).active,
.show > .btn-ovr-orange.dropdown-toggle { color: #fff; background-color: #ff8128; border-color: #ff8128; }
.btn-ovr-orange:not(:disabled):not(.disabled):active:focus, 
.btn-ovr-orange:not(:disabled):not(.disabled).active:focus,
.show > .btn-ovr-orange.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem #ff81287a; }

.btn-ovr-yellow { color: #fac443; background-color: transparent; background-image: none; border-color: #fac443; }
.btn-ovr-yellow:hover { color: #fff; background-color: #fac443; border-color: #fac443; }
.btn-ovr-yellow:focus, .btn-ovr-yellow.focus { box-shadow: 0 0 0 0.2rem #fac4437a; }
.btn-ovr-yellow.disabled, .btn-ovr-yellow:disabled { color: #fac443; background-color: transparent; }
.btn-ovr-yellow:not(:disabled):not(.disabled):active, 
.btn-ovr-yellow:not(:disabled):not(.disabled).active,
.show > .btn-ovr-yellow.dropdown-toggle { color: #fff; background-color: #fac443; border-color: #fac443; }
.btn-ovr-yellow:not(:disabled):not(.disabled):active:focus, 
.btn-ovr-yellow:not(:disabled):not(.disabled).active:focus,
.show > .btn-ovr-yellow.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem #fac4437a; }

.btn-ovr-green { color: #43c35e; background-color: transparent; background-image: none; border-color: #43c35e; }
.btn-ovr-green:hover { color: #fff; background-color: #43c35e; border-color: #43c35e; }
.btn-ovr-green:focus, .btn-ovr-green.focus { box-shadow: 0 0 0 0.2rem #43c35e7a; }
.btn-ovr-green.disabled, .btn-ovr-green:disabled { color: #43c35e; background-color: transparent; }
.btn-ovr-green:not(:disabled):not(.disabled):active, 
.btn-ovr-green:not(:disabled):not(.disabled).active,
.show > .btn-ovr-green.dropdown-toggle { color: #fff; background-color: #43c35e; border-color: #43c35e; }
.btn-ovr-green:not(:disabled):not(.disabled):active:focus, 
.btn-ovr-green:not(:disabled):not(.disabled).active:focus,
.show > .btn-ovr-green.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem #43c35e7a; }

.btn-ovr-blue { color: #3498db; background-color: transparent; background-image: none; border-color: #3498db; }
.btn-ovr-blue:hover { color: #fff; background-color: #3498db; border-color: #3498db; }
.btn-ovr-blue:focus, .btn-ovr-blue.focus { box-shadow: 0 0 0 0.2rem #3498db7a; }
.btn-ovr-blue.disabled, .btn-ovr-blue:disabled { color: #3498db; background-color: transparent; }
.btn-ovr-blue:not(:disabled):not(.disabled):active, 
.btn-ovr-blue:not(:disabled):not(.disabled).active,
.show > .btn-ovr-blue.dropdown-toggle { color: #fff; background-color: #3498db; border-color: #3498db; }
.btn-ovr-blue:not(:disabled):not(.disabled):active:focus, 
.btn-ovr-blue:not(:disabled):not(.disabled).active:focus,
.show > .btn-ovr-blue.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem #3498db7a; }

.btn-ovr-purple { color: #806aa5; background-color: transparent; background-image: none; border-color: #806aa5; }
.btn-ovr-purple:hover { color: #fff; background-color: #806aa5; border-color: #806aa5; }
.btn-ovr-purple:focus, .btn-ovr-purple.focus { box-shadow: 0 0 0 0.2rem #806aa57a; }
.btn-ovr-purple.disabled, .btn-ovr-purple:disabled { color: #806aa5; background-color: transparent; }
.btn-ovr-purple:not(:disabled):not(.disabled):active, 
.btn-ovr-purple:not(:disabled):not(.disabled).active,
.show > .btn-ovr-purple.dropdown-toggle { color: #fff; background-color: #806aa5; border-color: #806aa5; }
.btn-ovr-purple:not(:disabled):not(.disabled):active:focus, 
.btn-ovr-purple:not(:disabled):not(.disabled).active:focus,
.show > .btn-ovr-purple.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem #806aa57a; }

.btn-ovr-dark { color: #343a40; background-color: transparent; background-image: none; border-color: #343a40; }
.btn-ovr-dark:hover { color: #fff; background-color: #343a40; border-color: #343a40; }
.btn-ovr-dark:focus, .btn-ovr-dark.focus { box-shadow: 0 0 0 0.2rem #343a407a; }
.btn-ovr-dark.disabled, .btn-ovr-dark:disabled { color: #343a40; background-color: transparent; }
.btn-ovr-dark:not(:disabled):not(.disabled):active, 
.btn-ovr-dark:not(:disabled):not(.disabled).active,
.show > .btn-ovr-dark.dropdown-toggle { color: #fff; background-color: #343a40; border-color: #343a40; }
.btn-ovr-dark:not(:disabled):not(.disabled):active:focus, 
.btn-ovr-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-ovr-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem #343a407a; }

/**/




h5.qcategory { text-align: center; }
img.qbuttons { cursor: pointer; width: 100%; }

.gscat .lead { text-align: left; }
.gscatcat h1 { letter-spacing: .9rem; }

/* landscape phones and larger */
@media (min-width: 576px) {  }

/* tablets and larger) */
@media (min-width: 768px) {
	.jumbotron {
		padding-top: calc(var(--jumbotron-padding-y) * 2);
		padding-bottom: calc(var(--jumbotron-padding-y) * 2);
	}
	div#question-block.gamecard h2.answer {
		padding-top: 4rem;
	}
}

/* desktops and larger */
@media (min-width: 992px) {  }

/* xl devices and larger */
@media (min-width: 1200px) {  }