/*

	Public CSS

	Contains styles for everything in the Public part (the survey answering).
	Some of them can be overridden by the users' stylesheets.

	Lastly some things can be overridden by the accessibility settings.

*/

div {
    padding: 0px;
    margin: 0px;
}


/* v DEBUG v */
/*table 
{
	border: 1px solid #000;
	border-spacing: 5px;
}

td 
{
	border: 1px solid blue;
}

th 
{
	border: 1px solid red;
}*/
table {
    border: 0;
}

.question td, th {
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
    padding-bottom: 3px;
}
/* ^ DEBUG ^ */


/* Label hiding for visual browsers, but not aural */
label.hide {
    position: absolute;
    left: -1050em;
    width: 1px;
    overflow: hidden;
}

.accessabilitytext {
    font-size: 1em;
}

#accessibility {
    width: 90%;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}

    #accessibility fieldset {
        padding: 0;
    }

#footer {
    padding: 1px;
    clear: both;
    text-align: center;
    /*background-color: #ddd;*/
    font-family: Verdana;
    font-size: 10px;
    color: #9D9DA1;
}

    #footer a {
        font-family: Verdana;
        font-size: 10px;
        font-style: normal;
        font-weight: normal;
        color: #9D9DA1;
    }

#divNavigationButtons {
    float: right;
}

.panLogin {
    padding: 35px;
}

div.extraAlternative {
    margin-top: 10px;
}

input {
    font-size: 1.0em;
    /* WCAG*/
    /*font-size: 11px;*/
    font-family: Verdana;
}

#topmenu {
    margin-top: 10px;
    margin-bottom: 10px;
}

    #topmenu ul {
        margin-top: 0;
        padding-top: 0;
    }

    #topmenu li {
        display: inline;
        float: right;
        margin-right: 15px;
    }

    #topmenu input.image {
        vertical-align: middle;
    }

    #topmenu input, .link {
        vertical-align: middle;
        text-decoration: none;
        color: inherit;
        font-family: Verdana;
        font-size: 1.0em;
        /*WCAG:*/
        /*font-size: 12px;*/
        border: 0;
        background: transparent;
        width: auto;
        overflow: visible;
        padding: 0;
        margin: 0;
        cursor: pointer;
        color: #000;
    }

.sliderhandle {
    position: absolute;
    width: 20px;
    height: 22px;
}

/* These are used in SliderHelper.js */
.sliderrail {
    position: relative;
    height: 20px;
    width: 350px;
    background: url(../../gfx/slider/background_slider.gif) repeat-x;
}

.sliderrailvert {
    position: relative;
    height: 350px;
    width: 20px;
    background: url(../../gfx/slider/background_slider_vert.gif) repeat-y;
}

.sliderrail_disabled {
    position: relative;
    height: 20px;
    width: 350px;
    background: url(../../gfx/slider/background_slider_disabled.gif) repeat-x;
}

.sliderrailvert_disabled {
    position: relative;
    height: 350px;
    width: 20px;
    background: url(../../gfx/slider/background_slider_vert_disabled.gif) repeat-y;
}




.sliderDiv {
    width: 75%;
}

/*

	Overridable by user stylesheet

*/

body {
    font-size: 1em;
    margin: 0;
    height: 100%;
    background-color: #fff; /* Overridden */
}

html {
}

/* Container around everything (survey + footer) */
#container {
    /*
	min-width isn't supported by IE6
	min-width is specified in web.config
	*/
    min-width: 400px;
    position: relative;
    width: 75%; /* Overridden */
    /* TODO: Needs to be cross-browser, IE6 too */
    /* Can be placed to the left, in the middle or to the right */
    /* User can also choose to further offset the content with left/top */
    margin-left: auto; /* Overridden */
    margin-right: auto; /* Overridden */
    left: 0px; /* Overridden */
    /*top: 0px;	*/ /* Overridden */
}

/* Container around survey */
#survey {
    /*padding-left: 10px;*/
    min-height: 400px; /* Overridden */
    /* fast ie6 hack =) */
    height: auto !important;
    height: 400px;
    /* end of fast ie6 hack =) */
    border: solid 1px #000000; /* Overridden */
    background-color: #fff; /* Overridden */
    background-image: url(''); /*   |		  */
    background-repeat: no-repeat; /*   |        */
    background-position: center; /*   V        */
    margin-top: 10px; /* Overridden */
}

.translucent {
    display: none;
}

#panDefault {
    margin-right: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
}

div.question {
    margin-bottom: 30px; /* Overridden, margin below each question */
    display: block;
}

/* These get one definition each in the user style sheet */
.questionHeadline, .commentText, .text, .progressBarText {
    color: #000; /* Overridden */
    font-family: Verdana; /*   |		  */
    font-weight: normal; /*   |        */
    font-style: normal; /*   |        */
    font-size: 0.7em; /*   V        */
}

.inputs {
    color: #000;
    font-family: Verdana;
    font-weight: normal;
    font-style: normal;
    font-size: 0.7em;
    background-color: #fff;
}

/* Question text */
.questionHeadline {
    font-weight: bold;
    /*margin-bottom: 5px;*/
    display: block;
}

.userMessage {
    padding-top: 50px;
}

.commentText {
    font-style: italic;
}

/* Comments (!!! The actual survey object ones, or the ones inserted into questions, not extra alternatives !!!) */
div.comment {
    margin-top: 10px; /* Ov  ri  en  (same value) */
    margin-bottom: 10px; /*   er  dd                 */
}

/* Progress bar */
.progressBar {
    height: 26px;
    padding-right: 3px;
    font-size: 0.67em;
    text-align: right;
    color: #ff8000;
    line-height: 26px;
    background-color: #ff8000;
}

.progressBarBackground {
    float: left;
    width: 160px;
    padding: 2px 2px 2px 2px;
    height: 26px;
    background-color: #dddddd;
    border: solid 1px #000000;
}

.progressBarText {
    float: right;
    font-size: 0.67em;
    height: 26px;
    color: #000000;
    display: block;
    line-height: 26px;
    width: auto;
}

#panProgressbar {
    width: 200px;
    height: 26px;
    float: left;
}

#navbar {
    margin-top: 8px;
}

/* All links */
a {
}

/* all objects of type comment */
.objectComment {
    font-family: Verdana;
    font-size: 16px;
}

.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
    width: 100%;
    height: 100%;
}

.ajax__calendar td, th {
    padding: 0px;
}

.ajax__calendar_container {
    z-index: 2;
}

.questionNbr {
    vertical-align: top;
}

.basicQuestionAlternativeVAlign {
    vertical-align: top;
}

/*ipad-fix*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    .question-video {
        min-width: 500px;
        min-height: 400px;
    }

    .movie-dialog-main video {
        min-width: 500px;
        min-height: 400px;
    }
}