/**
* Main css file.
*
* @package WordPress
* @subpackage Thisgirlcan
* @since 1.0.0
*/

/* Global elements */
html, body {margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; font-family: "Gotham A", "Gotham B"; font-weight: 400; }
body {background-color: #ffffff; min-height: 100%;}
body.home {background-color: #d9d5d9;}

h1{display: none;}
h2{margin: 0; padding: 15px 0; text-transform: uppercase; color: #a2238e; font-size: 110%;}
p{font-family: "Gotham A", "Gotham B"; font-weight: 300; font-size: 90%;}
input::placeholder {
	font-size: 12px;
}
.group-label {
	display: block;
	font-size: 12px;
}
.checkbox.tandc input{top: -3px;}
/* End Global elements */


/* Common classes */
.button{
	-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
	font-family: "Gotham A", "Gotham B"; font-weight: 700; text-transform: uppercase; text-decoration: none; font-size: 85%;
	padding: 10px 30px;
}
.button-white{color: #a2238e; background: #fff;}
.button-white:hover,.button-white:active,.button-white:focus{color: #a2238e; text-decoration: none;}

.form-button{
	background: #a2238e; color: #fff; width: 170px; height: 40px; border: 0;
	font-family: "Gotham A", "Gotham B"; font-weight: 300; text-transform: uppercase; font-size: 80%;
	font-weight: bold;
	cursor: pointer;
}
button.form-button[disabled]{background: #d9d5d9;}

.logo-container{text-align: center;}
.logo-container img {width: 240px; height: auto;}
.thankyou-icon img {width: 165px; height: auto; margin-top: 50px; margin-bottom: 15px;}
/* End Common classes */


/** Home **/
.home-container{
	width: 100%; min-height: calc(100vh - 120px); text-align: center;
	background: url('../images/home-container-background.jpg') no-repeat center top;
	background-size: cover;
	padding-bottom: 40px;
}
.home-container .logo-container{padding-top: 100px;}

.home-description-container{width: 550px; margin: 30px auto;}
.home-description-container p{color: #fff;}

.stories-list .story-video{margin-bottom: 20px;}
.stories-list .story-video img {max-width: 140px; height: auto;}
.stories-container{padding-bottom: 150px; background: #d9d5d9; text-align: center;}
.container{padding-bottom: 150px;}
.stories-list{width: 480px; max-width: 100%; margin: 0 auto;}
.stories-list .story-video{padding-right: 8px; padding-left: 8px;}

/* .home-footer{
	position: fixed; bottom: 0;
	width: 100%;
	background: #a2238e; line-height: 32px;
	font-family: "Gotham A", "Gotham B"; font-weight: 300; color: #fff; padding: 10px;
}
.home-footer  ul.list-inline {margin-bottom: 0; font-size: 70%;}
.home-footer  ul.list-inline.wp-menu li:first-child {display: none;}
.home-footer  a {color: #fff; text-decoration: none;}
.home-footer .logo {width: auto; height: 65px; padding-bottom: 10px;} */

.home-footer {
	height: 120px; 
}

#storyModal .modal-dialog {
	width: 80%;
}
/** End Home **/

/** General Pages **/
.page-header {text-align: center; border: none; margin: 0;}
.page-header .logo-container{padding-top: 50px; padding-bottom: 25px;}
.page-header .logo-container img {width: 180px; height: 180px;}


/** Videoform **/
.modal {
	background-color: rgba(0, 0, 0, 0.6);
}
.modal-dialog{width: 100%; max-width: 640px; }
.modal-content {
	overflow: auto;
}
.videoform-container{padding: 20px; background-color: #ffffff; display: flex; flex-direction: column; height: calc(100vh - 60px); max-height: 896px; }

.videoform-button-container{ width: 100%; margin-top: 20px; margin-bottom: 20px;}

.videoform-step-container hr {border-top: 1px dotted #d9d5d9; margin-top: 10px; margin-bottom: 10px;}

.videoform-container p{margin: 10px auto; font-size: 80%;}

#videoform-camera-video-preview {
	object-fit: contain !important;
}
.videoform-progress-bar{text-align: center; height: 30px; display: flex; align-items: center; }
.videoform-progress-bar ul{display: flex; margin: 0 auto; padding: 0; position: relative; justify-content: space-between; width: 100%; }
.videoform-progress-bar ul:before{content: ""; background: #a6a7aa; width: 100%; height: 3px; position: absolute; top: 50%; z-index: 1;}
.videoform-progress-bar ul:after{content: ""; background: #a2238e; width: 0px; height: 3px; position: absolute; left: 0; top: 50%; z-index: 2;}
.videoform-progress-bar ul.step0-completed:after{width: 33.33%;}
.videoform-progress-bar ul.step1-completed:after{width: 66.66%;}
.videoform-progress-bar ul.step2-completed:after{width: 100%;}
.videoform-progress-bar ul li{display: inline; padding: 0; line-height: 30px; position: relative; z-index: 3;}
.videoform-progress-bar ul li span{
	display: inline-block; width: 30px; height: 30px;
	border-radius: 50%; behavior: url(PIE.htc); background: #a6a7aa;
	font-family: "Gotham A", "Gotham B"; font-weight: 700; font-size: 70%; color: #ffffff;
}
.videoform-progress-bar ul li.active span{background: #a2238e;}
.videoform-progress-bar ul li.complete span{background: #a2238e;}

.videoform-progress-bar ul li i{font-style: normal;}
.videoform-progress-bar ul li .glyphicon{display: none;}
.videoform-progress-bar ul.step0-completed li.step0 .progress-number,
.videoform-progress-bar ul.step1-completed li.step1 .progress-number,
.videoform-progress-bar ul.step2-completed li.step1 .progress-number,
.videoform-progress-bar ul.step2-completed li.step2 .progress-number {display: none;}
.videoform-progress-bar ul.step0-completed li.step0 .glyphicon, 
.videoform-progress-bar ul.step1-completed li.step1 .glyphicon,
.videoform-progress-bar ul.step2-completed li.step1 .glyphicon,
.videoform-progress-bar ul.step2-completed li.step2 .glyphicon{display: inline-block;}

.videoform-step-container{position: relative; width: 100%; flex-grow: 1; display: flex; }

.videoform-step{position: absolute; min-height: 100%; width: 100%;}

.videoform-step h2{padding: 20px 0 0; font-family: "Gotham A", "Gotham B"; font-weight: 700; font-size: 100%;}
.videoform-step p.subtitle{padding: 0; margin: 0; font-family: "Gotham A", "Gotham B"; font-weight: 700; font-size: 100%; color: #a2238e; text-transform: uppercase;}
.videoform-step .comment{font-family: "Gotham A", "Gotham B"; font-weight: 300; font-size: 80%; color: #a2238e; text-transform: uppercase;}
.videoform-step ul{margin: 10px 2px; padding: 0 0 0 15px; list-style-type: circle;}
.videoform-step div.radio {margin-left: 5px;}
.videoform-step div.radio label{font-family: "Gotham A", "Gotham B"; font-weight: 300; font-size: 80%;}

.videoform-step .tandc { font-size: 60%; font-weight: 300;}
.videoform-step .tandc a { color: #a2238e; text-decoration: underline;}

.videoform-step.step0 label {
	padding-left: 0;
}

#personal-information-form{padding-top: 10px;}
#personal-information-form .form-group label {display: none;}
#personal-information-form .form-group .form-control{border-radius: 0; font-family: "Gotham A", "Gotham B"; font-weight: 300; font-size: 80%;}
#personal-information-form .form-group{margin-bottom: 20px;}
#personal-information-form .form-group .col-md-6.col-left{padding-right: 5px;}
#personal-information-form .form-group .col-md-6.col-right{padding-left: 5px;}
#personal-information-form .checkbox{margin-top: 20px; font-family: "Gotham A", "Gotham B"; font-weight: 300; font-size: 60%;}
#personal-information-form .checkbox input{top: -3px;}
#personal-information-form .checkbox.multiple label {
	padding-left: 0;
	margin-right: 20px;
	margin-bottom: 5px;
}
#personal-information-form a  { color: #a2238e; text-decoration: underline;}

.videoform-step.step3 {
	/*display: flex;
	flex-direction: column;*/
	padding-bottom: 70px;
}
/*.videoform-step.step3.show {
	display: flex !important;
}
.videoform-step.step3 form {
	flex-grow: 1;
}*/
.videoform-step.step3 .form-inner {
	height: 100%;
	overflow-x: hidden;
}

.videoform-step.step4{text-align: center; padding-top: 10px;}
.videoform-step.step4 h2{padding-top: 5px; font-size: 100%;}
.videoform-step-logos img{padding: 15px 10px; width: 100px; height: auto;}

.videoform-step.step4 .form-button .glyphicon{margin-right: 5px;}

.videoapp-container{ 
	margin-top: 20px;
	width: 100%;
	max-width: 320px;
	margin: 20px auto;
	/* overflow-x: hidden; */
}
.camera_tag .cameratag_screen.cameratag_start{background: url('../images/video-background.jpg') no-repeat; background-size: cover;}
.camera_tag .cameratag_record_link.cameratag_record{width: 100%; height: 100%; display: block; cursor: pointer}
.camera_tag .cameratag_upload_link{
	position: absolute; top: -100px;  right: -25px;
	background: #fff; color: #a2238e; border: 1px solid #a2238e;
	font-family: "Gotham A", "Gotham B"; font-weight: 300; text-transform: uppercase; font-size: 60%;
	cursor: pointer;
	padding: 15px 10px;
}

.videoapp-container .camera_tag .cameratag_screen.cameratag_accept{padding-top: 30px;}
.videoapp-container .camera_tag .cameratag_screen.cameratag_accept .cameratag_accept_btn,
.videoapp-container .camera_tag .cameratag_screen.cameratag_accept .cameratag_rerecord_btn,
.videoapp-container .camera_tag .cameratag_screen.cameratag_accept .cameratag_play_btn {
	background: #a2238e; color: #fff; border: 0;
	font-family: "Gotham A", "Gotham B"; font-weight: 700; text-transform: uppercase; font-size: 80%;
	cursor: pointer;
	line-height: 29%; margin-bottom: 5%;
}
.videoapp-container .camera_tag .cameratag_screen.cameratag_accept .cameratag_accept_btn:hover,
.videoapp-container .camera_tag .cameratag_screen.cameratag_accept .cameratag_rerecord_btn:hover,
.videoapp-container .camera_tag .cameratag_screen.cameratag_accept .cameratag_play_btn:hover{
	background: #a2238e; color: #fff; border: 0; text-decoration: none;
}
.videoapp-container .camera_tag .cameratag_screen.cameratag_accept .button_label i.fa{display: none;}

.videoapp-container .camera_tag .cameratag_screen.cameratag_completed .cameratag_checkmark{
	font-size: 0;
	top: 50%; left: 50%; width: 100px; height: 100px; margin: 0 auto; margin-top: -50px; margin-left: -50px;
	background: url('../images/checked-big.png');
	background-size: cover;
}

#videoform-outer {
	width: 100%;
	max-width: 320px;
	height: 0;
	padding-bottom: 56.25%;
	margin: 0 auto;
	position: relative;
}
#videoform-camera {
	width: 100% !important;
	height: 100% !important;
	position: absolute;
	left: 0;
	top: 0;
}
#videoform-camera > div.cameratag_screen.cameratag_upload > div.radial-progress { width: 126px; height: 126px; }
#videoform-camera > div.cameratag_screen.cameratag_upload > div.radial-progress .circle .mask { width: 126px; height: 126px; clip: rect(0px, 126px, 126px, 63px); }
#videoform-camera > div.cameratag_screen.cameratag_upload > div.radial-progress .circle .fill { width: 126px; height: 126px;  }
#videoform-camera > div.cameratag_screen.cameratag_upload > div.radial-progress .circle .mask .fill { clip: rect(0px, 63px, 126px, 0px); }
#videoform-camera > div.cameratag_screen.cameratag_upload > div.radial-progress .circle .shadow { width: 126px; height: 126px; }
#videoform-camera > div.cameratag_screen.cameratag_upload > div.radial-progress .inset { width: 106px; height: 106px; margin-left: 10px; margin-top: 10px; }

.share-wrapper {
	display: none;
}

/*.camera_tag.recording{position: absolute;margin: 0; top: 0; left: 0; width: 100% !important; height: 100% !important; z-index: 99;}*/
/** End Videoform **/

/** CONTACT FORM **/
.frm_forms .frm_required_field .frm_error {
	display: none;
}
.frm_forms .frm_message {
	text-align: center;
}
.frm_forms .frm_error_style {
	text-align: center;
}
.form-inner {
	overflow: auto;
}

/** Mobile **/
@media (max-width: 767px) {
	.home  {
		font-size: 85%;
	}
	.videoform-container {
		height: 100vh;
	}
	.home-container{
		background-position: center top;
		background-size: cover;
	}
	
	.home-container .logo-container{padding-top: 70px;}
	.logo-container img {width: 60px; height: auto;}
	.home-description-container{width: 90%;}
	
	.page-header .logo-container{padding-top: 25px; padding-bottom: 25px;}
	.stories-container, .container{padding-bottom: 25px;}
	.home-footer-inner {width: 90%;}
	
	.form-button{
		width: 120px;
		font-size: 60%;
	}
	
	.camera_tag .cameratag_screen.cameratag_start{background: url('../images/video-background-mobile.jpg') no-repeat; background-size: cover; background-position: center center; }
	

	.camera_tag .cameratag_upload_link{ right: 0px; }
	
	.home-footer {
		position: relative;
	}
	
	.home-footer .row {
		display: flex;
		flex-direction: column;
	}
	
	.home-footer-logos ul{text-align: center;}
	
	.order-1 {
		order: 1;
	}

	.order-6 {
		order: 6;
	}

	.order-12 {
		order: 12;
	}
	
	.home-footer .left-logos img {
		float: none;
	}

	#storyModal .modal-dialog {
		margin: 20% auto;
	}
}
/** Mobile **/


.home-footer p {
	margin-top: 10px;
}

.home-footer .left-logos img {
	float: left;
	margin: 10px;
}

.home-footer .left-logos .change-game-logo {
	width: 50px;
}

.home-footer .left-logos .vic-gov-logo {
	width: 60px;
}

.home-footer .right-logos img {
	margin: 10px;
}

.home-footer .right-logos .vic-health-logo {
	height: 38px;
	width: 120px;
}

.home-footer .right-logos .tgc-logo {
	height: 43px;
	width: 43px;
}

.home-footer .right-logos .logo-wrapper {
	float: right;
}

.home-footer {
	background-color: #a3238f;
	padding: 20px;
	text-align: center;
	color: white;
}

.home-footer .center {
	font-size: 14px;
}

.links {
	margin-top: 20px;
}

@media(max-width: 991px) {
	.home-footer {
		height: auto;
	}

	.home-footer .left-logos .vic-gov-logo img {
		float: none;
	}
	
	.home-footer .right-logos .logo-wrapper {
		float: none;
	}
	
	.home-footer .right-logos a {
		display: inline-block;
		width: 100%;
	}
	
	.home-footer .left-logos img {
		float: none;
	}
	
	.links a {
		display: block;
		width: 100%;
		margin-bottom: 10px;
	}
	
	.links a:after {
		content: '' !important;
	}
}

.links a {
	color: white;
}

.links a:not(:last-of-type):after {
	content: ' |';
}

.main-container {
	/* min-height: calc(100vh); */
	min-height: 100vh;
}

.main-container .container {
	min-height: calc(100vh - 381px);
}