/* PV/[Layout]/portal.css */


/* ============================================ */
/* base settings                        - Start */
/* ============================================ */

/* hyphens */

.userlinks {
    -webkit-hyphens: none;
    hyphens: none;
}


/* ============================================ */
/* header                               - Start */
/* ============================================ */

.tools {
    margin-right: -20px;
    width: 200px;
}

.tools .column2 {
    width: 125px;
}

.searchicon {
    float: left;
}

.login {
    background: unset;
    width: 68px;
}

img#login_icon {
    padding-top: 0;
}

.login img {
    width: 45px;
}


/* logged in */

.login.in,
button#login_pulldown_button {
    height: 120px;
}

.login.in {
    margin-top: -40px;
}

button#login_pulldown_button {
    background: var(--gr-bg-color-04);
    border-radius: 0;
    position: relative;
}

.login.in button#login_pulldown_button:before {
    color: var(--gr-text-color-02);
    content: "\ea3a";
    font-family: 'sv_icons';
    font-size: 49px;
    left: 10px;
    position: absolute;
    top: 39px;
}

/* fix only for firefox */
@supports (-moz-appearance:none) {

    .login.in button#login_pulldown_button:before {
        top: 34px;
    }

}

.login.in button#login_pulldown_button:after {
    bottom: 0;
    color: var(--gr-text-color-02);
    content: "\e911";
    font-family: 'sv_icons';
    font-size: 36px;
    left: 16px;
    position: absolute;
}

.login.in.open button#login_pulldown_button:after {
    content: "";
}

.login.in img#login_icon {
    height: 0;
}

.userlinks {
    top: 120px;
    width: 465px;
    padding: 40px 10px 20px 40px;
}

.userlinks li {
    color: var(--gr-text-color-02);
    position: relative;
}

#loggedInUser {
    display: block;
    font-family: "Soleil-Semibold", sans-serif;
    font-size: 1.167rem;
    font-weight: 600;
    line-height: 1.417rem;
    padding-bottom: 40px;
}

.userlinks li a {
    color: var(--gr-text-color-02);
    font-family: "Soleil-Regular", sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.25rem;
    padding-bottom: 20px;
}

.userlinks li a:visited {
    color: var(--gr-text-color-02);
}

button#close_userlinks {
    background: unset;
    display: flex;
    flex-direction: column;
    float: right;
    margin-top: -20px;
    padding: 0;
    width: 3.334rem;
}

button#close_userlinks .sv-menu_close {
    font-size: 3.334rem;
}

button#close_userlinks .close-userlinks-text {
    font-family: 'Soleil-Light', sans-serif;
    font-size: 0.583rem;
    line-height: 0.833rem;
}


/* fixed header */

.fixed .login.in,
.fixed button#login_pulldown_button {
    height: 70px;
}

.fixed .login.in {
    margin-top: -15px;
}

.fixed .login.in button#login_pulldown_button:before {
    margin-top: 0px;
    top: 13px;
}

/* fix only for firefox */
@supports (-moz-appearance:none) {

    .fixed .login.in button#login_pulldown_button:before {
        top: 8px;
    }

}

.fixed .login.in button#login_pulldown_button:after {
    bottom: -6px;
    font-size: 26px;
    left: 21px;
}

/* fix only for firefox */
@supports (-moz-appearance:none) {

    .fixed .login.in button#login_pulldown_button:after {
        bottom: -9px;
    }

}

.fixed .userlinks {
    top: 70px;
}


@media (max-width: 1405px) {

    .tools {
        margin-right: -5px;
        width: 120px;
    }

	#esv-header.mobile-menu-hidden .tools {
		width: 74px;
	}

    .tools .column2 {
        width: 86px;
    }

	.login {
		padding-top: 8px;
		width: 50px;
	}

	#esv-header.mobile-menu-hidden .login {
		width: 34px;
		height: 50px;
	}

    .login a {
        padding: 0;
    }

    .login img {
        width: 34px;
    }


    /* logged in */

    .login.in,
    button#login_pulldown_button {
        height: 70px;
    }

    .login.in {
        margin-top: -18px;
    }

    button#login_pulldown_button {
        margin: 0 3px;
        padding: 0;
        width: 44px;
    }

    .login.in button#login_pulldown_button:before {
        font-size: 32px;
        left: 6.5px;
        margin-top: 0px;
        top: 21px;
    }

    /* fix only for firefox */
    @supports (-moz-appearance:none) {

        .login.in button#login_pulldown_button:before {
            top: 18px;
        }

    }

    .login.in button#login_pulldown_button:after,
    .fixed .login.in button#login_pulldown_button:after {
        bottom: -3px;
        font-size: 26px;
        left: 9px;
    }

    /* fix only for firefox */
    @supports (-moz-appearance:none) {

        .login.in button#login_pulldown_button:after,
        .fixed .login.in button#login_pulldown_button:after {
            bottom: -6px;
        }

    }

    .userlinks {
        margin-right: 3px;
        top: 78px;
    }


    /* fixed header logged in */

    .fixed .login.in {
        margin-top: -18px;
    }

    .fixed .login.in button#login_pulldown_button:before {
        top: 21px;
    }

    /* fix only for firefox */
    @supports (-moz-appearance:none) {

        .fixed .login.in button#login_pulldown_button:before {
            top: 18px;
        }

    }

    .fixed .userlinks {
        top: 78px;
    }

}

@media (max-width: 960px) {

    .userlinks {
        padding: 30px 7.5px 15px 30px;
    }

    #loggedInUser {
        padding-bottom: 30px;
    }

    .userlinks li a {
        padding-bottom: 15px;
    }

    button#close_userlinks {
        margin-top: -15px;
    }

	#esv-header.mobile-menu-hidden .login {
		float: right;
	}

}

@media (max-width: 600px) {

    .userlinks {
        padding: 20px 5px 10px 20px;
    }

    #loggedInUser {
        padding-bottom: 20px;
    }

    .userlinks li a {
        padding-bottom: 10px;
    }

}

@media (max-width: 540px) {

    .userlinks {
        width: calc(100vw - 73px);
    }

}


/* ============================================ */
/* main-navigation                      - Start */
/* ============================================ */

nav.main > ul {
    padding-right: 210px;
}

nav.main .menu > .menu-item:first-child > a {
    width: 85px;
}

nav.main .menu > .menu-item:nth-child(2) > a {
    width: 119px;
}

nav.main .menu > .menu-item:nth-child(3) > a {
    width: 138px;
}

nav.main .menu > .menu-item:nth-child(4) > a {
    width: 118px;
}

nav.main .menu > .menu-item:nth-child(5) > a {
    width: 123px;
}