@import "tailwindcss";

html {
    scroll-behavior: smooth !important;
}

body {
    font-family: "Open Sans", sans-serif !important;
    font-size: 16px;
    color: #000000;
}

.website-container {
    max-width: 1440px !important;
    margin: auto;
    width: 100%;
}

.swiper-pagination-bullet-active {
    background-color: #2CA6DB !important;
    border: 2px solid #2CA6DB !important;
    padding: 2px !important;
    width: 12px !important;
    height: 12px !important;
}

@media (max-width: 1800px) {
    .website-container {
        max-width: 1480px !important;
        margin: auto;
        width: 100%;
    }
}

@media (max-width: 1540px) {
    .website-container {
        max-width: 1320px !important;
        margin: auto;
        width: 100%;
    }
}

@media (max-width: 1440px) {
    .website-container {
        max-width: 1180px !important;
        margin: auto;
        width: 100%;
    }
}

@media (max-width: 1024px) {
    .website-container {
        max-width: 960px !important;
        margin: auto;
        width: 100%;
    }
}

@media (max-width: 912px) {
    .website-container {
        max-width: 850px !important;
    }
}

@media (max-width: 820px) {
    .website-container {
        max-width: 730px !important;
    }
}

@media (max-width: 853px) {
    .website-container {
        max-width: 790px !important;
    }
}

@media (max-width: 768px) {
    .website-container {
        max-width: 720px !important;
    }
}

@media (max-width: 600px) {
    .website-container {
        max-width: 500px !important;
    }
}

@media (max-width: 430px) {
    .website-container {
        max-width: 390px !important;
    }
}

@media (max-width: 390px) {
    .website-container {
        max-width: 345px !important;
    }
}

@media (max-width: 360px) {
    .website-container {
        max-width: 320px !important;
    }
}

@media (max-width: 320px) {
    .website-container {
        max-width: 300px !important;
    }
}