/* ----------- My Form ----------- */
.myform
    {
        margin:0 auto; width:80%; padding:14px; 
        font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
        font-size:12px;
    }

.myform fieldset 
    {
	   border:1px solid #ddd; padding:0 0.5em 0.5em;   
    }
    
.myform legend 
    {
	   color:#0b77b7; font-size:1.1em;
    }
    
.myform legend span 
    {
	   width:10em; text-align:right; 
    }

.myform p, h1, form, button
    {
        border:0; margin:0; padding:0;
    }

.myform .spacer
    {
       clear:both; height:10px;
    }
    
/* ------------ Form Class -------------- */

#stylized .todaysdate
    {
        float:left;   
        font-size:12px;
        padding:4px 2px;
        width:200px;
        margin:2px 0px 20px 10px;
        color:#666666;
        font-weight:normal; 
    }
    
    
#stylized .desc 
    {
        color:#666666;
        display:block;
        font-size:11px;
        font-weight:normal;
    }

#stylized .desclong 
    {
        color:#666666;
        display:table-row;
        font-size:11px;
        font-weight:normal;
    }
    
    
#stylized .valmes
    {      
        color:#84B02C;
        font-size:11px;
        font-weight:normal;
        text-align:left;  
        position:relative;
        right:-230px; 
        top:-20px;
    }
    
#stylized input[type="radio"] + span {
    top:0px !important;
}

#stylized input[type="radio"] {
    margin:0px !important;
    width: 10%;
}

#stylized input[type="radio"] ~ label{
    /* width: auto !important; */
    /* width: 50em; */
    width: 75%;
}

#stylized .radio {
    margin:6px 0px 0px 0px; 

}
#stylized .radio input
{
    clear:left;
    float:left;
    /* width:32px;  */
    width: 14% !important;
    margin-right: 1em !important;
    margin:6px 0px 0px 0px; 
}

#stylized .radio dt
{
    width: 20% !important;
    margin-bottom: 1em;
    padding: 0;
}
#stylized .radio dd
{
    width: 79% !important;
}




#stylized input[type="checkbox"] + span {
    top:0px !important;
}

#stylized input[type="checkbox"] {
    margin:0px !important;
    width: 10%;
}

#stylized input[type="checkbox"] ~ label{
    /* width: auto !important; */
    /* width: 50em; */
    width: 75%;
}




/* ----------- Stylized Form Contents  ----------- */
#error 
    {
       margin:0px 2px 15px 2px;
       padding:1px 4px;
       border: 1px solid #cd0000;
       background-color: #cd0000;
       font-size:13px;
       color:#fffffd;
    }
    
#error ul
    {
	   list-style: square;
	   padding: 5px;
	   font-size: 11px;
    }

#error ul li
    {
    	list-style-position: inside;
    	line-height: 1.6em;
    }

#error ul li strong
    {
	color: #fffffd; /* #e46c6d;*/
    }

#error.valid ul li strong
    {
	color: #93d72e;
    }

#confirmation 
    {
       margin:0px 2px 15px 2px;
       padding:8px 10px;
       border: 0px solid #cd0000; 
       background-color: #5F93B7;
       font-size:13px;
       color:#fffffd;
    }
    

#stylized
    {
        border:solid 2px #b7ddf2;
        background:#ebf4fb;
    }

#stylized h1 
    {
        font-size:14px;
        font-weight:bold;
        margin-bottom:8px;
    }
    
#stylized p
    {
        font-size:11px;
        color:#666666;
        margin-bottom:20px;
        border-bottom:solid 1px #b7ddf2;
        padding-bottom:10px;
    } 

#stylized dl {position:relative; line-height:1em;}
#stylized dt {clear:left; float:left; width:200px; padding:4px 0 2px 0; text-align:left;}
#stylized dd {float:left; width:220px; margin:0 0 0px 0; padding-left:6px;}

#stylized .guidelines {
	
	float:left; 
	width:400px; 
	padding:4px 0 2px 0;
	 text-align:left;
 color:#666666;
     
        font-size:11px;
        font-weight:normal;	
}

#stylized label
    {
        display:block;
        font-weight:bold;
        text-align:left;
        width:190px;
        float:left;

    } 

#stylized .indent 
    {       
     	text-indent:60px;
    }
        
#stylized input
    {
        float:left;
        font-size:12px;
        padding:4px 2px;
        border:solid 1px #aacfe4;
        width:200px;
        margin:2px 0 0px 10px !important;
    }
    
#stylized input.error
    {
        background: #f8dbdb;
	    border-color: #e77776;
    }

#stylized text.error
    {
        background: #f8dbdb;
	    border-color: #e77776;
    }
#stylized text
    {
        float:left;
        font-size:12px;
        padding:4px 2px;
        width:200px;
        margin:0px 0 00px 10px;
        color:#666666;
        font-weight:normal; 
    }
    
#stylized select
    {
        float:left;
        color:#666666;
        font-size:12px;
        padding:4px 2px;
        border:solid 1px #aacfe4;
        width:200px;
        margin:2px 0 0px 10px;
    }

#stylized textarea
    {
        float:left;
        color:#666666;
        font-size:12px;
        padding:4px 2px;
        border:solid 1px #aacfe4;
        width:200px;
        margin:2px 0 0px 10px;
        font-weight:normal; 
    }
    
    
#stylized .button
    {
        float:right;
	margin-top:1em;
        width:136;
        height:26px;
        background:#666666 /*url(img/button.png) no-repeat*/;
        text-align:center;
        line-height:31px;
        color:#FFFFFF;
        font-size:11px;
        font-weight:bold;
     }

#stylized .longbutton
{
        width:150px;
	margin-top:1em;
	float:right;   
        height:26px;
        background:#666666;
        text-align:center;
        line-height:31px;
        color:#FFFFFF;
        font-size:11px;
        font-weight:bold;
}



#stylized .file
   {
	border:solid 10px;      
   }

/*#stylized dd {float:left; width:120px; margin:0 0 0px 0; padding-left:6px;}*/



.summary dt {
    width: 300px !important;
}

.summary dl {
    line-height:0;
    
}

.summary label {
    width: 300px !important;
}

.summary text {
    padding: 0;
}

.control_file {
    height:400px;
    overflow-y: scroll;
    font-family: monospace;
    background:#EEEEEE;
}
/* ----------- Javascript - CSS ----------- */


.form_with_navigation {
    display: flex;
    justify-content:space-around;
    align-items: flex-start;
}

.navigation_panel {
    position:sticky;
    top: 10px;
    font-size: small;

    border: solid 2px #b7ddf2;
    background: #ebf4fb;
    padding:10px 10px 10px 20px;
    margin-left: 10px;
}

.navigation_panel .title {
    white-space: nowrap;
    padding-bottom: 1em;
    display:block;
}

.form_with_navigation .myform {
    flex-grow: 1;
}