/*
 * accountMenu Wrapper and Trigger
 */

#accountMenu {
    position: absolute;
    right: 0;
    z-index: 1003;
    display: inline-block;
}

#accountMenu * {
    font-size: 14px;
}

.green-nav #accountMenu {
    height: 40px;
    bottom: 0;
}

#accountMenu .user {
    float: left;
    display: inline-block;
}

.dropdown-container {
    position: relative;
    display: inline-block;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    right: 2px;
    display: none;
    max-width: 250px;
    padding: 20px;
}

.hover .dropdown-container:hover .dropdown-menu {
    display: block !important;
}

.trigger.active ~ .dropdown-menu {
    display: block !important;
}

/*
 * Form
 */

#accountMenu.is-logged-in form fieldset {
    display: none;
}

#accountMenu.is-logged-in form .logout {
    display: block;
}

#accountMenu.is-logged-out .logout {
    display: block;
}

#accountMenu input {
    width: 250px;
    height: 30px;
    box-sizing: border-box;
    padding: 6px 5px 6px 38px;
    box-shadow: none;
    background: #fff;
    border: 1px solid #62aa84;
}

#accountMenu .grd {
    position: relative;
    display: inline-block;
    margin-bottom: 6px;
}

#accountMenu .grd i {
    position: absolute;
    top: 0;
    left: 0;
    width: 32px;
    height: 29px;
    background-color: #62aa84;
    background-image: url(../../graphic/sprite/sprite_master-global.png);
    margin: 0;
}

.container-email .icon-ok,
.container-password .icon-ok {
    display: none !important;
}

.container-password i {
    background-position: -181px -94px;
}

.container-email i {
    background-position: -180px -68px;
}

#accountMenu a {
    color: #005e34;
    text-decoration: underline;
}

#accountMenu a:hover {
    text-decoration: none !important;
}

#accountMenu .toggle-form {
    display: inline-block;
    margin-bottom: 20px;
}

#accountMenu .register {
    padding: 20px 0 8px;
    border-bottom: 1px solid #cdcdcb;
}

#accountMenu button strong {
    line-height: 38px;
}

#accountMenu button i {
    right: 10px;
}

/*
 * Login Menu
 */

.login-menu {
    min-width: 170px;
    padding: 0;
    margin: 0;
}

.login-menu li {
    display: block;
}

.login-menu li a {
    color: #005e34;
    text-decoration: underline;
    display: inline-block;
    padding: 2px 0;
    margin-bottom: 5px;
}

.login-menu li a:hover {
    text-decoration: none !important;
}

.get-password p {
    line-height: 17px;
}

.login-menu li:last-child a {
    margin-bottom: 0;
}

.login-menu .logout {
    display: none;
}

.is-logged-in .login-menu .logout {
    display: block;
    border-top: 1px solid #69a27e;
    margin: 5px -15px 0;
    padding: 5px 15px 2px 0;
    text-align: right;
}

.is-logged-out .login-menu .logout {
    display: block;
    border-top: 1px solid #69a27e;
    margin: 5px -15px 0;
    padding: 5px 15px 2px 0;
    text-align: right;
}

/*
 * Get Password
 */

.get-password {
    display: none;
}

/*
 * Error Message
 */

#accountMenu .error-message {
    display: none;
}

#accountMenu .error .error-message {
    left: -117%;
    top: -20px;
    width: 265px;
    padding: 10px;
    white-space: normal;
}

#accountMenu .container-password .error-message {
    top: 2px;
}

#accountMenu .error .error-message p {
    color: #fff;
    margin: 0;
}

#accountMenu .error-message::after {
    transform: rotate(-180deg);
    left: 284px;
    content: " ";
}

#accountMenu .error input {
    border-color: #dc3909;
    background-color: #fbedeb;
}

#accountMenu .grd.error i {
    background-color: #dc3909;
}

.error-required .error-message-required,
.error-minlength .error-message-minlength,
.error-maxlength .error-message-maxlength,
.error-match .error-message-match,
.error-type .error-message-type {
    display: block !important;
}

.error-required .icon-ok-required,
.error-minlength .icon-ok-minlength,
.error-maxlength .icon-ok-maxlength,
.error-match .icon-ok-match,
.error-type .icon-ok-type {
    display: none !important;
}

/*
 * Module Box
 */

.module-box {
    width: 480px;
    margin: 0 auto;
    border-radius: 5px;
}

.module-box .button {
    display: inline-block;
}

.module-box h2 {
    font-size: 20px;
    padding: 15px;
}

.module-box h2,
.module-box p {
    padding-left: 15px;
    padding-right: 15px;
}

.module-box .action-box {
    text-align: center;
    padding: 10px;
    border-radius: 0 0 5px 5px;
}

.module-box i.close {
    display: none;
}