﻿#buttonResetPanel
{
    background-image: url("../Pix/Layout/resetPanelButtonBackground.png");
    background-repeat: no-repeat;
    background-position: 7px 8px;
    background-color:transparent;
    margin-bottom:10px;
    position:relative;
    top:6px;
    border:0px;
    cursor:pointer;
    
    width: 35px;
    height: 35px;
    border-radius: 3px;
    background-color: #d66a00;
    }    

 #buttonResetPanel:hover
{
    background-color: #ee7f00;   
    }   
    
.buttonResetPanelLabel
{
    font-size: 0.8em;
    line-height: 1.3em;
    color: #606060;
    margin-left:15px;
    position:absolute;
    top:30px;
    }    
    


.applicationPanel
{
    min-width: 447px;
    max-width: 645px;
    background-color: #e8e6de;   
    }
    
.applicationPanel .box
{
    }
 
.applicationPanel .box .top
{
    height: 4px;
    }   


 
.applicationPanel .box .bottom
{
    height: 12px;    
    } 
    
.applicationPanel .box .headline
{
    font-size: 0.8em;
    line-height: 1.3em;
    color: #606060;
    font-weight:bold;
    margin-left:20px;
    position:relative;
    top:12px;
    }   
    
.applicationPanel .box .shell
{
    background-image: webkit-linear-gradient(white 0%, #e8e6de 100%);
    background-image: moz-linear-gradient(white 0%, #e8e6de 100%);
    background-image: o-linear-gradient(white 0%, #e8e6de 100%);
    background-image: linear-gradient(white 0%, #e8e6de 100%);
    
    min-width: 437px;
    max-width: 635px;
    
    margin:0px 5px 0px 5px; 
    }

.applicationPanel .content
{
    margin-left:20px;
    margin-right:20px;
    }
    
.applicationPanel .content .hint
{
    padding-top:12px;
    float:left; 
    width:100px;
    font-size: 0.8em;
    line-height: 1.3em;
    color: #606060;
    }  
    
.applicationPanel .content .line
{
    margin-bottom:30px;
    margin-top:20px;
    margin-right:0px;
    min-width: 160px;
    max-width: 610px;
    height:1px;
    border-bottom:1px solid #cccccc;
    }      


#chooser
{    
    min-width:200px;
    }

#chooser .letterChooser
{
    background-color: #ee7f00;
    margin-left:110px;
    padding-top:10px;
    padding-bottom:10px;
    }
    
#chooser .shellStep
    {
        width:90px;
        float:left;
        }
    
#chooser .letterChooser .shellStep label
{   
    display:inline-block;
    position:relative;
    top:62px;
    left:10px;

    transform: rotate(-90deg);
    transform-origin: 0 0;

    color: #ffffff;
    font-size:16px;
    font-weight:normal;

    }    
    
#chooser .letterChooser .shellStep .stepIndicator
{
    display:inline-block;
    position:relative;
    left:32px;
    top:-30px;
    font-family:Verdana;
    font-size:72px;
    font-weight:bold;
    color: #ffffff;
    }    


#chooser .letterChooser .box
{
    min-width:120px;
    max-width:375px;
    margin-left:100px;
    margin-right:10px;

    background-color: #ffffff;
    box-shadow: inset 2px 2px 7px 0px #cacaca; 
}



#chooser .letterChooser .content
{    
    line-height: 1em;  
    padding-top:10px;
    padding-bottom:6px;
    margin-left:10px;
    margin-right:0px;   
    }


#chooser .letterChooser .content .tile
{
    margin:0px; 
    margin-right:5px;
    margin-bottom:5px;
    float:left;
    display:inline-block;
    
    background-color: #d66a00;
    cursor:pointer;
    }
    
#chooser .letterChooser .content .tile:hover
{
    background-color: #ee7f00;  
    }       

#chooser .letterChooser .content .tile .letter
{
    font-family:PTSans-Reg;

    color:#FFFFFF;
    font-size:0.9em;
    display:table-cell;  
    width:35px;
    height:32px;
    text-align:center;
    vertical-align:middle;   

    }

#chooser .letterChooser.disabled 
{    
    background-color: #ff942c;
    }

#chooser .letterChooser.disabled .stepIndicator
{    

    }

#chooser .letterChooser.disabled .content .tile
{
    cursor:default;  
    background-color: #ff942c; 
    }    

#chooser .letterChooser.disabled .content .tile.active
{   
    background-color: #ee7f00;   
}

#chooser .keywordChooser
{    
    position:relative; 
    background-color: #ee7f00;
    margin-left:110px;
    padding-top:10px;
    padding-bottom:10px;
    
    height:65px;
}    


    
#chooser .keywordChooser .shellStep label
{ 
    display:inline-block;
    position:relative;
    top:60px;
    left:10px;

    transform: rotate(-90deg);
    transform-origin: 0 0;

    color: #ffffff;
    font-size:16px;
    font-weight:normal;

    }        
    
#chooser .keywordChooser .stepIndicator
{   
    display:inline-block;
    position:relative;
    left:32px;
    top:-32px;
    font-family:Verdana;
    font-size:72px;
    font-weight:bold;
    color: #ffffff;
    }    

#chooser .keywordChooser .sandglass
{
    position:absolute;
    top:8px;
    background-image: url("../../Pix/Layout/Sandglass.gif");    
    background-repeat: no-repeat;
    background-position: center center;
    width:100%;
    height:70px;
    display:none;
    }
    
#chooser .keywordChooser .box
{   
    min-width:120px;
    max-width:375px;
    margin-left:100px;
    margin-right:10px;  

    background-color: #ffffff;

    border:1px solid #854200;

    }
    
#chooser .keywordChooser .content
{        
    margin-left:0px; 
    margin-right:0px;
    height:inherit; 
    width:inherit;     
    overflow:hidden;

}

#chooser .keywordChooser .content .alignment
{

    height:inherit;
    width:inherit;
    vertical-align:middle;    
    line-height: 1em;  
    }

#chooser .keywordChooser .content select
{
   width:100%;
   padding:20px;
   min-width:150px; 
   font-size:1.1em;
    }  


#chooser .keywordChooser.disabled 
{        
    background-color: #ff942c;  
}

#output
{
    min-width:200px;
    max-width:615px;       
    font-size:0.8em;
    line-height:1.2em; 
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;                                 
    display:none;
    margin-bottom:-15px;
    margin-right:0px;

    }

#output .note
{
    margin-bottom:10px;
    color: #515151;
    }
    
#output .line
{
    margin-bottom:15px;
    margin-top:25px;
    margin-right:0px;
    min-width: 160px;
    max-width: 610px;
    height:1px;
    border-bottom:1px solid #cccccc;
    }     

#output .information
{    
    }

#output .information .header
{
    margin-bottom: 15px;
    background-color: #ee7f00;
    }

#output .information .header .centerLeft
{
    }

#output .information .header .centerRight
{
     height: 29px;
    }
    
#output .information .header .content
{
    display:table-cell;
    text-align:center;
    vertical-align:middle;
    color: #FFFFFF;
    height:inherit;
    padding-left:10px;
    }    
    
#output .information .doubleColumn .box
{    
    margin-right:0px;
    margin-bottom:15px;
  
    }    

#output .information .doubleColumn .box .topLeft
{
    background-image: url("../Pix/Layout/InformationDoubleColumnBoxTopLeft.png");
    background-repeat: no-repeat;
    background-position: top left; 
      
    }

#output .information .doubleColumn .box .topRight
{
    height: 15px;
    background-image: url("../Pix/Layout/InformationDoubleColumnBoxTopRight.png");
    background-repeat: no-repeat;
    background-position: top right;  
    }

#output .information .doubleColumn .box .centerLeft
{
    background-image: url("../Pix/Layout/InformationDoubleColumnBoxCenterLeft.png");
    background-repeat: repeat-y;
    background-position: left;
    background-color:transparent;
    border:0px;  
    }

#output .information .doubleColumn .box .centerRight
{
    background-image: url("../Pix/Layout/InformationDoubleColumnBoxCenterRight.png");
    background-repeat: repeat-y;
    background-position: right;
    background-color:transparent;
    border:0px;  
    }

#output .information .doubleColumn .box .bottomLeft
{
    background-image: url("../Pix/Layout/InformationDoubleColumnBoxBottomLeft.png");
    background-repeat: no-repeat;
    background-position: bottom left;  

    }

#output .information .doubleColumn .box .bottomRight
{
    height: 15px;
    background-image: url("../Pix/Layout/InformationDoubleColumnBoxBottomRight.png");
    background-repeat: no-repeat;
    background-position: bottom right;
    }
    
#output .information .doubleColumn .box .rightColumn
{
    float:right;       
    margin-top:-15px;
    margin-bottom:-15px;
    }
    
    
#output .information .doubleColumn .box .rightColumn .box
{
    width:199px;
    margin-bottom:15px;
    
    background-color: #ffffff;
    border-radius: 8px; 
    }
    
 #output .information .doubleColumn .box .rightColumn .box:last-child
 {
     margin-bottom:0px;
     }   

#output .information .doubleColumn .box .rightColumn .box .top
{
    height: 15px;
    
    }

#output .information .doubleColumn .box .rightColumn .box .center
{
   
    }

#output .information .doubleColumn .box .rightColumn .box .bottom
{
    height: 15px;
    
    } 
    
#output .information .doubleColumn .box .rightColumn .content
{
    padding: 0px 10px 0px 10px;
    margin:0px;

    }            

#output .information .doubleColumn .box .rightColumn .content img
{
    margin-top:0px;
    margin-bottom:10px;
    width:120px;
    height:120px;  
    display:block;
    margin-left:auto;
    margin-right:auto;
    } 
    
#output .information .doubleColumn .box .rightColumn .content .caption
{
    text-align:center;
    line-height:1.3em;
    overflow:hidden;  
    }     

#output .information .doubleColumn .box .rightColumn .content h3
{
    font-family:PTSans-Bold;
    font-size: 1em;
    color: #ee7f00;  
    }

#output .information .doubleColumn .box .rightColumn .content p
{
    line-height:1.3em;
    overflow:hidden;
    letter-spacing:0.02em;
    }    

#output .information .doubleColumn .box .leftColumn
{
    margin-right:210px;
    
    }         
    
#output .information .doubleColumn .box .leftColumn .content
{
    padding: 0px 10px 0px 0px;
    } 
    
    
/* Information singleColumn */

#output .information .singleColumn .box
{    
    margin-bottom:15px;   
    margin-right:0px;   
    }    

#output .information .singleColumn .box .topLeft
{
    background-image: url("../Pix/Layout/InformationSingleColumnBoxTopLeft.png");
    background-repeat: no-repeat;
    background-position: top left; 
      
    }

#output .information .singleColumn .box .topRight
{
    height: 15px;
    background-image: url("../Pix/Layout/InformationSingleColumnBoxTopRight.png");
    background-repeat: no-repeat;
    background-position: top right;           
    }

#output .information .singleColumn .box .centerLeft
{
    background-image: url("../Pix/Layout/InformationSingleColumnBoxCenterLeft.png");
    background-repeat: repeat-y;
    background-position: left;    
    border:0px;
    }

#output .information .singleColumn .box .centerRight
{
    background-image: url("../Pix/Layout/InformationSingleColumnBoxCenterRight.png");
    background-repeat: repeat-y;
    background-position: right;  
    border:0px;     
    }

#output .information .singleColumn .box .bottomLeft
{
    background-image: url("../Pix/Layout/InformationSingleColumnBoxBottomLeft.png");
    background-repeat: no-repeat;
    background-position: bottom left;   
    }

#output .information .singleColumn .box .bottomRight
{
    height: 15px;
    background-image: url("../Pix/Layout/InformationSingleColumnBoxBottomRight.png");
    background-repeat: no-repeat;
    background-position: bottom right;
    }
    
    
#output .information .singleColumn .content
{
    padding: 0px 10px 0px 10px;

    }

#output .information .singleColumn .content img
{
    width:25px;
    height:35px;
    margin-right:5px;     
}

#output .information .singleColumn .content .description
{    
    margin-right:80px;
}
    
#output .information .singleColumn .content .description a
{    
    color: #000000;
}            
    
#output .information .appendix .header
{
    position:relative;   
    cursor:pointer;
    margin-bottom:15px;
    
    background-color: #ee7f00;
    }


#output .information .appendix .header .centerLeft
{       
    background-image: url("../Pix/Layout/DetailHeaderCenterLeft.png");
    background-repeat: no-repeat;
    background-position: left;  
    }

#output .information .appendix .header .centerRight
{
    background-image: url("../Pix/Layout/DetailHeaderCenterRight.png");
    height: 29px;
    background-repeat: no-repeat;
    background-position: right; 
    }
    
#output .information .appendix .header .centerRight.open
{
     background-image: url("../Pix/Layout/DetailHeaderCenterRightOpen.png");   
    }    
    
#output .information .appendix .header .content
{
    display:table-cell;
    text-align:center;
    vertical-align:middle;
    color: #FFFFFF;
    height:inherit;
    padding-left:10px;
    } 
    
#output .information .appendix .header .sandglass
{
    position:absolute;
    top:-20px;
    background-image: url("../../Pix/Layout/Sandglass.gif");    
    background-repeat: no-repeat;
    background-position: center center;
    width:100%;
    height:70px;
    display:none;    
    }    
    
#output .information .appendix .slider
{
    display: none;
    }  
         
    
.foot {
    min-width: 437px;
    max-width: 645px;
    color:#5c5c5c;
    font-size:0.9em;
    text-decoration:none;  
    display:block;
    text-align:right;
    margin:5px 13px 0 0;
}

.foot:hover{
    text-decoration:underline;
}
