/* 
    Document   : 01.form.main
    Created on : May 13, 2013, 6:07:21 PM
    Author     : nms
    Description:
        Purpose of the stylesheet follows.
*/
@import url("/zahrah/resources/css/home/fontawesome/css/font-awesome.css");
@font-face {
    font-family: 'Terminal Dosis';
    font-style: normal;
    font-weight: 400;
    src: local('Dosis Regular'), local('Dosis-Regular'), url(/zahrah/resources/css/designer/font/Terminal-Dosis/Terminal-Dosis.woff) format('woff');
}
@font-face {
	font-family: 'icomoon';
	src:url('/zahrah/resources/css/home/iconmoon/icomoon.eot');
	src:url('/zahrah/resources/css/home/iconmoon/icomoon.eot?#iefix') format('embedded-opentype'),
		url('/zahrah/resources/css/home/iconmoon/icomoon.woff') format('woff'),
		url('/zahrah/resources/css/home/iconmoon/icomoon.ttf') format('truetype'),
		url('/zahrah/resources/css/home/iconmoon/icomoon.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    src: local('Lato Regular'), local('Lato-Regular'), url(/zahrah/resources/css/home/font-lato/lato.woff) format('woff');
}
@font-face {
    font-family: 'BebasNeueRegular';
    src: url('/zahrah/resources/css/login/fonts/BebasNeue-webfont.eot');
    src: url('/zahrah/resources/css/login/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
        url('/zahrah/resources/css/login/fonts/BebasNeue-webfont.woff') format('woff'),
        url('/zahrah/resources/css/login/fonts/BebasNeue-webfont.ttf') format('truetype'),
        url('/zahrah/resources/css/login/fonts/BebasNeue-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
/*CSS Reset*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}
html, body {
    margin: 0;
    padding: 0;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
fieldset, img {
    border: 0 none;
}
input {
    border: 1px solid #B0B0B0;
    color: #979797;
    padding: 3px 5px 4px;
}
address, caption, cite, code, dfn, th, var {
    font-style: normal;
    font-weight: normal;
}
ol, ul {
}
caption, th {
    text-align: left;
}
h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
}
q:before, q:after {
    content: "";
}
abbr, acronym {
    border: 0 none;
}
a {
    color:#4593E3;
    cursor: pointer;
    position: relative;
    text-decoration: none;
}

a:hover{
    color:#226FBE;
    
}
a:active{
    /*top:2px;*/
}
.noscriptalert{
    width:90%;
    margin: auto;
    position:absolute;
    z-index: 5000;
    left: 0;
    top:50%;
    text-align: center;
    font-size: 24px;
    margin: 0 5%;
    background: white;
}
.noscriptalert div{
    font-size: 24px;
    font-weight: bolder;
}
html,body{
    background: url("/zahrah/resources/images/login/bg.jpg") repeat scroll left top #FFFFFF;
    margin:0px;
    padding:0px; 
    overflow-y: hidden;  
    overflow-x: hidden;
    color: #333333;
    font-family: 'BebasNeueRegular',Arial,sans-serif;
    height: 100%;
    width:100%;
}
#designModeIndicator{
    float:right;
    position: absolute;
    top:0;
    right:0;
    color:white;
    background-color:#1A5978;
    background: rgb(26, 89, 120);
    filter: alpha(opacity=59.8);
    -moz-opacity:0.598; 
    opacity: 0.598;
    padding: 5px 15px;
    font-size: 30px;
    z-index: 300;
}
.centerIndicator{
    float:none !important;
    position:relative !important;
    width:50%;
    text-align: center;
    display: inline-block;
    margin-left: 50px;
    
}

.DD_MASK{
        display: none;
        position: absolute;
        z-index: 1000;
        width:100%;
        height: 100%;
        top:0;
        left:0;
        background: white;
    }
#Super-Zahra-Form-Body-Container{
    float:left;
    clear:both;
    width: 100%;
    height:100%;
}
#Super-Zahrah-Mask-Container > #sz-loading-icon-container{
    margin: auto;
    font-size: 70px;
    text-align: center;
    width:100%;
    margin-top: 14%;
}
#Super-Zahrah-Mask-Container > #sz-loading-text{
    width:100%;
    font-size: 70px;
    text-align: center;
}
#Super-Zahrah-Mask-Container{
    width:100%;
    height:100%;
    background: white;
    opacity: 0.5;
    filter:alpha(opacity=50); /* For IE8 and earlier */
    z-index: 500;
    position:absolute;
    top:30px;
    left: 0;
}
.menu-toggle-button:hover,.menu-toggle-button:hover a{
    background: white;
    color:black;
}
#mini-menu-toggle-container.sideBarExpanded{
    /*left:21% !important;*/
}
#mini-main-button-toggle-container{
    float: right;
    right:1%;
}
#mini-menu-toggle-container{
    float:left;
    left:1%;
}
#mini-menu-toggle-container,#mini-main-button-toggle-container{
    z-index:90;
    /*float: left;*/
    clear: none;
    height: 8%;
    overflow: visible;
    
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    -ms-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
    position: relative;
}
.menu-toggle-button{
    position:relative;
        background-color:#1A5978;
    background: rgb(26, 89, 120);
    filter: alpha(opacity=89.8);
    -moz-opacity:0.898; 
    opacity: 0.898;
    border-radius: 50%;
    color: whitesmoke;
        -webkit-box-shadow: 3px 0px 5px rgba(0,0,0,0.6);
    -moz-box-shadow: 3px 0px 5px rgba(0,0,0,0.6);
    box-shadow: 3px 0px 5px rgba(0,0,0,0.6);
    	speak: none;
	font-weight: bold;
	cursor: pointer;
        padding:5px 10px;
        margin: 15px 10px;
        float: left;
}
.menu-toggle-button a{
 color:white;   
}
.menu-toggle-button:hover i{
    color:black;
}
.menu-toggle-button:active{
      -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none; 
    top:2px;
}
.menu-toggle-button i {
font-size: 24px;
position: relative;
/*top:1px;*/
left:-1px;
color:white;
}
#sidebar-navigation-menu.sideBarExpanded{
        width: 20% !important;
}
#sidebar-navigation-menu{
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    width: 0%;
    background-color:#1A5978;
    background: rgb(26, 89, 120);
    filter: alpha(opacity=89.8);
    -moz-opacity:0.898; 
    opacity: 0.898;
    font-family: 'Lato',Calibri,Arial,sans-serif;
    float:left;
    -webkit-box-shadow: 3px 0px 5px rgba(0,0,0,0.6);
    -moz-box-shadow: 3px 0px 5px rgba(0,0,0,0.6);
    box-shadow: 3px 0px 5px rgba(0,0,0,0.6);
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=90, Color='#ABABAB')";
    height: 95%;
    z-index: 100;
    position: relative;
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    -ms-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}
.isz_close{
       display:none;
    float:right;
    font-size: 36px;
    clear: both;
    padding: 5px 7px 0 0;
    cursor: pointer;
    overflow: hidden;
    height:35px;
}
#sz-super-general-info-container.sideBarExpanded{
    left:20% !important;
}
#sz-super-general-info-container{
    background: none repeat scroll 0 0 #E1F0FA;
    box-shadow: 0 0 0px 0px rgba(105, 108, 109, 0.698), 0 0 40px 90px rgba(208, 223, 226, 0.6) inset;
    height:90%;
    width:80%;
    z-index: 100;
    position: absolute;
    left:0%;
    top: 0px;
    border: 0px solid #143D52;
    border-top-width: 2px;
    border-bottom-width: 2px;
    width:0;
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    -ms-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}
#sz-general-info-content{
    float:left;
    width:100%;
    clear:both;
    overflow-y: auto;
    display:none;
}
.sideBarExpanded.info-containerOpened{
    width:79% !important;
}
.info-containerOpened{
    width:99% !important;
    border-left-width: 9px !important;
    border-right-width: 9px !important;
}
.sz-info-snippet-container{
    float:right;
    width:98%;
    clear:both;
    font-family: 'Lato',Calibri,Arial,sans-serif;
    font-size: 16px;
    font-weight: 400;
    text-align: justify;
    margin: 15px 1%;
}
#super-form-sections-container.sideBarExpanded{
    width:76% !important;
}
#super-form-sections-container{
    width:96%;
    padding:0 2%;
    position:relative;
    float:left;
    height: 87%;
    overflow-y: auto;
    overflow-x: visible;
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    -ms-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}
#super-forms-footer-container{
    float:left;
    clear:both;
    background-color:#1A5978;
    background: rgb(26, 89, 120);
    height: 5%;
    width: 100%;
    border-top: 3px solid #143D52;
    filter: alpha(opacity=89.8);
    -moz-opacity:0.898; 
    opacity: 0.898;
}
#super-forms-footer-container #sz-notifier-text{
    color: white;
    font-size: 24px;
    padding: 0% 2%;
}
#sidebar-navigation-menu > h3{
    font-size: 1.8em;
    margin: 20px;
    font-weight: 300;
    color: #fff;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.05); 
    overflow:hidden;
}
#sidebar-menu-form-info-button{
    text-align: center;
    height: 80px;
    float:left;
    width:100%;
    border-radius: 25px 0px 0px 25px;
    margin-bottom: 20px;
    overflow: hidden;
    -webkit-transition: all 1000ms linear;
    -moz-transition: all 1000ms linear;
    -o-transition: all 1000ms linear;
    -ms-transition: all 1000ms linear;
    transition: all 1000ms linear;
}
#sidebar-menu-form-info-button a{
    color: #0A3348;
    width:100%;
    float:left;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
    text-transform: uppercase;
    font-weight: normal;
    font-size: 24px;
    margin: auto;
    padding: 20px 0px;
    -webkit-transition: all 250ms linear;
    -moz-transition: all 250ms linear;
    -o-transition: all 250ms linear;
    -ms-transition: all 250ms linear;
    transition: all 250ms linear;
}
.sidebar-menu-form-info-button-selected{
    background: #143D52;
}
.sidebar-menu-form-info-button-selected a{
    color:white !important;
    font-size: 28px !important;
}
#sidebar-menu-form-info-button:hover a{
    color:white;
    font-size: 28px;
}
.side-bar-menu-toc {
    list-style: none;
    overflow-y: auto;
    max-height: 65%;
    float:left;
    width:100%;
}
.side-bar-menu-toc li a {
    display: block;
    color: #fff;
    font-size: 1.1em;
    padding: 20px;
    cursor: pointer;
    border-bottom: 1px solid #143D52;
    -webkit-transition: all 250ms ease-in;
    -moz-transition: all 250ms ease-in;
    -o-transition: all 250ms ease-in;
    -ms-transition: all 250ms ease-in;
    transition: all 250ms ease-in;
}
.side-bar-menu-toc li a:hover,
.side-bar-menu-toc li.menu-toc-current a{
    background: #143D52;
}
.form-section-body{
    float:left;
    clear: both;
    margin: 15px 0;
    width:100%;
}
.emptyFormSectionMessage{
    font-size: 24px;
    padding-left: 24px;
}
.form-section-buttons{
    float:left;
    clear:both;
    width:80%;
    margin: 0px 10%;
    padding: 35px 0px;
    height: 130px;
    position: relative;
}
.form-section-container{
    float:left;
    clear:both;
    width:100%;
    display:none;
}
#section-intro h4{
    width:90%;
    float:left;
    clear:both;
    margin: 2% 5%;
}
#section-intro #intro-content,#section-final #sz-form-final-page-content{
    width:90%;
    float:left;
    clear:both;
    margin: 0 5%;
    font-family: 'Lato',Calibri,Arial,sans-serif;
    font-size: 14px;
    font-weight: 400;
    text-align: justify;
}
h3{
    margin:10px 30px;
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 45px;
    color: #7cbcd6;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
    float:left;
    clear:both;
    width:90%;
    overflow:hidden;
}
h3 span{
    color:#1A5978;
    color: rgba(26,89,120,0.9);
    text-shadow: 0px 1px 1px rgba(255,255,255,0.8);
}
h3:after{
    content: ' ';
    display: block;
    width: 100%;
    height: 2px;
    margin-top: 1px;
    background: -moz-linear-gradient(left, rgba(147,184,189,0) 0%, rgba(147,184,189,0.8) 20%, rgba(147,184,189,1) 53%, rgba(147,184,189,0.8) 79%, rgba(147,184,189,0) 100%); 
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(147,184,189,0)), color-stop(20%,rgba(147,184,189,0.8)), color-stop(53%,rgba(147,184,189,1)), color-stop(79%,rgba(147,184,189,0.8)), color-stop(100%,rgba(147,184,189,0))); 
    background: -webkit-linear-gradient(left, rgba(147,184,189,0) 0%,rgba(147,184,189,0.8) 20%,rgba(147,184,189,1) 53%,rgba(147,184,189,0.8) 79%,rgba(147,184,189,0) 100%); 
    background: -o-linear-gradient(left, rgba(147,184,189,0) 0%,rgba(147,184,189,0.8) 20%,rgba(147,184,189,1) 53%,rgba(147,184,189,0.8) 79%,rgba(147,184,189,0) 100%); 
    background: -ms-linear-gradient(left, rgba(147,184,189,0) 0%,rgba(147,184,189,0.8) 20%,rgba(147,184,189,1) 53%,rgba(147,184,189,0.8) 79%,rgba(147,184,189,0) 100%); 
    background: linear-gradient(left, rgba(147,184,189,0) 0%,rgba(147,184,189,0.8) 20%,rgba(147,184,189,1) 53%,rgba(147,184,189,0.8) 79%,rgba(147,184,189,0) 100%); 
    overflow:hidden;
}