/* ALL Portrait or Landscape*/
html {
    font-size: 16px;
}

.navbar {
    height: 5em;
}

.nav-link.header {
    font-size: 1.5em !important;
}


.logo {
    height: 5em;
}


.home2 {
    padding-top: 8vh;
}

.home3-xs {
    margin-bottom: 6vh;
}

.img-round {
    padding-bottom: 10px;
}

.thespot>img {
    width: 130px;
}

.btn-user {
    font-size: 20px !important;
    border: 4px solid var(--tsc-blue-color) !important;
}

.btn-user:hover,
.btn-user:focus,
.btn-user:active:focus,
.btn-user-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {

    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem var(--tsc-blue-color);
}

.img-event {
    width: 140px;
    height: auto;
}

li.nav-item {
    padding: 8px 5px 8px 5px !important;
}


@media (orientation: landscape) {
            .img-event {
            width: 180px;
            height: auto;
        }

    li.nav-item {
        padding: 8px 10px 8px 10px !important;
        margin-right: 1rem !important;
        margin-left: 1rem !important;
    }

    .social-ico {
        margin-top: -1vh;
    }

    .citation {
        max-width: 45vw;
    }

    .navbar-brand-img {
        background-size: 7em auto !important;
        width: 7em !important;
        height: 7em;
        margin-top: 7vh;
    }

    .thespot {
        top: 14vh;
        left: 8vw;
    }

    .logo {
        height: 7em;
    }

    /* .menu-header {
            padding-top: 12vh !important;
        } */

    .booktable {
        top: 3vh;
        left: 85vw;
        font-size: 16px;
        font-weight: 600;
    }

    .logo {
        margin-top: 5vh;
        margin-left: 1vw;
    }

    .social-ico {
        margin-top: 1vh;
    }

    .citation {
        max-width: 45vw;
    }

    .home3 {
        width: 85vw !important;
    }

    @media (min-width: 768px) {
        .thespot {
            top: 12vh;
            left: 6vw;
        }

        .home2 {
            padding-top: 12vh !important;
        }

        .img-event {
            width: var(--width-576-event);
            height: auto;
        }

        @media (min-width: 992px) {

            .img-event {
                width: var(--width-410-event);
                height: auto;
            }

            .thespot>img {
                width: 170px;
            }


            @media (min-height: 600px) {
                /*T1 iPad Air*/

                .nav-link.header {
                    font-size: 22px !important;
                    font-weight: 700 !important;
                }

                .tagline {
                    font-size: clamp(2.2em, 2.2vw, 2.2em) !important;
                }

                .welcome-text-2 {
                    font-size: 2.2em !important;
                }


                .home2 {
                    padding-top: 6vh !important;
                }
            }

            @media (min-height: 744px) {

                /*T2 iPad Mini (6th generation), T3 iPad Mini*/

                .thespot {
                    top: 15vh;
                    left: 6vw;
                }

                .home2 {
                    padding-top: 12vh !important;
                }
            }

            @media (min-height: 820px) {

                /* min-height: 820px -iPad (10th/11th) */

                .thespot {
                    top: 15vh;
                    left: 6vw;
                }

                .home2 {
                    padding-top: 12vh !important;
                }
            }
        }

        @media (min-width: 1200px) {
            .img-event {
                width: var(--width-740-event);
                height: auto;
            }

            #modalEvent {
                top: 5vh;
            }

            .welcome-text-2 {
                padding-left: 20vw !important;
            }

            @media (min-height: 744px) {
                /*T4 Galaxy Tab S9+ 1280x800*/


                .thespot {
                    top: 26vh;
                    left: 10vw;
                }

            }

            @media (min-height: 820px) {

                /*S1 HP Screen*/

                .nav-link.header {
                    font-size: 24px !important;
                    font-weight: 700;
                }

                .thespot>img {
                    width: 240px;
                }

                /* min-height: 820px -iPad Pro 11*/
                .tagline {
                    font-size: clamp(2em, 2.2vw, 2em) !important;
                }

                .welcome-text-2 {
                    font-size: 2em !important;
                }
            }

            @media (min-height: 1300px) {

                /*S3 XL Screen*/

                .nav-link.header {
                    font-size: 34px !important;
                    font-weight: 800;
                }

                .thespot>img {
                    width: 400px;
                }

                .tagline {
                    font-size: clamp(3em, 2.2vw, 3em) !important;
                }

                .welcome-text-2 {
                    font-size: 3em !important;
                }

                .fa-brands {
                    font-size: 3em;
                }

                .fa-tripad {
                    height: 85px !important;
                }
            }
        }
    }
 }


    @media (orientation: portrait) {

        /* Small devices (cell)  */
        @media (min-width: 350px) {
            .navbar-brand-img {
                background-size: 7em auto !important;
                width: 7em !important;
                height: 7em;
                margin-top: 7vh;
            }

            .booktable {
                top: 2vh;
                left: 80vw;
                font-size: 16px;
                font-weight: 600;
            }

            .img-event {
                /* width: 80vw; */
                width: var(--width-340-event);
                height: auto;
            }

            .event-container {
                top: 20vh;
            }
        }

        @media (min-width: 390px) {
            .img-event {
                /* width: 80vw; */
                width: var(--width-390-event);
                height: auto;
            }
        }

        /* Small devices (tablet) */
        @media (min-width: 576px) {

            .nav-link.header {
                font-size: 1.5rem !important;
            }

            .thespot>img {
                width: 240px;
            }

            .tagline {
                font-size: clamp(1.8rem, 1vw, 1.8rem) !important;
                line-height: 1.65 !important;
            }

            .welcome-text-2 {
                font-size: 1.8em;
            }

            .img-event {
                /* width: 80vw; */
                width: var(--width-570-event);
                height: auto;
            }

            @media (min-height: 1180px) {

                /*T1 iPad Air*/
                .citation {
                    max-width: 100%;
                    font-size: 1.8em !important;
                }

                .img-event {
                    /* width: 80vw; */
                    width: var(--width-992-portrait);
                    height: auto;
                }
            }

            @media (min-height: 1200px) {

                li.nav-item {
                    padding: 8px 1em 8px 1em !important;
                }

                /* nav {
        border: 3px dashed chartreuse;
    } */

                .booktable {
                    top: 2vh;
                    left: 82vw;
                    font-size: 16px;
                    font-weight: 600;
                    width: 130px !important;
                }

                /* .menu-header {
        padding-top: 5vh !important;
    } */

                .thespot {
                    top: 22vh;
                    left: 9vw;
                }


                .home2 {
                    padding-top: 12vh !important;
                }

                .home2 {
                    padding-top: 9vh !important;
                }

                .home3-xs {
                    margin-bottom: 5vh;
                }

            }
        }


        /*T2 iPad mini (6th generation)*/
        @media (min-width: 740px) {

            .nav-link.header {
                font-size: 19px !important;
            }

            .img-event {
                width: 40vh;
                height: auto;
            }

            .dialog-event {
                width: 40vh;
            }

            .modal-dialog.dialog-event>.modal-content>.modal-body {
                width: 40vh;
            }

            .thespot {
                top: 20vh;
                left: 9vw;
            }

            .img-event {
                /* width: 80vw; */
                width: var(--width-700-event);
                height: auto;
            }



            .home2 {
                padding-top: 3vh !important;
            }
        }

        /*Medium devices: 
    - iPad mini iPadOS  768x1024 
    - Galaxy Tab S9     800x1280 
    - iPad (10th/11th)  820x1180
    - iPad Pro 11       834x1210 
*/
        @media (min-width: 768px) {

            .img-event {
                width: var(--width-740-event);
                height: auto;
            }

            .dialog-event {
                width: 40vh;
            }

            .modal-dialog.dialog-event>.modal-content>.modal-body {
                width: 40vh;
            }

            .thespot {
                top: 15vh;
                left: 9vw;
            }

            .home2 {
                padding-top: 3vh !important;
            }

            li.nav-item {
                padding: 8px 1em 8px 1em !important;
            }

            .booktable {
                top: 2vh;
                left: 82vw;
                font-size: 16px;
                font-weight: 600;
                width: 130px !important;
            }

            #modalEvent {
                top: -10vh;
            }

        }

        /*Large devices
    - iPad Pro 13      1032x1376 
    - Landscapes:
        - -iPad (10th/11th)
*/
        @media (min-width: 992px) {

            .img-event {
                width: 40vh;
                height: auto;
            }

            .dialog-event {
                width: 40vh;
            }

            .modal-dialog.dialog-event>.modal-content>.modal-body {
                width: 40vh;
            }

            .thespot {
                position: absolute !important;
                top: 10vh;
                left: 5vw;
            }

            .home3 {
                width: 90vw !important;
            }

            .img-event {
                /* width: 80vw; */
                width: var(--width-992-event);
                height: auto;
            }
        }

        /*X-Large devices (large desktops, 1200px and up) */
        @media (min-width: 1200px) {
            .img-event {
                width: var(--width-1200-event);
                height: auto;
            }

            .dialog-event {
                width: 60vh;
            }

            .modal-dialog.dialog-event>.modal-content>.modal-body {
                width: 60vh;
            }

            .navbar-brand-img {
                background-size: 7em auto !important;
                width: 7em !important;
                height: 7em;
                margin-top: 7vh;
            }

            .nav-link.header {
                font-size: 20px !important;
            }

            li.nav-item {
                margin-right: 0rem !important;
                margin-left: 0rem !important;
            }

            .thespot {
                top: 29vh;
                left: 17vw;
            }

            .splash-regular {
                font-size: 45px !important;
            }

            .karla-menu {
                font-size: 17px !important;
            }

            .logo {
                height: 7em;
            }

            .social-ico {
                margin-top: 0 !important;
            }

            .home2 {
                padding-top: 8vh !important;
            }

            .card-title {
                font-size: 25px !important;
            }

            .card-text {
                font-size: 18px !important;
            }

            .booktable {
                top: 3vh !important;
                left: 80vw !important;
                font-size: 18px !important;
                width: 200px !important;
            }

            .citation {
                max-width: 30vw;
                font-size: 25px !important;
            }
        }

        /*XX-Large devices 
*/
        @media (min-width: 1400px) {
            .img-event {
                width: var(--width-1400-event);
                height: auto;
            }

            .dialog-event {
                width: 60vh;
            }

            .modal-dialog.dialog-event>.modal-content>.modal-body {
                width: 60vh;
            }

            .navbar-brand-img {
                background-size: 7em auto !important;
                width: 7em !important;
                height: 7em;
                margin-top: 7vh;
            }

            .nav-link.header {
                font-size: 20px !important;
            }

            li.nav-item {
                /* margin-right: 1rem !important; */
                margin-left: 1rem !important;
            }

            .thespot {
                top: 25vh !important;
                left: 15vw !important;
            }

            .splash-regular {
                font-size: 45px !important;
            }

            .karla-menu {
                font-size: 22px !important;
            }

            .logo {
                height: 7em;
            }

            .home2 {
                padding-top: 2vh !important;
            }

            .card-title {
                font-size: 25px !important;
            }

            .card-text {
                font-size: 18px !important;
            }

            .booktable {
                top: 3vh !important;
                left: 88vw !important;
                font-size: 18px !important;
                width: 200px !important;
            }


            .citation {
                max-width: 25vw;
                font-size: 25px !important;
            }

        }

        /*XXX-Large devices 
    - CCA HP Screens            1920x 927
    - CCA Pierre Azus Screens   1920x1080
    - CCA XL Screens            2560x1440

*/
        @media (min-width: 1900px) {

            .navbar-brand-img {
                background-size: 7em auto !important;
                width: 7em !important;
                height: 7em;
                margin-top: 7vh;
            }

            .nav-link.header {
                font-size: 20px !important;
            }

            li.nav-item {
                /* margin-right: 1rem !important; */
                margin-left: 1rem !important;
            }

            .thespot {
                top: 25vh !important;
                left: 15vw !important;
            }

            .splash-regular {
                font-size: 45px !important;
            }

            .karla-menu {
                font-size: 22px !important;
            }

            .logo {
                height: 7em;
            }

            .home2 {
                padding-top: 2vh !important;
            }

            .card-title {
                font-size: 25px !important;
            }

            .card-text {
                font-size: 18px !important;
            }

            .booktable {
                top: 3vh !important;
                left: 88vw !important;
                font-size: 18px !important;
                width: 200px !important;
            }

            .citation {
                max-width: 25vw;
                font-size: 25px !important;
            }
        }
    }