/* Main Container Styles */
body {
    font-family: arial;
    margin: 0;
    padding: 0;
    min-width: 460px;
    width: 460px;
    z-index: 0;
    overflow: hidden;
}

#wrapper {
    padding-left: 8px;
    border: 0px solid black;
    min-width: 455px;
    width: 455px;
    z-index: 1;
}

/* Common Container Styles */

#overlay {
    position: absolute;
    top: 0px;
    left: 0px;
    background: transparent url('../../images/trans.png') repeat;
    width: 97%;
    height: 99%;
    display: none;
    z-index: 1002;
    overflow: hidden;
}

#animate {
    width: 92%;
    display:none;
}

#animate img {
    vertical-align: middle;
}

div#iwresponse_success {
    display: none;
}

div#iwresponse_error {
    display: none;
}

#iwpwd_recovery {

}

#formstep1 {
    width: 98%;
    z-index: 8;
}

#formstep2 {
    width: 98%;
    z-index: 8;
}

#formstep3 {
    width: 98%;
    z-index: 8;
}

div.field_info {
    line-height: 1.1;
}

span.field_info {
    padding: 3px;
    padding-left: 0px;
    color: #555555;
    font-size: 11px;
    line-height: 1.1;
    /*font-style: italic;*/
}

div.text_intro {
    width: 95%;
}

span.text_intro {
    font-size: 12px;
}

.iwerror {
    width: 90%;
    margin: 8px;
    margin-left:0px;
    margin-top: 5px;
    margin-bottom: 8px;
    padding: 6px;
    border-radius: 4px;
    background-color: #f4e0e0;
    background-repeat: no-repeat;
    background-position: top left;  
    font-size: 12px;
    line-height: 115%;
    color: red;
    position: relative;
    z-index: 10;
}

.iwfielderror {
    width: 90%;
    margin: 8px;
    margin-left:0px;
    margin-top: 5px;
    margin-bottom: 8px;
    padding: 6px;
    border-radius: 4px;
    background-color: #f9fdb6;
    background-repeat: no-repeat;
    background-position: top left;  
    font-size: 12px;
    line-height: 115%;
    color: #b75d15;
    position: relative;
    z-index: 10;
    display:none;
}

.iwwarning {
    width: 90%;
    margin: 8px;
    margin-left:0px;
    margin-top: 5px;
    margin-bottom: 8px;
    padding: 6px;
    border-radius: 4px;
    background-color: #f9fdb6;
    font-size: 12px;
    line-height: 115%;
    color: #b75d15;
    position: relative;
    z-index: 10;
}

.iwsuccess{
    width: 90%;
    margin: 8px;
    margin-left:0px;
    margin-top: 5px;
    margin-bottom: 8px;
    padding: 6px;
    border-radius: 4px;
    background-color: #e5f6e5;
    background-repeat: no-repeat;
    background-position: top left;
    font-size: 12px;
    line-height: 115%;
    color: #408712;
    position: relative;
    z-index: 10;
}

.iwwaiting{
    width: 90%;
    margin: 8px;
    margin-left: 0px;
    margin-top: 5px;
    margin-bottom: 8px;
    padding: 6px;
    padding-left: 20px;
    padding-right: 0px;
    border-radius: 4px;
    border-left: 4px solid transparent;
    background-image: url('../../images/loading.gif');
    background-repeat: no-repeat;
    background-position: left center;
    font-size: 12px;
    line-height: 115%;
    position: relative;
    z-index: 10;
    font-weight: bold;
    background-color: #e5f6e5;
    color: #408712;
    ;
}

.iwinfo {
    width: 90%;
    margin: 8px;
    margin-left:0px;
    margin-top: 5px;
    margin-bottom: 8px;
    padding: 6px;
    border-radius: 4px;
    background-color: #edf1f3;
    background-repeat: no-repeat;
    background-position: top left;
    font-size: 12px;
    line-height: 115%;
    color: #1352a3;
    position: relative;
    z-index: 10;
}

.hidden {
    display:none;
    width: 0;
    height: 0;
}

p.spacer {
    margin-top:12px;
    margin-bottom: 4px;
    height: 1px;
}

p.low_spacer {
    margin-top:3px;
    margin-bottom: 4px;
    height: 1px;
}

p.high_spacer {
    margin-top:42px;
    margin-bottom: 4px;
    height: 1px;
}

/* Parameters box open && close buttons */
#parameters_button_open {
    position: absolute;
    right: 5%;
    border:0px solid black;
    font-size: 11px;
    font-weight: bold;
    color: #494949;
    height: 26px;
    margin-top: -12px;
    padding-top: 13px;
    padding-left: 32px;
    z-index: 1001;
    vertical-align: middle;
    background: transparent url(../../images/parameters.png?version=2);
    background-position: left center;
    background-repeat: no-repeat;
    cursor: pointer;
}

#parameters_button_close {
    position: absolute;
    right: 5%;
    border:0px solid black;
    font-size: 11px;
    font-weight: bold;
    color: #494949;
    height: 26px;
    margin-top: -12px;
    padding-top: 13px;
    padding-left: 32px;
    z-index: 1001;
    vertical-align: middle;
    background: transparent url(../../images/parametersOn.png?version=2);
    background-position: left center;
    background-repeat: no-repeat;
    display:none;
    cursor: pointer;
}

span.parameters_button {
    font-size: 12px;
}

/* Parameters box */
#parameters_box_hidden_overlay {
    position: absolute;
    top: 0px;
    left: 0px;
    background: transparent url('../../images/trans.png') repeat;
    width: 97%;
    height: 97%;
    display: none;
    z-index: 50;
}

.parameters_box_outer {
    box-shadow: 1px 1px 8px #555;
    border-radius: 4px;
    margin:6px;
    position: absolute;
    top: 33px;
    right:2%;
    min-width: 250px;
    z-index: 110;
}

.parameters_box {
    background: #f2f2f2;
    padding: 6px;
    border-radius: 4px;
    z-index: 111;
}

.parameters_box div.menu {
    position: inherit;
    width: 100%;
    background-color: #ffffff;
    padding-top: 5px;
    padding-bottom: 3px;
    margin-bottom: 3px;
    border-top: 0px;
    border-bottom: 0px solid #999999;
    border-radius: 4px;
    height: 26px;
    vertical-align: middle;
    z-index: 113;
}

.parameters_box div.menu:hover {
    position: inherit;
    width: 100%;
    background-color: #666;
    padding-top: 5px;
    padding-bottom: 3px;
    margin-bottom: 3px;
    border-top: 0px;
    border-bottom: 0px solid #999999;
    border-radius: 4px;
    height: 26px;
    vertical-align: middle;
    z-index: 113;
}

.parameters_box a {
    text-decoration: none;
}

.parameters_box div.menu:hover a {
    color: #ffffff;
    text-decoration: none;
}

img.parameterimage {
    vertical-align: middle;
    margin-left: 8px;
    margin-right: 5px;
}

/* Specific styles */
div#iwform {
    position: relative;
    z-index: 3;
}

div#site_and_browser_info {
    font-size: 14px;
    color: #424242;
    background: #F2F2F2;
    width: 97%;
    margin-bottom: 8px;
}

td.rightContent {
    padding-top: 6px;
    padding-left:4px;
}

div#iwloginfield {
    padding-left: 2px;
}

td.field_create_password {
    width: 110px;
}

td.field_create_profile {
    width: 210px;
}

div#iwaddprofilelink {
    margin-top: 20px;
}

div.iw_pwd_container {
    vertical-align: middle;
    width: 113px;
    padding-right: 20px;
}

div.iw_pwd2_container {
    vertical-align: middle;
    width: 113px;
    padding-right: 20px;
}

div.pwd_ok {
    background-image: url(../../images/accept.png);
    background-repeat: no-repeat;
    background-position: center right;
}

div.pwd_pending {
    background-image: url(../../images/pending.png);
    background-repeat: no-repeat;
    background-position: center right;
}

div.pwd_ko {
    background-image: url(../../images/pending.png);
    background-repeat: no-repeat;
    background-position: center right;
}

div#iwinfoflash {
    display: none;
    margin-bottom: 15px;
}

div#iwerrorflash {
    display: none;
    margin-bottom: 15px;
}

div#iwsuccessflash {
    display: none;
    margin-bottom: 15px;
}

div#iwextrafields {
    margin-top: 12px;
}

div#iwservice_logo {
    width: 160px;
    height: 190px;
    position: fixed;
    left: 65%;
    background: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    text-align: center;
    vertical-align: middle;
    display:table-cell;
    overflow: hidden;
    z-index: 2;
}

div#iwservice_logo img {
    margin-top: 70px;
    margin-left: 20px;
    padding: 3px;
    background: transparent;
    border: 0px;
    border-radius: 3px;
    z-index: 2;
}

span#LBL_iwlogin {
    display: inline-block;
}

span#iwantiphishing,
span#iwantiphishing_activate {
    color: #777777;
    padding: 4px;
    padding-top: 0px;
    padding-left: 0px;
    margin-left: 0;
    margin-bottom: 6px;
    text-align: left;
    display: inline-block;
}

[action='activate'] span#iwantiphishing_activate {
     width: 98%;
}

div.title {
    width: 80%;
    margin-bottom: 6px;
    margin-top: 14px;
    padding-top: 0px;
}

div.title_underline {
    width:98%;
    border-bottom: 0px solid darkGrey;
    margin-bottom: 4px;
}

span.title {
    font-family: Arial;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 8px;
}

span.subtitle {
    color: #333333;
    font-weight: bold;
}


div.subtitle {
    width:98%;
    margin-top: 8px;
    margin-bottom: 4px;
    color: #333333;
    font-weight: bold;
}

div.separator_line {
    width:98%;
    height: 1px;
    margin-bottom: 4px;
    border-bottom: 1px solid lightGrey;
}

#LBL_iwpassword_create {
    margin-bottom: 3px;
}

#LBL_iwpassword_confirm {
    margin-bottom: 3px;
    margin-top: 3px; 
}

div.inweboinfo {
    font-size: 11px;
    text-align: left;
    margin-top: 10px;
    margin-bottom: 0px;
    padding-top: 8px;
    padding-bottom: 8px;
    /*margin-left: 65%;*/
    width: 60%;
    z-index: 2;
}

span.inweboinfo  {
    font-size: 11px;
    text-align: left;
    height: 16px;
    vertical-align: middle;
}

span#current_profile_name {
    font-size: 12px;
    font-weight: bold;
}

div#profile_info {
    margin-top: 4px;
    z-index: 2;
}

div#add_profile {
    margin-top: 12px;
    z-index: 2;
    display: none;
}


div#available_profiles {
    margin-top: 4px;
    z-index: 2;
}

/* Generic Styles */
p {
    font-size: 12px;
    margin-top: 12px;
    margin-bottom: 8px;
}

span {
    font-size: 12px;
    margin-top: 10px;
    margin-bottom: 8px;
}

.medium {
    font-size: 12px;
}

.small {
    font-size: 11px;
}

.red {
    color: red;
}

ul {
    padding-left: 25px;
}

a {
    color: #333333; /* Default color */
    font-size: 12px;
    text-decoration: underline;
}

a:hover {
    font-size: 12px;
    text-decoration: none;
}

a.options {
    font-weight: bold;
    text-decoration: none;
}

a.options:hover {
    font-weight: bold;
    text-decoration: none;
    text-shadow: silver 0 0 3px;
}

img {
    border: 0px;
}

input {
    font-family: arial;
}

select {
    font-size: 12px;
    font-family: arial;
    border: 1px solid #c1cad3;
    border-radius: 3px;
    padding: 3px;
}

input[type=radio] {
    vertical-align: middle;
    margin: 0px;
    margin-left: 6px;
    margin-right: 3px;
    margin-top: -4px;
}

input[type=checkbox] {
    vertical-align: middle;
    margin: 0px;
    margin-left: 3px;
    margin-right: 6px;
    margin-top: -4px;
}

input[type=password]{
    display: block;
    height: 25px;
    width: 100px;
    border: 1px solid #c1cad3;
    border-radius: 3px;
    /*box-shadow:1px 1px 5px #c1cad3, -1px -1px 5px #c1cad3;*/
    background: #FFFFFF;
    color: #424242;
    font-size: 12px;
    padding-top: 1px;
    padding-left: 4px;
    /*margin-top: 4px;*/
    cursor: auto;
    -webkit-text-security: disc;
}

input[type=text]{
    display: block;
    height: 25px;
    width: 400px;
    border: 1px solid #c1cad3;
    border-radius: 3px;
    /*box-shadow:1px 1px 5px #c1cad3, -1px -1px 5px #c1cad3;*/
    background: #FFFFFF;
    color: #424242;
    font-size: 12px;
    padding-top: 1px;
    padding-left: 4px;
    margin-top: 4px;
    cursor: auto;
}

input.sizeSmall {
    width: 120px;
}

input.sizeMedium {
    width: 290px;
}

input.sizePassword {
    width: 100px;
}

input:required {
    border: 1px solid #c1cad3;
}

input.disabled {
    border: #F2F2F2 1px solid;
    color: #444444;
    padding-left: 4px;
    cursor: default;
}

input[type=text].input_inactive {
    background: transparent;
    border: 1px solid lightGrey;
    width: 200px;
    color: #424242;
}

input[type=button] {
    border: lightgrey 1px solid;
    border-radius: 3px 3px 3px 3px;
    padding: 6px;
    padding-left: 9px;
    padding-right: 9px;
    font-weight: bolder;
    font-size: 12px;
    background: lightgrey;
    cursor: pointer;
    color: #424242;
    margin: 0px;
}

input[type=button].validate_form_step {
    border: lightgrey 1px solid;
    border-radius: 3px 3px 3px 3px;
    padding: 6px;
    padding-left: 9px;
    padding-right: 9px;
    font-weight: bolder;
    font-size: 12px;
    background: lightgrey;
    cursor: pointer;
    color: #424242;
}

input[type=button].submit_form {
    border: lightgrey 1px solid;
    border-radius: 3px 3px 3px 3px;
    padding: 6px;
    padding-left: 9px;
    padding-right: 9px;
    font-weight: bolder;
    font-size: 12px;
    background: lightgrey;
    cursor: pointer;
    color: #424242;
}

div#iwactivatenewprofile {
    position: absolute;
    left: 50%;
    top: -8px;
    right:0;
    height: 100%;
    padding-left: 9px;
    border-left: 1px solid lightGrey;
}

span#LBL_login_nopassword {
    background: transparent url(../../images/success_green.png);
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 24px;
    font-size: 13px;
    padding-right: 10px;
}

/******************************
 * Design conditional display
 ******************************/
div#site_and_browser_info[show_site_name='1'] {
    display: block!important;
}

div#site_and_browser_info span#LBL_activate_browser {
    display: none;
}

div#site_and_browser_info td#browser_name {
    display: none;
}

.forMobile {
    display: none;
}

input.forMobile {
    display: none;
}

.forMobileInline {
    display: none;
}

.notMobile {
    display: block!important;
}

input.notMobile {
    display: block!important;
}

/*[operation='activation'] div#activate_intro {
    display: block!important;
}*/

[operation='activation'][pinmode='1'] div#iwactivatepwdconfirm div.subtitle {
    display: block!important;
}

[operation='activation'][pinmode='2'] div#iwactivatepwdcreate div.subtitle {
    display: block!important;
}

[operation='setPassword'] div#setpassword_intro {
    display: block!important;
}

span.dedicated {
    display: none;
}

/******************************
 * Functional conditional display
 ******************************/

[dedicated='1'] span.dedicated {
    display: inline!important;
}

[dedicated='1'] span.iw {
    display: none!important;
}

/*[operation='activation'] div#iwactivatefirstprofile {
    display: block!important;
}*/

[operation='serviceAdd'] div#iwactivatewithprofile {
    display: block!important;
}

[operation='serviceAdd'] div#iwactivatenewprofile {
    display: block!important;
}

[operation='preAuth'] div#iwactivatewithprofile {
    display: block!important;
}

[operation='preAuth'] div#iwactivatenewprofile {
    display: block!important;
}

[operation='preAuth'] span#LBL_preauth_animate_title {
    display: inline!important;
}

[operation='preAuth'] span#LBL_activate_animate_title {
    display: none!important;
}

/* hide fields with ignore=1 */
[ignore='1'] {
    display: none!important;
}

[pinmode='1'] div#iwactivatepwdconfirm {
    display: block!important;
}

[pinmode='2'] div#iwactivatepwdcreate {
    display: block!important;
}

[result='nok'] div.end_error {
    display: block!important;
}

[result='ok'] div.end_success {
    display: block!important;
}

/* iwsucess activate or add_service (default: activate*/
[add_service='1'] span.add_service {
    display: inline!important;
}
[add_service='1'] span.activate {
    display: none!important;
}
[action='unlock'] div.unlock {
    display: inline!important;
}
[action='unlock'] div.notunlock {
    display: none!important;
}
div.select_profile[show_profile="1"] {
    display: inline!important;
}
[action='select_profile'] div.select_profile {
    display: inline!important;
}

