﻿
/* ================================================================================
   == General
   ================================================================================ */

    body
    {
	    background-color: #fff;
	    padding-top:40px;
	    text-rendering: optimizeLegibility;
    }

    #header-branding
    {
        width:100%;
        min-height:20px;
        margin-top:5px;
        margin-bottom: 25px;
    }

    #header-logo
    {
        position: relative;
	    background:transparent;
    }
    
    #btnSpace {display:inline-block;height:30px;width:30px;padding-left:45px;}
    #mktLogin {display:block;width:100%;height:10px;}
    #acctLogin {margin-top:3px;margin-bottom:0px;}
    .center {text-align:center;}
    
  /* ================================================================================
   == Branding Body
   ================================================================================ */  
    #branding-body {font-family:Helvetica,sans-serif;}
    #branding-body h1 {font-size:20px;}
    #branding-body p {font-size:1.25em;line-height:1.3em;}
    #branding-body #instructions p {font-size:1.1em;text-decoration:underline;}
    #branding-body div.row {margin-top:20px;}
    #branding-body #instructions ol li		{ list-style-type: decimal; margin-left: 5px; font-size: 0.9em;  margin-bottom: 0.25em; }
     
    #ps2000pic {text-align:center; }
    
  /* ================================================================================
   == Logon Form
   ================================================================================ */
    /*.control-group.side-by-side     {   margin-left:0px;    display:inline-block;}    
    .control-group.side-by-side div.controls    {   margin-left:0px;    }*/  

    #uac-input {position:relative;}
    @media (min-width:768px){
        #uac-input {margin-top:215px;padding-top:45px;}
    }

    @media (max-width: 767px) {
        #uac-input {margin-top: 0;}
    }
    
    .uac-input-field {text-transform:uppercase;}
    #cardImgWrap
    {
        
        margin:auto;
        position:relative;
    }
    
    /* For Dual Card */
    #cardImgHelper 
    {
        background: url('../img/smartCard2.2-en.png') bottom center;
        width:420px;
        height:420px;
        position:absolute;
        top:-425px;
    }
    #cardImg 
    {
        position:absolute;
        top:-425px;
    }
    
    
    
    
    #uac-input .form-horizontal .control-label {width:160px;}
    #uac-input .form-horizontal #showtutorialbtn.control-label  {width:auto;}
    #uac-input .form-horizontal .controls {margin-left:180px;}
    
    #uac-input .btn-primary {margin-bottom:0px;}
    #uac-input div.control-group,#uac-msg1-p {margin-bottom:8px;}
    #uac-input div.control-group.actions {margin-bottom:0px;}
    #uac-input form {margin-bottom:0px;}
    
    .uac-input-field { font-weight: bold; text-align: center; }
    .pin-input-field { font-weight: bold; text-align: center; width: 60px; }
    .bdate-select { font-weight: bold; text-align: center; }
    
    #modalAcctLogin-form #acctLoginErrorMessage.alert,
    #modalAcctCreate-form #acctCreateErrorMessage.alert {margin-bottom:0px;}
    #modalAcctCreate-form span.help-block {margin-top:3px;}
    
    #modalPinEnrollment input[type="radio"] { margin-right: 5px; }
    #modalPinEnrollment   
    {
        width: 750px;
        margin: -345px 0 0 -375px;
    }
    #modalPinEnrollment-form {margin-bottom:0px;}
    #modalPinEnrollment .collapse .control-label {width:275px;}    
    #modalPinEnrollment .collapse .control-group .controls {margin-left:295px;}
    #modalPinEnrollment #notifySetup.collapse .control-label {width:335px;}    
    #modalPinEnrollment #notifySetup.collapse .control-group .controls {margin-left:355px;}
    #modalPinEnrollment #notifySetup.collapse .control-group { margin-bottom: 10px; }
    #modalPinEnrollment #notifySetup.collapse #profileNotifyDays     {   margin-bottom: 5px; }
    #modalPinEnrollment #notifySetup.collapse .btn-group { margin-top:10px; }
    #modalPinEnrollment #notifySetup div.btn-group.quickSelect {margin-top:0px;}
    div.btn-group.quickSelect
    {
        margin-top:0px; 
        display:inline-block;
        margin-left:-1px;
        vertical-align:middle;
        white-space:nowrap;
    }
    
    /*Override Active Button to match .btn-inverse*/
    .btn.active,
    .btn:active {
        color:White;
        background-color: #222222;
        *background-color: #151515;
        background-color: #080808 \9;
        background-image: -ms-linear-gradient(top, #555555, #222222);
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#555555), to(#222222));
        background-image: -webkit-linear-gradient(top, #555555, #222222);
        background-image: -o-linear-gradient(top, #555555, #222222);
        background-image: -moz-linear-gradient(top, #555555, #222222);
        background-image: linear-gradient(top, #555555, #222222);
        background-repeat: repeat-x;
        border-color: #222222 #222222 #000000;
        border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
        filter: progid:dximagetransform.microsoft.gradient(startColorstr='#555555', endColorstr='#222222', GradientType=0);
        filter: progid:dximagetransform.microsoft.gradient(enabled=false);
    }
    
    .btn.active i {  background-image: url("../img/bootstrap/glyphicons-halflings-white.png");}
    
    
    #disclaimer {margin-top:15px;}

    /* ================================================================================
   == Preferences
   ================================================================================ */
    #unsubPref input[type="radio"] { margin-right: 5px; }
    
    #unsubPref-form {margin-bottom:0px;display:block;}
    #unsubPref-form .control-label {width:73%;}    
    #unsubPref-form .control-group .controls {margin-left:75%;}
    #unsubPref-form .control-group { margin-bottom: 10px; }
    #unsubPref-form .input-prepend span.add-on   {   margin-right:-5px;  }
    #unsubPref-form #profileNotifyDays     {   margin-bottom: 5px; }
    #unsubPref-form .btn-group { margin-top:10px; }
    #unsubPref-form div.btn-group.quickSelect {margin-top:0px;}
    div.btn-group.quickSelect
    {
        margin-top:0px; 
        display:inline-block;
        margin-left:-1px;
        vertical-align:middle;
        white-space:nowrap;
    }

    #unsubPref-form .btn-group input:first-child + .btn {
         /* This is an actual copy/paste of the .btn-group .btn:first-child style */
        border-bottom-left-radius: 4px;
        border-top-left-radius: 4px;
        margin-left: 0;
    }

    #unsubPref-form .disclaimerSm {
        font-size: 70%;
    }

@media (max-width: 1200px) {
    #unsubPref-form .control-label {
        width: 63%;
    }

    #unsubPref-form .control-group .controls {
        margin-left: 65%;
    }
}


@media (max-width: 767px) {
    #unsubPref-form .control-label {
        width: 49%;
    }

    #unsubPref-form .control-group .controls {
        margin-left: 51%;
    }
}