@charset "UTF-8";

.netigatetexbox {
	height: auto !important;
}

strong {
	font-weight: 700;
}

/* --------------------------------------------------------- */
/* SMARTPHONES, TABLETS & TINY DESKTOPS -------------------- */
/* --------------------------------------------------------- */

/* Old Smartphones (portrait and landscape) ---------------- */
@media
only screen and (min-device-width: 240px) and (max-device-width: 320px) {

#main{
	overflow:auto;
}
	.qheader, .qdescription, .qoption,  .mheader, .stlink, .footertext, .footlink, input[type=text], textarea, select, .totalSum, .qoption.disabled, .qoptiondisabled {
		font-size: 30px;
		padding: 5px;	
	}
	
	#header, #content, #ContentAndFooter {
		padding: 0px;
		width: 98%;
		min-height: 100px;
		margin: 0 auto 0 auto;
		border-width: 0px;
	}
	
	#warning {
		font-size: 30px;
		min-width: 50%;
	}

	.pbar {
		width: 50% !important;
		height: 1.25em !important;
		border-width: 2px !important;
	}

	.pbarinner {
		height: 1.25em !important;
	}
	
	
	input[type=submit] {
		min-height: 75px !important;
		min-width: 75px !important;
		width: auto;
		background-size: contain;
		font-size: 20px;
		line-height: 25px;
		padding: 2.5px;
	}
	
	.netigatetexbox, .netigatetextarea, .totalSum {
		min-width: 50%;
	}
}


/* Old Smartphones (e.g. portrait) ------------------------- */
@media
only screen and (max-width: 319px) {
	/* YOUR STYLES */
}


/* Smartphones (portrait and landscape) -------------------- */
@media
only screen and (min-device-width: 320px) and (max-device-width: 640px) {
	/* YOUR STYLES */
}


/* Smartphones (portrait) & Old SP (landscape) ------------- */
@media
only screen and (min-width: 320px) and (max-width: 479px) {
	/* YOUR STYLES */
}


/* Smartphones (landscape) & Old Tablets (Portrait) -------- */
@media
only screen and (min-width: 480px) and (max-width: 799px) {

	body, html, form, document {
		padding: 0px;
		margin: 0 auto 0 auto;
		width: 100%;
		font-family: 'Open Sans', sans-serif;
		min-height: 100%;
		height: 100%;
		-webkit-overflow-scrolling: touch;	
	}
	
	#header, #content, #ContentAndFooter {
		padding: 0px;
		width: 98%;
		min-height: 100px;
		margin: 0 auto 0 auto;
		border-width: 0px;
	}
	
	#ContentAndFooter {
		height: 100%;
	}
	
	#mainbanner {
		margin-top: 20px;
		margin-left: 0px;
	}
	
	#main {
		-webkit-overflow-scrolling: touch;
		min-height: 100%;
		width: 100%;
		padding: 0px !important;
		margin: 0px !important;
		border: none;
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		overflow: auto !important;
	}
	
	#footer {
		clear: both;
		width: 75%;
		margin: 0 auto 0 auto;
		text-align: center;
		background-size: cover;
	}
		
	table {
		width: 95%;
	}
	
	#buttonholder {
		margin: 15px auto 0 auto;
	}
	
	.NetigateBackButton {
		float: left;
	}

	.NetigateNextButton, .NetigateToSurveyButton, .NetigateEndButton {
		float: right;
	}
	.netigatetexbox, .netigatetextarea, .totalSum {
		min-width: 50%;
	}
}


/* Smartphones & Tablets (portrait & landscape) ------------ */
@media
only screen and (min-device-width: 640px) and (max-device-width: 960px) {
	/* YOUR STYLES */
}


/* Smartphones & Tablets (portrait) & Tiny Desktops -------- */
@media
only screen and (min-width: 640px) and (max-width: 799px) {	
}


/* Smartphones & Tablets (landscape) & Splitted Desktops --- */
@media
only screen and (min-width: 800px) and (max-width: 1000px) {

	body, html, form, document {
		padding: 0px;
		margin: 0 auto 0 auto;
		width: 100%;
		font-family: 'Open Sans', sans-serif;
		min-height: 100%;
		height: 100%;
		-webkit-overflow-scrolling: touch;
	}
	
	
	#header, #content, #ContentAndFooter {
		padding: 0px;
		padding-bottom: 15px;
		width: 98%;
		min-height: 100px;
		margin: 0 auto 0 auto;
		border-width:0px;
	}

	#ContentAndFooter {
		height: 100%;
	}
	
	#mainbanner {
		margin-top: 20px;
		margin-left: 0px;
	}
	
	#main {
		width: 100%;
		min-height: 100%;
		padding: 0px !important;
		margin: 0px !important;
		border: none;
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		overflow: auto;
	}
	
	#footer {
		clear: both;
		width: 75%;
		margin: 40px auto 0 auto;
		text-align: center;
		background-size: cover;
	}
		
	table {
		width: 95%;
		border-spacing: 0px;
	}

	#buttonholder {
		margin: 0 auto;
		clear: both;
	}
		
	.NetigateBackButton {
		float: left;
	}

	.NetigateNextButton, .NetigateToSurveyButton, .NetigateEndButton {
		float: right;
	}
	
	#progressbardiv {
		margin-top: 25px;
	}
	.netigatetexbox, .netigatetextarea, .totalSum {
		min-width: 50%;
	}
}


/* --------------------------------------------------------- */
/* DEVICES BY RATIO ---------------------------------------- */
/* --------------------------------------------------------- */

/* LowRes (e.g. 240x320 / 320x480) ------------------------- */
@media
only screen and (min--moz-device-pixel-ratio: 0.75),
only screen and (-o-min-device-pixel-ratio: 3/4),
only screen and (-webkit-min-device-pixel-ratio: 0.75),a
only screen and (min-device-pixel-ratio: 0.75),
only screen and (min-resolution: 0.75dppx) {	
}


/* HighRes ------------------------------------------------- */
@media
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	/* YOUR STYLES */
	
	/* e.g. HighRes Logo (use _2x as extension for double-sized images) */
	/* .logo {background-image: url(logo_2x.png); background-size: 50%;} */
}
/* RetinaRes Smartphones (e.g. iPhone 4 / portrait) -------- */
@media
only screen and (min--moz-device-pixel-ratio: 5) and (orientation: portrait) and (max-device-width: 736px),
only screen and (-o-min-device-pixel-ratio: 5/1) and (orientation: portrait) and (max-device-width: 736px),
only screen and (-webkit-min-device-pixel-ratio: 1.5) and (orientation: portrait) and (max-device-width: 736px), /* SAFARI */
only screen and (min-device-pixel-ratio: 5) and (orientation: portrait) and (max-device-width: 736px),
only screen and (min-resolution: 5dppx) and (orientation: portrait) and (max-device-width: 736px)
{	
	body, body p{
		font-size:50px;
		line-height:60px;
	}
	
	body h1, body h1.qheader{
		font-size:65px;
		line-height:70px;
		margin-bottom:20px;
	}
	
	.ui-slider .ui-slider-handle {
		position: absolute;
		z-index: 2;
		margin-top:-0.3em!important;
		margin-left:-75px!important;
		width: 150px!important;
		height: 150px!important;
		cursor: default;
		-ms-touch-action: none;
		border-radius:25px!important;
		border:none!important;
		background:url(../img/handle.png)!important;
		background-size:contain!important;
		background-color:none!important;
		outline: 0!important;
	}
	
	.ui-slider {
		border:2px solid #ccc!important;
	}
	
	.flagz{
		height: 75px;
		width: auto;
		margin: 15px 15px;
	}
	
	#ui-datepicker-div{
		font-size: 54px!important;
		-webkit-transform:translateZ(1px);
		-moz-transform:translateZ(1px);
		-o-transform:translateZ(1px);
		transform:translateZ(1px);
	}

	.mheader{
		margin-bottom: 25px;
	}
	
    .sliderbox {
		font-size: 50px;
		line-height: 60px;
		padding: 5px;
    }
	
	.qheader {
		font-size: 65px !important;
		line-height: 60px;
		padding: 5px;
		padding-bottom: 15px;	
	}
	
	.qdescription font, .qdescription, .mheader, .qoption, .stlink, input[type=text], textarea, select, .netigatedropdown, .totalSum, .qoption.disabled, .qoptiondisabled{
		font-size: 50px !important;
		line-height: 60px;
		padding: 5px;
		padding-bottom: 15px;
	}
	
	span.qoption img{
		max-width: 100%;
	}
	
	ol{
		margin-left: 35px;
	}

	.checkboxtable td{
		padding-bottom: 20px;
	}
	
	.matrixcollegend{
		padding:20px 10px 20px 20px;
	}
	
	td.matrixcollegend span.qoption{
		font-size: 40px!important;
		line-height: 50px!important;
		padding: 5px;
	}
	
	#header, #content, #ContentAndFooter {
		padding: 0;
		width: 98%;
		min-height: 100px;
		margin: 0 auto 60px auto;
		border-width: 0px;
	}
	
	#mainbanner{
		min-height:100px;
	}
	
	.qheader{
		margin-top: 15px;
	}
	
	.qoption {
		font-size: 45px;
		line-height: 50px;
		vertical-align: middle;
	}
	
	#buttonholder{
		margin-top: 30px;
		height: 90px;
	}
	
	#footer{
		position: relative;
		bottom: 0;
		margin: 50px auto;
		text-align: center;
		width: 99%;
		background-size: cover;
	}
	
	.footertext, .footlink, a.footlink, #footertext, #footertext a, #footlink, #footerlogo, #tagline{
		font-size: 30px!important;
		line-height: 35px!important;
	}
	
	.netigatetextarea{
		height:180px;
		font-size: 50px;
		line-height: 60px;
		padding: 5px;
	}
	
	#warning {
		font-size: 40px;
		min-width: 50%;
		-webkit-transform:translateZ(1px);
		-moz-transform:translateZ(1px);
		-o-transform:translateZ(1px);
		transform:translateZ(1px);
	}

	.pbar {
		width: 50% !important;
		height: 1.25em !important;
		border-width: 2px !important;
		line-height: 25px!important;
	}

	.pbarinner {
		height: 1.25em !important;
		line-height: 25px;
	}
	
	.checkboxcol{
		vertical-align: middle!important;
	}
	
	.androidRadio, .androidCheck{
		margin: 15px 15px 15px 0;
		height: 55px;
		width: auto;
	}
	
	.netigateimg{
		height: auto;
	}
	
	table{
		width:100%;
	}
	
	table.sliderTable td .sliderbox{
		float:left;
		width: 120px;
		text-align: center;
		margin-left: 42%;
		margin-top: 40px;
	}
	
	td.slideroption{
		padding: 50px;
	}
	
	.npscontainer{
		border: none;
	}
	
	input[type=submit] {
		height: 150px !important;
		min-width: 150px !important;
		width: auto;
		background-size: contain;
		font-size: 40px;
		line-height: 50px;
		padding: 5px;
	}
	
	.netigatetexbox, .netigatetextarea, .totalSum {
		min-width: 50%;
	}
	
	#main{
		overflow:auto;
	}
	
	.smileyBig, .smileyMedium, .smileySmall{
		height: 100px!important;
		width: auto!important;
	}
}


/* RetinaRes Smartphones (e.g. iPhone 4 / landscape) ------- */
@media
only screen and (min--moz-device-pixel-ratio: 1.5) and (orientation: landscape) and (max-device-width: 736px),
only screen and (-o-min-device-pixel-ratio: 3/2) and (orientation: landscape) and (max-device-width: 736px),
only screen and (-webkit-min-device-pixel-ratio: 1.5) and (orientation: landscape) and (max-device-width: 736px),
only screen and (min-device-pixel-ratio: 1.5) and (orientation: landscape) and (max-device-width: 736px),
only screen and (min-resolution: 1.5dppx) and (orientation: landscape) and (max-device-width: 736px)
{
	/* YOUR STYLES */
	
	body, body p{
		font-size:30px;
		line-height: 40px;
	}
	
	body h1, body h1.qheader{
		font-size:45px;
		line-height:50px;
	}
	
    .ui-slider .ui-slider-handle {
		position: absolute;
		z-index: 2;
		margin-top:-15px!important;
		margin-left:-55px!important;
		width: 100px!important;
		height: 100px!important;
		cursor: default;
		-ms-touch-action: none;
		border-radius:25px!important;
		border:none!important;
		background:url(../img/handle.png)!important;
		background-size:contain!important;
		background-color:none!important;
		outline: 0!important;
	}
	
    .sliderbox {
		font-size:28px;
    }
	
	.qdescription font, .qheader, .qdescription, .mheader, .qoption, .stlink, input[type=text], textarea, select, .netigatedropdown, .totalSum, .qoption.disabled, .qoptiondisabled {
		font-size: 30px !important;
		line-height: 40px;
		padding: 5px;
		padding-bottom: 15px;
	}
	
	span.qoption img{
		max-width: 100%;
	}
	
	.netigatetextarea{
		height:170px;
		font-size: 30px;
		line-height: 40px;
		padding: 5px;
	}
	
	ol{
		margin-left: 30px;
	}
	
	#ui-datepicker-div{
		font-size: 54px!important;
		-webkit-transform:translateZ(1px);
		-moz-transform:translateZ(1px);
		-o-transform:translateZ(1px);
		transform:translateZ(1px);
	}
	
	.mheader{
		margin-bottom: 25px;
	}
	
	#header, #content, #ContentAndFooter {
		padding: 0px;
		width: 98%;
		min-height: 100px;
		margin: 0 auto 60px auto;
		border-width: 0px;
	}
	
	#mainbanner{
		min-height:100px;
	}
	
	#buttonholder{
		margin-top: 30px;
		height: 80px;
	}
	
	#warning {
		font-size: 30px;
		min-width: 50%;
		-webkit-transform:translateZ(1px);
		-moz-transform:translateZ(1px);
		-o-transform:translateZ(1px);
		transform:translateZ(1px);
	}

	.pbar {
		width: 50% !important;
		height: 1.25em !important;
		border-width: 2px !important;
		line-height: 25px!important;
	}

	.pbarinner {
		height: 1.25em !important;
	}
	
	
	input[type=submit] {
		height: 100px !important;
		min-width: 100px !important;
		width: auto;
		background-size: contain;
		font-size: 30px;
		line-height: 40px;
		padding: 5px;
	}
	
	input[type=button] {
		height: 150px !important;
		min-width: 150px !important;
		width: auto;
		background-size: contain;
		font-size: 30px;
		line-height: 40px;
		padding: 5px;
	}
	
	table.sliderTable td .sliderbox{
		float:left;
		width: 120px;
		text-align: center;
		margin-left: 42%;
		margin-top: 40px;
	}
	
	td.slideroption{
		padding: 50px;
	}
	
	.matrixcollegend{
		padding:20px 10px 20px 20px;
	}
	
	td.matrixcollegend span.qoption{
		font-size: 30px!important;
		line-height: 40px!important;
		padding: 5px;
	}
	
	.androidRadio, .androidCheck{
		margin: 10px 10px 10px 0;
		height: 45px;
		width: auto;
	}
	.netigatetexbox, .netigatetextarea, .totalSum {
		min-width: 50%;
	}
	
	.netigateimg{
		height: auto;
	}
	
	#footer{
		position: relative;
		bottom: 0;
		margin: 50px auto;
		text-align: center;
		width: 99%;
		background-size: cover;
	}
	
	.footertext, .footlink, a.footlink, #footertext, #footertext a, #footlink, #footerlogo, #tagline{
		font-size: 20px!important;
		line-height: 25px!important;
	}
	
	#main{
		overflow:auto!important;
	}
	
	.smileyBig, .smileyMedium, .smileySmall{
		height: 100px!important;
		width: auto!important;
	}
}


/* --------------------------------------------------------- */
/* IPADS --------------------------------------------------- */
/* --------------------------------------------------------- */

/* iPads (portrait and landscape) -------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1023px) {
	/* YOUR STYLES */
	
	body, body p{
		font-size: 25px;
		line-height: 30px;
	}
	
	body h1, body h1.qheader{
		font-size:50px;
		line-height:55px;
	}
	
	.ui-slider .ui-slider-handle {
		position: absolute;
		z-index: 2;
		margin-top:-22px!important;
		margin-left:-55px!important;
		width: 100px!important;
		height: 100px!important;
		cursor: default;
		-ms-touch-action: none;
		border-radius:25px!important;
		border:none!important;
		background:url(../img/handle.png)!important;
		background-size:contain!important;
		background-color:none!important;
		outline: 0!important;
	}
	
    .sliderbox {
		font-size:28px;
    }
	
	.smileyBig, .smileyMedium, .smileySmall{
		height: 100px!important;
		width: auto!important;
	}
	
	.qdescription font, .qheader, .qdescription, .mheader, .qoption, .stlink, input[type=text], textarea, select, .netigatedropdown, .netigatetexbox, .totalSum, .qoption.disabled, .qoptiondisabled {
		font-size: 25px !important;
		line-height: 30px;
		padding: 5px;
		padding-bottom: 5px;
	}
	
	span.qoption img{
		max-width: 100%;
	}
	
	.netigatetextarea{
		height:165px;
		font-size: 25px;
		line-height: 30px;
		padding: 5px;
	}

	ol{
		margin-left: 30px;
	}
	
	#ui-datepicker-div{
		font-size: 25px!important;
		-webkit-transform:translateZ(1px);
		-moz-transform:translateZ(1px);
		-o-transform:translateZ(1px);
		transform:translateZ(1px);
	}
	
	.mheader{
		margin-bottom: 30px;
	}
	
	h1, h2, p{
		padding: 6px 6px 6px 0;
		min-width: 100%;
		max-width: 100%;
	
	}
	
	#header, #content, #ContentAndFooter {
		padding: 0px;
		width: 98%;
		min-height: 100px;
		margin: 0 auto 60px auto;
		border-width: 0px;
	}
	
	#mainbanner{
		min-height:100px;
	}

	.androidRadio, .androidCheck{
		margin: 10px 10px 10px 0;
		height: 45px;
		width: auto;
	}
	
	#buttonholder{
		margin-top: 30px;
		height: 80px;
	}

	.matrixcollegend{
		padding:20px 10px 20px 20px;
	}
	
	td.matrixcollegend span.qoption{
		font-size: 20px!important;
		line-height: 30px!important;
		padding: 5px;
	}
	
	#warning {
		font-size: 28px;
		min-width: 50%;
		-webkit-transform:translateZ(1px);
		-moz-transform:translateZ(1px);
		-o-transform:translateZ(1px);
		transform:translateZ(1px);
	}

	.pbar {
		width: 50% !important;
		height: 1.25em !important;
		border-width: 2px !important;
		line-height: 20px!important;
	}

	.pbarinner {
		height: 1.25em !important;
	}
	
	#footer{
		position: relative;
		bottom: 0;
		margin: 50px auto;
		text-align: center;
		width: 99%;
		background-size: cover;
	}
		
	table{
		width:100%;
	}
	
	table.sliderTable td .sliderbox{
		float:left;
		width: 120px;
		text-align: center;
		margin-left: 42%;
		margin-top: 40px;
	}
	
	td.slideroption{
		padding: 50px;
	}
	
	.npscontainer{
		border: none;
	}
	
	input[type=submit] {
		height: 100px !important;
		min-width: 100px !important;
		width: auto;
		background-size: contain;
		font-size: 30px;
		line-height: 40px;
		padding: 5px;
	}
	
	.netigatetexbox, .netigatetextarea, .totalSum {
		min-width: 50%;
	}
	
	.netigateimg{
		height: auto;
	}
	
	.footertext, .footlink, a.footlink, #footertext, #footertext a, #footlink, #footerlogo, #tagline{
		font-size: 20px!important;
		line-height: 25px!important;
	}
	
	#main{
		overflow:auto!important;
	}
}


/* iPads (portrait) ---------------------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
	/* YOUR STYLES */
}


/* iPads (landscape) --------------------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
	/* YOUR STYLES */
}


/* iPad Retina (iPad 3; portrait and landscape) ------------ */
@media
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min--moz-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min-resolution: 2dppx) {
	/* YOUR STYLES */
}


/* --------------------------------------------------------- */
/* COMPUTERS / OTHER DEVICES ------------------------------- */
/* --------------------------------------------------------- */


/* Displays/Screens (e.g. MacBook @ 1280x800) -------------- */
@media
only screen and (min-width: 1250px) and (max-width: 1409px) {
	/* YOUR STYLES */
}


/* Displays/Screens (e.g. 19" WS @ 1440x900) --------------- */
@media
only screen and (min-width: 1410px) and (max-width: 1649px) {
	/* YOUR STYLES */
}


/* Displays/Screens (e.g. 22" WS @ 1680x1050) -------------- */
@media
only screen and (min-width: 1650px) and (max-width: 1889px) {
	/* YOUR STYLES */
}


/* Displays/Screens (e.g. 24" WS @ 1920x1080) -------------- */
@media
only screen and (min-width: 1890px) and (max-width: 2529px) {
	/* YOUR STYLES */
}


/* Really Large Displays/Screens (e.g. 2560x1440) ---------- */
@media
only screen and (min-width: 2530px) {
	/* YOUR STYLES */
}