body {
    margin: 0;
    font-family: 'Montserrat', sans-serif !important;
    letter-spacing: 1.2px;
}

.notifSub {
    display: none;
}

tspan {
    white-space: inherit;
    display: none;
}

.bg-gray {
    background-color: #eee;
}

.bg-ebeb {
    background-color: #ebebeb !important;
}

.bg-fafa {
    background-color: #fafafa !important;
}

.bg-resault {
    background-image: url('../../images/bg-resault.png');
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

input:focus {
    border: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
    outline: none !important;
}

section {
    z-index: 1023;
    height: 100vh;
    overflow: hidden;
}

.title-content h2 {
    font-weight: bold;
    text-align: center;
}

.center {
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
}

img {
    width: 100%;
}

.page-wrapper {
    height: 100vh;
    overflow: hidden;
}

a {
    text-decoration: none !important;
}
a small {
    color: #dbddf1;
}

/**
 * For the full copyright and license information, please view the LICENSE
 * file that was distributed with this source code.
 *
 * @author         Alfian Imanuddin
 * @copyright      Copyright (c) http://alfianimanuddin.com 
*/
@-webkit-keyframes leftright {
    0% {
        left: 0px;
    }
    50% {
        left: 10px;
    }
    100% {
        left: 0px;
    }
}
@-moz-keyframes leftright {
    0% {
        left: 0px;
    }
    50% {
        left: 10px;
    }
    100% {
        left: 0px;
    }
}
@-o-keyframes leftright {
    0% {
        left: 0px;
    }
    50% {
        left: 10px;
    }
    100% {
        left: 0px;
    }
}
@keyframes leftright {
    0% {
        left: 0px;
    }
    50% {
        left: 10px;
    }
    100% {
        left: 0px;
    }
}

@-webkit-keyframes up-down {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px);
    }
    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}

@-moz-keyframes up-down {
    0% {
        -moz-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -moz-transform: translateY(-100px);
        transform: translateY(-100px);
    }
    100% {
        -moz-transform: translateY(0px);
        transform: translateY(0px);
    }
}

@-o-keyframes up-down {
    0% {
        -o-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -o-transform: translateY(-100px);
        transform: translateY(-100px);
    }
    100% {
        -o-transform: translateY(0px);
        transform: translateY(0px);
    }
}

@keyframes up-down {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(-100px);
        -moz-transform: translateY(-100px);
        -o-transform: translateY(-100px);
        transform: translateY(-100px);
    }
    100% {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
    }
}

@-webkit-keyframes updown {
    0% {
        top: 0px;
    }
    25% {
        top: -6px;
    }
    50% {
        top: 6px;
    }
    75% {
        top: -6px;
    }
    100% {
        top: 0px;
    }
}

@-moz-keyframes updown {
    0% {
        top: 0px;
    }
    25% {
        top: -6px;
    }
    50% {
        top: 6px;
    }
    75% {
        top: -6px;
    }
    100% {
        top: 0px;
    }
}

@-o-keyframes updown {
    0% {
        top: 0px;
    }
    25% {
        top: -6px;
    }
    50% {
        top: 6px;
    }
    75% {
        top: -6px;
    }
    100% {
        top: 0px;
    }
}

@keyframes updown {
    0% {
        top: 0px;
    }
    25% {
        top: -6px;
    }
    50% {
        top: 6px;
    }
    75% {
        top: -6px;
    }
    100% {
        top: 0px;
    }
}

@-webkit-keyframes z-right {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 0;
    }
    50% {
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(40px);
        transform: translateX(40px);
        opacity: 0;
    }
}

@-moz-keyframes z-right {
    0% {
        -moz-transform: translateX(0);
        transform: translateX(0);
        opacity: 0;
    }
    50% {
        -moz-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 1;
    }
    100% {
        -moz-transform: translateX(40px);
        transform: translateX(40px);
        opacity: 0;
    }
}

@-o-keyframes z-right {
    0% {
        -o-transform: translateX(0);
        transform: translateX(0);
        opacity: 0;
    }
    50% {
        -o-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 1;
    }
    100% {
        -o-transform: translateX(40px);
        transform: translateX(40px);
        opacity: 0;
    }
}

@keyframes z-right {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        opacity: 0;
    }
    50% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(40px);
        -moz-transform: translateX(40px);
        -o-transform: translateX(40px);
        transform: translateX(40px);
        opacity: 0;
    }
}

@-webkit-keyframes blink {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 50%;
    }
    100% {
        opacity: 100%;
    }
}

@-moz-keyframes blink {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 50%;
    }
    100% {
        opacity: 100%;
    }
}

@-o-keyframes blink {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 50%;
    }
    100% {
        opacity: 100%;
    }
}

@keyframes blink {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 50%;
    }
    100% {
        opacity: 100%;
    }
}

@-webkit-keyframes sidebar-open {
    0% {
        height: 0;
    }
    100% {
        height: 300px;
    }
}

@-moz-keyframes sidebar-open {
    0% {
        height: 0;
    }
    100% {
        height: 300px;
    }
}

@-o-keyframes sidebar-open {
    0% {
        height: 0;
    }
    100% {
        height: 300px;
    }
}

@keyframes sidebar-open {
    0% {
        height: 0;
    }
    100% {
        height: 300px;
    }
}

@-webkit-keyframes sidebar-close {
    0% {
        height: 300px;
    }
    100% {
        height: 0px;
        display: none;
    }
}

@-moz-keyframes sidebar-close {
    0% {
        height: 300px;
    }
    100% {
        height: 0px;
        display: none;
    }
}

@-o-keyframes sidebar-close {
    0% {
        height: 300px;
    }
    100% {
        height: 0px;
        display: none;
    }
}

@keyframes sidebar-close {
    0% {
        height: 300px;
    }
    100% {
        height: 0px;
        display: none;
    }
}

@-webkit-keyframes opacity {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-moz-keyframes opacity {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-o-keyframes opacity {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes opacity {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes change {
    0% {
        margin-top: 0;
    }
    15% {
        margin-top: 0;
    }
    25% {
        margin-top: -40px;
    }
    40% {
        margin-top: -40px;
    }
    50% {
        margin-top: -80px;
    }
    65% {
        margin-top: -80px;
    }
    75% {
        margin-top: -40px;
    }
    85% {
        margin-top: -40px;
    }
    100% {
        margin-top: 0;
    }
}

@-moz-keyframes change {
    0% {
        -moz-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    15% {
        -moz-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    30% {
        -moz-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    40% {
        -moz-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    50% {
        -moz-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    60% {
        -moz-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    70% {
        -moz-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    80% {
        -moz-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    90% {
        -moz-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
    100% {
        -moz-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
}

@-o-keyframes change {
    0% {
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    15% {
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    30% {
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    40% {
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    50% {
        -o-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    60% {
        -o-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    70% {
        -o-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    80% {
        -o-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    90% {
        -o-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
    100% {
        -o-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
}

@keyframes change {
    0% {
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    15% {
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    30% {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    40% {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    50% {
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    60% {
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translateY(80px);
        -moz-transform: translateY(80px);
        -o-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    80% {
        -webkit-transform: translateY(80px);
        -moz-transform: translateY(80px);
        -o-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    90% {
        -webkit-transform: translateY(-80px);
        -moz-transform: translateY(-80px);
        -o-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(-80px);
        -moz-transform: translateY(-80px);
        -o-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
}

@-webkit-keyframes change2 {
    0% {
        margin-bottom: 0;
    }
    15% {
        margin-bottom: 0;
    }
    25% {
        margin-bottom: -40px;
    }
    40% {
        margin-bottom: -40px;
    }
    50% {
        margin-bottom: -80px;
    }
    65% {
        margin-bottom: -80px;
    }
    75% {
        margin-bottom: -40px;
    }
    85% {
        margin-bottom: -40px;
    }
    100% {
        margin-bottom: 0;
    }
}

@-moz-keyframes change2 {
    0% {
        -moz-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    15% {
        -moz-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    30% {
        -moz-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    40% {
        -moz-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    50% {
        -moz-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    60% {
        -moz-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    70% {
        -moz-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    80% {
        -moz-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    90% {
        -moz-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
    100% {
        -moz-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
}

@-o-keyframes change {
    0% {
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    15% {
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    30% {
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    40% {
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    50% {
        -o-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    60% {
        -o-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    70% {
        -o-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    80% {
        -o-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    90% {
        -o-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
    100% {
        -o-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
}

@keyframes change2 {
    0% {
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    15% {
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        opacity: 0;
    }
    30% {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    40% {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    50% {
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    60% {
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translateY(80px);
        -moz-transform: translateY(80px);
        -o-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    80% {
        -webkit-transform: translateY(80px);
        -moz-transform: translateY(80px);
        -o-transform: translateY(80px);
        transform: translateY(80px);
        opacity: 0;
    }
    90% {
        -webkit-transform: translateY(-80px);
        -moz-transform: translateY(-80px);
        -o-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(-80px);
        -moz-transform: translateY(-80px);
        -o-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
}

.title.home-page {
    width: 100%;
    font-size: 36px;
    line-height: 40px;
    font-family: 'Muli';
    color: #ecf0f1;
    height: 40px;
}
.title.home-page h1 {
    position: absolute;
    font-family: 'Montserrat', sans-serif !important;
    line-height: 40px;
    margin: 0;
    font-weight: 600;
    color: white;
    font-size: 60px;
    opacity: 0;
}

.title.home-page h1:nth-of-type(2) {
    position: absolute;
    font-family: 'Montserrat', sans-serif !important;
    line-height: 40px;
    margin: 0px 100px 0px 0px;
    font-weight: 600;
    color: white;
    font-size: 60px;
    opacity: 0;
}

.title.home-page h1:first-of-type {
    -webkit-animation: 12s linear 0s normal none infinite change;
    -moz-animation: 12s linear 0s normal none infinite change;
    -o-animation: 12s linear 0s normal none infinite change;
    animation: 12s linear 0s normal none infinite change;
}
.title.home-page h1:nth-of-type(2) {
    -webkit-animation: 12s linear 3s normal none infinite change2;
    -moz-animation: 12s linear 3s normal none infinite change2;
    -o-animation: 12s linear 3s normal none infinite change2;
    animation: 12s linear 3s normal none infinite change2;
}
.title.home-page h1:nth-of-type(3) {
    -webkit-animation: 12s linear 6s normal none infinite change;
    -moz-animation: 12s linear 6s normal none infinite change;
    -o-animation: 12s linear 6s normal none infinite change;
    animation: 12s linear 6s normal none infinite change;
}
.title.home-page h1:nth-of-type(4) {
    -webkit-animation: 12s linear 9s normal none infinite change;
    -moz-animation: 12s linear 9s normal none infinite change;
    -o-animation: 12s linear 9s normal none infinite change;
    animation: 12s linear 9s normal none infinite change;
}

.header-top {
    background-image: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#194587),
        to(#5090ae)
    );
    background-image: -webkit-linear-gradient(left, #194587, #5090ae);
    background-image: -moz-linear-gradient(left, #194587, #5090ae);
    background-image: -o-linear-gradient(left, #194587, #5090ae);
    background-image: linear-gradient(to right, #194587, #5090ae);
    height: 100vh;
    width: 100%;
    overflow: hidden;
}
.header-top .title.home-page {
    position: relative;
    top: 0;
    width: 100%;
}
.header-top .title.home-page h1 {
    width: 100%;
    text-align: center;
    font-weight: 600;
    color: white;
    font-size: 60px;
}
.header-top .scroll-down {
    font-weight: bold;
    font-size: 12px;
    text-align: center;
    position: absolute;
    bottom: 10vh;
    left: 0;
    right: 0;
    z-index: 2;
}
.header-top .scroll-down a {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 300;
    color: white;
}
@media only screen and (max-width: 767px) {
    .header-top .scroll-down a {
        color: #3a3a3a;
    }
}
@media only screen and (max-width: 767px) {
    .header-top .scroll-down a span svg {
        color: #3a3a3a;
    }
}
.header-top .scroll-down a:hover {
    color: black !important;
    text-decoration: none;
}
.header-top .scroll-down a:hover svg {
    fill: black;
}
.header-top .scrollBtnEffect span {
    position: relative;
    top: 30px;
    -webkit-animation-name: updown;
    -moz-animation-name: updown;
    -o-animation-name: updown;
    animation-name: updown;
    -webkit-animation-duration: 3s;
    -moz-animation-duration: 3s;
    -o-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-direction: linear;
    -moz-animation-direction: linear;
    -o-animation-direction: linear;
    animation-direction: linear;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.header {
    margin-bottom: -37px;
}
.header .title {
    margin-top: 2rem;
    margin-bottom: 2rem;
}
.header .title h1 {
    width: 100%;
    text-align: center;
    font-weight: 600;
    color: white;
    font-size: 60px;
}
.header .title p {
    text-align: center;
    color: white;
    font-weight: 100;
    height: 85px;
}
.header .item {
    padding-top: 35px;
}
.header .owl-stage-outer {
    background-color: #00032f;
}
.header .owl-dots {
    position: relative;
    top: -65px;
}
.header .owl-dot span {
    background-color: #1a2935 !important;
}
.header .owl-dot.active span {
    width: 60px !important;
}
.header .photo-sleep {
    width: 100%;
}

.navbar {
    background-color: #00032f;
    z-index: 1024;
    -webkit-transition: 1s;
    -o-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
}
.navbar .navbar-brand img {
    width: 73px;
    height: 55px;
}
.navbar .nav-item.active:after {
    border: 1px solid white;
    height: 2px;
    width: 100%;
}
.navbar .nav-item {
    position: relative;
}
.navbar .nav-item .mattress-btn {
    background-color: white;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    font-size: 12px;
    padding-left: 17px !important;
    padding-top: 10px !important;
    min-height: 34px;
    min-width: 145px;
    color: #00032f !important;
    font-weight: bold !important;
}
.navbar .nav-item.active:after {
    content: '';
    width: 100%;
    border-bottom: 1px solid white;
    position: absolute;
    left: 0;
    bottom: -8px;
}
.navbar .nav-item:after {
    -webkit-transition: 0.8s;
    -o-transition: 0.8s;
    -moz-transition: 0.8s;
    transition: 0.8s;
    content: '';
    width: 0;
    border-bottom: 1px solid white;
    position: absolute;
    left: 0;
    bottom: -8px;
}
.navbar .nav-item:hover:after {
    -webkit-transition: 0.8s;
    -o-transition: 0.8s;
    -moz-transition: 0.8s;
    transition: 0.8s;
    content: '';
    width: 100%;
    border-bottom: 1px solid white;
    position: absolute;
    left: 0;
    bottom: -8px;
}
.navbar .nav-link {
    font-weight: 300;
    font-size: 10pt;
    max-height: 35px;
    overflow: hidden;
}
.navbar input[type='search'] {
    visibility: hidden;
    width: 0;
    -webkit-transition: 1s;
    -o-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
    font-weight: 600;
    color: white;
}
.navbar .nav-link.login-nav {
    font-weight: 600 !important;
    color: white !important;
}

.sidebar-wrapper {
    background-color: #00032f;
    display: none;
    height: 0;
    top: 81px;
    z-index: 1020;
    position: -webkit-sticky;
    position: sticky;
    overflow: hidden;
}
.sidebar-wrapper ul {
    list-style: none;
    padding: 0;
}
.sidebar-wrapper ul a {
    font-size: 10pt;
    color: white;
}
.sidebar-wrapper ul .mattress-btn {
    background-color: white;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    font-size: 10px;
    text-align: center;
    padding-top: 10px !important;
    min-height: 34px;
    min-width: 100%;
    color: #00032f !important;
    font-weight: bold !important;
}
.sidebar-wrapper .search-btn-wrapper {
    padding-left: 15px;
}
.sidebar-wrapper .search-column {
    width: 100%;
}

i.far.fa-registered {
    position: absolute;
    font-size: 24px;
}

#about {
    background-image: url('../../images/bg-about.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
}
#about .about {
    margin-top: 30vh;
}
@media only screen and (max-width: 767px) {
    #about .about {
        margin-top: 10vh;
    }
}
#about .about .title-about {
    font-family: 'Nunito Sans', sans-serif;
    text-align: center;
}
#about .about .title-about h2 {
    font-size: 44px;
    letter-spacing: 1.05px;
    font-weight: 300;
    color: #3c3f58 !important;
}
#about .about .title-about h2 span {
    font-weight: 900;
}
#about .about .title-about span {
    position: relative;
}
#about .about .title-about span i.far.fa-registered {
    bottom: 32px;
    right: -20px;
}
#about .about .title-about img {
    width: 75px;
    position: relative;
    bottom: 7px;
}
#about .about .text-content {
    text-align: center;
}
#about .about .text-content p {
    font-size: 13px;
}
#about .photo-about {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
#about .photo-about .domba-about-1 img {
    position: absolute;
}
@media only screen and (min-width: 1200px) {
    #about .photo-about .domba-about-1 img {
        width: 389px;
    }
}
@media only screen and (max-width: 767px) {
    #about .photo-about .domba-about-1 img {
        width: 260px;
    }
}
#about .photo-about .domba-about-2 img {
    position: absolute;
    right: 0;
    top: 10px;
}
@media only screen and (min-width: 1200px) {
    #about .photo-about .domba-about-2 img {
        width: 375px;
    }
}
@media only screen and (max-width: 767px) {
    #about .photo-about .domba-about-2 img {
        width: 250px;
    }
}

.learn-more {
    text-align: center;
}
.learn-more a {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.4px;
    color: #1a2935;
}
.learn-more a:hover {
    text-decoration: none;
}

.hoverRightEffect span {
    position: relative;
    left: 8px;
    top: 1px;
}

.hoverRightEffect:hover span {
    -webkit-animation-name: leftright;
    -moz-animation-name: leftright;
    -o-animation-name: leftright;
    animation-name: leftright;
    -webkit-animation-direction: linear;
    -moz-animation-direction: linear;
    -o-animation-direction: linear;
    animation-direction: linear;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
}

/*--features style--*/
#features {
    background-color: #f5f5f7;
    height: 100vh;
    position: relative;
    color: #000000;
}

#features .title-features {
    padding-top: 3vh;
    text-align: center;
}
#features .title-features h1 {
    font-weight: bold;
}
#features .img-features {
    margin-top: 67px;
    width: 623px;
    display: inline-block;
    z-index: 10;
    position: relative;
}
@media only screen and (min-width: 1200px) {
    #features .img-features {
        width: 623px;
    }
}
@media only screen and (max-width: 767px) {
    #features .img-features {
        width: 350px;
    }
}
@media only screen and (max-width: 767px) {
    #features .img-features #img-f-0 {
        bottom: -10px;
        height: auto;
    }
}
@media only screen and (max-width: 767px) {
    #features .img-features #img-f-5 {
        bottom: 96px;
        height: auto;
    }
}
#features .text-features {
    max-width: 467px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #1a2935;
}

.overlay {
    position: absolute;
    -webkit-transition: 0.8s;
    -o-transition: 0.8s;
    -moz-transition: 0.8s;
    transition: 0.8s;
    top: 0;
    background: #00032f;
    width: 100%;
    height: 100vh;
    opacity: 0.5;
}

.feature-big-wrapper {
    background-color: #e3e3e3;
}

#features p {
    font-size: 14px;
    color: #000000;
    font-weight: 600;
}

#img-f-0 {
    position: relative;
    bottom: -50px;
    z-index: 3;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
}

#img-f-1 {
    position: relative;
    bottom: 10px;
    z-index: 2;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
}

#img-f-2 {
    position: relative;
    bottom: 40px;
}

#img-f-3 {
    position: relative;
    bottom: 66px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
}

#img-f-4 {
    position: relative;
    bottom: 93px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
}

#img-f-5 {
    position: relative;
    bottom: 116px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
}

#img-f-f.fadeOut {
    -webkit-animation: fadeOut 1s ease-out 0s alternate both;
    -moz-animation: fadeOut 1s ease-out 0s alternate both;
    -o-animation: fadeOut 1s ease-out 0s alternate both;
    animation: fadeOut 1s ease-out 0s alternate both;
}

#img-f-f.fadeIn {
    -webkit-animation: fadeIn 1s ease-out 0s alternate both;
    -moz-animation: fadeIn 1s ease-out 0s alternate both;
    -o-animation: fadeIn 1s ease-out 0s alternate both;
    animation: fadeIn 1s ease-out 0s alternate both;
}

#collection {
    padding-top: 10vh;
    padding-bottom: 10vh;
}
@media only screen and (max-width: 767px) {
    #collection .row.mobile-style {
        margin-left: auto;
        margin-right: auto;
    }
}
#collection .title-features h3 {
    text-align: center;
    font-weight: bold;
    font-size: 40px !important;
}
#collection .text-collection {
    max-width: 625px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #1a2935;
}
#collection .collection-1 {
    background-color: #2b2a2a9d;
    float: right;
    width: 100%;
    height: 214px;
    line-height: 200px;
    text-align: center;
}
#collection .collection-1 .product-name {
    width: 60%;
    margin: auto;
}
#collection .collection-1 .product-name img {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 60%;
}
#collection .collection-1 p {
    text-align: center;
    color: white;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 24px;
    font-weight: 300;
    vertical-align: middle;
    display: inline-block;
    line-height: 1.5;
}
#collection .collection-1.big-collection {
    line-height: 456.59px;
}
#collection .collect-1Wrapper {
    width: 100%;
    height: 214px;
    background-image: url('../../images/bed-1.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
#collection .collect-2Wrapper {
    width: 100%;
    height: 214px;
    background-image: url('../../images/bed-2.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
#collection .collect-3Wrapper {
    width: 100%;
    height: 214px;
    background-image: url('../../images/bed-4.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
#collection .collect-4Wrapper {
    width: 100%;
    height: 214px;
    background-image: url('../../images/bed-3.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
#collection .collect-5Wrapper {
    width: 100%;
    height: 214px;
    background-image: url('../../images/bed-6.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
    padding-left: 0px !important;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
#collection .collect-6Wrapper {
    width: 100%;
    height: 214px;
    background-image: url('../../images/bed-6.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
#collection .collect-6Wrapper .collection-6 {
    background-color: #2b2a2a9d;
    float: left;
    height: 214px;
    width: 100%;
}
#collection .collect-6Wrapper .collection-6 p {
    margin-top: 72px;
    text-align: center;
    color: white;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 24px;
}

a.hover-effect-1 .collection-1 {
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background-color: #0000004b;
    opacity: 1;
    overflow: hidden;
    padding-left: 0;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    -moz-transition: 1.5s;
    transition: 1.5s;
}

a.hover-effect-1:hover .collection-1Wrapper {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

a.hover-effect-1:hover .collection-1 {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0;
}

a.hover-effect-1 .collection-2 {
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background-color: #2b2a2a9d;
    opacity: 1;
    overflow: hidden;
    padding-left: 0;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    -moz-transition: 1.5s;
    transition: 1.5s;
}

.collection-2Wrapper {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

a.hover-effect-1:hover .collection-2 {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0;
}

a.hover-effect-1 .collection-3 {
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background-color: #2b2a2a9d;
    opacity: 1;
    overflow: hidden;
    padding-left: 0;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    -moz-transition: 1.5s;
    transition: 1.5s;
}

.collection-3Wrapper {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

a.hover-effect-1:hover .collection-3 {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0;
}

a.hover-effect-1 .collection-4 {
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background-color: #2b2a2a9d;
    opacity: 1;
    overflow: hidden;
    padding-left: 0;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    -moz-transition: 1.5s;
    transition: 1.5s;
}

.collection-4Wrapper {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

a.hover-effect-1:hover .collection-4 {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0;
}

a.hover-effect-1 .collection-5 {
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background-color: #2b2a2a9d;
    opacity: 1;
    overflow: hidden;
    padding-left: 0;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    -moz-transition: 1.5s;
    transition: 1.5s;
}

.collection-5Wrapper {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

a.hover-effect-1:hover .collection-5 {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0;
}

a.hover-effect-1 .collection-6 {
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background-color: #2b2a2a9d;
    opacity: 1;
    overflow: hidden;
    padding-left: 0;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    -moz-transition: 1.5s;
    transition: 1.5s;
}

.collection-6Wrapper {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

a.hover-effect-1:hover .collection-6 {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0;
}

#augmented {
    padding-top: 5vh;
    padding-bottom: 10vh;
    background-image: url('../../images/bg-AR.png');
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    overflow: hidden;
}
#augmented .ar-wrapper {
    text-align: center;
}

.title-ar {
    margin-top: 92px;
}

.title-ar h2 {
    font-family: 'Nunito Sans', sans-serif !important;
    font-size: 40px !important;
    font-weight: 600 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff !important;
}
@media only screen and (max-width: 767px) {
    .title-ar h2 {
        font-size: 30px !important;
    }
}

.arContent {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    max-width: 479px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}

.title-download {
    margin-top: 99px;
}
.title-download h4 {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600;
    color: white;
}

.phone {
    position: relative;
}

.promotion {
    padding-top: 10vh;
    padding-bottom: 5vh;
    background: #eeeeee;
}
.promotion .big-promotion {
    min-height: 299px;
    text-align: center;
    background-color: white;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
@media only screen and (max-width: 767px) {
    .promotion .big-promotion {
        min-height: unset;
    }
}
.promotion .big-promotion .serta-promotion {
    margin-left: auto;
    margin-right: auto;
    max-width: 218px;
    background-color: #00032f;
    min-height: 74px;
    color: white;
    font-size: 20px;
    padding-top: 20px;
}
.promotion .big-promotion .discount {
    font-size: 16pt;
    font-weight: bold;
}
.promotion .big-promotion .discount h2 {
    font-size: 52px !important;
    font-weight: bold;
    margin: 0;
}
@media only screen and (max-width: 767px) {
    .promotion .big-promotion .discount h2 {
        font-size: 30px !important;
    }
}
@media only screen and (max-width: 767px) {
    .promotion .big-promotion .discount span {
        font-size: 14px;
    }
}
.promotion .big-promotion .photo-ipedic {
    text-align: center;
}
.promotion .big-promotion .photo-ipedic img {
    width: 127px;
}
.promotion .big-promotion .syarat {
    margin-bottom: 10px;
}
@media only screen and (max-width: 767px) {
    .promotion .big-promotion .syarat small {
        font-size: 10px;
    }
}
.promotion .text-content {
    max-width: 625px;
}
.promotion .text-content p {
    color: #1a2935;
    font-size: 12px;
}
.promotion .photo-discount-big {
    max-height: 440px;
    overflow: hidden;
}
@media only screen and (max-width: 767px) {
    .promotion .photo-discount-big {
        max-height: 100%;
        height: 100%;
    }
}
.promotion .photo-discount-big img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.news-box {
    min-height: 300px;
    background: white;
    padding-bottom: 10px;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
.news-box p {
    font-size: 16px;
    font-weight: 600;
    color: #3c3f58;
    letter-spacing: 2px;
    line-height: 24px;
}
.news-box .news-photo img {
    width: 100%;
    height: 186px;
    -o-object-fit: cover;
    object-fit: cover;
}
.news-box .news-content {
    height: 100%;
    padding-left: 40px;
    padding-right: 40px;
}
.news-box .news-content p {
    min-height: 72px;
    padding-top: 24px;
}
.news-box small {
    padding-left: 40px;
}

.promotion-detail .big-promotion {
    min-height: 299px;
    text-align: center;
    background-color: white;
    -webkit-border-bottom-left-radius: 5.4px;
    -moz-border-radius-bottomleft: 5.4px;
    border-bottom-left-radius: 5.4px;
    -webkit-border-bottom-right-radius: 5.4px;
    -moz-border-radius-bottomright: 5.4px;
    border-bottom-right-radius: 5.4px;
    overflow: hidden;
}
@media only screen and (max-width: 767px) {
    .promotion-detail .big-promotion {
        min-height: unset;
    }
}
.promotion-detail .big-promotion .serta-promotion {
    margin-left: auto;
    margin-right: auto;
    max-width: 218px;
    background-color: #00032f;
    min-height: 74px;
    color: white;
    font-size: 20px;
    padding-top: 20px;
}
@media only screen and (max-width: 767px) {
    .promotion-detail .big-promotion .serta-promotion {
        font-size: 16px;
    }
}
.promotion-detail .big-promotion .photo-discount-big {
    height: 100%;
}
.promotion-detail .big-promotion .photo-discount-big img {
    -o-object-fit: cover;
    object-fit: cover;
}
@media only screen and (max-width: 767px) {
    .promotion-detail .big-promotion .photo-discount-big img {
        height: 100%;
    }
}
.promotion-detail .big-promotion .discount {
    font-size: 16pt;
    font-weight: bold;
}
.promotion-detail .big-promotion .discount h2 {
    font-size: 52px !important;
    font-weight: bold;
    margin: 0;
}
@media only screen and (max-width: 767px) {
    .promotion-detail .big-promotion .discount h2 {
        font-size: 30px !important;
    }
}
@media only screen and (max-width: 767px) {
    .promotion-detail .big-promotion .discount span {
        font-size: 14px;
    }
}
.promotion-detail .big-promotion .photo-ipedic {
    text-align: center;
}
.promotion-detail .big-promotion .photo-ipedic img {
    width: 127px;
}
.promotion-detail .big-promotion .syarat {
    margin-bottom: 10px;
}
@media only screen and (max-width: 767px) {
    .promotion-detail .big-promotion .syarat small {
        font-size: 10px;
    }
}

.page-number-wrapper {
    display: table;
    margin-left: auto;
    margin-right: auto;
}
.page-number-wrapper .page-number {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.page-number-wrapper .page-number .btn-content.active {
    width: 20px;
    height: 20px;
    background-color: #1a2935 !important;
    color: white;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
}
.page-number-wrapper .page-number .btn-content {
    background: none;
    outline: none !important;
    border: none;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}
.page-number-wrapper button {
    color: #1a2935;
    font-weight: 600;
    cursor: pointer;
    font-size: 12px;
}

.news-title h2 {
    font-weight: 600;
}

.share-sosmed {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.share-sosmed .icon-sosmed.news-detail {
    margin-left: 10px;
}
.share-sosmed .icon-sosmed.news-detail a {
    margin-left: 7px;
}
.share-sosmed .icon-sosmed.news-detail a img {
    width: 23px;
}

.news-detail-photo {
    margin-left: auto;
    margin-right: auto;
    max-width: 751px;
}

.news-detail-content p {
    font-size: 12px;
    color: #1a2935;
}

.related-news h2 {
    font-weight: normal;
    font-size: 40px;
}

/*--Store-Style--*/
#store {
    background-image: url('../../images/bg-store.png');
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 405px;
    line-height: 405px;
    text-align: center;
}
#store .store-wrapper {
    display: inline-block;
    vertical-align: middle;
}

.title-store h2 {
    text-align: center;
    font-size: 40px;
    font-weight: 600;
    color: white !important;
}

.text-store {
    margin-top: 20px;
    max-width: 501px;
    font-size: 12px;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}

/*--Subscribe-Style--*/
#subs {
    padding-top: 47px;
}
#subs .subsWrapper .subs {
    margin-bottom: 5vh;
}
#subs .titleCenter {
    text-align: center;
}
#subs .titleCenter h2 {
    font-weight: 800;
    font-size: 40px;
    color: #1a2935;
}

.text-subs {
    max-width: 625px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #1a2935;
}

.inputEmail {
    padding-top: 9px;
    padding-left: 29px;
    padding-right: 10px;
    text-align: center;
    margin-top: 47px;
    height: 57px;
    border: 1px solid #a1a1a1;
    -webkit-border-radius: 5.62px;
    -moz-border-radius: 5.62px;
    border-radius: 5.62px;
    -webkit-box-shadow: 0 2px 14px 0 rgba(207, 207, 207, 0.5);
    -moz-box-shadow: 0 2px 14px 0 rgba(207, 207, 207, 0.5);
    box-shadow: 0 2px 14px 0 rgba(207, 207, 207, 0.5);
    background-color: white;
}
@media only screen and (min-width: 1200px) {
    .inputEmail {
        width: 481px;
    }
}
@media only screen and (max-width: 767px) {
    .inputEmail {
        width: 80%;
    }
}
.inputEmail input[type='email'] {
    width: 200px;
    margin-top: 5px;
    float: left;
    border: 0;
}
@media only screen and (min-width: 1200px) {
    .inputEmail input[type='email'] {
        width: 200px;
    }
}
@media only screen and (max-width: 767px) {
    .inputEmail input[type='email'] {
        width: 120px;
    }
}

.password-input {
    position: relative;
}
.password-input .btn-visible {
    top: 7px;
    width: 24px;
    height: 24px;
    position: absolute;
    right: 28px;
    background: transparent;
}
.password-input .btn-visible:focus {
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.btn-custom {
    float: right;
    width: 132px;
    height: 40px;
    position: relative;
    bottom: 2px;
    color: white;
    -webkit-border-radius: 30px !important;
    -moz-border-radius: 30px !important;
    border-radius: 30px !important;
    font-family: 'Nunito Sans', sans-serif;
    background-color: #1a2935;
    padding: 9px 30px 9px 30px !important;
}
@media only screen and (max-width: 767px) {
    .btn-custom {
        padding: 5px 15px 5px 15px !important;
        font-size: 10pt;
        width: 100px;
    }
}

#register {
    padding-bottom: 30px;
    height: unset;
}
#register .login {
    margin-bottom: 0px;
}

.header.child-page {
    height: 260px;
    overflow: hidden;
}
@media only screen and (max-width: 767px) {
    .header.child-page {
        height: auto;
    }
}
.header.child-page .photo-header {
    position: relative;
}
.header.child-page .photo-header img {
    max-height: 260px;
    -o-object-fit: cover;
    object-fit: cover;
}
.header.child-page .photo-header .header-title {
    text-align: center;
    position: absolute;
    top: 50%;
    width: 100%;
}
@media only screen and (max-width: 767px) {
    .header.child-page .photo-header .header-title {
        top: 25%;
    }
}
.header.child-page .photo-header .header-title h2 {
    font-weight: 800;
}

@media only screen and (max-width: 767px) {
    .content.child-page {
        padding-top: 0px !important;
    }
}

.content.child-page h5 {
    font-weight: 600;
    font-size: 16px;
}

.content.child-page p {
    font-size: 16px;
}

/*--footer style--*/
#footer {
    background-color: #00032f;
    padding-top: 28px;
    margin-bottom: -28px;
}
@media only screen and (max-width: 767px) {
    #footer {
        padding-bottom: 25px;
    }
}
#footer .logoFooter {
    width: 126px;
    margin-bottom: 15px;
}
#footer .aboutFooter {
    max-width: 313px;
    font-family: 'PT Sans', sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
#footer .aboutMenuFooter {
    line-height: 1;
}
#footer .title-menu-footer span i {
    font-size: 12px;
}
#footer .title-menu-footer h5 {
    font-family: 'Heebo', sans-serif !important;
    font-size: 16px !important;
    line-height: 1.56 !important;
    color: white !important;
}
@media only screen and (min-width: 1200px) {
    #footer .about-menu-footer {
        padding-left: 2.3rem;
    }
}
@media only screen and (min-width: 1200px) {
    #footer .custom-footer {
        padding-left: 1.3rem;
    }
}
#footer .menuFooter {
    padding-left: 0;
}
#footer .menuFooter li {
    text-decoration: none;
    list-style: none;
}
#footer .menuFooter li a {
    position: relative;
    font-family: 'PT Sans', sans-serif;
    font-size: 12px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.67;
    letter-spacing: normal;
    color: #ffffff;
    text-decoration: none;
}
#footer .imgNumber1 {
    width: 70%;
}
@media only screen and (max-width: 767px) {
    #footer .imgNumber1 {
        padding-top: 0px;
        width: 80%;
    }
}
#footer .img-women {
    width: 70%;
}
@media only screen and (max-width: 767px) {
    #footer .img-women {
        width: 80%;
    }
}
#footer .sosmed {
    letter-spacing: 20px;
    margin-top: 15px;
}
#footer .sosmed i {
    color: white;
    font-size: 12pt;
}
#footer .sosmed-button {
    padding-left: 15px;
    padding-top: 20px;
}
#footer .sosmed-button a {
    margin-left: 20px;
}
#footer .copyright {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    bottom: 35px;
    max-width: 313px;
    font-family: 'PT Sans', sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
#footer .copyright p {
    position: absolute;
}
@media only screen and (max-width: 767px) {
    #footer .copyright {
        margin-left: unset;
        bottom: 3px;
    }
}

#production-detail {
    background-color: #f8f8f8;
    padding-top: 77px;
}
@media only screen and (max-width: 767px) {
    #production-detail {
        padding-top: 35px;
    }
}
#production-detail .title-page {
    text-align: center;
}
#production-detail .title-page h2 {
    font-weight: 800;
}
#production-detail .title-page img {
    width: 200px;
}
#production-detail .text-content {
    text-align: center;
    max-width: 671px;
    margin-left: auto;
    margin-right: auto;
}
#production-detail .text-content p {
    font-size: 12px;
}
#production-detail .product-box {
    margin-bottom: 30px;
    background-color: white;
    padding-bottom: 15px;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
#production-detail .product-box a {
    text-decoration: none;
}
#production-detail .product-box a:hover h3 {
    text-decoration: none !important;
}
#production-detail .product-box h3 {
    padding-left: 15px;
    color: #3c3f58;
    font-weight: 600;
    margin-top: 15px;
}
#production-detail .product-box img {
    max-height: 191px;
    -o-object-fit: cover;
    object-fit: cover;
}
#production-detail .product-box.product-serta {
    position: relative;
    padding-bottom: 0;
}
#production-detail .product-box.product-serta .collection-1 {
    text-align: center;
    position: absolute;
    width: 100%;
    height: 222px;
    max-height: 222px;
    display: table;
}
#production-detail .product-box.product-serta .collection-1 img {
    max-width: 169px;
    max-height: 63px;
    -o-object-fit: contain;
    object-fit: contain;
}
#production-detail .product-box.product-serta .collection-1 P {
    font-size: 21.6px;
    color: white;
    font-weight: 600;
    display: table-cell;
    vertical-align: middle;
}
#production-detail .product-box.product-serta img {
    -o-object-fit: cover;
    object-fit: cover;
    min-height: 222px;
    max-height: 222px;
}
#production-detail .product-box.product-serta img.top {
    -o-object-position: top;
    object-position: top;
}

#product-detail {
    padding-bottom: 30px;
}
#product-detail .type-product {
    text-align: center;
    margin-bottom: 40px;
}
#product-detail .type-product h1 {
    font-size: 46px !important;
    color: #3c3f58;
    font-weight: 800;
}
#product-detail .photo-product {
    margin-bottom: 50px;
}
#product-detail .photo-product img {
    width: 100%;
    /* max-height: 60vh; */
    -o-object-fit: cover;
    object-fit: cover;
}
#product-detail .detail-product h4 {
    color: #3c3f58;
    font-weight: 600;
}
#product-detail .owl-nav {
    position: absolute;
    bottom: 39px;
    right: 0px;
}
#product-detail .owl-nav button:focus {
    outline: none !important;
}
#product-detail .owl-nav .owl-prev {
    margin: 0;
    background-color: #00032f;
    color: white;
    width: 42px;
    height: 40px;
    font-size: 40px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-weight: 600;
}
#product-detail .owl-nav .owl-prev span {
    position: relative;
    bottom: 13px;
}
#product-detail .owl-nav .owl-next {
    margin: 0;
    background-color: #00032f;
    color: white;
    width: 42px;
    height: 40px;
    font-size: 40px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-weight: 600;
}
#product-detail .owl-nav .owl-next span {
    position: relative;
    bottom: 13px;
}

.login {
    margin-bottom: -81px;
}
.login .title-page {
    text-align: center;
}
.login .title-page h1 {
    font-weight: 600;
    color: #1a2935;
}
.login .text-page {
    text-align: center;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.login .text-page p {
    font-size: 14px;
    display: inline-block;
}
.login .form-login {
    padding-right: 20%;
    padding-left: 20%;
}
@media only screen and (max-width: 767px) {
    .login .form-login {
        padding-left: 5%;
        padding-right: 5%;
    }
}
.login .form-login input {
    min-height: 48px;
    -webkit-border-radius: 30px !important;
    -moz-border-radius: 30px !important;
    border-radius: 30px !important;
    border: 0.8px solid #989898;
}
.login .login-sosmed {
    text-align: center;
}
.login .login-sosmed small {
    font-weight: 600;
}
.login .login-sosmed .icon-sosmed img {
    margin-left: 18px;
    margin-right: 18px;
    width: 55.6px;
}
.login .button-login {
    text-align: center;
}
.login .button-login .btn-login {
    background: #00032f;
    color: white;
    font-weight: 600;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    width: 60%;
    height: 48px;
}
.login .forgot-pass {
    text-align: center;
}
.login .forgot-pass a {
    font-size: 12px;
    color: #0f89dd;
    font-weight: 600;
}

#reset-pass {
    height: 70vh;
}
@media only screen and (max-width: 767px) {
    #reset-pass {
        height: 100vh;
    }
}

#contact-us .maps img {
    width: 80%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#contact-us .text-page p {
    font-size: 12px;
    width: 100%;
    margin: 0;
}

#contact-us .text-page span {
    font-size: 12px;
}

#contact-us .btn-send {
    background: #00032f;
    -webkit-border-radius: 32px;
    -moz-border-radius: 32px;
    border-radius: 32px;
    font-weight: 600;
    min-width: 245px;
    color: white;
}

#contact-us .contact2-textarea .form-control {
    height: 123px;
}

#contact-us {
    background: url(../../images/backgroundok.jpg);
    background-size: cover;
}

.product-care {
    background: url(../../images/backgroundok.jpg);
    background-size: cover;
}

.warranty {
    background: url(../../images/backgroundok.jpg);
    background-size: cover;
}

.csr {
    background: url(../../images/backgroundok.jpg);
    background-size: cover;
}

.multimedia .title-page h3 {
    font-weight: 600;
}

.child-page h5 {
    margin-bottom: 25px;
    font-weight: bold !important;
    color: #1a2935;
    font-size: 16px !important;
}

.child-page span {
    font-weight: 800;
    font-size: 12px;
    color: #1a2935;
}

.child-page .title-page {
    text-align: center;
}
.child-page .title-page h5 {
    font-weight: 600;
    color: #3c3f58;
}

.child-page ul {
    padding-left: 20px;
}

.child-page .text-page {
    text-align: center;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.child-page .text-page p {
    font-size: 14px;
    display: inline-block;
}

.child-page .video-wrapper {
    text-align: center;
}
.child-page .video-wrapper iframe {
    width: 100%;
}

.csr .inner-img img {
    height: 295px;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

.faq-pack.faq {
    margin: 33px 0px;
}
.faq-pack.faq .row {
    margin: 0;
}
.faq-pack.faq p {
    display: inline-block;
}
.faq-pack.faq .answer b {
    font-size: 20px !important;
    padding-left: 0px !important;
}
.faq-pack.faq .answer p {
    margin: 0;
    width: 90%;
    margin-left: 10px;
}
.faq-pack.faq .answer ul {
    padding-left: 50px;
}
.faq-pack.faq .expand-btn {
    margin-left: auto;
    display: block;
}
.faq-pack.faq .expand-btn a {
    font-size: 16px;
    text-decoration: none;
    font-weight: 600;
}
.faq-pack.faq .expand-btn a span {
    color: #1a2935 !important;
}

.faq-pack {
    margin: 33px 0px;
}
.faq-pack .row {
    margin: 0;
}
.faq-pack p {
    display: inline-block;
}
.faq-pack .answer p {
    margin: 0;
    width: 90%;
    margin-left: 10px;
}
.faq-pack .answer ul {
    padding-left: 50px;
}
.faq-pack .expand-btn {
    margin-left: auto;
    display: block;
}
.faq-pack .expand-btn a {
    font-size: 16px;
    text-decoration: none;
    font-weight: 600;
    color: #1a2935;
}

.feature ul {
    padding: 0;
    list-style: none;
}
.feature ul li {
    display: inline-table;
}
.feature ul li .icon-img {
    margin-left: 15px;
    margin-right: 15px;
    text-align: center;
}
.feature ul li .icon-img span {
    font-size: 12px;
    color: #3c3f58;
    font-weight: bold;
}
.feature ul li .icon-img img {
    width: 70px;
}

.slide .feature-text-2 {
    padding-top: 80px;
}

.slide .feature-text-3 {
    padding-top: 170px;
}

.slide .feature-text-4 {
    padding-top: 240px;
}

.slide .feature-text-5 {
    padding-top: 360px;
}

@media only screen and (max-width: 767px) {
    .feature ul li .icon-img img {
        margin-top: 10px;
        width: 40px;
    }
    .slide .feature-text-1,
    .slide .feature-text-2,
    .slide .feature-text-3,
    .slide .feature-text-4,
    .slide .feature-text-5 {
        padding-top: 10px;
        height: 180px;
    }

    #features {
        padding-bottom: 20px;
        margin-bottom: 50px;
    }

    #features p {
        font-size: 11px;
    }

    .slick-dots {
        bottom: 0px !important;
    }
}

.sleep-corner-wrapper {
    background-color: #fafafa;
    padding-bottom: 45px;
}
.sleep-corner-wrapper table {
    margin-bottom: 0;
}
.sleep-corner-wrapper table tr td,
.sleep-corner-wrapper table tr th {
    border: none;
    vertical-align: middle;
}
.sleep-corner-wrapper table .note-table {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.sleep-corner-wrapper table .note-table span {
    font-size: 10px;
    font-weight: 600;
    position: relative;
    top: 2px;
}
@media only screen and (min-width: 1200px) {
    .sleep-corner-wrapper table .note-table span {
        min-width: 100px;
    }
    
}
@media only screen and (max-width: 767px) {
    .sleep-corner-wrapper table .note-table span {
        max-width: 72px;
    }
}
.sleep-corner-wrapper table .note-table .status-duration.bad {
    margin-right: 10px;
    top: 4px;
    left: 7px;
    width: 10px;
    height: 10px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background-color: #d30805;
    position: relative;
}
.sleep-corner-wrapper table .note-table .status-duration.normal {
    margin-right: 10px;
    top: 4px;
    left: 7px;
    width: 10px;
    height: 10px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background-color: #fa7b0d;
    position: relative;
}
.sleep-corner-wrapper table .note-table .status-duration.good {
    margin-right: 10px;
    top: 4px;
    left: 7px;
    width: 10px;
    height: 10px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background-color: #00c139;
    position: relative;
}
.sleep-corner-wrapper .profil {
    background-color: white;
    background-image: url('../../images/codigo-super-graphic-artboard-3.png');
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    text-align: center;
}
.sleep-corner-wrapper .profil .photo-profil {
    margin-left: auto;
    margin-right: auto;
    width: 100px;
}
.sleep-corner-wrapper .profil #name {
    font-weight: 600;
    color: #1a2935;
}
.sleep-corner-wrapper .profil #point {
    font-weight: bold;
    color: #1a2935;
}
.sleep-corner-wrapper .title {
    text-align: center;
}
.sleep-corner-wrapper .title h1 {
    font-size: 30px;
    color: #1a2935;
    font-weight: bold;
}
.sleep-corner-wrapper .title p {
    font-size: 14px;
    color: #3c3f58;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.sleep-corner-wrapper .time-sleep {
    text-align: center;
}
.sleep-corner-wrapper .time-sleep span {
    font-size: 40px;
    font-family: 'Heebo', sans-serif;
    font-weight: 900;
}
.sleep-corner-wrapper .time-sleep button {
    min-width: 153px;
    margin-bottom: 20px;
    margin-left: 10px;
    font-size: 18px;
    font-weight: 600;
    height: 41px;
    color: white;
    background-color: #00032f;
    -webkit-box-shadow: 0 5px 6px 0 #00032f;
    -moz-box-shadow: 0 5px 6px 0 #00032f;
    box-shadow: 0 5px 6px 0 #00032f;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
}
.sleep-corner-wrapper .graph-wrapper {
    background-color: white;
    padding-top: 30px;
    text-align: center;
}
.sleep-corner-wrapper .graph-wrapper .title-graph {
    text-align: center;
}
.sleep-corner-wrapper .graph-wrapper .title-graph h2 {
    font-size: 40px;
    color: #1a2935;
    font-weight: bold;
    margin-bottom: 0 !important;
}
.sleep-corner-wrapper .graph-wrapper .title-graph p {
    font-size: 20px;
    color: #1a2935;
    font-weight: bold;
}
.sleep-corner-wrapper .graph-wrapper small {
    font-weight: 600;
}

#chart {
    max-width: 650px;
}

#chart,
.chart-box {
    padding-top: 20px;
    padding-left: 10px;
    background: #fff;
    border: none;
}

select.flat-select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background: #008ffb
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60px' height='60px'><polyline fill='white' points='46.139,15.518 25.166,36.49 4.193,15.519'/></svg>")
        no-repeat scroll right 2px top 9px/16px 16px;
    border: 0 none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    font-family: arial, tahoma;
    font-size: 16px;
    font-weight: bold;
    outline: 0 none;
    height: 33px;
    padding: 5px 20px 5px 10px;
    text-align: center;
    text-indent: 0.01px;
    -o-text-overflow: '';
    text-overflow: '';
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: auto;
    -webkit-transition: 0.3s ease all;
    -moz-transition: 0.3s ease all;
    -o-transition: 0.3s ease all;
    transition: 0.3s ease all;
}

select.flat-select:focus,
select.flat-select:hover {
    border: 0;
    outline: 0;
}

.apexcharts-canvas {
    margin: 0 auto;
}

.share-dream .share-dream-wrapper {
    padding-top: 60px;
    padding-bottom: 44px;
}
.share-dream .share-dream-wrapper .title {
    text-align: center;
}
.share-dream .share-dream-wrapper .title h1 {
    font-size: 30px;
    color: #00032f;
    font-weight: 600;
}
.share-dream .share-dream-wrapper .title p {
    font-size: 14px;
    color: #00032f;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
}
.share-dream .share-dream-wrapper .learn-more a {
    font-size: 14px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.4px;
    color: #00032f;
}

.share-dream-detail .share-dream-wrapper {
    background-color: #fafafa;
    padding-top: 60px;
    padding-bottom: 44px;
}
.share-dream-detail .share-dream-wrapper .title {
    text-align: center;
    margin-bottom: 20px;
}
.share-dream-detail .share-dream-wrapper .title h1 {
    font-size: 30px;
    color: #00032f;
    font-weight: 600;
}
.share-dream-detail .share-dream-wrapper .title p {
    font-size: 14px;
    color: #00032f;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
}

.sleep-graph-wrapper td {
    font-size: 12px;
    color: #1a2935;
    font-weight: 600;
}

.sleep-graph-wrapper th {
    font-size: 12px;
    color: #1a2935;
    font-weight: 800;
}

.sleep-graph-wrapper .duration-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.sleep-graph-wrapper .duration-item .status-duration.bad {
    margin-right: 10px;
    top: 6px;
    width: 10px;
    height: 10px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background-color: #d30805;
    position: relative;
}
.sleep-graph-wrapper .duration-item .status-duration.normal {
    margin-right: 10px;
    top: 6px;
    width: 10px;
    height: 10px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background-color: #fa7b0d;
    position: relative;
}
.sleep-graph-wrapper .duration-item .status-duration.good {
    margin-right: 10px;
    top: 6px;
    width: 10px;
    height: 10px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background-color: #00c139;
    position: relative;
}

.share-dream-box {
    display: table;
    margin-top: 30px;
    width: 100%;
    min-height: 287px;
    -webkit-border-radius: 5.6px;
    -moz-border-radius: 5.6px;
    border-radius: 5.6px;
    -webkit-box-shadow: 0 2px 24px 0 rgba(236, 236, 236, 0.5);
    -moz-box-shadow: 0 2px 24px 0 rgba(236, 236, 236, 0.5);
    box-shadow: 0 2px 24px 0 rgba(236, 236, 236, 0.5);
    background-color: #ffffff;
    padding: 20px 22px;
}
.share-dream-box .dream-title h4 {
    font-size: 12px;
    font-weight: bold;
    color: #3c3f58;
    margin: 0;
}
.share-dream-box .dream-title small {
    font-size: 7pt;
    font-weight: 300;
    color: #3c3f58;
}
.share-dream-box .btn-detail {
    font-size: 10px;
    color: #3c3f58;
    font-weight: 800;
}
.share-dream-box .dream-fill {
    font-size: 12px;
    color: #3c3f58;
    font-weight: 300;
}
.share-dream-box .add-btn {
    display: table-cell;
    vertical-align: middle;
}
.share-dream-box .add-btn p {
    margin-top: 20px;
    font-size: 14px;
    color: #00032f;
    font-weight: 600;
}
.share-dream-box .add-btn img {
    width: 40px;
    height: 40px;
}
.share-dream-box .profil-wrapper {
    display: table;
}
.share-dream-box .profil-wrapper .photo-profil {
    width: 31px;
}
.share-dream-box .profil-wrapper span {
    left: 10px;
    position: relative;
    display: table-cell;
    vertical-align: center;
    font-size: 11.2px;
    font-weight: 800;
}

.other-wrapper {
    padding-top: 48px;
    padding-bottom: 62px;
    background-color: #00032f;
}
.other-wrapper .title {
    text-align: center;
}
.other-wrapper .title h1 {
    font-size: 30px;
    color: white;
    font-weight: 600;
}
.other-wrapper .title p {
    font-size: 14px;
    color: white;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
}
.other-wrapper .box-content {
    background: white;
    text-align: center;
    padding: 18px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
.other-wrapper .box-content h3 {
    font-size: 20px;
    color: #1a2935;
    font-weight: bold;
    opacity: 0.78;
}
.other-wrapper .box-content .photo-game {
    padding: 5px;
}
.other-wrapper .box-content .music-wrapper {
    min-height: 222px;
}
.other-wrapper .box-content .box-music {
    margin-top: 6.5px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    background: #ebebeb;
}
.other-wrapper .box-content .box-music .photo-music {
    width: 58px;
}
.other-wrapper .box-content .box-music .status-music {
    margin-top: 10px;
    margin-left: 20px;
    text-align: left;
}
.other-wrapper .box-content .box-music .status-music .judul-music {
    display: grid;
    font-size: 15.5px;
    font-weight: bold;
    color: #3c3f58;
    margin-bottom: -5px;
}
.other-wrapper .box-content .box-music .status-music .artist {
    font-size: 13.3px;
    font-weight: 300;
    color: #3c3f58;
}
.other-wrapper .box-content .box-music .music-controller {
    margin-top: 15px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: auto;
}
.other-wrapper .box-content .box-music .music-controller .add-music {
    margin-right: 15px;
}
.other-wrapper .box-content .box-music .music-controller .3-dots-menu {
    width: 4px;
    height: 19px;
}

.select-hidden {
    display: none;
    visibility: hidden;
    padding-right: 10px;
}

.select {
    cursor: pointer;
    display: inline-block;
    position: relative;
    background-color: white;
    width: 111px;
    min-height: 31px;
    padding-top: 8px;
    top: 10px;
    color: #1a2935;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #364857;
    font-weight: 600;
    margin-left: 15px;
}

.select-styled {
    font-size: 12px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 8px 15px;
    -webkit-transform: transition(all 0.2s ease-in);
    -moz-transform: transition(all 0.2s ease-in);
    -ms-transform: transition(all 0.2s ease-in);
    -o-transform: transition(all 0.2s ease-in);
    transform: transition(all 0.2s ease-in);
}
.select-styled:after {
    content: '';
    width: 0;
    height: 0;
    border: 7px solid transparent;
    position: absolute;
    top: 16px;
    right: 10px;
}
.select-styled:active:after,
.select-styled.active:after {
    top: 9px;
}

option {
    cursor: pointer;
}

.select-options {
    background-color: #eee;
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 999;
    margin: 0;
    padding: 0;
    list-style: none;
}
.select-options li {
    margin: 0;
    padding: 12px 0;
    text-indent: 15px;
    -webkit-transform: transition(all 0.15s ease-in);
    -moz-transform: transition(all 0.15s ease-in);
    -ms-transform: transition(all 0.15s ease-in);
    -o-transform: transition(all 0.15s ease-in);
    transform: transition(all 0.15s ease-in);
}
.select-options li[rel='hide'] {
    display: none;
}

.graph-wrapper {
    background: white;
    height: 100%;
}
.graph-wrapper .horizontal .progress-bar {
    float: left;
    height: 45px;
    width: 100%;
    padding: 12px 0;
    background: transparent;
}
.graph-wrapper .horizontal .progress-track {
    position: relative;
    width: 100%;
    height: 20px;
    background: #ebebeb;
}
.graph-wrapper .horizontal .progress-fill {
    position: relative;
    background: #666;
    height: 20px;
    width: 50%;
    color: #fff;
    text-align: center;
    font-family: 'Lato', 'Verdana', sans-serif;
    font-size: 12px;
    line-height: 20px;
}
.graph-wrapper .rounded .progress-track,
.graph-wrapper .rounded .progress-fill {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
}
.graph-wrapper span {
    display: none;
}

/*--menu FLoat--*/
#floatBg {
    background-color: #292a2b71;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 1030;
    display: none;
}

.menuFloat {
    cursor: pointer;
    position: fixed;
    z-index: 1031;
    bottom: 96px;
    right: 96px;
}

.menuFloatEffect img {
    position: relative;
    width: 75px;
    height: 75px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
}

.menuFloat a:hover img {
    width: 85px;
    height: 85px;
}

.menuInnerFloat {
    position: absolute;
    bottom: 0px;
    right: 28px;
    display: none;
}

.menuInnerFloat ul {
    list-style: none;
}

.menuInnerFloat ul li a {
    font-size: 30pt;
    color: white !important;
}

.menuInnerFloat ul li a:hover {
    text-decoration: none;
    font-size: 30pt;
    color: #524284 !important;
}

/*effect-underline*/
a.effect-underline:after {
    content: '';
    position: absolute;
    left: 0em;
    display: inline-block;
    height: 0.8em;
    width: 24%;
    border-bottom: 1px solid;
    margin-top: 10px;
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, -webkit-transform 0.35s;
    -o-transition: opacity 0.35s, -o-transform 0.35s;
    -moz-transition: opacity 0.35s, transform 0.35s, -moz-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s,
        -moz-transform 0.35s, -o-transform 0.35s;
    -webkit-transform: scale(0, 1);
    -moz-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    -o-transform: scale(0, 1);
    transform: scale(0, 1);
}

a.effect-underline:hover:after {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.awan-1 {
    -webkit-animation: up-down 18s linear infinite 5s;
    -moz-animation: up-down 18s linear infinite 5s;
    -o-animation: up-down 18s linear infinite 5s;
    animation: up-down 18s linear infinite 5s;
    width: 411px;
}
.awan-1 img {
    position: absolute;
}

.notfound p {
    color: #3c3f58;
    font-weight: 600;
}
.notfound p span {
    color: #d71f1c;
}

.notfound .domba.notfound {
    width: 314px;
    margin-left: auto;
    margin-right: auto;
}
.notfound .domba.notfound h1 {
    text-align: center;
    font-size: 40px;
    font-weight: bold;
    color: #3c3f58;
}
.notfound .domba.notfound p {
    text-align: center;
    font-weight: 300;
}

.notfound ul {
    list-style: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.notfound ul li {
    margin-left: 20px;
    margin-right: 20px;
}
.notfound ul li a {
    color: #3c3f58;
    font-weight: 600;
    text-decoration: none;
}
.notfound ul li a.active {
    font-weight: bold;
}

input[type='search'] {
    width: 514px;
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid !important;
}

.mattress-guide-wrapper {
    background-image: url('../../images/bg-mattress-guide.png');
    background-position: right;
    background-repeat: no-repeat;
    padding-top: 40px;
    padding-bottom: 60px;
}
.mattress-guide-wrapper .step-inner p {
    max-width: 504px;
    font-size: 14px;
}
.mattress-guide-wrapper .step-inner h2 {
    font-size: 20px;
    color: #2f2f2f;
    font-weight: bold;
}
.mattress-guide-wrapper label {
    margin-left: 10px;
    font-size: 14px;
    color: #2f2f2f;
    font-weight: 300;
}
.mattress-guide-wrapper .next-btn .btn-next {
    background-color: #00032f;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    min-width: 104px;
    font-size: 14px;
    font-size: 300;
    color: white;
    text-decoration: none;
}
.mattress-guide-wrapper .next-btn .btn-next i {
    margin-left: 8px;
}
.mattress-guide-wrapper .next-btn .btn-prev {
    background-color: #00032f;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    min-width: 104px;
    font-size: 14px;
    font-size: 300;
    color: white;
    text-decoration: none;
}
.mattress-guide-wrapper .next-btn .btn-prev i {
    margin-right: 8px;
}
.mattress-guide-wrapper .next-btn.prev-btn .btn-next {
    margin-left: 20px;
}
.mattress-guide-wrapper .next-btn.prev-btn.mattress-5 .btn-next {
    margin-left: 20px;
}
@media only screen and (max-width: 767px) {
    .mattress-guide-wrapper .next-btn.prev-btn.mattress-5 .btn-next {
        margin-left: 7px;
    }
}
.mattress-guide-wrapper .next-btn.margin {
    margin-top: 76px;
}

.step-mattress-wrapper {
    text-align: center;
}
.step-mattress-wrapper .one-step {
    display: inline-block;
    min-width: 150px;
}
@media only screen and (max-width: 767px) {
    .step-mattress-wrapper .one-step {
        min-width: 50px;
    }
}
.step-mattress-wrapper .one-step .step-round {
    background-color: #bbbfc1;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width: 30px;
    height: 30px;
    position: relative;
    z-index: 2;
}
.step-mattress-wrapper .one-step .step-line {
    border: 1px solid #bbbfc1;
    background-color: #bbbfc1;
    width: 100%;
    height: 4px;
    position: relative;
    bottom: 15px;
    left: 20px;
    z-index: 1;
}
.step-mattress-wrapper .one-step.active .step-round {
    background-color: #524284;
}
.step-mattress-wrapper .one-step.active .step-line.active {
    border: 1px solid #524284;
    background-color: #524284;
}

.product-box {
    margin-bottom: 30px;
    background-color: white;
    padding-bottom: 15px;
    -webkit-border-radius: 5.4px;
    -moz-border-radius: 5.4px;
    border-radius: 5.4px;
    overflow: hidden;
}
.product-box a {
    text-decoration: none;
}
.product-box a:hover h3 {
    text-decoration: none !important;
}
.product-box h3 {
    padding-left: 15px;
    color: #3c3f58;
    font-weight: 600;
    margin-top: 15px;
}
.product-box img {
    max-height: 191px;
    -o-object-fit: cover;
    object-fit: cover;
}

.product-box.product-serta {
    position: relative;
    padding-bottom: 0;
}
.product-box.product-serta .collection-1 {
    text-align: center;
    position: relative;
    width: 100%;
    height: 100%;
    max-height: 222px;
}
.product-box.product-serta .collection-1 img {
    max-width: 60%;
    max-height: 63px;
    -o-object-fit: contain;
    object-fit: contain;
}
.product-box.product-serta .collection-1 P {
    font-size: 21.6px;
    color: white;
    font-weight: 600;
}

.resault-wrapper {
    padding-top: 46px;
    padding-bottom: 60px;
}
.resault-wrapper .title-page {
    text-align: center;
}
.resault-wrapper .title-page h1 {
    font-weight: 800;
    font-size: 30px;
    color: #1a2935;
}
.resault-wrapper .text-page {
    text-align: center;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.resault-wrapper .text-page p {
    font-size: 12px;
    font-weight: 300;
    display: inline-block;
}
.resault-wrapper .detail-btn-wrapper {
    text-align: center;
}
.resault-wrapper .detail-btn-wrapper .btn-detail {
    background-color: #00032f;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    min-width: 104px;
    font-size: 14px;
    font-weight: 300;
    color: white;
    text-decoration: none;
    padding-left: 28px;
    padding-right: 28px;
}
.resault-wrapper .btn-try {
    background-color: #00032f;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    min-width: 104px;
    font-size: 14px;
    font-weight: 300;
    color: white;
    text-decoration: none;
    padding-left: 28px;
    padding-right: 28px;
    opacity: 0.65;
}

.search-location-box {
    padding-top: 24px;
    padding-left: 24px;
    padding-bottom: 104px;
}
@media only screen and (max-width: 767px) {
    .search-location-box {
        padding: 24px 16px 0px 16px;
    }
}
.search-location-box .search-box {
    margin-bottom: 24px;
    padding-top: 5px;
    padding-left: 22px;
    padding-right: 10px;
    width: 366px;
    height: 45px;
    -webkit-border-radius: 2.4px;
    -moz-border-radius: 2.4px;
    border-radius: 2.4px;
    -webkit-box-shadow: 0 2px 11px 0 rgba(207, 207, 207, 0.5);
    -moz-box-shadow: 0 2px 11px 0 rgba(207, 207, 207, 0.5);
    box-shadow: 0 2px 11px 0 rgba(207, 207, 207, 0.5);
    border: solid 0.8px #a1a1a1;
    background-color: #ffffff;
}
@media only screen and (max-width: 767px) {
    .search-location-box .search-box {
        width: 85%;
        margin-left: auto;
        margin-right: auto;
    }
    
}
.search-location-box .search-box input {
    width: 200px;
    margin-top: 5px;
    float: left;
    border: 0;
}
@media only screen and (max-width: 767px) {
    .search-location-box .search-box input {
        width: 150px;
    }
}
.search-location-box .search-box button {
    top: 1px;
    width: 90.3px;
    height: 31.6px;
    -webkit-border-radius: 15.8px;
    -moz-border-radius: 15.8px;
    border-radius: 15.8px;
    background-color: #00032f;
    padding: 0 !important;
    font-size: 12px;
}
.search-location-box .search-list {
    margin-bottom: 104px;
}
.search-location-box .search-list table {
    line-height: 2;
}
.search-location-box .search-list span {
    font-size: 12px;
    color: #3c3f58;
    font-weight: 600;
    padding-left: 5px;
}

@media only screen and (max-width: 767px) {
    .map iframe {
        height: 400px;
    }
}

.before-serta {
    background-image: -webkit-gradient(
        linear,
        left bottom,
        left top,
        from(#388abe),
        to(#0f3d69)
    );
    background-image: -webkit-linear-gradient(bottom, #388abe, #0f3d69);
    background-image: -moz-linear-gradient(bottom, #388abe, #0f3d69);
    background-image: -o-linear-gradient(bottom, #388abe, #0f3d69);
    background-image: linear-gradient(to top, #388abe, #0f3d69);
}
.before-serta .before-serta-wrapper {
    position: relative;
    padding-top: 20vh;
    padding-bottom: 3vh;
}
.before-serta .before-serta-wrapper .title-content {
    color: white;
}
.before-serta .before-serta-wrapper .title-content h2 {
    font-size: 30px;
    font-weight: 600;
}
.before-serta .before-serta-wrapper .text-content {
    color: white;
}
.before-serta .before-serta-wrapper .text-content p {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    max-width: 751px;
    font-size: 14px;
    letter-spacing: 2px;
}
.before-serta .before-serta-wrapper .star-wrapper {
    overflow: hidden;
}
.before-serta .before-serta-wrapper .star-wrapper .star-child {
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width: 2px;
    height: 2px;
    background-color: #f4f3bd;
    -webkit-box-shadow: 0 0 6px 6px #f4f3bd;
    -moz-box-shadow: 0 0 6px 6px #f4f3bd;
    box-shadow: 0 0 6px 6px #f4f3bd;
    position: absolute;
}
.before-serta .before-serta-wrapper .star-wrapper .moon-child {
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width: 116px;
    height: 116px;
    -webkit-box-shadow: 0 0 34px 0 #f4f3bd;
    -moz-box-shadow: 0 0 34px 0 #f4f3bd;
    box-shadow: 0 0 34px 0 #f4f3bd;
    background-color: #f4f3bd;
    position: absolute;
    left: 5%;
    top: 56px;
}
.before-serta .before-serta-wrapper .star-wrapper .star-child:first-of-type {
    top: 279px;
    left: 157px;
    animation: blink 2s alternate-reverse 0.2s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:first-of-type {
        left: 10%;
    }
}
.before-serta
    .before-serta-wrapper
    .star-wrapper
    .star-child:nth-last-of-type(2) {
    top: 287px;
    left: 288px;
    animation: blink 2s alternate-reverse 1s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:nth-last-of-type(2) {
        left: 20%;
    }
}
.before-serta
    .before-serta-wrapper
    .star-wrapper
    .star-child:nth-last-of-type(3) {
    top: 66px;
    left: 322px;
    animation: blink 2s alternate-reverse 1.8s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:nth-last-of-type(3) {
        left: 32%;
    }
}
.before-serta
    .before-serta-wrapper
    .star-wrapper
    .star-child:nth-last-of-type(4) {
    top: 166px;
    left: 376px;
    width: 3px;
    height: 3px;
    animation: blink 2s alternate-reverse 1s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:nth-last-of-type(4) {
        left: 43%;
    }
}
.before-serta
    .before-serta-wrapper
    .star-wrapper
    .star-child:nth-last-of-type(5) {
    top: 30px;
    left: 528px;
    animation: blink 2s alternate-reverse 0.2s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:nth-last-of-type(5) {
        left: 50%;
    }
}
.before-serta
    .before-serta-wrapper
    .star-wrapper
    .star-child:nth-last-of-type(6) {
    top: 40px;
    left: 735px;
    animation: blink 2s alternate-reverse 2s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:nth-last-of-type(6) {
        left: 62%;
    }
}
.before-serta
    .before-serta-wrapper
    .star-wrapper
    .star-child:nth-last-of-type(7) {
    top: 74px;
    left: 857px;
    animation: blink 2s alternate-reverse 1s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:nth-last-of-type(7) {
        left: 65%;
    }
}
.before-serta
    .before-serta-wrapper
    .star-wrapper
    .star-child:nth-last-of-type(8) {
    top: 206px;
    left: 888px;
    width: 5px;
    height: 5px;
    animation: blink 2s alternate-reverse 1s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:nth-last-of-type(8) {
        left: 72%;
    }
}
.before-serta
    .before-serta-wrapper
    .star-wrapper
    .star-child:nth-last-of-type(9) {
    top: 40px;
    left: 1026px;
    animation: blink 2s alternate-reverse 0.2s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta
        .before-serta-wrapper
        .star-wrapper
        .star-child:nth-last-of-type(9) {
        left: 82%;
    }
}
.before-serta .before-serta-wrapper .star-wrapper .star-child:last-of-type {
    top: 251px;
    left: 1236px;
    animation: blink 2s alternate-reverse 1.8s infinite;
}
@media only screen and (max-width: 767px) {
    .before-serta .before-serta-wrapper .star-wrapper .star-child:last-of-type {
        left: 90%;
    }
}
.before-serta .before-serta-wrapper .domba-wrapper {
    text-align: center;
    margin-top: 135px;
}
.before-serta .before-serta-wrapper .domba-wrapper img {
    width: 261px;
    height: 160px;
}
.before-serta .before-serta-wrapper .learn-more {
    margin-top: 41px;
}

.first-content-wrapper.about {
    padding-top: 68px;
    padding-bottom: 51px;
}
.first-content-wrapper.about .title-content h2 {
    max-width: 666px;
    font-size: 40px;
    color: #3c3f58;
    font-weight: 800;
    margin-left: auto;
    margin-right: auto;
}
.first-content-wrapper.about .text-content p {
    max-width: 800px;
    text-align: center;
    font-size: 14px;
    letter-spacing: 2px;
    margin-left: auto;
    margin-right: auto;
}

.second-content-wrapper.about {
    background-image: url('../../images/codigo-super-graphic-artboard-3.png');
    background-color: #eeeeee;
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    padding-top: 68px;
    padding-bottom: 51px;
}
.second-content-wrapper.about .title-content h2 {
    max-width: 666px;
    font-size: 40px;
    color: #3c3f58;
    font-weight: 800;
    margin-left: auto;
    margin-right: auto;
}
.second-content-wrapper.about .text-content p {
    max-width: 800px;
    text-align: center;
    font-size: 14px;
    letter-spacing: 2px;
    margin-left: auto;
    margin-right: auto;
}

.why-serta {
    background-color: #00032f;
    padding-top: 50px;
    color: white;
}
.why-serta .title-content h2 {
    max-width: 666px;
    font-size: 40px;
    color: white;
    font-weight: 800;
    margin-left: auto;
    margin-right: auto;
}
.why-serta .text-content p {
    max-width: 823px;
    text-align: center;
    font-size: 14px;
    letter-spacing: 2px;
    margin-left: auto;
    margin-right: auto;
}
.why-serta .content.child-page h5 {
    font-weight: 600;
    font-size: 16px;
}
.why-serta .content.child-page p {
    font-size: 16px;
}
@media only screen and (max-width: 767px) {
    .why-serta .content.child-page p {
        font-size: 12px;
    }
}

.content.child-page {
    max-width: 823px;
    margin-left: auto;
    margin-right: auto;
}
.content.child-page .quest {
    font-size: 20px !important;
}
.content.child-page .answer b {
    font-size: 14px;
    margin-bottom: 15px;
    padding-left: 10px;
}
.content.child-page .answer p {
    font-size: 14px;
}
.content.child-page .expand-btn a span {
    color: white;
    font-size: 18px;
}

.serta-counting-wrapper {
    background-image: url('../../images/codigo-super-graphic-artboard-3.png');
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    padding-top: 56px;
    padding-bottom: 61px;
}
.serta-counting-wrapper .serta-counting-sheep {
    text-align: center;
}
.serta-counting-wrapper .serta-counting-sheep .title-about h2 {
    color: #3c3f58;
    font-weight: 800;
}
.serta-counting-wrapper .serta-counting-sheep .text-content {
    max-width: 777px;
}
.serta-counting-wrapper .serta-counting-sheep .domba-count-wrapper img {
    margin-left: 10px;
    margin-right: 10px;
    /* width: 180px;  */
    width: auto;
}
@media only screen and (max-width: 767px) {
    .serta-counting-wrapper .serta-counting-sheep .domba-count-wrapper img {
        width: 84px;
    }
}
.serta-counting-wrapper .serta-counting-sheep button {
    width: 145px;
    height: 40px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    -webkit-box-shadow: 0 5px 6px 0 #00032f;
    -moz-box-shadow: 0 5px 6px 0 #00032f;
    box-shadow: 0 5px 6px 0 #00032f;
    background-color: #00032f;
    color: white;
    font-size: 14px;
    font-weight: 800;
}

.sleep-btn {
    position: fixed;
    bottom: 65px;
    right: 65px;
    opacity: 0;
    -webkit-transition: 1s;
    -o-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flylogo-btn {
    position: fixed;
    bottom: 65px;
    left: 65px;
    opacity: 0;
    -webkit-transition: 1s;
    -o-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flylogo-btn-sub .content {
    display: flex;
    align-items: center;
    justify-content: center;
}
.flylogo-btn-sub .title {
    text-align: center;
    font-size: 10px;
    font-weight: 600;
    color: #1a2935;
    text-shadow: 4px 7px 0px #fff;
    margin-bottom: 10px;
}
@media only screen and (max-width: 767px) {
    .sleep-btn {
        right: 27px;
    }
}
.sleep-btn .z-effect {
    position: relative;
    left: 43px;
    bottom: 22px;
    -webkit-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -ms-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
}
.sleep-btn .z-effect span:first-of-type {
    font-weight: 600;
    position: absolute;
    -webkit-animation: z-right 4s linear 4s infinite;
    -moz-animation: z-right 4s linear 4s infinite;
    -o-animation: z-right 4s linear 4s infinite;
    animation: z-right 4s linear 4s infinite;
}
.sleep-btn .z-effect span:nth-last-of-type(3) {
    font-weight: 600;
    position: absolute;
    -webkit-animation: z-right 4s linear 3s infinite;
    -moz-animation: z-right 4s linear 3s infinite;
    -o-animation: z-right 4s linear 3s infinite;
    animation: z-right 4s linear 3s infinite;
}
.sleep-btn .z-effect span:nth-last-of-type(2) {
    font-weight: 600;
    position: absolute;
    -webkit-animation: z-right 4s linear 2s infinite;
    -moz-animation: z-right 4s linear 2s infinite;
    -o-animation: z-right 4s linear 2s infinite;
    animation: z-right 4s linear 2s infinite;
}
.sleep-btn .z-effect span:nth-last-of-type(1) {
    font-weight: 600;
    position: absolute;
    -webkit-animation: z-right 4s linear 1s infinite;
    -moz-animation: z-right 4s linear 1s infinite;
    -o-animation: z-right 4s linear 1s infinite;
    animation: z-right 4s linear 1s infinite;
}

.domba-1 {
    -webkit-animation: up-down 18s linear 3s infinite;
    -moz-animation: up-down 18s linear 3s infinite;
    -o-animation: up-down 18s linear 3s infinite;
    animation: up-down 18s linear 3s infinite;
    position: relative;
}
.domba-1 img {
    position: absolute;
    width: 326px;
    right: 33px;
}

.domba-2 {
    -webkit-animation: up-down 15s linear 1s infinite;
    -moz-animation: up-down 15s linear 1s infinite;
    -o-animation: up-down 15s linear 1s infinite;
    animation: up-down 15s linear 1s infinite;
    position: relative;
    bottom: -61vh;
}
.domba-2 img {
    position: absolute;
    width: 436px;
}

.domba-3 {
    z-index: 1;
    float: right;
    width: 540px;
    position: relative;
    right: 0;
    bottom: 0;
    top: 70vh;
    -webkit-animation: up-down 18s linear 0.5s infinite;
    -moz-animation: up-down 18s linear 0.5s infinite;
    -o-animation: up-down 18s linear 0.5s infinite;
    animation: up-down 18s linear 0.5s infinite;
    pointer-events: none;
}

@media screen and (max-width: 360px) {
    .header-top .title.home-page h1 {
        font-size: 30px;
    }
}

@media screen and (max-width: 420px) {
    .header .title {
        height: 250px;
    }

    .header .title h1 {
        font-size: 35px;
    }

    .header .title p {
        font-size: 15px;
    }

    .domba-2 {
        bottom: -45vh;
    }

    .domba-3 {
        left: 150px;
    }

    .domba-1 img,
    .domba-2 img,
    .domba-3 img {
        width: 300px;
        height: auto;
    }
}

.question:not(.active) {
    display: none;
}

.jawaban:not(.active) {
    display: none;
}
.mattress101-img {
    padding: 0px 60px 0px 0px;
}

h3.title-line {
    overflow: hidden;
    text-align: center;
    font-weight: 600;
}
h3.title-line:before,
h3.title-line:after {
    background-color: #136ffe;
    content: '';
    display: inline-block;
    height: 2px;
    position: relative;
    vertical-align: middle;
}
h3.title-line:before {
    right: 0.5em;
    margin-left: -50%;
    width: 20%;
}
h3.title-line:after {
    left: 0.5em;
    margin-right: -50%;
    width: 80%;
}

.matress-101 h4 {
    margin-left: 14%;
    font-weight: 600;
}

.matress-101 p.title-desc {
    margin-left: 14%;
}

.matress-101 .img-container {
    background-color: #ffffff;
    border-radius: 25px 25px 0px 25px;
    padding: 30px;
}

.selector-product-img {
    height: 250px;
    width: 100%;
}

.text-mattress101 p {
    font-size: 15px;
    color: #000000;
    font-weight: 600;
}
.matress-101-footer {
    background-image: url('../../images/sheepy101.png');
    background-repeat: no-repeat;
    height: 300px;
    background-position-x: 90%;
    text-align: left;
}

.matress-101 h6 {
    font-size: 1.4rem;
    font-weight: 600;
}

.matress-101-footer hr {
    border-top: 2px solid #136ffe;
}
h3.title-line-footer {
    font-weight: 600;
}

.matress-101 p {
    margin-bottom: 0px;
    margin-top: 15px;
}

.matress-101 p.list {
    margin-top: 7px;
}

.matress-101 a {
    color: #000;
}

div.slider-arrow {
    position: absolute;
    top: 50%;
    height: 36px;
    margin-top: -18px;
    color: #4c4c4f;
    line-height: 36px;
    font-size: 80px;
    cursor: pointer;
    z-index: 10;
}


@media only screen and (max-width: 767px) {
    div.slider-prev {
        left: -15px !important;
    }
    div.slider-next {
        right: -15px !important;
    }


}

@media (min-width: 768px) { 

    div.slider-prev {
        left: -50px !important;
    }
    div.slider-next {
        right: -50px !important;
    }

    div.slider-arrow {
        top: 30%;
    }

 }
.wrapper-3d img {
    width: auto !important;
}