	/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.5;
}
h1, h2, h3 {
	line-height: 1.1;
	font-weight: normal;
	margin: 0.3em 0;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ===== Julekal styles 000==================================================
   Author: Casper Bram - Roger.dk
   ========================================================================== */

body {
    font: 16px/26px Helvetica, Helvetica Neue, Arial, sans-serif;
    color: #0c0c0c;
    background-color: #dddddd;
    margin: 0;
}

.wrapper {
	position: relative;
	width: 100%;
	max-width: 852px;
	margin: 0 auto;
	overflow: hidden;
}

a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

input, textarea {
	font-size: 14px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"] {
	line-height: 18px;
	height: 30px;
	width: 62%;
	min-width: 205px;
	margin: 0;
	padding: 5px;
	color: #555555;
	background-color: whiteSmoke;
	border: 1px solid #c1c1c1;
}
input[type="checkbox"], input[type="radio"] {
	width: 3px 0;
	margin: 3px 0;
	line-height: normal;
	cursor: pointer;
}
select {
	font-size: 12px;
	line-height: 28px;
	height: 28px;
	width: 62%;
	min-width: 217px;
	margin: 0;
	padding: 4px;
	color: #555555;
	background-color: whiteSmoke;
	border: 1px solid #bbb;
}
textarea {
	line-height: 18px;
	width: 62%;
	min-width: 205px;
	margin: 0;
	padding: 5px;
	color: #555555;
	background-color: whiteSmoke;
	border: 1px solid #c1c1c1;
}



/* ==============
    MOBILE: Menu
   ============== */

nav ul {
    margin: 0;
    padding: 0;
}

nav a {
    display: block;
    margin-bottom: 10px;
    padding: 15px 0;

    text-align: center;
    text-decoration: none;
    font-weight: bold;

    color: white;
    background: #e44d26;
}

nav a:hover,
nav a:visited {
    color: white;
}

nav a:hover {
    text-decoration: underline;
}

/* ==============
    MOBILE: Main
   ============== */

.main, .footer-container, .modal-content {
    background-color: #fff;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    min-width: 306px;
}
.main article h1 {
    font-size: 2em;
}
.footer-container {
	font-size: 11px;
    color: #666;
    padding: 0;
    border-bottom: 1px solid #ccc;
}
.footer-container div {
    padding: 0px 15px 60px;
	background-color: whiteSmoke;
}
.footer-container a {
	color: #666;
	margin-right: 1.5em;
}
.footer-container .pull-right a {
	margin-right: 0;
}

/* ===============
    ALL: IE Fixes
   =============== */

.ie7 .title {
    padding-top: 20px;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

.company-logo {
	position: relative;
	height: 110px;
	width: 100%;
	margin-left: -30px;
	margin-top: -20px;
}

.highlight-box {
	border: 15px solid #f5f5f5;
	padding: 5px 0 15px 15px;
}
.highlight-box img {
	float: right;
	max-width: 40%;
	margin-left: 15px;
}
.highlight-box p {
	padding-right: 15px;
}

.signup-box,
.challenge-box {
	padding: 15px;
}
.signup-box::before, .signup-box::after,
.challenge-box::before, .challenge-box::after,
.challenge-doors-box::before, .challenge-doors-box::after {
	display: table;
	content: "";
}
.signup-box::after,
.challenge-box::after,
.challenge-doors-box::after {
	clear: both;
}

.introduction, .question-block {
	float: left;
	width: 100%;
	vertical-align: top;
}
.question-block h2 {
	font-size: 2em;
}
.terms {
	background-color: whiteSmoke;
	background-color: rgba(255, 255, 255, 0.6);
	min-height: 60px;
	margin-top: 20px;
}
.terms-selection {
	padding: 10px 0 0 12px;
	float: left;
	width: 30px;
}
.terms-selection-link {
	padding: 10px;
	background-color: #fff;
	height: 60px;
	margin-left: 40px;
}

.terms .terms-selection-link a {
	color: #141314;
}

.signup {
	float: right;
	width: 100%;
	min-width: 276px;
	vertical-align: top;
	padding-top: 14px;
}
.signup .tabbable {
	border: 10px solid whiteSmoke;
	position: relative;
}
.signup .tabbable.disabled {
	-moz-opacity: 0.40;
	-khtml-opacity: 0.40;
	opacity: 0.40;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=40);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
	filter:alpha(opacity=40);
	pointer-events: none;
}
.signup .tabbable .hidecontent {
	display: none;
}
.signup .tabbable.disabled .hidecontent {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
}
.button {
	color: #fff;
	background-color: #666;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
	padding: 14px 14px;

	border: 0px solid rgba(0,0,0,0.5);
	
	moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	
	-moz-box-shadow: 0px 0px 0px rgba(0,0,0,0.4);
	-webkit-box-shadow: 0px 0px 0px rgba(0,0,0,0.4);
	box-shadow: 0px 0px 0px rgba(0,0,0,0.4);
	display: inline-block;
	line-height: 1.2em;
}

.connect_with_mail_content {
	border: 1px solid #c1c1c1;
	background-color: #ffffff;
	font-family: "Lucida Grande", sans-serif;
	font-size: 12px;
	color: #666;	
}
.connect_with_mail_content .text_top {
	padding: 10px 10px 10px 29px;
	border-bottom: 1px solid #c1c1c1;
	font-size: 11px;
	line-height: 14px;
	background-image: url('http://cdn.julekal.com/frontend_v2/img/mail_icon.gif');
	background-position: 8px 10px;
	background-repeat: no-repeat;
}
.connect_with_mail_content .text_bottom {
	padding: 10px;
	border-top: 1px solid #c1c1c1;
	font-size: 9px;
	line-height: 1.5em;
}
.connect_with_mail_content .toptextbg {
	background-color: #f2f2f2;
	color: #808080;
}
.connect_with_mail_content .mail_content {
	padding: 18px;
	font-weight: bold;
	font-size: 11px;
	color: #666;
}


.form-horizontal .control-group::after {
	clear:both;
}
.form-horizontal .control-group::before, .form-horizontal .control-group::after {
	display: table;
	content: "";
}
.form-horizontal .control-group {
	margin-bottom:18px;*zoom:1;
}
.form-horizontal .control-label {
	min-width: 126px;
	text-align: left;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: #666;
	font-weight: bold;
	font-size: 11px;
	margin-bottom: 5px;
}
.btn-signin {
	width: 99%;
	min-width: 216px;
}
.btn-contact {
	width: 216px;
	margin-top: 0.7em;
}
.form-horizontal input[type="text"],
.form-horizontal input[type="email"],
.form-horizontal input[type="tel"],
.form-horizontal input[type="number"] {
	width: 99%;
	min-width: 205px;
}
.form-horizontal select {
	width: 99%;
	min-width: 217px;
}

.alert-box {
	background-color: #666;
	color: white;
}
.alert-box .loading-finished {
	text-align: center;
	padding: 20px;
}
.alert-box .icon {
	display: inline-block;
	vertical-align: middle;
}
.alert-box .icon-ok, .alert-box .icon-attention, .alert-box .icon-attention-triangle {
	font-size: 100px;
}
.alert-box .alert-text {
	display: inline-block;
	vertical-align: middle;
	padding-right: 16px;
}

.modal, .modalbg {	
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.modal {
	z-index: 100;
}
.modal-header, .modal-body, .modal-footer {
	background-color: #fff;
	border-left: 15px solid #;
	border-right: 15px solid #;
	padding: 5px 15px 15px 15px;
	margin: 0 auto;
	max-width: 670px;
}
.modal-header {
	border-top: 15px solid #;
}
.modal-footer {
	border-bottom: 15px solid #;
}
.modal .close {
	cursor: pointer;
	background: transparent;
	border: 0;
	-webkit-appearance: none;
	float: right;
	line-height: 1.5em;
	color: #000000;
	padding: 5px 0 5px 5px;
	margin: 10px 0 0 0;
	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
.modal .close:hover {
	color: #fff;
}
.modal .close i {
	font-size: 1.5em;
	line-height: 1em;
	vertical-align: top;
	display: inline-block;
}
.modal input[type="text"],
.modal input[type="email"],
.modal input[type="tel"],
.modal input[type="number"],
.modal textarea {
	margin: 8px 0 0;
	display: block;
	width: 100%;
}
.modal input[type="radio"] {
	margin-right: 0.4em;
}
.modal label {
	display: block;
	margin-bottom: 0.5em;
}
.modal label.error {
	background-color: #db4d4d;
	display: block;
	width: 90%;
	color: #fff;
	padding: 0.5em;
	margin-top: -1px;
	margin-bottom: 1em;
}
.modalbg {
	position: fixed;
}


#prizes .prizes-header,
#prizes .prizes-footer {
	width: 96%;
}
#prizes .prizes-header {
	margin-top: 30px;
	margin-bottom: 2%;
	padding: 0 15px 0;
	cursor: auto;
}
#prizes .prizes-footer {
	margin-top: 2%;
	margin-bottom: 60px;
	padding: 0 15px 10px;
}
#prizes .prizes-header h1 {
	margin-top: 25px;
}
#prizes .prizes-header.prize-item p {
	position: relative;
	display: block;
	width: 70%;
	background-color: #fff;
	padding: 0;
	margin-bottom: 15px;
}
#prizes .modal-body {
	background-color: #;
	padding: 0;
	max-width: 700px;
}
#prizes .modal-body {
	padding: 5px 0 15px 0;
	border-left: 7px solid #;
	border-right: 7px solid #;
}


.prize-grid-sizer, .prize-item { width: 46%; margin: 2% 2%; }
.prize-item { padding-top: 46%; }
.prize-item.big { width: 96%; padding-top: 96%; }

/*.prize-gutter-sizer { width: 3%; }*/

.prize-item {
	position: relative;
	background-color: #fff;
	overflow: hidden;
	box-sizing: border-box;
	cursor: pointer;
}
.prize-item .teaser {
	position: absolute;
	top: 0;
	padding-top: 100%;
	width: 100%;
}
.prize-item:hover h3 {
	color: #999;
}
.prize-item img {
	width: 100%;
	position:absolute;
	top:0;
	bottom:0;
	margin:auto;
}
.prize-item h2 {
	position: absolute;
	top: 0;
	width: 30px;
	height: 30px;
	margin: 0;
	font: normal 1em/30px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	text-align: center;
	color: #fff;
	background-color: #333;
	background-color: rgba(0, 0, 0, .75);
	overflow: hidden;
	z-index: 50;
}
.prize-item h3 {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 7px 5px;
	background-color: #fff;
	background-color: rgba(255, 255, 255, .75);
	font: normal 0.8em/1.2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	text-align: center;
	color: #000;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.prize-item.big h3 {
	font-size: 1em;
}
#prizes .prize-item p,
#prizes .prize-item ul { 
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	background-color: #eee;
	position: relative;
	z-index: 45;
}
.prize-item p {
	padding: 15px 15px 15px;
}
.prize-item ul {
	list-style: none;
	padding: 15px;
}
.prize-item.winner ul {
	padding-top: 0;
}
#prizes .prize-item.no-winner-selected ul,
#prizes .prize-item.single-winner:not(.expanded) ul,
.prize-item.multiple-winners h4 {
	position: absolute;
	z-index: 40;
	top: 0;
	height: 100%;
	width: 100%;
	margin: 0;
	padding-top: 40%;
	text-align: center;
	background-color: #999;
	background-color: rgba(153, 153, 153, 0.8);
	font: normal 1em/1.2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: #fff;
	box-sizing: border-box;
}
.prize-item.multiple-winners h4 {
	padding: 40% 10px 0;
}
.prize-item .single-winner,
.prize-item .multiple-winners {
	font-weight: bold;
}
.prize-item.winner h3 {
	z-index: 45;
}
.prize-item.winner:not(.expanded) h2 {
	color: #999;
	background-color: #fff;
}
.prize-item.winner:not(.expanded):hover h2 {
	color: #000;
	background-color: #eee;
}

.prize-item p,
.prize-item ul { display: none; }
.prize-item.expanded p,
.prize-item.winner.expanded ul { display: block; }
.prize-item.expanded { overflow: auto; }

#prizes .icon-multiply-2 {
	font-size: 0.9em;
}

#prizes .single-prize .prize-header span,
#prizes .prize-item .prize-winners,
#prizes .prize-item .single-winner,
#prizes .prize-item .multiple-winners,
#prizes .prize-item .no-winners,
#prizes .prize-item.winner.single-winner .no-winners,
#prizes .prize-item.winner.multiple-winners .no-winners,
#prizes .prize-item.winner.multiple-winners .prize-winners,
#prizes .prize-item h4,
#prizes .prize-item.winner.multiple-winners.expanded h4 {
	display:none;
}
#prizes .prize-item.winner .prize-winners,
#prizes .prize-item.winner .no-winners,
#prizes .prize-item.winner.single-winner.expanded .single-winner,
#prizes .prize-item.winner.multiple-winners h4,
#prizes .prize-item.winner.multiple-winners.expanded .multiple-winners,
#prizes .prize-item.winner.multiple-winners.expanded .prize-winners {
	display:block;
}




/* ==========================================================================
   Challenge specific styles
   ========================================================================== */

.area-challenge-doors {
	margin-top: 0;
}
.challenge-box .radio input[type="radio"], 
.challenge-box .checkbox input[type="checkbox"] {
	margin-left: 0px;
	margin-right: 5px;
	float: initial;
	width: 16px;
	height: 16px;
	vertical-align: baseline;
}
label {
	display: block;
	margin-bottom: 5px;
}
label.checkbox,
label.radio {
  padding: 0;
  line-height: 1.5em;
  font-size: 14px;
  font-weight: 400;
  font-family: Arial, sans-serif;
}
.radio, .checkbox {
	min-height: 18px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

.challenge-box .radio, .checkbox {
	margin-left: 0px;
	padding: 10px 0;
	cursor: pointer;
}
.challenge-box .checkbox, .challenge-box .radio {
	padding: 12px;
	background-color:rgba(255,255,255,0.8);
}
.challenge-box .checkbox:hover, .challenge-box .checkbox.selected,
.challenge-box .radio:hover, .challenge-box .radio.selected {
	background: rgba(255, 255, 255, 1);
}
.challenge-box .question, .challenge-box .answer {
	margin-top: 1em;
}

.btn-large,
.btn-answer {
	min-width: 200px;
	margin: 15px 0 30px;
}

.challenge-media img {
	position: relative;
	width: 100%;
}

/* DOORS */
#doors .door {
    text-align: center;
    overflow: auto;
}
#doors .door:after,
.door-number {
	display: inline-block;
    vertical-align: middle;
}
#doors .door:after {
	content: "";
	height: 100%;
	margin-left: -0.25em;
}
.door-number {
	max-width: 99%;
}
.door-number.not-approved {
    /*color: red !important;*/
}
#doors {
    position: relative;
	height: 100%;
}
#doors .door {
    position: absolute;
    cursor: pointer;
    -moz-opacity: 1;
    opacity: 1;
   -moz-box-sizing: border-box;
	box-sizing: border-box;
	background-position: 50% 50%;
	overflow: hidden;
}
#doors .door.door-open {
    -moz-box-shadow: inset 0 1px 6px rgba(0,0,0,0.6);
    -webkit-box-shadow: inset 0 1px 6px rgba(0,0,0,0.6);
    box-shadow: inset 0 1px 6px rgba(0,0,0,0.6);
}
#doors .door.door-close {
    border: 4px dotted rgba(255, 255, 255, 0.6);
	background-image: url() !important;
}
#doors .door.door-notselectable {
    cursor: default;
}
#doors .door.door-selectable {
}
#doors .door.door-close.blink {
    -moz-box-shadow: 0 0 40px white;
    -webkit-box-shadow: 0 0 40px white;
    box-shadow: 0 0 40px white;
    background-color: rgba(255, 255, 255, .5);
}
#doors .door.door-close:hover {
    -moz-box-shadow: 0 3px 18px rgba(0,0,0,0.8);
    -webkit-box-shadow: 0 3px 18px rgba(0,0,0,0.8);
    box-shadow: 0 3px 18px rgba(0,0,0,0.8);
}
#doors .door.door-open .door-number {
    text-indent: -999em;
}


.area-challenge-doors.show-mobile .company-logo {
	margin: 5% 0 0;
	max-width: none;
	width: 100%;
	height: 13%;
	background-position: center center;
	background-size: contain;
}
.area-challenge-doors.show-mobile #doors {
	background-color: rgba(0,0,0,0.2);
	z-index: -1;
}
.area-challenge-doors.show-mobile .door {
	/*display: none;*/
}
.area-challenge-doors.show-mobile #doors {
	padding: 63% 10% 3%;
	box-sizing: border-box;
}
.area-challenge-doors.show-mobile #doors .door.door-open,
.area-challenge-doors.show-mobile #doors .door.door-close {
	display: inline-block;
	position: relative;
	width: 14% !important;
	height: 20% !important;
	margin: 1%;
	top: auto !important;
	left: auto !important;
}
.area-challenge-doors.show-mobile #doors .door.door-close {
	border: 6px dotted rgba(255, 255, 255, 0.4);
}
.area-challenge-doors.show-mobile #doors .door.door-selectable {
	display: inline-block;
	position: absolute;
	width: 80% !important;
	height: 35% !important;
	margin: 0 auto;
	display: block;
	left: auto !important;
	top: 21% !important;
	border: 20px dotted rgba(255, 255, 255, 0.8);
}
.area-challenge-doors.show-mobile #doors .door.door-close:hover {
	-moz-box-shadow: 0 3px 48px rgba(0,0,0,0.8);
	-webkit-box-shadow: 0 3px 48px rgba(0,0,0,0.8);
	box-shadow: 0 3px 48px rgba(0,0,0,0.8);
}
.area-challenge-doors.show-mobile .door.door-selectable .door-number {
	font-size: 140px;
}



#lockeddoor {
    width: 40px;
    height: 40px;
    margin-left: -20px;
    margin-top: -20px;
    z-index: 280;
    position: absolute;
    background: url(http://jk-v20.s3.amazonaws.com/Content/Images/Icons/locked.png) no-repeat 0 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
#loadingdoor {
    width: 40px;
    height: 40px;
    margin-left: -20px;
    margin-top: -20px;
    z-index: 280;
    position: absolute;
    background: url(http://jk-v20.s3.amazonaws.com/Content/Images/Icons/loading_opendoor_frontend.gif) no-repeat 0 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
.challenge-doors-box {
	width: 1110px;
	height: 675px;
}
.challenge-doors-box .company-logo {
	position: absolute;
	max-width: 95%;
	margin-top: -15px;
	margin-left: -15px;
}
.transparent {
    -moz-opacity: 0;
    opacity: 0;
}


/* ==========================================================================
   New signup form
   ========================================================================== */

.controls { position: relative; }
.validate.required { border-right: 8px solid #bbbbbb; }
.validate.required.invalid { border-right: 8px solid #b30000; }
.validate.required.valid { border-right: 8px solid #7dbe2d; }
.error-message {
	position: absolute;
	margin-top: 5px;
	width: 70%;
	left: 15%;
	padding: 7px 10px;
	box-sizing: border-box;
	z-index: 10;
	display: none;
	background-color: #b30000;
	color: #fff;
}
.error-message.show { display: block; }
.error-message:before, .error-message:after {
	content: "";
	border-top: 8px solid transparent;
	position: absolute;
	left: 50%;
	top: -8px;
}
.error-message:before {
	margin-left: -4px;
	border-right: 8px solid #b30000;
}
.error-message:after {
	margin-left: 4px;
	border-left: 8px solid #b30000;
}

.form-horizontal input.input-medium.dkzip {
	width: 30%;
	min-width: 65px;
}
.form-horizontal input.input-medium.dkzip-city {
	width: 67.9%;
	min-width: 150px;
}
input {
	overflow: hidden;
	text-overflow: ellipsis;
}
input.input-medium.dkzip-city,
input:read-only,
textarea:read-only {
	border: none;
	background-color: transparent;
	color: #999;
}
@media only screen and (min-width: 510px) {
	.form-horizontal input.input-medium.dkzip { width: 18.5%; }
	.form-horizontal input.input-medium.dkzip-city { width: 42.5%; }
}

.error-message.warning {
	background-color: #dfc100;
	bottom: 3.1em;
	margin-top: 0;
}
.error-message.warning:before,
.error-message.warning:after {
	top: auto;
	bottom: -8px;
	border-top: none;
	border-bottom: 8px solid transparent;
}
.error-message.warning:before {
	border-right: 8px solid #dfc100;
}
.error-message.warning:after {
	border-left: 8px solid #dfc100;
}
input#accept {
	width: 20px;
	height: 20px;
}





/* Social Share */
.social_share {
	z-index: 10;
	margin-bottom: 10px;
	margin-top: 20px;
	display: inline-block;
	position: relative;
	background-color: #fff;
	padding: 15px 11px;
}
.social_share h5,
.social_share a {
	margin: 0 4px 0 4px;
}
.social_share h5 {
	margin-bottom: 0.5em;
	font-weight: 400;
	line-height: 20px;
	text-decoration: none;
	white-space: normal;
}
.social_share a {
	display: inline-block;
	float: left;
	overflow: hidden;
	text-indent: -999px;
	width: auto;
	width: auto;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	background-color: #3a5795;
}
.social_share a:hover {
	text-decoration: none;
	background-color: #4f6ba6;
}
.social_share .facebook,
.social_share .linkedin,
.social_share .twitter {
	display: inline-block;
	vertical-align: baseline;
	background-position: left center;
	background-size: 42px 42px;
}
.social_share .facebook {
	background-color: #3a5795;
	background-image: url('https://s3-eu-west-1.amazonaws.com/cdn.julekal.com/frontend_v2/img/icon-facebook-sm-white.svg');
}
.social_share .facebook:hover {
	background-color: #4f6ba6;
}
.social_share .linkedin {
	background-color: #008cc9;
	background-image: url('https://s3-eu-west-1.amazonaws.com/cdn.julekal.com/frontend_v2/img/icon-linkedin-sm-white.svg');
}
.social_share .linkedin:hover {
	background-color: #14a1dd;
}
.social_share .twitter {
	background-color: #55acee;
	background-image: url('https://s3-eu-west-1.amazonaws.com/cdn.julekal.com/frontend_v2/img/icon-twitter-sm-white.svg');
}
.social_share .twitter:hover {
	background-color: #66b4f0;
}
.social_share a > div {
	text-indent: 0;
	white-space: nowrap;
}
.social_share a > div {
	display: none;
	text-indent: 0;
	padding: 2px 5px;
	font-size: 9px;
	white-space: nowrap;
	background-color: #e7e7e7;
	color: #8e8e8e;
}
.social_share a {
	min-width: 42px;
	padding-left: 42px;
}
.social_share a,
.social_share a > div,
.social_share a > div div,
.social_share a > div h5 {
	height: 42px;
	line-height: 42px;
}

.social_share a > div div,
.social_share a > div h5 {
	display: inline-block;
}

.social_share.noshow,
.social_share .hide-facebook,
.social_share .hide-linkedin,
.social_share .hide-twitter {
	display: none;
}




/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 480px) {

/* ====================
    INTERMEDIATE: Menu
   ==================== */

    nav a {
        float: left;
        width: 27%;
        margin: 0 1.7%;
        padding: 25px 2%;
        margin-bottom: 0;
    }

    nav li:first-child a {
        margin-left: 0;
    }

    nav li:last-child a {
        margin-right: 0;
    }
    
/* ========================
    INTERMEDIATE: Prizes
   ======================== */
    
    .prize-grid-sizer, .prize-item { width: 31.85%; margin: 0.7% 0.7%; }
    .prize-item { padding-top: 31.85%; }
    .prize-item.big { width: 64.6%; padding-top: 64.6%; }
    
	#prizes .prizes-header, #prizes .prizes-footer { width: 97.5%; }
	#prizes .prizes-header { margin-bottom: 1%; }
	#prizes .prizes-footer { margin-top: 1%; }
  
/* ========================
    INTERMEDIATE: IE Fixes
   ======================== */

    nav ul li {
        display: inline;
    }

    .oldie nav a {
        margin: 0 0.7%;
    }
    
}


@media only screen and (min-width: 510px) {

/* ======================
    INTERMEDIATE: signup
   ====================== */

	.introduction {
		width: 70%;
	}
	.alert-box .alert-text {
		max-width: 60%;
		text-align: left;
	}
	   
	.form-horizontal .control-label {
		float: left;
		width: 36%;
	}
	.form-horizontal label.radio,
	.form-horizontal label.checkbox {
		float: right;
		width: 64%;
		clear: right;
	}
	.btn-signin, .form-horizontal select {
		width: 62%;
	}
	.form-horizontal input[type="text"],
	.form-horizontal input[type="email"],
	.form-horizontal input[type="tel"],
	.form-horizontal input[type="number"] {
		width: 62%;
	}

	.social_share {
		float: right;
	}


/* ======================
    INTERMEDIATE: Modal
   ====================== */
	.modal p {
		width: 70%;
	}



/* ========================
    INTERMEDIATE: Challenge
   ======================== */
	.question-block {
		width: 55%;
	}
	
	.challenge-media {
		width: 45%;
		float: right;
	}
	.challenge-media img {
		float: right;
		width: auto;
		margin-top: 3em;
		max-width: 90%;
	}

}

@media only screen and (min-width: 774px) {

/* ====================
    WIDE: CSS3 Effects
   ==================== */

/* ====================
    WIDE: Main
   ==================== */
	.main, .modal-content {
		padding: 20px 20px 0;
	}
	.footer-container a {
		margin-right: 3em;
	}
	.footer-container {
	    padding: 0 20px 20px 20px;
	}
	.signup-box {
		padding: 30px;
	}
	.company-logo {
		margin-top: -30px;
	}


/* ======================
    WIDE: signup
   ====================== */
   
	.signup {
		width: 410px;
	}
	.introduction {
		width: 36%;
	}
	

/* ============
    WIDE: Menu
   ============ */

    nav {
        float: right;
        width: 38%;
    }

/* ============
    WIDE: Modal
   ============ */
	.modal {
		padding: 20px 20px 0;
	}  
	.modal-header, .modal-body, .modal-footer {
		/*border-left: 40px solid #666;
		border-right: 40px solid #666;*/
	}
	.modal-header {
		border-top: 40px solid #;
	}
	.modal-footer {
		border-bottom: 40px solid #;
	}
	
    
/* ========================
    WIDE: Prizes
   ======================== */
    
	.prize-grid-sizer, .prize-item { width: 24%; margin: 0.5% 0.5%; }
	.prize-item { padding-top: 24%; }
	.prize-item.big { width: 48.8%; padding-top: 48.8%; }
	
	#prizes .prizes-header, #prizes .prizes-footer { width: 98.5%; }
	#prizes .prizes-header { margin-bottom: 0.5%; }
	#prizes .prizes-footer { margin-top: 0.5%; }
}

@media only screen and (min-width: 1140px) {

/* ===============
    Maximal Width
   =============== */

}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}


.hide {
    display: none;
    /*visibility: hidden;*/
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

.pull-right {
	float: right;
}


/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}




/* ==========================================================================
   Campaign specific styles
   ========================================================================== */

/* Main font */
body {
	font-family: 'arial', 'sans-serif'; 
	font-size: 16px;
    line-height: 1.1;
}

/* Headline font */
h1, h2, h3 {
	font-family: 'ff-market-web';
	font-size: 40px;
}

/* Door number */
.door-number {
	font-family: 'ff-market-web';
	font-size: 48px;
	color: #ffffff;
}

/* Link color */
a, .prize-item:hover h3 {
	color: #141314;
}

/* Modal close colors */
.modal .close {
	color: #141314;
}
.modal .close:hover {
	background-color: #141314;
}


/* Logo image */
.company-logo {
	background: transparent url('filerepo/42e13e1298a841139506d4c5cf7ea8da.png') no-repeat 30px 30px;
}

/* Main image */
.background-image {
	background: #ffffff url('filerepo/bff19d1a51a34d35b7e7ccdd36090422.jpg') no-repeat center top; 
}
/* Main image font color */
.introduction p {
	color: #ffffff;
}
.introduction h1 {
	color: #ffffff;
}
.introduction a {
	color: #ffffff;
	text-decoration: underline;
}



/* Buttons and prizes */
.btn-signin,
.btn-contact,
.prize-item h2,
.prize-item.no-winner-selected ul,
#prizes .prize-item.single-winner:not(.expanded) ul,
.prize-item.winner:not(.expanded) h3,
.prize-item.multiple-winners h4 {
	color: #ffffff;
	background-color: #bb162b;
}

.btn-signin, .btn-contact {
	font-family: 'arial', 'sans-serif'; 
	font-size: 26px;
}
.prize-item h2 {
	background-color: rgba(9,10,9, 0.9);
	background-image: none;
}
#prizes .prize-item.no-winner-selected ul,
#prizes .prize-item.single-winner:not(.expanded) ul,
.prize-item.multiple-winners h4 {
	background-color: rgba(9,10,9, 0.8);
	background-image: none;
}
.prize-item.winner:not(.expanded) h3 {
	background-color: transparent;
	background-image: none;
}
.prize-item.winner:not(.expanded) h2 {
	color: #141314;
	background-color: #fff;
}

/* Buttons hover state */
.btn-signin:hover,
.btn-contact:hover,
.prize-item:hover h2 {
	color: #ffffff;
	background-color: #bb162b;
}
.prize-item:hover h2 {
	background-color: rgba(7,7,7, 0.9);
	background-image: none;
}

/* Background color */
body {
	background-color: #d6d6d6;	
}



/* Challenge CSS */

/* Headline */
.challenge-box .headline,
.challenge-box h1 {
	font-family: 'ff-market-web', 'cursive';
	font-size: 40px;
	color: #ffffff;
}
.challenge-box .introtext {
	font-family: 'arial', 'sans-serif'; 
	font-size: 16px;
	color: #ffffff;
}
.challenge-box .link {
	font-family: 'arial', 'sans-serif'; 
	font-size: 22px;
	color: #ffffff;
}
.challenge-box a {
	color: #ffffff;
	text-decoration: underline;
}
.challenge-box .question,
.challenge-box .question-block {
	font-family: 'arial', 'sans-serif'; 
	font-size: 16px;
	color: #ffffff;
}
.social_share h5,
.challenge-box .answer {
	font-family: 'arial', 'sans-serif'; 
	font-size: 16px;
	color: #0c0c0c;
}

/* Button challenge */
.btn-large,
.btn-answer {
	font-family: 'arial', 'sans-serif'; 
	font-size: 26px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color: #ffffff !important;
	text-decoration: none !important;
	background-color: #bb162b;
}

.btn-large:hover,
.btn-answer:hover {
	color: #ffffff;
	background-color: #bb162b;
}

/* Doors */
.challenge-doors-box {
	background: #ffffff url('filerepo/bff19d1a51a34d35b7e7ccdd36090422.jpg') no-repeat center top;
	background-size: 100%;
	background-size: cover;
}
.area-challenge-doors.show-mobile #doors {
	background-color: rgba(9,10,9, 0.3);
}




