@font-face {
  font-family: 'SansaNormal';
  src: url("../themes/common/webfonts/SansaSoftPro-Normal.eot");
  src: url("../themes/common/webfonts/SansaSoftPro-Normal.eot?#iefix") format("embedded-opentype"), url("../themes/common/webfonts/SansaSoftPro-Normal.woff") format("woff"), url("../themes/common/webfonts/SansaSoftPro-Normal.ttf") format("truetype"); }
@font-face {
  font-family: 'SansaBold';
  src: url("../themes/common/webfonts/SansaSoftPro-Bold.eot");
  src: url("../themes/common/webfonts/SansaSoftPro-Bold.eot?#iefix") format("embedded-opentype"), url("../themes/common/webfonts/SansaSoftPro-Bold.woff") format("woff"), url("../themes/common/webfonts/SansaSoftPro-Bold.ttf") format("truetype"); }

html { overflow-x: hidden; }
html, body { color: white; padding: 0; margin: 0; /* width: 100%; */ height: 100%; }
body { background-color: #000; font-family: 'SansaNormal', 'Open Sans', sans-serif !important; box-sizing: border-box; -moz-box-sizing: border-box; position: relative;}
body * { box-sizing: border-box; -moz-box-sizing: border-box; }
.mover { -webkit-transform: translateZ(0); }

/*--- VERTICAL CENTER ---*/
.v-parent { text-align: center; }
.v-parent:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -0.25em; /* Adjusts for spacing */ }
.v-parent > * { display: inline-block; vertical-align: middle; /* width: 300px; */ }

/*--- TOP BAR ---*/
.top-bar { background-color: #212121; height: 80px; position: relative; z-index: 60; }
.top-bar .logo { float: left; max-height: 100%; /* width: 37%; */ margin: 18px 43px; }
.top-bar .logo-challengex { float: left; max-height: 100%; max-width: 50%; margin: 18px 43px; }
.top-bar .logo-link { /*height: 100%; width: 30%; float: left;*/ text-decoration: none;}
.top-bar .logo-link div{padding-top: 22px; font-size: 22px; color: #fff;}
.right { width: 68%; text-align: right; }
.fill-out { width: 100%; }
.not-visible { visibility: hidden; position: relative; z-index: 10000;}
.login { z-index: 100; width: 100%; height: 100%; /*text-align: right;*/ padding-right: 10px; display: none;}
.login input[type=text], .login input[type=password], .login input[type=email] { padding: 10px; border: none; font-size: 14px; /*width: 24%; margin-right: 3%;*/ width: 300px;}
.login input[type=image] { width: 20%; max-width: 100px; }
.submit-link { color: #CC9900; text-decoration: none; font-size: 1.4em; background: transparent; border: 0; cursor: pointer; 
    font-family: 'SansaNormal', 'Open Sans', sans-serif !important;
}
.top-bar .links { list-style: none; }
.top-bar .links li { display: inline-block; }
.top-bar .links a { color: white; text-decoration: none; margin-right: 20px; font-size: 14px; }
.top-bar .links-challengex { list-style: none; }
.top-bar .links-challengex li { display: inline-block; }
.top-bar .links-challengex a { color: white; text-decoration: none; margin-right: 44px; font-size: 20px; }
#fb-login-button { vertical-align: top; margin-right: 20px; width: 50px;}
#email-login-button { margin-right: 20px; font-size: 12px; background-color: #487580; padding: 4px 10px 4px 4px; border-radius: 4px; }
#email-login-button .fa { margin-right: 3px; font-size: 14px; }

/*--- ERRORS/MESSAGES ---*/
.messages {
	/* margin-bottom: 30px; */
	text-align: center;
	z-index: 100;
}

.messages .message {
	list-style: none;
	display: inline-block;
	background-color: #5C5C05;
	padding: 10px 20px;
	max-width: 700px;
	line-height: 1.4em;
}

.messages .info {
	vertical-align: bottom;
	width: 20px;
	height: 20px;
	margin-right: 9px;
}

.messages .message.error {
	background-color: #680E0E;
}

/*--- CONTENT ---*/

.content {width: 100%; margin: 0 auto; position: relative; }
.content .login-modal { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0,0,0,0.54); z-index: 20; }
.content .login-modal { color: white; background-color: rgba(0, 0, 0, 0.7); position: absolute; right: 0; bottom: 0; top: -10px; left: 0; z-index: 30; padding: 20px; text-align: center; visibility: hidden; opacity: 0; transition: opacity 0.6s;}
.content .login-modal .form { width: 30%; margin: auto; text-align: left; }
.content .login-modal input { display: block; border: none; margin-bottom: 20px; padding: 10px; font-size: 14px; border-radius: 4px; width: 100%;}
.content .login-modal button { display: block; background-color: #008DB9; color: #FFF; font-size: 16px; padding: 10px; border: none; border-radius: 4px; width: 100%; cursor: pointer; margin: auto; }
.content .login-modal .close-button {
	position: absolute;
	top: 50px;
	right: 60px;
	font-size: 3em;
	cursor: pointer;
}
.content .picture-box { margin: 0 auto; position: relative; overflow: hidden;}
.content .picture-box .background { width: 100%; display: block; }
.content .picture-box .copy { font-size: 2.6vw; font-weight: 300; left: 0; padding: 2%; position: absolute; text-shadow: 0 4px 5px rgba(90, 72, 44, 0.75); top: 0; z-index: 10; line-height: 1.6em; }
.content .picture-box .copy p { margin: 0; }
.content .picture-box .copy .stronger { font-size: 1.8em; font-weight: 700; }
.content .picture-box .copy.first { padding-top: 3%; }
.content .picture-box .copy.second { font-size: 3.4vw; line-height: 1.2em; font-weight: 300; letter-spacing: 1px; padding: 1%; }
.content .picture-box .copy.bigger { font-size: 4vw; line-height: 1.4em; }
.content .picture-box .bottom { font-size: 5.7vw; position: absolute; left: 0; bottom: 0; padding: 1%; padding-left: 3%; }
.content .text-box { color: white; font-size: 3vw; font-weight: 100; line-height: 1.2em; letter-spacing: 1px; text-align: center; margin: 0 auto; min-height: 100px; background-color: #222; width: 100%; padding: 0; }
.content .text-box { position: relative; width: 100%; }		/* desired width  }*/
.content .text-box:before{ content: ""; display: block; padding-top: 25%; } 	/* initial ratio of 1:1 }*/
.content .text-box .aspect-box { position:  absolute; top: 0; left: 0; bottom: 0; right: 0; }
.content .text-box.last { padding-bottom: 13%; }

.get-started { text-decoration: none; display: none; background-color: rgba(194, 151, 9, 0.65); color: #FFF; border-radius: 4px; padding: 0px 20px; margin: 16% 0 0; }
.get-started-now { text-decoration: none; background-color: #C29709; color: #222; border-radius: 8px; padding: 10px 20px; margin: 3% 0; font-weight: 900; }

/*=== OPEN SIGNUP ===*/
.open-notice {
	text-align: right;
	color: white;
	cursor: pointer;
}
.open-notice:hover {
	background-color: #628F9A !important;
}

.flex-container{
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	height: 100%;
	width: 100%;
	align-items: center;
	justify-content: center;
	align-content: center;
	z-index: 100;
}

.open-signup {
	background-color: rgba(9, 26, 29, 0.62);
	padding: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	margin-right: -40%;
	margin-bottom: -20%;

	/* Float the form */
	/* border-radius: 44px; */
	/* box-shadow: 0px 0px 40px #000; */

	/* Fullscreen the form */
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.4s;
}

.open-signup button {
	display: block;
	border: none;
	padding: 0px 60px;
	font-size: 25px;
	font-weight: bold;
	color: #FFF;
	background-color: #016367;
	border-radius: 8px;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	float: left;
	height: 45px;
	cursor: pointer;
}

.open-signup button:hover {
	background-color: #117D82;
}

.open-signup button:active {
	background-color: #70D4C5;
}

.open-signup input {
	padding: 11px;
	border: 0;
	font-size: 18px;
	color: #698588;
	height: 45px;
	outline: 0;
}

.open-signup h1 {
	font-size: 50px;
	margin-top: 0;
}

.open-signup h2 {
	font-weight: 300;
	margin: -16px 0 40px;
}

.input-group {
	float: left;
}

.input-group-addon {
	padding: 5px 15px;
	font-size: 24px;
	border: 1px solid #FFF;
	height: 45px;
	display: inline-block;
	vertical-align: top;
	margin-right: -4px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

/*--- ABOUT/SUPPORT/FAQ ---*/
.support.content, .about.content, .faq.content { font-family: 'SansaNormal', 'Open Sans', sans-serif; color: #111; margin: auto; width: 80%; padding: 0 0 140px 0; }
.support h1, .about h1, .faq h1 { color: #385c86; margin-top: 60px; }
.support h2, .about h2 { color: #4f81bd; margin-top: 20px; }
.support h3, .about h3, .faq h3 { color: #333; margin-top: 40px; }
.support .browsers { font-size: 12px; line-height: 1em; color: #555; }
.public-form textarea { resize: none; overflow: auto; }
.public-form { background-color: rgba(88, 88, 88, 0.33); padding: 30px; }
.public-form table { width: 100%; border-collapse: collapse; }
.public-form tr td { vertical-align: top; padding: 10px 5px; }
.public-form tr:nth-child(odd) { background-color: rgba(51, 51, 51, 0.07); }
.public-form tr td:first-child { width: 200px; }
.public-form .submit { border: none; padding: 16px 29px; background-color: #0D5257; color: #FFF; font-size: 16px; margin: 10px -5px; cursor: pointer; }
.public-form .submit:hover { background-color: #53868A; }
.public-form .submit:active { background-color: #0E383B; }
.captcha-container {
   width: 160px;
}
.captcha-input {
   margin-top: 10px;
}

/*--- DESKTOP (WIDE) ---*/
@media only screen 
and (min-width : 1280px) {
	.content .picture-box .copy { font-size: 2em; }
	.content .text-box { font-size: 3em; }
	.content .picture-box .bottom { font-size: 4.3em; }
	.content .picture-box .copy.bigger { font-size: 3.3em; }
	.content .picture-box .copy.second { font-size: 2.8em; }
}

/* (THIN) */
@media only screen 
and (max-width : 780px) {
	body { font-size: 8px; }
	.login input[type=text], .login input[type=password], .login input[type=email] { width: 35%; }
	.content .picture-box .copy { font-size: 1.25em; }
	.content .text-box { font-size: 1.8em; }
	.content .picture-box .bottom { font-size: 2.8em; }
	.content .picture-box .copy.bigger { font-size: 2.1em; }
	.content .picture-box .copy.second { font-size: 1.7em; }
}

/* IPHONE */
@media

/* 6 Plus */
screen and (min-device-width : 414px) 
and (-webkit-device-pixel-ratio: 3),

/* 6 */
only screen and (max-device-width: 667px) 
and (-webkit-device-pixel-ratio: 2),

/* Tiny screens */
screen and (max-width : 700px) {
	.top-bar .right { float: right; clear: both; width: 100%; }
	.login { width: 100%; padding-right: 20px; padding-bottom: 20px; }
	.content { clear: both; }
	.cycling-motto {font-size: 40px;}
}

@media


/* 5 */
screen and (device-aspect-ratio: 40/71),

/* < 5 */
screen and (device-aspect-ratio: 2/3) {
	body { font-size: 7px; }
	.cycling-motto {font-size: 40px;}
}

/*--- IPAD ---*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  {
	body { font-size: 14px; }
	body { -webkit-overflow-scrolling: touch; }
	.content .picture-box .copy { padding: 1% 2% 2% 5%; }
	.support.content, .about.content, .faq.content { padding: 2% 5%; }

}

/*--- IPAD LANDSCAPE ---*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	.content .picture-box .copy.first { font-size: 1.7em; }
	.content .picture-box .copy.bigger { font-size: 2.4em; }
	.content .text-box { font-size: 2em; }
}

#forgot-password-link {
	float: right;
	padding-right: 120px;
	padding-top: 2px;
}
#forgot-password-link a {
	color: white;
	text-decoration: none;
	font-size: 12px;
	cursor: pointer;
}
#email-login-box {
	vertical-align: middle;
}

.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 15% auto; 
    padding-top: 0;
    padding-left:  20px;
    padding-right: 20px;
    padding-bottom: 20px; 
    border: 1px solid #888;
    width: 53%; 
    font-color: black !important;
}

#video {
	width: 100%;
	height: auto;
}

.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}
.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

#contact-modal{
	color: black;
}

.modal-preface {
	margin-bottom: 10px;
}

.modal-input {
	padding: 7px;
	font-size: 16px;
	margin-bottom: 10px;
}

.modal-textarea{ 
	width: 100%;
	height: 250px;
	resize: none;
	font-size: 16px;
}

.button-tray{
	margin-top: 10px;
}

.modal-button{
	margin-left: 5px;
	font-size: 18px;
	color: black;
	border-color: #2e6da4;
	display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

.button-submit {
	background-color: #337ab7;
	color: #fff;
}

.centered-overlay {
	z-index: 1 !important;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	min-width: 60%;
}

.cycling-motto {
	background: rgba(33,33,33,0.7);
	font-size: 90px;
	text-align: center;
	padding: 40px;
	width: 100%;
	display: none;
}

#motto-verb {
	color: #5789e0;
	/*opacity: 1 !important;*/ 
/*	opacity: 0 !important;*/
}

#motto-noun {
	/*opacity: 1 !important;*/
	/*opacity: 0 !important;*/
}


.top-bar{
	height: 70px;
	display: flex;
   justify-content: space-between;
   align-items: center;
}

.login-container {
	display: none;
	padding-top: 15px;
	padding-bottom: 25px;
	background: rgba(33,33,33,0.7);
	border-top: 1px solid black; 
}

.login-input {
	margin-right:10px !important;
	font-size: 18px !important;
	padding: 10px !important;
}

#submit-link-challengex {
	margin-right: 10px;
	color: #5789e0;
	font-size: 23px;
}

.challengex-body {
	background-image: url("/img/home/panel-1-challengex.jpg");
	background-size: cover;
	background-repeat: no-repeat;
}

.challengex-content {

}
.challengex-picture-box {
	position: absolute;
	height: 100%;
}

#learn-more {
	display: none;
	width: 20%;
	padding: 15px;
	font-size: 30px;
	color: #5789e0;
	border-style: solid;
	border-color: #5789e0;
	border-radius: 20px;
}

#learn-more:hover{
	cursor: pointer;
}

.firetech-footer{
    background-color: #ff4c50;
    z-index:1000;
    color:white;
    /*height:250px;*/
    width: 100%;
    padding: 5px;
}

.firetech-links{
    color:white;
    width:100%;
    text-align:center;
    display:inline-flex;
    vertical-align: top;
}

.firetech-header-link{
    display:inline-block;
    /*margin-top:20px;*/
    width: 21%;
}

.firetech-footer-links{
    display:inline-flex;
    width:100%;
    margin-top: 1%;
    margin-bottom: 5px;
}

.firetech-footer-links ul{
    height:100%;
    width: 80%;
    list-style:none;
    text-align:left;
    padding-inline-start: 5px;
    margin-block-start: 0;
    margin-block-end:0;
    margin-top:auto;
}

.firetech-header-link ul{
    height:100%;
    list-style:none;
    text-align:left;
    padding-inline-start: 5px;
}

.firetech-header-link h5{
    color:white !important;
}

.firetech-header-link a{
    color:white !important;
    text-decoration: none;
}
.firetech-footer-logo{
    float:left;
    width: 16%;
    position: relative;
/*    margin-right:15%;
    margin-left:12%;*/
}
.firetech-logo {
   position: absolute;
   top:0;
   bottom: 0;
   left:0;
   right:0;
   margin:auto;
   max-width: 70%;
   height: auto;
}
.firetech-copyright{
/*    margin-right:40%;
    margin-left:12%;*/
    width: 20%;
    height: 100%;
}
.firetech-footer-link{
    margin-right: 5%;
    display: inline-block;
    float: right;
}

.firetech-footer-link a{
	text-decoration: none;
}

.firetech-link{
    color:white !important;
}

.firetech-brand img{
    width:100%;
    height:auto;
    margin-top:15px;
}

.firetech-social{
    display:inline;
    margin-right:5%;
    /*margin-left:20px;*/
}
.firetech-social-links {
}
.firetech-facebook{
    display:inline;
}

.firetech-top-bar{
    background-color: #ff4c50 !important;
    border-color: #ff4c50 !important;
    margin-bottom: -30px;
}

.firetech-right{
	padding-bottom: 15px;
	text-align:right;
	width:75%;
}

.firetech-submit-link{
	color: white; text-decoration: none; font-size: 1.4em; background: transparent; border: 0; cursor: pointer; 
    font-family: 'SansaNormal', 'Open Sans', sans-serif !important;
}

.firetech-top-bar .links{
	list-style:none;
}

.firetech-top-bar .links a{
	color: white;
	text-decoration:none;
	margin-right: 20px;
	font-size: 14px;
}

.firetech-top-bar .links li{
	display: inline-block;
}

.firetech-top-bar .links-challengex{
	list-style:none;
}

.firetech-top-bar .links-challengex li{
	display:inline-block;
}

.firetech-top-bar .links-challengex a{
	color:white;
	text-decoration: none;
	margin-right:44px;
	font-size: 20px;
}	

.error-message {
  margin-top: 10px;
  margin-bottom: 10px;
  color: #dc3545;
  text-align: center;
}

.homepage-video {
   text-align: center;
   position: fixed
}
.homepage-video video{
   max-width: 75%;
}

#curtin-sso-login {
	border-radius: 5px;
	color: white;
	text-decoration: none;
	padding: 10px 15px 10px 15px;
	background-color: #bc8c00;
	vertical-align: unset !important;
}
#login-form {
	display: flex;
   justify-content: flex-end
}
#top-bar-container {
	flex: 1;
   display: flex;
   justify-content: flex-end;
   align-items: center;
}
#non-curtin-login, #curtin-login {
	font-size: 12px;
	text-align: right;
}
#non-curtin-redirect, #curtin-redirect {
	color: #bc8c00;
}
#non-curtin-redirect:visited, #curtin-redirect:visited {
	color: #bc8c00;
}
#non-curtin-login-container {
	display: none;
	visibility: hidden;
	opacity: 0;
	flex-direction: column;
	margin-top: 19px;
}
#curtin-login-container {
	display: flex;
   flex-direction: column;
	justify-content: center;
	margin-top: 16px;
}