/* Solid, go home, you're drunk */

.nfuk_ot3 {
	border: 2px solid yellow !important;
	margin: 10px !important;
}

.nfuk_interactive {
	line-height: normal !important;
}

.nfuk-vct {
	vertical-align: middle !important;
}

.nfuk_gpit {
	vertical-align: middle !important;
	font-family: 'Proxima Nova', Helvetica, sans-serif !important;
}

.nfuk_question_inner {
	font-family: 'Proxima Nova', Helvetica, sans-serif !important;
	vertical-align:middle !important;
	padding:5% !important;
}

.nfuk-yr {
	vertical-align:middle !important;
	font-family: 'Proxima Nova', Helvetica, sans-serif !important;
}

.nfuk-btn-liner {
	vertical-align:middle !important;
}

/* Basics */

.nfuk_interactive {
	display:none;
	position:relative;
	line-height:initial;
	box-sizing:border-box;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a90329+0,8f0222+44,6d0019+100;Brown+Red+3D */
	background: rgb(169,3,41); /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(169,3,41,1)), color-stop(44%,rgba(143,2,34,1)), color-stop(100%,rgba(109,0,25,1))); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* IE10+ */
	background: radial-gradient(ellipse at center, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	width:100%;
}

.TwoColumns .nfuk_interactive {
	margin:0 !important;
	width:100% !important;
}

.nfuk_gamepanel {
	display:none;
	width:100%;
	position:absolute;
	top:0px;
	left:0px;
	height: 100%;
}

/* Mute icon */

.nfuk_msi {
	width:100%;
	height:100%;
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
}
.nfuk_sound_on {
	background-image:url(../this-or-that/img-4/sound-on.png);
}
.nfuk_sound_off {
	display:none;
	background-image:url(../this-or-that/img-4/sound-off.png);
}
#nfuk_mutestate {
	position:absolute;
	width:7%;
	height:7%;
	right:1%;
	top:1%;
	cursor:pointer;
	z-index:5;
}

/* Panel 1 */

.nfuk_gptop {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:60%;
	background-position:center center;
	background-repeat:no-repeat;
}

#nfuk_page1_top { 
	background-image:url(../this-or-that/img-4/title.png); 
	background-size: auto 80%;
}

.nfuk_gpbottom {
	position:absolute;
	bottom:0px;
	left:0px;
	width:100%;
	height:40%;
}

.nfuk_ot3 {
	display:inline-block;
	margin:10px;
	border:2px solid #E24900;
	/* Fallback */
	height: 87%;
	width: 29.3%;
	/* Thank u based css3 */
	height: calc(100% - 24px);
	width: calc((100% / 3) - 24px);
	box-shadow: 6px 6px rgba(0, 0, 0, 0.15);
	background-size:cover;
	background-position:center center;
}

.ot1 { background-image:url(../this-or-that/img-4/opt_1.jpg); }
.ot2 { background-image:url(../this-or-that/img-4/opt_2.jpg); }

.nfuk_startbtn {
	background-image: url(../this-or-that/img-4/play.png);
	background-size: 100% 100%;
	width: 50%;
	height: 16%;
	position: absolute;
	bottom: 28%;
	left: 25%;
	z-index: 5;
	cursor: pointer;
}

/* Panel 2 */

.nfuk_mod2 {
	height:35%;
	bottom:10%;
}

.nfuk_gptext {
	position:absolute;
	bottom:0px;
	left:0px;
	height:10%;
	width:100%;
	display:table;
}

.nfuk_gpit {
	width: 33%;
	height: 100%;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	font-family: 'Proxima Nova', Helvetica, sans-serif;
	font-size: 5px;
	text-transform: uppercase;
	color: #E24900;
	text-shadow: 3px 3px rgba(0, 0, 0, 0.3);
}

.nfuk_tl_prompt {
	position:absolute;
	top:1%;
	left:1%;
	width: 27%;
	height: 12%;
	
}

.nfuk_question_holder {
	display:table;
	position:absolute;
	top:5%;
	width:100%;
	height:50%;
}

.nfuk_question_inner {
	display:table-cell;
	padding:5%;
	text-align:center;
	color: yellow;
	text-shadow: 3px 3px rgba(0, 0, 0, 0.3);
	font-family: 'Proxima Nova', Helvetica, sans-serif;
	vertical-align:middle;
}

/* Updog */

.updog {
	cursor:pointer;
	transition:0.5s all ease;
}

.updog:hover {
	transform:rotate(2deg) scale(1.05);
}

/* Correct / Incorrect Panels */

#nfuk_correct_top { 
	background-image:url(../this-or-that/img-4/rite.png); 
	background-size: 95% auto;
}
#nfuk_incorrect_top { 
	background-image:url(../this-or-that/img-4/rong.png); 
	background-size: 95% auto;
}

.gray-text { color:gray !important; }
.nfuk_nb { border:2px solid gray !important; }

/* Game Over */

.nfuk_go {
	background-image: url(../this-or-that/img-4/gameover.png);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center center;
  width: 40%;
  height: 20%;
  left: 3%;
  top: 2%;
}

.nfuk-yr {
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	font-family: 'Proxima Nova', Helvetica, sans-serif;
	color:yellow;
	text-shadow: 3px 3px rgba(0, 0, 0, 0.3);
	text-align:center;
}

.nfuk_r1hold {
	position: absolute;
	display:table;
	width: 60%;
	left: 20%;
	top: 18%;
	height: 13%;
	text-align:center;
}
.nfuk_r2hold {
	position: absolute;
	display:table;
	width: 60%;
	left: 20%;
	top: 32%;
	height: 12%;
}
.nfuk_r3hold {
	position: absolute;
	display:table;
  width: 60%;
  left: 20%;
  top: 45%;
  height: 22%;
}

.nfuk-button-row1 {
	position: absolute;
  display: table;
  bottom: 18%;
  height: 13%;
  width: 93%;
  left: 3%;
}

.nfuk-button-row2 {
	position: absolute;
	display: table;
	bottom: 3.5%;
	height: 13%;
	width: 93%;
	left: 3%;
}

.nfuk-vct {
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}

.nfuk-btn {
	font-family:sans-serif;
	color:white;
	font-weight:600;
	font-size:5px;
	width:45%;
	margin:2%;
	box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
	height:90%;
	display:inline-block;
	cursor:pointer;
}

.nfuk-btn-inner {
	height:100%;
	width:100%;
	display:table;
}

.nfuk-btn-liner {
	height:100%;
	width:100%;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}

.nfuk-button-row2 .nfuk-btn {
	width:97%;
}

.nfuk-fb { background-color:#396195; }
.nfuk-tw { background-color:#46b3e1; }
.nfuk-rp { background-color:#71a12e; }





