﻿/*  Stylesheet for Philadelphia Insurance Companies
--------------------------------------------------------
File Name: phly_main.css
Media: Screen
-------------------------------------------------------- */ 
    
    
    
    
/*  --------------------------------------------------------------------------- 
    STANDARD HTML DOCUMENT ELEMENTS
    --------------------------------------------------------------------------- */
    * 
        {   margin: 0px; 
            padding: 0px; }
    
    body
        {   background: #e9eef6;
			text-align: center; 
			width: 700px;
            color: Navy; 
            margin: auto; 
            font-family: Arial, Helvetica, sans-serif; }
    body .bodyCertificate
    {
        height:800px;
        width:600px;
    }

/*  --------------------------------------------------------------------------- 
    STANDARD HTML FORM ELEMENTS
    --------------------------------------------------------------------------- */    
    
    label 
        {   font-size: 11px; 
            color: Navy; 
            border: 0px; 
            padding: 10px; }
    p
		{	text-align:left;
			padding: 20px; }
			
			
/*  --------------------------------------------------------------------------- 
    STANDARD HTML LIST ELEMENTS
    --------------------------------------------------------------------------- */    
    
    ul 
        {   list-style-type:square;
			text-align:left;
			margin-left: 35px;	 }
    

/*  --------------------------------------------------------------------------- 
    CUSTOM FORM ELEMENTS
    --------------------------------------------------------------------------- */
    .TitleLabel    
		{   font-size: 18px; 
            color: Navy;
            font-weight:bolder;
            padding: 25px;
            margin: 50px;  }
     .QuestionNumberLabel    
		{   font-size: 16px;
			text-align:left; 
            color: Navy;
            font-weight:bold;
            padding: 0px;  }      
    .inputboxwithbutton  
        {   border: 1px solid #3366cc; 
            margin: 4px 0px 0px 0px; 
            padding: 0px 0px 0px 5px; 
            background-color: #ffffff; }
    .inputboxbutton /* Button with an inputbox next to it */ 
        {   margin: 0px 0px 0px 3px; 
            padding: 0px; 
            vertical-align: bottom; 
            border: none; }    
    .selectboxbutton    /* Button with a selectbox next to it */
        {   margin: 2px 0px 0px 0px; 
            padding: 0px; 
            vertical-align: top; 
            border: none; } 
      

    /*  Span Elements
        ------------------------------- */                                  
       
        span.required
            {   color: #FF0000; }
        span.errormsg
            {   color: #FF0000; }
        span.success
            {   color: #FF0000; }
        span.message
            {   color: #000000; 
                font-size: 13px; }        
        span.label
            {   font-weight: bold; }
        
  /*  --------------------------------------------------------------------------- 
    STANDARD HTML TABLE ELEMENTS
    --------------------------------------------------------------------------- */    
    table 
        {   width: 100%; 
            margin: 5px 0px 15px 0px;  
            font-size: 11px; 
            border-collapse:collapse;  
            border-top: 1px dashed #3366cc; 
            border-right: 2px solid #3366cc; 
            border-bottom: 1px dashed #3366cc; 
            border-left: 2px solid #3366cc; }
    table a 
        {   text-decoration: none; }
    table a:hover
        {   text-decoration: underline; }
    th 
        {   padding: 5px 5px 5px 5px; 
            text-align: left; 
            color: #3366cc; 
            border-bottom: 4px double #c7d1c6; 
            background: #ffffff; 
            vertical-align: bottom; }
    
    td      
        {   padding: 2px 7px 2px 7px; 
            text-align: left; 
            border-bottom: 1px solid #c7d1c6; 
            background: #ffffff; }
    
   .Score   
		{   font-size: 16px;
			text-align:center; 
            color: Navy;
            font-weight:bold;
            padding: 0px;  }  
        
    .FailedSection p
    {
        text-align:center;
    } 
    .failedAnswers
    {
        width:700px;
        left:30px;
        text-align:center;        
    }
        .failedAnswers .answercol
        {
            float:left;
            width: 175px;
        }
        .failedAnswers .answercol ul 
        {
            list-style-type:none;
        }
            .failedAnswers .answercol ul .correct
            {
                color:green;
            }
            .failedAnswers .answercol ul .wrong
            {
                color:red;
            }
    .passAnswers
    {
        width:700px;
        left:30px;
        text-align:center;
        position:relative;
        padding-bottom:75px;
    }
        .passAnswers .answercol
        {
            float:left;
            width: 175px;
        }
        .passAnswers .answercol ul 
        {
            list-style-type:none;
        }
            .passAnswers .answercol ul .correct
            {
                color:green;
            }
            .passAnswers .answercol ul .wrong
            {
                color:red;
            }
    #driverCertificate
    {
        height:1024px;
        width:768px;
    }
        #driverCertificate .certificateImage
        {
            position:absolute;
            left:0px;
            top:0px;
        }
        #driverCertificate .certificateText
        {
            position:absolute;
            text-align:center;
            font-size:24px;
            font-weight:bold;
            left:180px;
            color:#000;
            padding-top:250px;
        }
            #driverCertificate .certificateText h1
            {
                font-size:24px;                
            }
            #driverCertificate .certificateText a
            {
                font-size:18px;       
                color:#02047E;
                font-weight:bold;         
            }
            #driverCertificate .certificateText .score
            {
                float:left;
                width:350px;
                text-align:center;
            }
            #driverCertificate .certificateText .date
            {
                float:left;
                width:350px;
            }

    .fields-container
    {
        margin: 0 auto;
        width: 170px;
        text-align: left;
        padding-left: 20px;
    }
    .fields-container label
    {
        text-align: center;
        display: block;
        font-size: 1em;
        padding: 6px 10px 2px 0;
    }
    .fields-container .validation-message
    {
        position: absolute;
    }
    .fields-container input[type=text], .fields-container textarea
    {
        width: 150px;
        text-align: left;
        display: inline-block;
    }