@font-face {
    font-family: "db_helvethaicamon_x77_bdcond";
    /* font-style : normal; */
    /* font-weight: 400; */
    src: url("../fonts/db_helvethai/db-helvethaicamon-x-bd-cond-v3-2.woff2") format("woff2"),
        url("../fonts/db_helvethai/db-helvethaicamon-x-bd-cond-v3-2.woff") format("woff"),
        url("../fonts/db_helvethai/db-helvethaicamon-x-bd-cond-v3-2.ttf") format("truetype");
}

@font-face {
    font-family: "db_helvethaicamon_x57_cond";
    /* font-style : normal; */
    /* font-weight: 400; */
    src: url("../fonts/db_helvethai/db-helvethaicamon-x-cond-v3-2.woff2") format("woff2"),
        url("../fonts/db_helvethai/db-helvethaicamon-x-cond-v3-2.woff") format("woff"),
        url("../fonts/db_helvethai/db-helvethaicamon-x-cond-v3-2.ttf") format("truetype");
}

@font-face {
    font-family: "db_helvethaicamon_x67_medcond";
    /* font-style : normal; */
    /* font-weight: 400; */
    src: url("../fonts/db_helvethai/db-helvethaicamon-x-med-cond-v3-2.woff2") format("woff2"),
        url("../fonts/db_helvethai/db-helvethaicamon-x-med-cond-v3-2.woff") format("woff"),
        url("../fonts/db_helvethai/db-helvethaicamon-x-med-cond-v3-2.ttf") format("truetype");
}

.font-normal {
    font-family: "db_helvethaicamon_x57_cond" !important;
}

.font-normal-bold {
    font-family: "db_helvethaicamon_x67_medcond" !important;
}

.font-bold {
    font-family: "db_helvethaicamon_x77_bdcond" !important;
}

body,
html {
    font-family: "db_helvethaicamon_x77_bdcond" !important;
}

.paleturquoise {
    color: #a8dce9 !important;
}

.bg-paleturquoise {
    background-color: #a8dce9 !important;
}

.skyblue {
    color: #7bd2d6 !important;
}

.bg-skyblue {
    background-color: #7bd2d6 !important;
}

.lightsalmon {
    color: #ffb7b8 !important;
}

.bg-lightsalmon {
    background-color: #ffb7b8 !important;
}

.salmon {
    color: #f3999a !important;
}

.bg-salmon {
    background-color: #f3999a !important;
}

.lightcoral {
    color: #c17c80 !important;
}

.bg-lightcoral {
    background-color: #c17c80 !important;
}

video {
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.bg-section-two {
    /* The image used */
    background-image: url("../images/backgrounds/section-two-bg.jpg") !important;

    /* Full height */
    height: 100%;
    width: 100%;

    /* Center and scale the image nicely */
    background-position: center -125px;
    background-repeat: no-repeat;
    background-size: cover;
}

.banner-text {
    font-size: 2rem !important;
}

#row-vdo-new-one,
#row-vdo-old-one,
#row-vdo-new-two,
#row-vdo-old-two,
#row-vdo-new-three,
#row-vdo-old-three {
    font-size: 1.25rem !important;
}
.benner-two {
    margin-top: -70px !important;
    z-index: 9999 !important;
}

#btn-to-new-vdo,
#btn-all-new-vdo {
    border: 1px solid #f3999a !important;
    width: 250px;
    max-width: 250px;
    border-radius: 20px;
    font-size: 1.5rem !important;
}

#btn-to-old-vdo,
#btn-all-old-vdo,
#btn-survey {
    border: 1px solid #7bd2d6 !important;
    width: 250px;
    max-width: 250px;
    border-radius: 20px;
    font-size: 1.5rem !important;
}

.button-up {
    bottom: 45px;
    right: 40px;
    cursor: pointer;
}

.rounded-section {
    border-radius: 20px !important;
}

.title-select-text {
    font-size: 3.5rem !important;
}
span.font-normal-bold {
    font-size: 16pt !important;
}
a {
    color: #000 !important;
    text-decoration: none !important;
}

.social {
    bottom: 8%;
    left: 4%;
    width: 85px;
}

@media (min-width: 500px) {
    .social {
        bottom: 8%;
        left: 5%;
        width: 150px;
    }
}

@media (min-width: 768px) {
    .social {
        bottom: 9%;
        left: 5%;
        width: 200px;
    }
}

@media (min-width: 1024px) {
    .social {
        bottom: 10%;
        left: 5%;
        width: 250px;
    }
}

@media (min-width: 1366px) {
    .social {
        bottom: 11.5%;
        left: 5%;
        width: 260px;
    }
}

@media (min-width: 1440px) {
    .social {
        bottom: 11%;
        left: 5%;
        width: 265px;
    }
}

@media (min-width: 1600px) {
    .social {
        bottom: 12%;
        left: 6%;
        width: 270px;
    }
}
