@font-face {
	font-family: 'MuseoSans300';
	src: url("fonts/MuseoSans/MuseoSans_300Web.eot"), url("fonts/MuseoSans/MuseoSans_300Web.woff") format("woff");
}

#divError {position:absolute;bottom:60px;color:red;}
.err td {background-color:pink!important;}
.dir_rtl {direction:rtl;}

body {font-size: 12pt;margin: 0px;padding: 0px;color: #454234;background: rgb(255, 255, 255);background-size: 100% auto;font-family: "MuseoSans300", Arial, Helvetica, sans-serif;font-weight:500;}
#header {height: 80px; background: #3FC1CC;}
#headerlogo {position:absolute;left:30px;top:12px;width:198px;height:48px;background: transparent url(images/sepulogo.png) no-repeat;}
#header .title, #title {display:none;}
#spnLogout a:link, #spnLogout a:hover, #spnLogout a:visited {color: #ffffff;position: absolute;right: 0;top: 0;font-size: 9px;display: inline-block;width: 50px;height: 50px;background: #393939 url(Images/logout.gif) no-repeat;padding-top: 34px;box-sizing: border-box;text-align: center;background-position: 5px 0;text-decoration: none;text-transform: uppercase;}

* {box-sizing:border-box;}
#divQuestions *::selection {background-color:transparent;}
h1 {margin:0;}

#divLoginForm {width:240px;padding:30px;margin-left:auto;margin-right:auto;background:#eee;border:1px solid #ccc;border-radius:5px;}
#divLoginForm input[type=text] {padding:4px;border-radius:5px;border:1px solid #a8a7a6;font-size:12pt;width: 180px;}
#divLoginForm input[type=button], 
#divLoginForm input[type=submit],
#confirmBox input[type=button],
#btnTimeoutOK {background:#00468E;padding:12px 20px;border:none;color:white;font-size:12pt;cursor:pointer;}
#divLoginBtn {margin-top:10px;}
#divLoginForm input:focus {outline:none;}

.spnLanguage a {background:#00468E;padding:8px 16px;color: #ffffff;cursor: pointer;text-decoration: none;margin-right: 12px;display: inline-block;margin-bottom: 10px;}
.divActivity {margin-bottom:10px;}

select {width:100%;font-size:12pt;}

#divQuestions {overflow-y:auto;padding-bottom:5px;}
.divPage 	{display:none;}
.surveyname	{margin-bottom:10px;}
.panel 		{padding:20px;margin-bottom:10px;}
.bold		{font-weight:bold;}
.blue 		{background:#B2C8DD;}
.yellow 	{background:#F3E6B4;}
/*.content 	{min-height:200px;}*/

.hide,.offscreen		{display:none;}


.pageName	{font-size:14pt;padding-bottom:15px;}
.pageDesc	{}

#moreArrow line {stroke:#999;stroke-width:5;stroke-linecap:round;}
		
.buttonbar 			{text-align:center;background:white;width:100%;margin-top:30px;}
.buttonbar svg		{opacity:0;transition:opacity 0.2s linear;margin-top:8px;}
/*.buttonbar.more svg	{opacity:1;}*/
.buttonbar.more.bottom svg {opacity:0;}
.navbtn				{cursor:pointer;font-size:18px;}
.buttonbar .navbtn	{padding:10px 20px;border:none;margin:5px;display:inline-block;color:white;}
.navbtn:hover	{text-decoration:underline;}
.navbtn.prev	{background:#024981;position:absolute;right:55%;}
.navbtn.next	{background:#024981;position:absolute;left:55%;}
.navbtn.finish 	{background:#008000;position:absolute;left:50%;transform:translateX(-50%);display:none;}
.navbtn.disable {color:#787878!important;text-decoration:none!important;cursor:default!important;}
		
.progress		{background:#bfbfbf;position:relative;height:20px;margin-top:2px;margin-bottom:30px;}
.iprogress		{display:inline-block;background:#024981;height:20px;}
.progress .val	{position:absolute;width:100%;text-align:center;color:white;font-size:14px;top:2px;display:none;}
		
.smalltext		{font-size:12px;line-height:1.1;display:inline-block;padding-top:10px;}

#divTimeout		{text-align:center;}
.buttons		{margin-top:10px;}
		
.container		{padding-bottom:50px;position:relative;overflow:hidden;}
.question		{width:100%;top:90px;bottom:50px;left:0;position:fixed;transition: all 0.2s linear;overflow:auto;transform-origin:top;padding:10px;}
.question.left	{left:-110%;transition: all 0.2s linear;}
.question.right	{left:110%;transition: all 0.2s linear;}
.question.moving {transform:scale(0.8);opacity:0.7;}
		
.page		{width:100%;display:block;}
.page.left	{display:none;}
.page.right	{display:none;}
.page.moving {transform:scale(0.8);opacity:0.7;}
.innerpage {margin:15px;margin-top:0;}
.innerpage .q {margin-bottom:20px;}
		
table		{width:100%;table-layout:fixed;border-spacing:1px;}
table.s		{border-spacing:1px 10px;}
table.h,
table.v,
table.d		{margin-bottom:20px;}
table.d th	{height:28px;}
td,th		{padding:5px;}
th			{background:#eaeaea;height:auto;}
tr td		{text-align:center;background:#FBDFB8;height:50px;}
tr td:first-child,
tr th:first-child {text-align:left;}
td.alt		{position:relative;}
td.alt.sel	{background:#E7BB7B;}
table.s td.alt		{position:relative;border:2px solid transparent;border-radius:5px;box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.4);}
table.s td.alt.sel	{background:#FFF;border-color:#7FA4C7;box-shadow:none;}
table.v label 	{height:auto!important;}
.throw th {font-weight:normal;}

.st,.qt		{padding:5px;}
.st {font-size:12px;}		
table.s .lbl	{text-align:center;font-weight:bold;font-size:12pt;}
		
.alt.a0 label,
.alt.a2 label	{width:100%;height:100%;position:relative;display:inline-block;left:0;top:0;cursor:pointer;}
.alt.a0 label	{padding:3px 3px 3px 30px;}
.alt.a2 label   {padding:3px 30px 3px 30px;}
table.s .alt.a2 label,
table.s .alt.a0 label	{padding-right:30px;}
.alt.a2 textarea {width:100%;border-radius:3px;border:1px solid #999;}
.alt.a2 textarea:focus {outline:none;}
		
.alt input:focus~.ctrl:before {background-color:#ddd!important;}
.alt input:disabled~.ctrl:before {background-color:#ccc!important;}
.alt.s input:disabled~.ctrl:after {background-color:#666!important;}
.alt.m input:disabled~.ctrl:after {color:#666!important;}
		
td.alt .ctrl {display:inline-block;position:absolute;left:0;top:0;width:100%;height:100%;}
table.s .ctrl {display:none;}
		
div.ctrl:before,
div.ctrl:after		{content:"";display:block;position:absolute;font-family:FontAwesome;}
div.ctrl:after		{transition:transform 0.2s linear;}
		
/*Radio button*/
.alt.a0.s .ctrl:before,
.alt.a2.s .ctrl:before	{width:20px;height:20px;top:50%;background:#fff;border:1px solid #666;border-radius:50%;}
.alt.a0.s .ctrl:after,
.alt.a2.s .ctrl:after 	{width:14px;height:14px;top:50%;background:#000;border-radius:50%;}
		
/*Checkbox*/
.alt.a0.m .ctrl:before,
.alt.a2.m .ctrl:before	{width:20px;height:20px;top:50%;background:#fff;border:1px solid #666;border-radius:3px;}
.alt.a0.m .ctrl:after,
.alt.a2.m .ctrl:after	{content:'\F00C';display:block;width:14px;height:14px;top:50%;}
		
		
/*AltType 0 - Single choice*/
table.h td.alt.a0.s	.ctrl:before {left:50%;transform:translateX(-50%) translateY(-50%);}
table.h td.alt.a0.s .ctrl:after  {left:50%;transform:translateX(-50%) translateY(-50%) scale(0);}
table.h td.alt.a0.s.sel	.ctrl:after  {transform:translateX(-50%) translateY(-50%) scale(1);}
		
table.v td.alt.a0.s	.ctrl:before {left:3px;transform:translateY(-50%);}
table.v td.alt.a0.s .ctrl:after  {left:7px;transform:translateY(-50%) scale(0);}
table.v td.alt.a0.s.sel	.ctrl:after  {transform:translateY(-50%) scale(1);}
		
	
/*AltType 0 - Multiple choice*/
table.h td.alt.a0.m 	.ctrl:before {left:50%;transform:translateX(-50%) translateY(-50%);}
table.h td.alt.a0.m 	.ctrl:after  {left:50%;transform:translateX(-50%) translateY(-40%) scale(0);}
table.h td.alt.a0.m.sel	.ctrl:after  {transform:translateX(-50%) translateY(-60%) scale(1);}
		
table.v td.alt.a0.m	.ctrl:before {left:3px;transform:translateY(-50%);}
table.v td.alt.a0.m .ctrl:after  {left:7px;transform:translateY(-40%) scale(0);}
table.v td.alt.a0.m.sel	.ctrl:after  {transform:translateY(-60%) scale(1);}
		
		
/*Text*/
.alt.a1 input 	{width:100%;border:1px solid #666;border-radius:2px;padding:4px;}
		
/*Radio with text*/
.alt.a2 input[type=text] {width:100%;border:1px solid #666;border-radius:2px;padding:4px;}
.alt.a2.s		.ctrl:before {left:3px;transform:translateY(-50%);}
.alt.a2.s 		.ctrl:after  {left:7px;transform:translateY(-50%) scale(0);}
.alt.a2.s.sel	.ctrl:after  {transform:translateY(-50%) scale(1);}
		
td.alt.a2 > div {position: absolute;left:35px;top:50%;transform: translateY(-50%);right:5px;}
		
/*Checkbox with text*/
td.alt.a2.m		.ctrl:before {left:3px;transform:translateY(-50%);}
td.alt.a2.m 	.ctrl:after  {left:7px;transform:translateY(-40%) scale(0);}
td.alt.a2.m.sel	.ctrl:after  {transform:translateY(-60%) scale(1);}
td.alt.a2.m input:not(:checked)+label>div>input {background:#EEE;color:#999;}
		
input[type=radio],input[type=checkbox] {margin:0;padding:0;opacity:0;z-index:-1;width:0;height:0;display:block;}


/*Udir spesial*/
#thanks           {margin-left:10px;margin-right:10px;}
#thankyou         {background-color:#E1E1E1;padding:10px;}
#thankyoutext     {background-color:#363636;color:white;font-size:10pt;font-weight:bold;padding:10px;}
#thankyoutext a	  {color:white;}
      
@media screen and (min-width:550px){
    #divFinish		{max-width:900px;margin-left:auto;margin-right:auto;}
    #thanks			{background-color:#363636;height:263px;position:relative;}
    #thankyou		{position:absolute;left:0;top:0;width:300px;margin:8px;}
    #thankyoutext	{position:absolute;left:320px;top:0;margin:0;}
}
/*@media screen and (max-width:780px) {
	#header		{display:none;}
	.question	{top:30px;padding-bottom:0;}
	tr td		{height:40px;}
	.innerpage	{margin-bottom:0;}
	table.v		{margin-bottom:0;}
	.navbtn.prev	{background:transparent;color:#000;left:0;right:auto;}
	.navbtn.next	{background:transparent;color:#000;right:0;left:auto;}
	.navbtn.finish 	{position:absolute;right:0;left:auto;}
	.buttonbar 		{position:fixed;bottom:0;height:50px;left:0;margin-top:0;}
}*/

#main.mobile #header		{display:none;}
#main.mobile .question	{top:30px;padding-bottom:0;}
#main.mobile tr td		{height:40px;}
#main.mobile .innerpage	{margin-bottom:0;}
#main.mobile table.v		{margin-bottom:0;}
#main.mobile .navbtn.prev	{background:transparent;color:#000;left:0;right:auto;}
#main.mobile .navbtn.next	{background:transparent;color:#000;right:0;left:auto;}
#main.mobile .navbtn.finish 	{}
#main.mobile .buttonbar 		{position:fixed;bottom:0;height:50px;left:0;margin-top:0;}


/* Leseweb */
#PAFTOOLBAR {display:none;}
#divReadText {height:1px;opacity:0;overflow:hidden;}
.readalts {font-size:smaller;cursor:pointer;margin-top:15px;padding:10px 0;}
.readalts.hide {display:none;}
div.q > .readalts {margin-top:0;}
#divQuestions.leseweb .pageName,
#divQuestions.leseweb table.h>tbody>tr.q>td:first-child,
#divQuestions.leseweb table.h>tbody>tr.throw>th,
#divQuestions.leseweb .pageDesc,
#divQuestions.leseweb .infoText,
#divQuestions.leseweb .st,
#divQuestions.leseweb .qt,
#divQuestions.leseweb div.throw {cursor:pointer;}

#divLoginInfo {float:left;padding:20px;width:350px;}
#divLoginWrapper {width:280px;float:left;padding:20px;}
#divLoginForm {width:240px;height:auto;padding:30px;background:#eee;border:1px solid #ccc;border-radius:5px;}

#divDownArrow {
	width: 80px;
    height: 80px;
    position: fixed;
    border: 1px solid #999;
    border-radius: 50%;
    right: 20px;
    bottom: 60px;
    background: #f9f67a;
    cursor: pointer;
    opacity: 0;
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.4);
    transition: opacity ease-in-out 0.2s;
    padding-left: 23px;
    padding-top: 16px;
    color: #000;
    font-weight: bold;
}

#divDownArrow.more {
	opacity: 0.7;
}
#divDownArrow.more.bottom {
	opacity: 0;
}

#divDownArrow > div {
    width: 19px;
    height: 19px;
    transform: rotate(45deg);
    top: 37px;
    position: absolute;
    left: 30px;
    border-bottom: 4px solid #000;
    border-right: 4px solid #000;
}

.errorMsg {color:red;}