/*
 * Form Style v1.0
 *
 * Copyright 2014 Luke Spilsbury 
*/

body, html{
	height: 100%;
}

input[type=radio]{
	cursor: pointer;
}

.radio-img-s{
	display: none; /* Remove this to change from radios to images. */
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 6px 0px 0px 0px;
	background-image: url(../img/logo_s.png);
	background-repeat: no-repeat;
	background-size: 25%;
	background-position: center;
}

.radio-img-ns{
	display: none; /* Remove this to change from radios to images. */
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 6px 0px 0px 0px;
	background-image: url(../img/logo_h.png);
	background-repeat: no-repeat;
	background-size: 25%;
	background-position: center;
}

.header-fixed{
	display: none;
	position: fixed;
	top: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px -15px;
	z-index: 100;
}

.account-info-container{
	padding: 5px 0px 0px 0px;
	font: 400 28px/42px 'VAGRoundedStdLight', sans-serif; 
	font-size: 20px;
	font-weight: 300;
	line-height: 28px;
}

.account-info{
	display: inline-block;
	padding-right: 25px;
}

.account-info b{
	color: rgb(119, 85, 145); 	
}

.cover{
	display: none;
	opacity: 0;
	position: fixed;
	z-index: 100;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}

.msg-box{
	display: none;
	opacity: 0;
	z-index: 110;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -125px;
	margin-left: -250px;
	width: 500px;
	height: 250px;
}

.form-shadow{
	-webkit-box-shadow: 0 0 10px 0 rgba(50,50,50,.35);
	-moz-box-shadow: 0 0 10px 0 rgba(50,50,50,.35);
	/* box-shadow: 0 0 10px 0 rgba(50,50,50,.35); */
}

.text-middle{
	display: table-cell;
	height: 50px;
	vertical-align: middle;
	font-size: 14px;
	line-height: 16px;
	margin-left: 5px;
	margin-right: 5px;
}

.form-m-row{
	display: inline-block;
	vertical-align: middle;
	height: 80px;
	color: rgb(119, 85, 145);
}
 
.form-s-row{
	display: inline-block;
	height: 80px;
	line-height: 80px;
	text-align: center;
	margin-left: 10px;
	cursor: pointer;
}

.form-c-row{
	display:inline-block;
	vertical-align: middle;
}

.form-c-header{
	display:inline-block;
}

.form-t-row{
	margin-left: 10px;
}

.form-value{
	display: none;
}

.form-textarea{
	height: 150px;
	width: 100%;
	margin-top: 15px;
	color: #555;
	font: 400 28px/42px 'VAGRoundedStdLight', sans-serif; 
	-webkit-font-smoothing: antialiased;
	font-size: 14px;
	font-weight: 300;
	line-height: 21px;
	resize: none;
}

.form-textarea:focus{
	outline-width: 0;
}

.form-header-wrapper{
	padding: 0px 0px 0px 0px;

}

.form-header{
	font: 400 28px/42px 'VAGRoundedStdLight', sans-serif; 
	color: rgb(210, 39, 138); 
	font-size-adjust: none; 
	font-stretch: normal; 
	margin-top: 18px; 
	margin-bottom: 0px;
}

.form-welcome{
	font: 22px 'VAGRoundedStdLight', sans-serif; 
	color: rgb(119, 85, 145); 
	font-size-adjust: none; 
	font-stretch: normal; 
	margin-top: 0px; 
	margin-bottom: 0px;
	line-height: 33px;
}

.form-footer{
	font: 400 28px/42px VAGRoundedStdLight, sans-serif; 
	color: rgb(210, 39, 138); 
	display:inline-block;
	padding: 0px;
}

.form-category{
	display: inline-block;
	padding-left: 15px;
	margin-top: 0px;
}

.form-ratings{
	display: inline-block;
	background: #d2278a;
	color: #ffffff;
	text-align: center;
	vertical-align: middle;
	margin-left: 10px;
	height: 50px;
}

.form-submit-button{
	width: 100%;
	height: 50px;
	margin-top: 25px;
	margin-bottom: 45px;
}

.end-box{
	display: none;
	width: 100%;
	opacity: 0;
}

.tweet-frame{
	width: 100%;
	height: 100%;
}

.comment-box-question{
	height: 180px;
}

.question-text{
	height: 80px;
	display: table;
	vertical-align: middle;
}

.question-comment-text{
	height: 180px;
	display: table;
	vertical-align: middle;
}

.question-text span{
	display: table-cell;
	vertical-align: middle;
}

.comment-box-question{
	height: 180px;
}

.fill-me{
	display: none;
	width: 100%;
	margin-top: -20px;
	font-style: italic;
	font-size: 12px;
	height: 12px;
}

/**
Mobile Devices: iPhone, ...
**/

@media only screen and (max-width : 767px) {

	.account-info-container{
		padding: 15px 0px 0px 0px;
	}

	.fixed{
		width: 100%;
	}

	.msg-box{
		width: 100%;
		margin-left: 0px;
		left: 0px;
	}

	.account-info{
		display: block;
		margin-bottom: 5px;
	}

	.comment-box-question{
		height: 50px;
	}

	.form-row{
		background: #ffffff;
	}

	.form-header{
		width: 100%;
		padding-left: 0px;
		padding-right: 5px;
		font-size: 26px;
		line-height: 32px;	
	}

	.form-c-header{
		display: block;
		padding-right: 5px;
	}	
	
	.form-b-row{
		background-color: #ffffff;
	}
	
	.form-s-row {
		height: 80px;
		margin: 7.5px 0px 7.5px 15px;
		line-height: 16px;
		font-size: 14px;
		padding: 5px;
	}

	.form-s-row-3 {
		width: 93px;
	}	

	.form-s-row-5 {
		width: 73px;
	}		
		
	
	.form-radio-wrapper{
		display: table;
		width: 100%;
		margin-top: -30px;
	}
	
	.form-radio{
		margin-top: 15px
	}
	
	.form-value{
		display: table;
		width: 100%;
		height: 60px;
	}
	
	.form-category{
		width: 100%;
		margin-top: 15px;
		padding-left: 15px;
	}
	
	.form-ratings-3{
		width: 16%;
		height: 120px;
		background: #d2278a;
		color: #ffffff;

	}
	
	.form-ratings{
		display: none;
	}
	
	.form-ratings-5{
		width: 16%;
		height: 120px;
		background: #d2278a;
		color: #ffffff;

	}

	.form-c-row{
		display:block;
	}

	.question-text{
		height: 60px;
		vertical-align: middle;
		font: 400 28px/42px 'VAGRoundedStdLight', sans-serif; 
		font-size: 20px;
		font-weight: 300;
		line-height: 28px;
	}

	.form-t-row{
		display:block;
		padding-right: 25px;
	}
	
	.form-submit-button{
		margin-top: 15px;
	}
}

/**
Mobile Devices: iPad Mini, ...
**/

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

	.comment-box-question{
		height: 180px;
	}
	
	.form-category{
		line-height: 32px;
	
	}

	.form-header-wrapper{
		padding-top: 20px;
	}

	.form-category{
		width: 246px;
	}

	.form-ratings-3{
		width: 156px;
	}	
	
	.form-ratings-5{
		width: 90px;
	}	
	
	.form-m-row{
		display: inline-block;
		vertical-align: middle;
		height: 80px;
		color: rgb(119, 85, 145);
		width: 246px;
	}

	.form-s-row-3 {
		width: 156px
	}	
	
	.form-s-row-5 {
		width: 90px
	}
	
	.form-t-row{
		width: 488px;
	}

	.comment-box-question{
		height: 180px;
	}
	
	.question-comment-text{
		height: 180px;
		display: table;
		vertical-align: middle;
	}
	
	.fill-me{
		display: none;
		width: 100%;
		margin-top: -20px;
		font-style: italic;
		font-size: 12px;
		height: 12px;
	}

	.form-category{
		width: 311px;
	}

	.form-ratings-3{
		width: 205px;
	}
	
	.form-ratings-3 .text-middle{
		width: 205px;
	}
	
	.form-ratings-5{
		width: 119px;
	}
	
	.form-ratings-5 .text-middle{
		width: 119px;
	}
	
	.form-m-row{
		display: inline-block;
		width: 311px;
		vertical-align: middle;
		height: 80px;
		color: rgb(119, 85, 145);
	}
	
	.form-s-row-3{
		width: 205px;
	}
	
	.form-s-row-5{
		width: 119px;
	}
	
	.form-t-row{
		width: 635px;
	}

	.comment-box-question{
		height: 180px;
	}

	.question-comment-text{
		height: 180px;
		display: table;
		vertical-align: middle;
	}

	.fill-me{
		display: none;
		width: 100%;
		margin-top: -20px;
		font-style: italic;
		font-size: 12px;
		height: 12px;
	}
	
	
}


@media only screen and (max-width : 992px) {

	.radio-img-s{
		background-size: 50%;
	}

	.radio-img-ns{
		background-size: 50%;
	}


	.form-s-row-3{
		width: 135px;
	}
	
	.form-s-row-5{
		width: 77px;
	}
	
	.form-t-row{
		width: 424px;
	}
	
	.fixed{
		width: 750px;
	}
	
	.form-ratings-3{
		width: 135px;
	}
	
	.form-ratings-5{
		width: 77px;
	}	

}


@media only screen and (max-width : 767px) {

	.radio-img-s{
		background-size: 50%;
	}

	.radio-img-ns{
		background-size: 50%;
	}

	.header-fixed{
		display: none;
	}
	
	.form-s-row{
		background: rgb(150,83,170);
		color: #ffffff;
	}

	.form-s-row-3 {
		width: 84px;
	}	

	.form-s-row-5 {
		width: 84px;
	}
		
	.form-textarea{
		width: 100%;
	}

	.form-t-row{
		margin-left: 0px;
		width: 100%;
		padding-right: 15px;
	}
	
	.form-header-wrapper{
		padding-top: 80px;
	}
	
	
	.form-m-row{
		display: table-cell;
		vertical-align: middle;
		height: 50px;
		padding: 35px 15px 5px 15px;
		margin: 0px;
		width: 100%;
	}
	
	.fill-me{
		display: none;
		width: 100%;
		height: 16px;
		margin-top: 0px;
		color: rgb(210,39,138);
	}
	
	.question-comment-text{
		height: 60px;
	}
	
	.radio-img-s{
		display: none;
	}
	
	.radio-img-ns{
		display: none;
	}
	
	input[type=radio]{
		display: inline;
	}
}

/*
Quick jQuery Mobile fix.
*/
.ui-loader{
	display: none;
}