/*****
zacks.com
My Account CSS
March 2014
*****/

input::-ms-reveal,
input::-ms-clear {
    display: none;
}

.my_account_content
{
    padding:0;
    margin:0 0 10px 0;
    border-top:1px solid #CACACA;
}
.my_account_content > section
{
    padding: 10px;
    overflow:hidden;
    border-bottom:3px solid #007F06;
    position:relative;
}

#order_history input
{
    float:none !important;
}
  #order_history th
, #order_history td
, #order_details th
, #order_details td
{
    padding-right:5px;
    padding-left:5px;
}

/**Order Details page Table structure **/
  #custom_info h1
, #login_info h1
{
    color:#007F06;
    margin-bottom:0 !important;
    font-size:13.5pt;
    text-transform:capitalize;
    text-shadow:0 1px 1px #fff;
    font-weight:bold;
}


  #login_info table
, #custom_info table
{
    margin-top:0;
    margin-bottom:25px;
}

  #login_info table
, #custom_info table
{
    width:560px;
}

  #login_info table td:first-child
, #custom_info table td:first-child
{
    width:250px;
}
#custom_info .select_spl select
{
    width:70px !important;
}

  #custom_ship_to input[type=checkbox]
, #sms_notification_block input[type=checkbox]
{
    float:left;
    margin-right:5px;
}

  #login_info select
, #custom_info select
{
    width:200px !important;
    margin-top:5px;
}
  #login_info input[type=text]
, #login_info input[type=password]
, #custom_info input[type=text]
, #custom_info input[type=password]
{
    width:200px;
}
  #login_info input[type=submit]
, #custom_info input[type=submit]
, #account_brokerage_reports input[type=submit]
, #subscription_prefs input[type=submit].fancy_button
, #sms_notification_block a.fancy_button
, .sms_modal a.fancy_button
{
    min-width:120px !important;
    text-align:center;
    padding-left:0;
    padding-right:0;
}


/* update button for alert preferences page */
#login_info p input[type=submit]{margin-bottom: 10px;}

  #main_content .phone_with_ext input[type=text]
, #main_content .phone_with_ext label
{
    width:150px;
    float:left;
}
  #main_content .phone_with_ext input[type=text] + input[type=text]
, #main_content .phone_with_ext label + label
{
    width:40px;
    margin-left:7px;
}
#main_content .phone_with_ext label + label
{
    margin-left:12px;
}


#custom_info .highlight
{
    background:#d8e7f0;
}

/*******/
  #login_info #login_info_block
, #custom_info #custom_bill_to
, #custom_info #custom_ship_to
, #subscription_prefs > div
, #contact_info_block
{
    border-bottom:1px solid #cacaca;
}
#subscription_prefs > div
{
    padding-bottom:10px;
}
  #login_info #contact_info_block
, #custom_info #custom_ship_to
, #custom_info #custom_payment_info
, #sms_notification_block
{
    margin-top:10px;
    padding-bottom: 3px;
    overflow: hidden;
}


#login_info_block input[type=submit]
{
    float:none !important;
}
#login_info_block input[type=submit]
{
    min-width:140px !important;
}


  #login_info > div table
, #custom_info > div table
{
    margin-left:30px;
}
  #login_info label
, #custom_info label
{
    display:block;
    font-weight:bold;
}
  #login_info table tr:hover
, #custom_info table tr:hover
, #subscription_prefs table tr:hover
{
    background:none;
}
  #login_info table td
, #custom_info table td
{
    border-bottom:none;
    vertical-align:top;
}
#sms_notification_block table td
{
    vertical-align:middle;
}
#custom_ship_to > p
{
    margin:8px 0 5px 0;
}

#account_brokerage_reports input[type=submit]
{
    margin-bottom:5px;
    display:block;
    float:none !important;
}

#sms_notification_block table td
{
    width: 90px !important;
}
#sms_notification_block input[type=text]
{
    margin-top: 0 !important;
}
.status_succesfull span
{
    background:url(/images/icons/general/click.png) no-repeat left center;
    font-weight: bold;
    padding-left: 17px;
}

/**** Subscription Preferences *****/
  #subscription_prefs section
, #subscription_prefs > form > section > header
{
    padding-bottom:10px;
    margin-bottom:10px;
    border-bottom:1px solid #CACACA;
}

#subscription_prefs section > header > h1
{
    float:left;
}

#subscription_prefs section > div
{
    margin-left:76px;
}

#subscription_prefs footer
{
    margin-top:15px;
}

#subscription_prefs label
{
    display:inline;
    font-weight:normal;
    font-family:Arial,Helvetica,sans-serif;
    font-size:10pt;
    padding:0 0 6px 0;
    color:#000;
    line-height:normal;
}

#subscription_prefs input
{
    border:0;
    outline:0;
}

#cont_group_profit_from_pros
{
    margin-bottom:10px;
}

  .paid_service_name_col
, .paid_service_opt_col
{
    float:left;
}
.paid_service_name_col
{
    width:350px;
}
  .paid_service_name_col p
, .paid_service_opt_col p
{
    height:16px;
}
  .paid_service_name_col p:first-child
, .paid_service_opt_col p:first-child
{
    height:40px !important;
}
  .paid_service_name_col p:nth-child(even)
, .paid_service_opt_col p:nth-child(even)
{
    background:#EEE;
}
.paid_service_opt_col
{
    width:100px;
}
.paid_service_opt_col p
{
    font-weight:bold;
    text-align:center;
}
/*added new column for other services*/
/*#cont_fdd_free_subs > #cont_group_other_services > h2{
	margin-left:0px;
}*/
#cont_fdd_free_subs > #cont_group_other_services, 
#cont_fdd_free_subs > #cont_group_other_services > div{
	float:left;
}
#cont_fdd_free_subs > #cont_group_other_services > div:first-of-type{
	margin-right:78px;
}
/****** My Account Login Page ******/
#my_account_login form label
{
    width:80px;
    display:inline-block;
}
  #my_account_login form input[type=text]
, #my_account_login form input[type=password]
{
    width:200px !important
}


/*****  Order History Table ****/
  #order_history th:first-child
, #order history table th:nth-child(2)
{
    width:90px !important;
}
#order_history th:nth-child(2) 
{
    width:80px !important;
}
#order_history th:nth-child(3) 
{
    width:435px !important;
}
#order_history th:nth-child(4) 
{
    padding-right:12px;
}


/*** update-contact-info Missing Information style ***/
.my_account_content > li
{
    list-style:none;
    margin-bottom:3px;
}
.my_account_content .empty_entry
{
    font-weight:bold;
    margin-top:5px;
    margin-bottom:5px;
}

  .my_account_content .not_verified
, .my_account_content .verified
{
    color:red;
    font-weight:bold;
} 
.my_account_content .verified 
{
    color:green;
}
  .my_account_content .not_verified:before
, .my_account_content .verified:before
{
    content:'';
    float:left;
    margin-right:3px;
    background:url(/images/icons/general/alert.png);
    height:15px;
    width:18px;
}
.my_account_content .verified:before
{
    background:url(/images/icons/general/check_green.png);
    width:12px;
}


/* Modal content */
.sms_modal
, .portfolio_edit_modal {
    width:400px !important;
}
.sms_modal #modal_interface {
    background:url(/images/zacks/icons/phone-sms.png) 0 5px no-repeat;
    padding:10px 10px 40px 54px;
}
.sms_modal .phone_number {
    background:url(/images/zacks/icons/flag_us.png) 0 3px no-repeat;
    padding-left:20px;
    font-weight:bold;
}
.sms_modal label {
    font-weight:bold;
}
.sms_modal .modal_link {
    font-weight:bold;
    color:#007F06;
    outline:none;
    background:none;
    border:none;
    display:inline;
    font-size:10pt;
    padding:0;
}
.sms_modal .modal_link:hover {
    color:#007F06 !important;
    text-decoration:underline;
}
.sms_modal .fancy_button {
    float:right;
    min-width:120px;
    padding:5px;
}
.sms_modal .fancy_button + .fancy_button {
    margin-right:10px;
}

.sms_modal label + span.error {
    margin-left:20px;
}
.sms_modal .error {
    color:red;
    font-weight:bold;
}


/* Modal loading spinner */
#modal_ajax_spinner {
    position:absolute;
    top:15%;
    left:44%;
    display:none;
}


/* sign_in_to_unsubscribe in alert_preference page
Please login to modify paid subsc paragraph when user is not logged in alert_preference page */
.unsubscribe_container
{
    padding-right:2%;
    padding-bottom:2%;
    padding-top:1%;
    margin-right:4%;
    
}
.unsubscribe_container label
{
    margin-right:7%;
}

/* unsubscribe msg */
.paid_service_opt_col p#sign_in_to_unsubscribe
{
    float: left;
    margin-left: 0;
    line-height: initial;
    text-align: left;
    width: 380px;
}
.paid_service_opt_col a
{
  color:#1d5eb5;
}


/*Password Restore page*/
#forgot_password{
    border: 1px solid #cacaca;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 80px;
}

#forgot_password form{
    border-top: none;
    box-shadow: none;    
}

#forgot_password form input.fancy_button{
    float: left;
    margin-left: 0;
    margin-top: 15px;
}

#forgot_password form div.forgot_password_text > label{
    width: 175px;
    display: inline-block;
    margin-top: 15px;
}

#password-strength-status{
    display: none;
    position: absolute;
    left: 188px;
    border-radius: 10px;
    background: #ffffff;
    margin-top: 12px;
    padding: 12px;
    z-index: 1;
    border: 1px solid #ccc;
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.13);
    -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.13);
    box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.13);
}
#password-strength-status:before{
    width: 0;
    height: 0;
    border-left: 17px solid transparent;
    border-right: 17px solid transparent;
    border-bottom: 17px solid #cccccc;
    /* border-top: 12px solid #cccccc; */
    content: '';
    float: left;
    position: absolute;
    top: -17px;
    left: 16px;
}
#password-strength-status::after {
    content: '';
    position: absolute;
    left: 19px;
    top: -15px;
    width: 0;
    height: 0;
    border-left: 14px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #fff;
    clear: both;
}
#password-strength-status ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
#password-strength-status ul li{
    font-size: 10pt;
    margin-bottom: 10px;
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Verdana, 'Droid Sans', Roboto, Helvetica, Arial, sans-serif;
    font-weight: normal;
    color: #666;
    padding-left: 25px;
    position: relative;
    line-height: 18px;
}
#password-strength-status ul li:last-child{
    margin-bottom: 0;
}
#password-strength-status ul li.invalid{
    /*color: #db0030;*/
}
#password-strength-status ul li.invalid:after{
    content: 'x';
    color: #900;
    position: absolute;
    top: 0;
    left: 0;
    width: 19px;
    height: 20px;
    text-align: center;
}
#password-strength-status ul li.valid{
    font-weight: bold;
    color: #333;
}
#password-strength-status ul li.valid:after{
    content: '\2713';
    color: #007d0f;
    position: absolute;
    top: 0;
    left: 0;
    width: 19px;
    height: 20px;
    text-align: center;
}
#confirm-password-err-msg{
    float: left;
    width: 100%;
    margin: 8px 0;
    color: red;
    font-size: 9pt;
    font-weight: bold;
    margin-left: 0;
}

/* password strength box positioning changed from min-width 1560px */
@media screen and (min-width: 1370px){
    .my_account_content > section{
        overflow:visible;
    }
    
    #password-strength-status{
        top: 0 !important;
        left: 387px !important;
    }
    #password-strength-status:before{
        top: 22px !important;
        left: -17px;
        border-top: 17px solid transparent;
        border-right: 17px solid #ccc !important;
        border-bottom: 17px solid transparent !important;
        border-left: none !important;
    }
    #password-strength-status::after{
        top: 22px !important;
        left: -15px !important;
        border-top: 17px solid transparent;
        border-right: 17px solid #fff !important;
        border-bottom: 17px solid transparent !important;
        border-left: none !important;
    }
}

@media screen and (min-width: 1370px) and  (max-width: 1439px){
     #password-strength-status{               
        width: 140px !important;
        max-width: 140px;
        min-width: 140px;
        padding: 15px 10px;
    }
    #password-strength-status ul li{
        font-size: 9pt;
        padding-left: 16px;
    }
    #password-strength-status ul li.invalid:after
    , #password-strength-status ul li.valid:after{
            text-align: left;
    }
}

@media screen and (min-width: 1440px) {
    #password-strength-status{               
        width: 200px !important;
        max-width: 200px;
        max-width: 200px;
    }
}


/*Password field :: eye icon show/hide toggle */
.eye-ico{
    background-image: url(/images/zacks/icons/eye-icon.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    width: 19px;
    height: 13px;  
    display: inline-block;
    position: absolute;
    right: 9px;
    top: 46px;  
    z-index: 1;
}

/* Forgot Passsword*/
#forgot_password .forgot_password_text{
    position: relative;
}
#forgot_password .forgot_password_text.new-pw-field input[type=password]
, #forgot_password .forgot_password_text.new-pw-field input[type=text] {
    height: 25px;
    width: 175px;
    margin-top: 5px;
}
#forgot_password .forgot_password_text span.eye-ico{
    left: 329px;
    top: 17px;
}

/**** start: attributes for media room responsive left sidebar ****/

.quote_nav_toggle      { position: relative; float: left; z-index: 99; margin-top: 0; margin-left: 0; margin-bottom: 5px; padding: 2px; padding-top: 5px; padding-bottom: 8px; width:100%; max-width: 60px; cursor: pointer; display: none; top: -37px; }
.quote_nav_toggle span { width: 80%; float: left; margin: 5px 10% 0; background-color: #787878;; padding: 3px 0; }

/* Start: New quote nav toggle v1.3 */
#quote_nav_toggle{position: absolute; top: -45px; left: 2%; width: 82px; padding: 12px; padding-left: 8px; background: #F07519; cursor: pointer; display: block; border-radius: 2px;}

#quote_nav_toggle span{float: left; width: 22px; background: #fff; margin: 2px 0; padding: 1px;}
#quote_nav_toggle span::before, #quote_nav_toggle span::after, #quote_nav_toggle.close-toggle span::before, #quote_nav_toggle.close-toggle span::after{width: 22px; position: absolute; background: #fff; padding: 1px; content: ''; display: block; -webkit-transition:all ease 0.5s; -moz-transition:all ease 0.5s; -o-transition:all ease 0.5s; -ms-transition:all ease 0.5s; transition:all ease 0.5s;}
#quote_nav_toggle span::before{left: 8%; top: 19%;}
#quote_nav_toggle span::after{bottom: 19%; left: 8%;}

#quote_nav_toggle.close-toggle span::before{-webkit-transform: rotate(44deg); -moz-transform: rotate(44deg); -o-transform: rotate(44deg); -ms-transform: rotate(44deg); transform: rotate(44deg); top: 46%;}
#quote_nav_toggle.close-toggle span{background: none; padding: 0;}
#quote_nav_toggle.close-toggle span::after{-webkit-transform: rotate(-44deg); -moz-transform: rotate(-44deg); -o-transform: rotate(-44deg); -ms-transform: rotate(-44deg); transform: rotate(-44deg); bottom: 45%;}

#quote_nav_toggle strong{float: right; font-weight: 400; line-height: 0.2; color: #fff; text-align: left; font-size: 14px;}
@media screen and (max-width:384px)
{
    #quote_nav_toggle { top:-31px; }
    nav.left_subnav   { top:0 !important; }

    #quote_sidebar_toggle { margin-top:-20px; }
}

/* Start: New left side bar nav toggle v1.4  */
 #quote_sidebar_toggle { cursor:pointer; display:none; }
 #quote_sidebar_toggle strong { text-transform:capitalize; font-size:12px; color:#000; text-align:left; float:left; line-height:22px; }
 #quote_sidebar_toggle aside {
    background: #f1943b; /* Old browsers */
    background: -moz-linear-gradient(top,  #f1943b 0%, #dc6e2f 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f1943b), color-stop(100%,#dc6e2f)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f1943b 0%,#dc6e2f 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f1943b 0%,#dc6e2f 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f1943b 0%,#dc6e2f 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #f1943b 0%,#dc6e2f 100%); /* W3C */
}

#quote_sidebar_toggle aside{float: left; margin-left: 5px; padding: 8px 10px;}
#quote_sidebar_toggle aside span{background-color: #fff; float: left; margin:0 2px; border-radius:100%; padding: 2px;}

.close_nav_btn span{float: right; margin-left: 5px; border:1px solid #cacaca; border-radius: 100%; width: 16px; height: 16px; margin-right: 10px; position: relative;}
.close_nav_btn span::before, .close_nav_btn span::after{background-color: #fff; width: 1px; height: 10px; position: absolute; z-index: 1000; left: 46%; top: 16%; content: '';}
.close_nav_btn span::before{-webkit-transform: rotate(44deg); -moz-transform: rotate(44deg); -o-transform: rotate(44deg); -ms-transform: rotate(44deg); transform: rotate(44deg); }
.close_nav_btn span::after{-webkit-transform: rotate(-44deg); -moz-transform: rotate(-44deg); -o-transform: rotate(-44deg); -ms-transform: rotate(-44deg); transform: rotate(-44deg); right: 50%;}
.close_nav_btn {color: #fff; text-align: left; float: right; cursor: pointer; display: none;}
@media screen and (max-width:1023px){ #quote_sidebar_toggle, .close_nav_btn{display: block;} }
@media screen and (min-width:480px) and (max-width:768px) { #quote_sidebar_toggle{top: -35px;} }
@media screen and (min-width:385px) and (max-width:414px) { 
    #quote_sidebar_toggle{top: -34px;} 
    
    #forgot_password form div.forgot_password_text > label{width: 100%;}
    #password-strength-status{left: 10px;}
    
}

@media screen and (max-width:414px) {
#forgot_password .forgot_password_text.new-pw-field label{
        float: left;
        width: 100%;
    }
    #forgot_password .forgot_password_text.new-pw-field span.eye-ico{
        left: 154px;
        top: 44px;
    }
    
    #forgot_password #password-strength-status{
        left: 0;
    }
}
/* End: New left side bar nav toggle v1.4  */

@media screen and (min-width:1023px){
    #quote_nav_toggle{display: none;} 
    #confirm-password-err-msg{margin-left: 179px; width: calc(100% - 180px);}
}
@media screen and (max-width:1023px){
    #left_rail{ width: 98%; float: left; margin: 15px 1% 10px 1%; position: relative;}
    .quote_nav_toggle{ display: block; }
    nav.left_subnav{top: -34px; position: absolute; z-index: 1001; border-radius: 0; width: 99%; left: -999px;}/* implemented new value for left sidbar nav in quote page in order to slide it from left */
/*added new column for other services*/
#cont_fdd_free_subs > #cont_group_other_services > div + div {
	margin-left:0 !important;
}
#cont_fdd_free_subs > #cont_group_other_services, 
#cont_fdd_free_subs > #cont_group_other_services > div{
	float:none;
}
#cont_fdd_free_subs > #cont_group_other_services > div:first-of-type{
	margin-right:0px;
}
}

/* any msg block inside all my account related pages */
.acc-page--msg{
    padding: 0 3em;
}

/**** end: attributes for media room responsive left sidebar ****/
// eof