/* neumorp */
a {
    color: #7577e5;
    text-decoration: none;
    background-color: transparent
}

a:hover {
    color: #3538d9;
    text-decoration: underline;
    cursor: pointer
}

a:not([href]) {
    color: inherit;
    text-decoration: none
}

a:not([href]):hover {
    color: inherit;
    text-decoration: none;
    cursor: pointer
}

input.np-element:focus,
select.np-element:focus,
textarea.np-element:focus {
    outline: none;
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff;
    font-size: calc(1rem * .995)
}

.np-element {
    background: #f2f3f7;
    color: #75a1e5;
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff;
    border-radius: 5px;
    padding: .4rem 1rem;
    border: 1px solid #fff;
    transition: all .3s
}

.np-element::after,
.np-element::before {
    transition: all .3s
}

.np-element-inverse {
    background: #f2f3f7;
    color: #75a1e5;
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff;
    border-radius: 5px;
    padding: .4rem 1rem;
    border: 1px solid #fff;
    font-size: calc(1rem * .995);
    transition: all .3s
}

.np-element-inverse::after,
.np-element-inverse::before {
    transition: all .3s
}

.np-hover {
    transition: all .3s
}

.np-hover:hover {
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff;
    font-size: calc(1rem * .995)
}

.np-hover-inverse:hover {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff;
    font-size: calc(1rem * 1.1)
}

.np-square-sm:focus,
.np-square-md:focus,
.np-square-lg:focus,
.np-square-xl:focus,
.np-square-xxl:focus {
    outline: none;
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff;
    font-size: calc(1rem * .995)
}


.np-square-sm {
    width: 6vh;
    height: 6vh;
    overflow: hidden
}

.np-square-md {
    width: 10vh;
    height: 10vh;
    overflow: hidden
}

.np-square-lg {
    width: 15vh;
    height: 15vh;
    overflow: hidden
}

.np-square-xl {
    width: 19.5vh;
    height: 19.5vh;
    overflow: hidden
}

.np-square-xxl {
    width: 25.5vh;
    height: 25.5vh;
    overflow: hidden
}


.np-shadow-inverse:focus {
    outline: none;
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff;
    font-size: calc(1rem * 1.1)
}


.np-shadow {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff
}

.np-shadow-inverse {
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff
}

.np-shadow-double {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff
}

.np-shadow-border-square {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center
}

.np-shadow-border-square::before {
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff;
    content: "";
    display: block;
    width: 80%;
    height: 80%;
    position: absolute;
    z-index: 2;
    top: 10%;
    left: 10%
}

.np-shadow-border-circle {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center
}

.np-shadow-border-circle::before {
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff;
    content: "";
    display: block;
    width: 80%;
    height: 80%;
    position: absolute;
    z-index: 2;
    top: 10%;
    left: 10%;
    border-radius: 50%
}

.np-shadow-border-square-push {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center
}

.np-shadow-border-square-push::before {
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff;
    content: "";
    display: block;
    width: 80%;
    height: 80%;
    position: absolute;
    z-index: 2;
    top: 10%;
    left: 10%
}

.np-shadow-border-square-push:hover::before {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff
}

.np-shadow-border-circle-push {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center
}

.np-shadow-border-circle-push::before {
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff;
    content: "";
    display: block;
    width: 80%;
    height: 80%;
    position: absolute;
    z-index: 2;
    top: 10%;
    left: 10%;
    border-radius: 50%
}

.np-shadow-border-circle-push:hover::before {
    box-shadow: 6px 6px 16px 0px #dde4ef, -6px -6px 16px 0px #fff, inset 0px 0px 0px 0px #dde4ef, inset 0px 0px 0px 0px #fff
}

a {
    color: #75a1e5;
    text-decoration: none
}

a:hover {
    color: #e28ae8;
    text-decoration: none;
    cursor: pointer
}

a.selected {
    color: #e28ae8;
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff
}

a.active {
    color: #e28ae8;
    box-shadow: 0px 0px 0px 0px #dde4ef, 0px 0px 0px 0px #fff, inset 6px 6px 16px 0px #dde4ef, inset -6px -6px 16px 0px #fff
}