HTML {
}

BODY {
	background-color: #f2f2f2 !important;
}

#page-div {
	width: 100% !important;
}

td {
	padding: 0px !important;
}

INPUT[type=submit] {
	-webkit-border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	border-radius: 0px !important;
	color: #000000;
	background-color: #ffffff;
	border: solid 2px #000000 !important;
	padding: 10px 0px 10px 0px !important;
	text-decoration: none;
	text-transform: uppercase;
	font-family: Montserrat;
	font-size: 18px;
	width: 30% !important;
}

INPUT[type=text]{
	width: 100% !important;
	max-width: 100% !important;
    padding: 20px 10px;
    margin: 8px 0 !important;
    box-sizing: border-box;
	font-size: 0.9em;
	text-transform: uppercase;
	border: 1px solid grey !important;
}

SELECT{
	font-size: 0.8em !important;
	width: 100% !important;
	height: 45px !important;
	max-width: 100% !important;
	padding: 10px !important;
    margin: 8px 0 !important;
    box-sizing: border-box;
	text-transform: uppercase;
}

INPUT[type=text]:focus {
    border: 1px solid blue !important;
}

TEXTAREA {
	width: 95% !important;
	resize: none;
	padding: 5px;
}

/* Survey page (all survey content is contained in this table) */
TABLE.page {
	
}

/* survey header */
Table.header {}
TD.header {}

/* Login screen */
TD.login{}

/* Survey title */
TD.title{
	color: #dd0000;
	text-transform: uppercase;
	padding-top: 20px !important;
}

H1.title {
	padding-left: 20px !important;
}

/* Spacing before introduction */
TD.spaceBeforeIntro {
	display: none !important;
}

/* Spacing before section text */
TD.spaceBeforeFirstSectionText {
	display: none !important;
}

/* Spacing before section text */
TD.spaceAfterFirstSectionText {
	display: none !important;
}

/* Spacing before section text */
TD.spaceBeforeSectionText {
	display: none !important;
}

/* Spacing after section text */
TD.spaceAfterSectionText {
	display: none !important;
}

/* Section title */
SPAN.sectionTitle{}

/* Survey introduction */
TD.introduction {
	font-family: Montserrat;
	font-size: 16px !important;
	letter-spacing: -0.1px;
}

TD.introduction > p {
	margin: 5px 20px 15px 20px !important;
}

/* for controlling spacing before the last question */
TD.beforeFirstQuestion {}

/* Question table*/
TABLE.question {}

TD.question {
	padding: 20px !important;
}

TD.questionNo{}

TD.questionText{
	font-size: 0.9em !important;
	text-transform: uppercase !important;
}

TD.questionInput{
	padding-top: 10px !important;
}

TD.textBefore{}

TD.textAfter{}

/* for controlling after last question */
TD.afterLastQuestion {}

/* for controlling spacing between questions */
TD.betweenQuestions {}

/* Essay */
INPUT.essayText {}

SELECT.essayDropdown{}

INPUT.essayCheckbox{}

/* Rating question */
TABLE.rating {}

TD.ratingMinMax {}

TD.ratingNumbers {
	margin-left: 5px !important;
	margin-right: 5px !important;
	padding: 10px !important;
}

TD.ratingNA {}

TD.ratingRadio {}

TD.ratingEmpty {}

INPUT.ratingRadio {}


/* Numeric question */

TABLE.numeric {}

TD.numericPrefix {}

TD.numericPostfix {}

TD.numericInput {}

INPUT.numericInput {}

/* Dropdown question */

TABLE.dropdown {
	width: 100%;
	max-width: 100%;
}

TD.dropdown {}

SELECT.dropdown {}

/* Multiple question */

TABLE.multiple {}

TABLE.multipleChoice {}

TD.multipleButton {}

TD.multipleText {}

TD.multipleImage {}

INPUT.multipleOther {}

INPUT.multipleButton {}


/* Matrix question */

TABLE.matrix {}

TD.matrixHeading {}

TD.matrixCell {}

TD.matrixEmpty {}

INPUT.matrixCheckbox {}

INPUT.matrixRadio {}

INPUT.matrixText {}

SELECT.matrixDropdown {}

/* Upload files screen */
Table.uploadPage {
}

TD.uploadTitle {
}

TD.uploadHelp {
}

TD.upload {
}

SELECT.uploadSelectImage {
}

TD.uploadPreview {
}

TD.uploadButtons {
}

Input.uploadField {
}

/* ProgressBar */
TD.progressBar{
	/* controlls position of the progress bar, f.exp:
		TEXT-ALIGN: center;
	*/
}

TABLE.progressBar {
	/* controlls width of the progress bar, f.exp:
		width: 50%;
	*/
}

TD.progressBarFill {
	/* controlls the filled part of the progress bar f.exp:
		BACKGROUND-COLOR: #000000;
	*/
}

TD.progressBarBlank {
	/* controlls the blank part of the progress bar f.exp:
		BACKGROUND-COLOR: #FFFFFF;
	*/
}

TD.progressBarText {
	/* controlls the text(percentage) of the progress bar
	*/
}

TD.buttons {
	/* controlls the table cell where survey buttons are located
	*/
	text-align: center;
	padding-top: 20px !important;
	padding-bottom: 20px !important;
}

TD.thankYouNote {
	/* controlls the table cell where survey thank-you note is displayed
	*/
	padding: 20px !important;
}

/* survey footer */
Table.footer {
	display: none !important;
}

TD.footer {
}

/* Save and come back */
TD.saveAndComeBack {}

/* custom design */
.dialog {
	text-align: center;
}

h1.title:after {
    background: #e6b1b1;
    content: '';
    display: block;
    height: 2px;
    margin-top: 15px;
    width: 95%;
}

.questionFreeText {
	padding-top: 5px !important;
}

.validationError {
	font-size: 14px;
	font-family: Montserrat;
	padding-bottom: 20px !important;
}

.rsaf50-logo {
	text-align: center;
	padding-top: 20px;
}

.ballot-form-header {
    background-color: #104b73;
    text-align: center;
	padding: 20px;
}

.ballot-form-header > span {
	height: 24px;
    font-family: Montserrat;
    font-size: 20px;
    font-weight: 300;
    letter-spacing: 1px;
    color: #ffffff;
	text-transform: uppercase;
}

.ready-to-do-some-mac {
	font-family: Montserrat;
    font-size: 14px;
    font-weight: 300;
    text-align: center;
    color: #000000;
    padding: 10px 20px 10px 20px;
}

.ballot-form-sub-header {
	text-align: center;
    background-color: rgba(161, 170, 175, 0.2);
    padding: 10px;
}

.ballot-form-sub-header  > span {
	text-transform: uppercase;
    color: #00557c;
    height: 22px;
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 300;
    letter-spacing: 1px;
}

.form-instruction {
	font-family: Montserrat;
	font-size: 14px;
	font-weight: 300;
	text-align: center;
	color: #000000;
}

/* responsive design */
@media (max-width: 800px) {
	#page-div {
		padding: 0px !important;
	}
	TD.title {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}
	H1.title {
		padding-left: 8px !important;
	}
	INPUT[type=text]{
		padding: 20px 10px;
	}
	INPUT[type=submit] {
		width: 50% !important;
	}
	TD.question {
		padding: 20px !important;
	}
	TD.introduction > p {
		margin: 0px 20px 0px 20px !important;
	}
	.sectionText {
		padding: 20px !important;
	}
	.questionText > div {
		display: none;
	}
}

@media (max-width: 750px) {
	.rsaf50-logo > img{
		width: 90%;
	}
}