| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121 | 
							- @import url(//fonts.googleapis.com/css?family=Open+Sans:400,700,600);
 
- * {
 
- 	box-sizing: border-box;
 
- }
 
- html, body {
 
- 	margin: 0;
 
- 	padding: 0;
 
- 	height: 100%;
 
- 	font-family: 'Open Sans';
 
- }
 
- body {
 
- 	opacity: 0;
 
- 	transition: all 1s linear;
 
- }
 
- .divider {
 
- 	height: 150px;
 
- 	width: 2px;
 
- 	background-color: #C0C9CE;
 
- 	position: relative;
 
- 	top: 50%;
 
- 	float: left;
 
- 	transform: translateY(-50%);
 
- }
 
- #background-stats-1 {
 
- 	background-color: #2196f3;
 
- }
 
- #background-stats-2 {
 
- 	background-color: #00cbca;
 
- }
 
- #content-container {
 
- 	z-index: 2;
 
- 	position: relative;
 
- 	margin: 0 auto;
 
- 	display: table;
 
- 	padding: 10px;
 
- 	max-width: 940px;
 
- 	height: 100%;
 
- }
 
- #content-container-center {
 
- 	display: table-cell;
 
- 	text-align: center;
 
- 	vertical-align: middle;
 
- }
 
- #result {
 
- 	z-index: 3;
 
- 	position: absolute;
 
- 	bottom: 40px;
 
- 	right: 20px;
 
- 	color: #fff;
 
- 	opacity: 0.5;
 
- 	font-size: 45px;
 
- 	font-weight: 600;
 
- }
 
- #choice {
 
- 	transition: all 300ms linear;
 
- 	line-height: 1.3em;
 
- 	background: #fff;
 
- 	box-shadow: 10px 0 0 #fff, -10px 0 0 #fff;
 
- 	vertical-align: middle;
 
- 	font-size: 40px;
 
- 	font-weight: 600;
 
- 	width: 450px;
 
- 	height: 200px;
 
- }
 
- 	#choice a {
 
- 		text-decoration: none;
 
- 	}
 
- 		#choice a:hover, #choice a:focus {
 
- 			outline: 0;
 
- 			text-decoration: underline;
 
- 		}
 
- 	#choice .choice {
 
- 		width: 49%;
 
- 		position: relative;
 
- 		top: 50%;
 
- 		transform: translateY(-50%);
 
- 		text-align: left;
 
- 		padding-left: 50px;
 
- 	}
 
- 		#choice .choice .label {
 
- 			text-transform: uppercase;
 
- 		}
 
- 		#choice .choice.resultb {
 
- 			color: #00cbca;
 
- 			float: right;
 
- 		}
 
- 		#choice .choice.resulta {
 
- 			color: #2196f3;
 
- 			float: left;
 
- 		}
 
- #background-stats {
 
- 	z-index: 1;
 
- 	height: 100%;
 
- 	width: 100%;
 
- 	position: absolute;
 
- }
 
- 	#background-stats div {
 
- 		transition: width 400ms ease-in-out;
 
- 		display: inline-block;
 
- 		margin-bottom: -4px;
 
- 		width: 50%;
 
- 		height: 100%;
 
- 	}
 
 
  |