/* You can add global styles to this file, and also import files  other style */

body {
    .header {
        width: 100%;
        position: fixed;
        z-index: 2;
    }
    .headerctctinfo {
        /* on all devices screens */
        background-image: linear-gradient(#21421e, darkgreen, green);
        display: flex;
        color: white;
        font-weight: 550;
        font-family: Georgia, 'Times New Roman', Times, serif;
        /* on mobile smart phone small screens on portrait orientation*/
        @media only screen and (max-width: 480px) {
            padding-top: 5%;
            padding-bottom: 5%;
            padding-right: 5%;
            padding-left: 15%;
            i {
                font-size: 3.25vmin;
            }
        }
        /* on mobile smartphone smaller screens on landscape orientation*/
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            padding-top: 5%;
            padding-bottom: 5%;
            padding-right: 5%;
            padding-left: 20%;
            i {
                font-size: 3.5vmin;
            }
        }
        /* on ipads and tablets screens on portraire orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            padding-top: 5%;
            padding-bottom: 3%;
            padding-right: 7%;
            padding-left: 20%;
            i {
                font-size: 3.25vmin;
            }
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            padding-top: 5%;
            padding-bottom: 3%;
            padding-right: 7%;
            padding-left: 20%;
            i {
                font-size: 3.5vmin;
            }
        }
        /* on laptops small screens and ipad and tablets large screen*/
        /* @media only screen and (min-width: 896px) and (max-width: 1024px) */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            padding-top: 4%;
            padding-bottom: 2%;
            padding-left: 25%;
            padding-right: 15%;
            i {
                font-size: 2vmin;
            }
        }
        /* landscap orientation for smartphone devices and small ipad */
        /* increased characters size to 0.25px */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            padding-top: 4%;
            padding-bottom: 2%;
            padding-left: 30%;
            padding-right: 15%;
            i {
                font-size: 3.75vmin;
            }
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            padding-top: 4%;
            padding-bottom: 2%;
            padding-left: 30%;
            padding-right: 15%;
            i {
                font-size: 3.1vmin;
            }
        }
        /* on laptop large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            padding-top: 3%;
            padding-bottom: 1.5%;
            padding-left: 22%;
            padding-right: 22%;
            i {
                font-size: 1.75vmin;
            }
        }
        /* landscape orientation for ipad and tablet devices */
        /*  increased characters size to 0.25px */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            padding-top: 4%;
            padding-bottom: 2%;
            padding-left: 30%;
            padding-right: 15%;
            i {
                font-size: 2.25vmin;
            }
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            padding-top: 2%;
            padding-bottom: 1%;
            padding-left: 30%;
            padding-right: 30%;
            i {
                font-size: 2.5vmin;
            }
        }
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            padding-top: 2%;
            padding-bottom: 1%;
            padding-left: 30%;
            padding-right: 30%;
            i {
                font-size: 2.5vmin;
            }
        }
    }
    .navbar {
        /* on all other screens */
        background-color: green;
        height: 75px;
        /* on smaller mobile devices screens */
        @media only screen and (max-width: 320px) {
            height: 45px;
        }
        /* on ipods and tablets screens */
        ul {
            margin: 0;
            padding: 0;
            list-style: none;
            display: flex;
            justify-content: space-between;
            height: 100%;
            .logo {
                /* on mobile devices screens */
                /* width: 25%; */
                width: 35%;
                margin-left: 3%;
                height: auto;
                float: left;
                /* on ipads and tablets screens */
                @media only screen and (min-width: 481px) and (max-width: 768px) {
                    width: 20%;
                    margin-left: 2%;
                    height: auto;
                    float: left;
                }
                /* laptop to larger screen  */
                @media only screen and (min-width: 769px) {
                    width: 15%;
                    padding-top: 1%;
                    margin-left: 5%;
                    height: auto;
                    float: left;
                }
                a {
                    text-decoration: none;
                    /* on mobile devices and other screens */
                    .img-responsive {
                        width: 100%;
                        max-width: 100%;
                    }
                }
            }
            .burger {
                /* on mobile devices screens */
                display: block;
                font-size: 6vmin;
                padding: 0px 10px;
                cursor: pointer;
                margin-right: 3%;
                i {
                    color: white;
                    line-height: 35px;
                    width: 100%;
                    text-decoration: none;
                }
                @media only screen and (min-width: 481px) {
                    display: none;
                }
            }
            .close-window {
                /* on mobile devices screens */
                display: none;
                font-size: 6vmin;
                padding: 0px 10px;
                cursor: pointer;
                margin-right: 3%;
                i {
                    color: white;
                    line-height: 35px;
                    width: 100%;
                    text-decoration: none;
                    font-weight: bold;
                }
                @media only screen and (min-width: 481px) {
                    display: none;
                }
            }
            .fa-window-close::before {
                content: "✕";
            }
            /* mobile screen menu */
            .mobilemenu {
                /* on mobile smartphone devices screens */
                display: none;
                position: absolute;
                top: 90px;
                @media only screen and (max-width: 320px) {
                    top: 60px;
                }
                background-color: green;
                width: 100%;
                .menu-item {
                    display: block;
                    color: white;
                    padding: 2px 10px;
                    height: 30px;
                    line-height: 25px;
                    border: .5px solid whitesmoke;
                    font-weight: 500;
                    font-size: 4vmin;
                    text-decoration: none;
                    font-family: Georgia, 'Times New Roman', Times, serif;
                    @media only screen and (max-width: 320px) {
                        height: 25px;
                        line-height: 20px;
                    }
                }
                .menu-item:hover {
                    background-color: green;
                    color: black;
                }
                /* on all other devices screens */
                @media only screen and (min-width: 481px) {
                    display: none;
                    .menu-item {
                        display: none;
                    }
                }
            }
            /* large screen menu  */
            .menu {
                display: none;
                @media only screen and (min-width: 481px) {
                    display: flex;
                    .menu-item {
                        padding: 10px 19px;
                        height: 50px;
                        line-height: 20px;
                        color: white;
                        font-weight: 500;
                        font-family: Georgia, 'Times New Roman', Times, serif;
                        text-decoration: none;
                    }
                    .menu-item:hover {
                        color: black;
                    }
                    .active {
                        color: white;
                        text-decoration: underline !important;
                    }
                    .active:hover {
                        color: white;
                        text-decoration: underline !important;
                    }
                }
                /* on ipads and tablets screens */
                @media only screen and (min-width: 481px) and (max-width: 768px) {
                    .menu-item {
                        padding: 10px 15px;
                        font-size: 3vmin;
                    }
                }
                /* on mobile smartphone small screens on landscape orientation*/
                @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                    .menu-item {
                        font-size: 4.75vmin;
                    }
                }
                /* on laptops small screens and ipad and tablets large screen*/
                @media only screen and (min-width: 769px) and (max-width: 1024px) {
                    .menu-item {
                        font-size: 2.5vmin;
                    }
                }
                /* landscape orientation for smartphone devices  */
                /* increased charactere size to 1 */
                @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                    .menu-item {
                        font-size: 5vmin;
                    }
                }
                /* landscape orientation for smartphone devices larger screen and ipad small screen*/
                @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                    .menu-item {
                        font-size: 4.5vmin;
                    }
                }
                /* on laptop large screen and desktops screens */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                    .menu-item {
                        font-size: 2.5vmin;
                    }
                }
                /* landscape orientation for ipad and tablet devices */
                /*  increased characters size to 0.25px */
                @media only screen and (min-width: 1025px) and (max-width: 1112px) and (orientation: landscape) {
                    .menu-item {
                        font-size: 3.25vmin;
                    }
                }
                /* landscape orientation for ipad and tablets large screen */
                /*  increased characters size to 0.5px */
                @media only screen and (min-width: 1113px) and (max-width: 1200px) and (orientation: landscape) {
                    .menu-item {
                        font-size: 3.25vmin;
                    }
                }
                /* on extra large screens */
                @media only screen and (min-width: 1201px) {
                    .menu-item {
                        font-size: 3.5vmin;
                    }
                }
                /* landscape orientation for device large screen */
                @media only screen and (min-width: 1201px) and (orientation: landscape) {
                    .menu-item {
                        font-size: 4vmin
                    }
                }
            }
        }
    }
    .colorbar {
        padding-top: 0px;
    }
    .colUndNav1 {
        height: 5px;
        background-color: black;
    }
    .colUndNav2 {
        height: 5px;
        background-color: greenyellow;
    }
    .colUndNav3 {
        height: 5px;
        background-color: dodgerblue;
    }
    main {
        padding-top: 135px;
        @media only screen and (max-width: 768px) {
            padding-top: 80px;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            padding-top: 126px;
        }
        /* on mobile devices screens */
        @media only screen and (max-width:320px) {
            padding-top: 75px;
            padding-bottom: 0px;
        }
    }
    img {
        max-width: 100%;
    }
    .mainphotocontainer {
        display: flex;
        width: 100%;
        margin-bottom: 2%;
        margin-top: 15%;
        /* on smaller mobile screens */
        @media only screen and (max-width: 320px) {
            margin-top: 8.5%;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            margin-top: 12%;
        }
        @media only screen and (min-width: 769px) and (max-width: 1200px) {
            margin-top: 3.4%;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            margin-top: 0.6%;
        }
        .main_photo {
            /* on mobile devices screens */
            width: 100%;
            @media only screen and (min-width: 481px) {
                width: 60%;
            }
        }
        .mainTitle {
            /* on mobile smaller devices screens */
            @media only screen and (max-width: 320px) {
                width: 100%;
                top: 5px;
                position: absolute;
            }
            /* on mobile devices screens */
            @media only screen and (min-width: 321px) and (max-width: 480px) {
                width: 100%;
                top: 20px;
                position: absolute;
            }
            @media only screen and (min-width: 481px) {
                width: 40%;
                position: relative;
                top: 0px;
            }
            /* on mobile smartphone small screens on landscape orientation*/
            h1 {
                border-bottom: 5px solid gray;
                font-weight: bolder;
                font-family: Georgia, 'Times New Roman', Times, serif;
                text-align: center;
                color: grey;
                /* on mobile devices screens */
                /* on mobile smaller devices screens */
                @media only screen and (max-width: 320px) {
                    margin-left: 10%;
                    margin-right: 10%;
                    font-size: 6.5vmin;
                    margin-top: 15%;
                }
                /* on mobile smaller devices screens in landscape orientation */
                @media only screen and (max-width: 320px) and (orientation: landscape) {
                    margin-left: 10%;
                    margin-right: 10%;
                    font-size: 7.5vmin;
                    margin-top: 3%;
                }
                /* on mobile devices screens */
                @media only screen and (min-width: 321px) and (max-width: 480px) {
                    margin-left: 10%;
                    margin-right: 10%;
                    font-size: 6.5vmin;
                    margin-top: 15%;
                }
                /* on ipods and tablets screens on portrait orientation*/
                @media only screen and (min-width: 481px) and (max-width: 768px) {
                    margin-top: 25%;
                    font-size: 4.25vmin;
                }
                /* on laptops and small screens */
                @media only screen and (min-width: 769px) and (max-width: 1024px) {
                    font-size: 4vmin;
                    margin-top: 30%;
                }
                /* on mobile smartphone small screens on landscape orientation*/
                @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                    margin-top: 25%;
                    font-size: 6vmin;
                }
                /* landscap orientation for smartphone devices and small ipad */
                @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                    font-size: 6vmin;
                    margin-top: 30%;
                }
                /* landscap orientation for smartphone devices larger screen */
                @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                    font-size: 6.5vmin;
                    margin-top: 30%;
                }
                /* on large screen and desktops screens */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                    font-size: 4.5vmin;
                    margin-top: 30%;
                }
                /* on extra large screens */
                @media only screen and (min-width: 1201px) {
                    font-size: 5.5vmin;
                    margin-top: 25%;
                }
                /* laptop and large screens landscape orientation */
                @media only screen and (min-width: 1201px) and (max-width: 1600px) and (orientation: landscape) {
                    font-size: 7vmin;
                    margin-top: 20%;
                }
            }
        }
    }
    .container {
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            padding-right: var(--bs-gutter-x, 0rem);
            padding-left: var(--bs-gutter-x, 0rem);
        }
        a {
            text-decoration: none;
        }
        .output-datafolder {
            border: 1px solid green;
            width: 100%;
            .output-data {
                padding: 10px 10px;
                button {
                    margin-left: 10px;
                    height: 4.5vh;
                }
                .datatable {
                    width: 100%;
                    th {
                        padding: 10px 10px;
                        text-align: center;
                    }
                    td {
                        /* padding horizontal 2px and vertical 10px */
                        padding: 2px 10px;
                        p {
                            text-align: center;
                            background-color: whitesmoke;
                            width: auto;
                        }
                        a {
                            text-decoration: none;
                        }
                    }
                }
            }
        }
    }
    .title {
        text-align: center;
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-weight: bold;
        @media only screen and (max-width: 480px) {
            margin-top: 22%;
            font-size: 4.5vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            margin-top: 22%;
            font-size: 5.5vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            margin-top: 20%;
            font-size: 3vmin;
        }
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation:landscape) {
            margin-top: 20%;
            font-size: 4.75vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 896px) {
            margin-top: 10%;
            font-size: 2.75vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            margin-top: 10%;
            font-size: 5vmin;
        }
        @media only screen and (min-width: 897px) and (max-width: 1024px) {
            margin-top: 10%;
            font-size: 2.5vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            margin-top: 10%;
            font-size: 4.75vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            margin-top: 8%;
            font-size: 3.75vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            margin-top: 8%;
            font-size: 3.75vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            margin-top: 5%;
            font-size: 4.5vmin;
        }
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            margin-top: 5%;
            font-size: 3.75vmin;
        }
    }
    .subtitle {
        font-weight: bolder;
        text-align: center;
        margin-bottom: 1.5%;
        margin-top: 5%;
        font-family: Georgia, 'Times New Roman', Times, serif;
        /* smallest mobile screen  */
        @media only screen and (max-width: 480px) {
            font-size: 4.25vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 5vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.75vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 4.5vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 896px) {
            font-size: 2.5vmin;
        }
        @media only screen and (min-width: 897px) and (max-width: 1024px) {
            font-size: 2.25vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4.75vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 4.5vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 3vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 3.5vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 4vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 3.5vmin;
        }
    }
    .sub-subtitle {
        font-weight: bolder;
        text-align: center;
        margin-bottom: 1%;
        margin-top: 4%;
        font-family: Georgia, 'Times New Roman', Times, serif;
        @media only screen and (max-width: 480px) {
            font-size: 4vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 5vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.5vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 4.25vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            font-size: 2.25vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4.5vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 4.25vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 2.7vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 3.25vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 3.5vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 3.25vmin;
        }
    }
    .paragraph {
        font-family: Georgia, 'Times New Roman', Times, serif;
        /* smallest mobile screen  */
        @media only screen and (max-width: 480px) {
            font-size: 4.25vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 5vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.75vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 4.25vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4.5vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 4.25vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            font-size: 2.5vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 2.5vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 3.25vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 3.5vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 3.25vmin;
        }
    }
    .subparagraph {
        font-family: Georgia, 'Times New Roman', Times, serif;
        border-left: .5px solid whitesmoke !important;
        border-right: .5px solid whitesmoke !important;
        padding: 2%;
        /* on mobile devices screens */
        @media only screen and (max-width: 320px) {
            font-size: 3.7vmin;
        }
        @media only screen and (min-width: 320px) and (max-width: 480px) {
            font-size: 4vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 4.75vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.5vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            font-size: 2.25vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4.25vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 2.7vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 3vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 3.5vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 3vmin;
        }
    }
    span {
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-style: italic;
        font-weight: 600;
        /* smallest mobile screen  */
        @media only screen and (max-width: 480px) {
            font-size: 4vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 4.75vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.5vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            font-size: 2.25vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4.25vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 2.7vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 3vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 3.5vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 3vmin;
        }
    }
    .sub-subparagraph {
        font-family: Georgia, 'Times New Roman', Times, serif;
        /* on mobile devices screens */
        @media only screen and (max-width: 320px) {
            font-size: 3.5vmin;
        }
        @media only screen and (min-width: 320px) and (max-width: 480px) {
            font-size: 3.75vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 4.5vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.25vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 3.75vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            font-size: 2vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 3.75vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 2.5vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 2.75vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 3vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 2.75vmin;
        }
    }
    .homespacebar {
        margin-top: 5%;
        margin-bottom: 5%;
        height: 2vh;
        background-image: linear-gradient(to right, white, whitesmoke, grey);
    }
    .Himgcontainer {
        margin-bottom: 10%;
        width: 50%;
    }
    .HtextInfo {
        background-image: linear-gradient(gray, whitesmoke, white);
        margin-top: 5%;
        .sub-subparagraph {
            padding-left: 3%;
            padding-right: 3%;
            padding-bottom: 5%;
        }
    }
    .itemlistcontainer,
    .LsStaffMbr {
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            display: none;
        }
    }
    .itemlistcontainer-small {
        display: none;
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            display: block;
            margin-top: 3%;
        }
    }
    .itemlistcontainer {
        margin-top: 3%;
    }
    .smallImg {
        display: flex;
        margin-bottom: 5%;
        .HSimgcontainer {
            width: 50%;
            margin: 2%
        }
        .cateimgcontainer {
            width: 50%;
            margin: 2%;
            border: 1.5px solid whitesmoke;
            padding-left: 5%;
            padding-right: 5%;
            border-radius: 10%;
        }
    }
    .privacypolicy,
    .termsandconditions {
        margin-top: 5%;
    }
    .log_links {
        margin-top: 2%;
        width: 60%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 5%;
    }
    .log_links a {
        text-decoration: none;
        color: green;
        font-family: Georgia, 'Times New Roman', Times, serif;
        padding: 10px 10px;
        @media only screen and (max-width: 320px) {
            font-size: 3.7vmin;
        }
        @media only screen and (min-width: 320px) and (max-width: 480px) {
            font-size: 4vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.5vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 3.75vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            font-size: 2.25vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 3.75vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 2.7vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 2.75vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 3.5vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 2.75vmin;
        }
    }
    .search_Form {
        font-family: Georgia, 'Times New Roman', Times, serif;
        form {
            .btn-default {
                color: white;
                background-color: green;
            }
        }
    }
    .The_Form {
        margin-top: 10%;
        margin-bottom: 10%;
        font-family: Georgia, 'Times New Roman', Times, serif;
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            height: 95vh;
        }
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            height: 150vh;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            height: 75vh;
        }
        @media only screen and (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
            height: 150vh;
        }
        .adminsuccess-message,
        .success-message {
            .close-icon {
                height: 4vh;
                .close-message {
                    float: right;
                    width: 12%;
                    height: 3.5vh;
                    text-decoration: none;
                    color: white;
                    text-align: center;
                    i {
                        width: 75%;
                        margin: auto;
                        background-color: green;
                    }
                }
            }
        }
        .existingcurrentpayment-message {
            .close-icon {
                height: 4vh;
                .close-message {
                    float: right;
                    width: 12%;
                    height: 3.5vh;
                    text-decoration: none;
                    color: white;
                    text-align: center;
                    i {
                        width: 75%;
                        margin: auto;
                        background-color: gray;
                    }
                }
            }
            .awairepay-form {
                border-color: white;
                .payment-awaireness-btn {
                    width: 60%;
                    margin: auto;
                    display: flex;
                    .p-awnsbtn {
                        border: 1px solid gray;
                        border-radius: 45%;
                        width: 35%;
                        margin-left: 10%;
                        text-align: center;
                        color: white;
                        background-color: green;
                    }
                }
            }
            .message-content {
                padding: 7px;
                display: flex;
                font-size: 1em;
                font-family: Georgia, Times, 'Times New Roman', serif;
                i {
                    margin-right: 4px;
                    margin-left: 3px;
                }
            }
        }
        .adminsuccess-message,
        .success-message,
        .nonsuccess-message,
        .searchingduplicatefile-message,
        .filesize-message,
        .existingfile-message,
        .existingcurrentpayment-message,
        .searchingduplicatepayment-message,
        .goodbye-message {
            background-color: white;
            display: none;
            position: absolute;
            border: 1px solid gray;
            .message-content {
                padding: 7px;
                display: flex;
                font-size: 1em;
                font-family: Georgia, Times, 'Times New Roman', serif;
                i {
                    margin-right: 4px;
                    margin-left: 3px;
                }
            }
        }
        .goodbye-message,
        .success-message {
            width: 250px;
            .message-content {
                padding-left: 5%;
                color: green;
            }
        }
        .adminsuccess-message,
        .nonsuccess-message,
        .searchingduplicatefile-message,
        .searchingduplicatepayment-message {
            color: lightcoral;
        }
        .filesize-message,
        .existingcurrentpayment-message,
        .existingfile-message {
            color: peru
        }
        .adminsuccess-message,
        .success-message,
        .nonsuccess-message,
        .searchingduplicatefile-message,
        .filesize-message,
        .existingfile-message,
        .existingcurrentpayment-message,
        .searchingduplicatepayment-message,
        .goodbye-message {
            @media only screen and (max-width: 480px) {
                margin-top: 45%;
                margin-left: 15%;
                margin-right: 15%;
            }
            /* stopped here */
            @media only screen and (max-width: 480px) and (orientation: landscape) {
                margin-top: 20%;
                margin-left: 15%;
                margin-right: 15%;
            }
            /* on ipods and tablets screens */
            @media only screen and (min-width: 481px) and (max-width: 768px) {
                margin-top: 35%;
                margin-left: 15%;
                margin-right: 15%;
            }
            /* on mobile smartphone small screens on landscape orientation*/
            @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                margin-top: 35%;
                margin-left: 15%;
                margin-right: 30%;
            }
            /* on laptops and small screens */
            @media only screen and (min-width: 769px) and (max-width: 1024px) {
                margin-top: 45%;
                margin-left: 15%;
                margin-right: 15%;
            }
            /* landscap orientation for smartphone devices and small ipad */
            @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                margin-top: 30%;
                margin-left: 15%;
                margin-right: 25%;
            }
            /* landscap orientation for smartphone devices larger screen */
            @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                margin-top: 25%;
                margin-left: 10%;
                margin-right: 35%;
            }
            /* on large screen and desktops screens */
            @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                margin-top: 45%;
                margin-left: 15%;
                margin-right: 15%;
            }
            /* landscape orientation for ipad and tablet devices */
            @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
                margin-top: 20%;
                margin-left: 10%;
                margin-right: 35%;
            }
            /* on extra large screens */
            @media only screen and (min-width: 1201px) {
                margin-top: 45%;
                margin-left: 10%;
                margin-right: 35%;
            }
            /* laptop and large screens landscape orientation */
            @media only screen and (min-width: 1201px) and (orientation: landscape) {
                margin-top: 15%;
                margin-left: 10%;
                margin-right: 40%;
            }
        }
        .loading-spinner {
            background-color: transparent;
            color: green;
            display: none;
            position: absolute;
            @media only screen and (max-width: 480px) {
                margin-top: 45%;
                margin-left: 35%;
                margin-right: 35%;
            }
            @media only screen and (max-width: 480px) and (orientation: landscape) {
                margin-top: 20%;
                margin-left: 15%;
                margin-right: 35%;
            }
            /* on ipods and tablets screens */
            @media only screen and (min-width: 481px) and (max-width: 768px) {
                margin-top: 35%;
                margin-left: 35%;
                margin-right: 35%;
            }
            /* on mobile smartphone small screens on landscape orientation*/
            @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                margin-top: 35%;
                margin-left: 35%;
                margin-right: 35%;
            }
            /* on laptops and small screens */
            @media only screen and (min-width: 769px) and (max-width: 1024px) {
                margin-top: 45%;
                margin-left: 35%;
                margin-right: 35%;
            }
            /* landscap orientation for smartphone devices and small ipad */
            @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                margin-top: 30%;
                margin-left: 35%;
                margin-right: 35%;
            }
            /* landscap orientation for smartphone devices larger screen */
            @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                margin-top: 25%;
                margin-left: 25%;
                margin-right: 35%;
            }
            /* on large screen and desktops screens */
            @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                margin-top: 45%;
                margin-left: 30%;
                margin-right: 35%;
            }
            /* landscape orientation for ipad and tablet devices */
            @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
                margin-top: 20%;
                margin-left: 15%;
                margin-right: 45%;
            }
            /* on extra large screens */
            @media only screen and (min-width: 1201px) {
                margin-top: 45%;
                margin-left: 10%;
                margin-right: 40%;
            }
            /* laptop and large screens landscape orientation */
            @media only screen and (min-width: 1201px) and (orientation: landscape) {
                margin-top: 15%;
                margin-left: 15%;
                margin-right: 45%;
            }
            .spinner-border {
                border-top: 8px dotted green;
                border-left: 4px dotted green;
                border-bottom: 2px dotted green;
                width: 120px;
                height: 120px;
                @media only screen and (max-width: 480px) {
                    width: 90px;
                    height: 90px;
                }
            }
        }
        form {
            border: .5px solid green;
            padding-bottom: 10px;
            .subtitle {
                font-weight: normal;
            }
            label {
                font-weight: normal;
                @media only screen and (max-width: 320px) {
                    font-size: 3.7vmin;
                }
                @media only screen and (min-width: 320px) and (max-width: 480px) {
                    font-size: 4vmin;
                }
                @media only screen and (max-width: 480px) and (orientation: landscape) {
                    font-size: 4.75vmin;
                }
                /* on ipods and tablets screens */
                @media only screen and (min-width: 481px) and (max-width: 768px) {
                    font-size: 2.5vmin;
                }
                /* on mobile smartphone small screens on landscape orientation*/
                @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                    font-size: 4vmin;
                }
                /* on laptops and small screens */
                @media only screen and (min-width: 769px) and (max-width: 1024px) {
                    font-size: 2.25vmin;
                }
                /* landscap orientation for smartphone devices and small ipad */
                @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                    font-size: 4.25vmin;
                }
                /* landscap orientation for smartphone devices larger screen */
                @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                    font-size: 4vmin;
                }
                /* on large screen and desktops screens */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                    font-size: 2.7vmin;
                }
                /* landscape orientation for ipad and tablet devices */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
                    font-size: 3vmin;
                }
                /* on extra large screens */
                @media only screen and (min-width: 1201px) {
                    font-size: 3.5vmin;
                }
                /* laptop and large screens landscape orientation */
                @media only screen and (min-width: 1201px) and (orientation: landscape) {
                    font-size: 3vmin;
                }
            }
            .form-group {
                width: 90%;
                margin: auto;
                padding-top: 15px;
            }
            input {
                @media only screen and (max-width: 320px) {
                    font-size: 3.7vmin;
                }
                @media only screen and (max-width: 320px) and (orientation: landscape) {
                    font-size: 3.7vmin;
                }
            }
            select {
                -webkit-appearance: listbox !important;
                @media only screen and (max-width: 320px) {
                    font-size: 3.7vmin;
                }
                @media only screen and (max-width: 320px) and (orientation: landscape) {
                    font-size: 3.7vmin;
                }
            }
            .theBtns {
                width: 45%;
                margin: auto;
                margin-top: 20px;
                /* on mobile devices screens */
                @media only screen and (max-width: 320px) {
                    width: 60%;
                }
            }
            .groupBtn {
                display: block;
                width: 99%;
                margin: auto;
            }
            button {
                margin-left: 3%;
                width: 45%;
                /* on mobile devices screens */
                @media only screen and (max-width: 320px) {
                    font-size: 3.5vmin;
                }
                @media only screen and (min-width: 320px) and (max-width: 480px) {
                    font-size: 3.75vmin;
                }
                @media only screen and (max-width: 480px) and (orientation: landscape) {
                    font-size: 4.5vmin;
                }
                /* on ipods and tablets screens */
                @media only screen and (min-width: 481px) and (max-width: 768px) {
                    font-size: 2.25vmin;
                }
                /* on mobile smartphone small screens on landscape orientation*/
                @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                    font-size: 3.75vmin;
                }
                /* on laptops and small screens */
                @media only screen and (min-width: 769px) and (max-width: 1024px) {
                    font-size: 2vmin;
                }
                /* landscap orientation for smartphone devices and small ipad */
                @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                    font-size: 4vmin;
                }
                /* landscap orientation for smartphone devices larger screen */
                @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                    font-size: 3.75vmin;
                }
                /* on large screen and desktops screens */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                    font-size: 2.5vmin;
                }
                /* landscape orientation for ipad and tablet devices */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
                    font-size: 2.75vmin;
                }
                /* on extra large screens */
                @media only screen and (min-width: 1201px) {
                    font-size: 3vmin;
                }
                /* laptop and large screens landscape orientation */
                @media only screen and (min-width: 1201px) and (orientation: landscape) {
                    font-size: 2.75vmin;
                }
            }
            .btn-default {
                color: white;
                background-color: green;
            }
            .btn-right {
                margin-left: 3%;
            }
            .paymentsCard li {
                /* sub-subtitle character size */
                padding: 10px 10px;
                text-decoration: none;
                @media only screen and (max-width: 480px) {
                    font-size: 4vmin;
                }
                @media only screen and (max-width: 480px) and (orientation: landscape) {
                    font-size: 4.5vmin;
                }
                /* on ipods and tablets screens */
                @media only screen and (min-width: 481px) and (max-width: 768px) {
                    font-size: 2.5vmin;
                }
                /* on mobile smartphone small screens on landscape orientation*/
                @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                    font-size: 3.75vmin;
                }
                /* on laptops and small screens */
                @media only screen and (min-width: 769px) and (max-width: 1024px) {
                    font-size: 2.25vmin;
                }
                /* landscap orientation for smartphone devices and small ipad */
                @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                    font-size: 4vmin;
                }
                /* landscap orientation for smartphone devices larger screen */
                @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                    font-size: 3.75vmin;
                }
                /* on large screen and desktops screens */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                    font-size: 2.7vmin;
                }
                /* landscape orientation for ipad and tablet devices */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
                    font-size: 2.75vmin;
                }
                /* on extra large screens */
                @media only screen and (min-width: 1201px) {
                    font-size: 3.5vmin;
                }
                /* laptop and large screens landscape orientation */
                @media only screen and (min-width: 1201px) and (orientation: landscape) {
                    font-size: 2.75vmin;
                }
            }
            .p_paypal {
                width: 35%;
                margin: auto;
                margin-top: 4%;
                text-align: center;
                /* on mobile devices screens */
                @media only screen and (max-width: 320px) {
                    font-size: 3.5vmin;
                }
                @media only screen and (min-width: 320px) and (max-width: 480px) {
                    font-size: 3.75vmin;
                }
                @media only screen and (max-width: 480px) and (orientation: landscape) {
                    font-size: 4.5vmin;
                }
                /* on ipods and tablets screens */
                @media only screen and (min-width: 481px) and (max-width: 768px) {
                    font-size: 2.25vmin;
                }
                /* on mobile smartphone small screens on landscape orientation*/
                @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                    font-size: 3.75vmin;
                }
                /* on laptops and small screens */
                @media only screen and (min-width: 769px) and (max-width: 1024px) {
                    font-size: 2vmin;
                }
                /* landscap orientation for smartphone devices and small ipad */
                @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                    font-size: 4vmin;
                }
                /* landscap orientation for smartphone devices larger screen */
                @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                    font-size: 3.75vmin;
                }
                /* on large screen and desktops screens */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                    font-size: 2.5vmin;
                }
                /* landscape orientation for ipad and tablet devices */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
                    font-size: 2.75vmin;
                }
                /* on extra large screens */
                @media only screen and (min-width: 1201px) {
                    font-size: 3vmin;
                }
                /* laptop and large screens landscape orientation */
                @media only screen and (min-width: 1201px) and (orientation: landscape) {
                    font-size: 2.75vmin;
                }
            }
            .p_paypal a {
                text-decoration: none;
            }
            .p_paypal:hover {
                background-color: yellow;
            }
            #french {
                display: none;
            }
        }
        .info_login {
            padding-top: 10px;
            a {
                padding: 5px 15px;
                text-decoration: none;
            }
        }
        /* admin forms */
        .admincontainer {
            position: absolute;
        }
        .admindatadisplay {
            border: 1px solid black;
        }
    }
    .abtusImg {
        width: 90%;
        max-width: 100%;
        margin: auto;
        .abtImg {
            width: 100%;
            max-width: 100%;
        }
    }
    .slideshow-container {
        display: flex;
    }
    .aboutusInfo {
        margin-top: 5%;
        margin-bottom: 10%;
    }
    .leftsubtitle {
        font-weight: bolder;
        text-align: left;
        margin-bottom: 2%;
        font-family: Georgia, 'Times New Roman', Times, serif;
        /* smallest mobile screen */
        @media only screen and (max-width: 480px) {
            font-size: 4.25vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 5.25vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.75vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 4.5vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 896px) {
            font-size: 2.5vmin;
        }
        @media only screen and (min-width: 897px) and (max-width: 1024px) {
            font-size: 2.25vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4.75vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 4.5vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 3vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 3.5vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 4vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 3.5vmin;
        }
    }
    .text-body {
        width: 90%;
        margin: auto;
    }
    .catIndusText {
        background-image: linear-gradient(gray, whitesmoke, white);
        margin-bottom: 10%;
        /* on mobile devices screens */
        @media only screen and (max-width: 320px) {
            width: 96%;
            margin-left: 2%;
            margin-right: 2%;
        }
        @media only screen and (min-width: 320px) and (max-width: 480px) {
            width: 96%;
            margin-left: 2%;
            margin-right: 2%;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            width: 80%;
            margin-left: 10%;
            margin-right: 10%;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            width: 80%;
            margin-left: 10%;
            margin-right: 10%;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            width: 70%;
            margin-left: 15%;
            margin-right: 15%;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            width: 60%;
            margin-left: 20%;
            margin-right: 20%;
        }
        .catText {
            /* on mobile devices screens */
            @media only screen and (max-width: 320px) {
                width: 94%;
                margin: auto;
            }
            @media only screen and (min-width: 320px) and (max-width: 480px) {
                width: 94%;
                margin: auto;
            }
            /* on ipods and tablets screens */
            @media only screen and (min-width: 481px) and (max-width: 768px) {
                width: 90%;
                margin: auto;
            }
            /* on laptops and small screens */
            @media only screen and (min-width: 769px) and (max-width: 1024px) {
                width: 90%;
                margin: auto;
            }
            /* on large screen and desktops screens */
            @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                width: 90%;
                margin: auto;
            }
            /* on extra large screens */
            @media only screen and (min-width: 1201px) {
                width: 90%;
                margin: auto;
            }
            .subparagraph {
                font-family: Georgia, 'Times New Roman', Times, serif;
                /* on mobile devices screens */
                @media only screen and (max-width: 320px) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 4.2vmin;
                }
                @media only screen and (min-width: 320px) and (max-width: 480px) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 4.5vmin;
                }
                @media only screen and (max-width: 480px) and (orientation: landscape) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 4.75vmin;
                }
                /* on ipods and tablets screens */
                @media only screen and (min-width: 481px) and (max-width: 768px) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 2.5vmin;
                }
                /* on mobile smartphone small screens on landscape orientation*/
                @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 4vmin;
                }
                /* on laptops and small screens */
                @media only screen and (min-width: 769px) and (max-width: 1024px) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 2.25vmin;
                }
                /* landscap orientation for smartphone devices and small ipad */
                @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 4.25vmin;
                }
                /* landscap orientation for smartphone devices larger screen */
                @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 4vmin;
                }
                /* on large screen and desktops screens */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 2.3vmin;
                }
                /* landscape orientation for ipad and tablet devices */
                @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 3vmin;
                }
                /* on extra large screens */
                @media only screen and (min-width: 1201px) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 3.5vmin;
                }
                /* laptop and large screens landscape orientation */
                @media only screen and (min-width: 1201px) and (orientation: landscape) {
                    padding-left: 5%;
                    padding-right: 5%;
                    padding-top: 2%;
                    padding-bottom: 2%;
                    font-size: 3vmin;
                }
            }
        }
    }
    .HmainImgs {
        .row {
            margin-bottom: 5px;
        }
    }
    .catepageitem {
        padding-top: 1.5%;
        padding-bottom: 0.5%;
        @media only screen and (max-width: 480px) {
            margin-top: 7.5%;
            margin-bottom: 7.5%;
        }
        @media only screen and (min-width: 481px) {
            margin-top: 5%;
            margin-bottom: 5%;
        }
    }
    .pageitem {
        margin-top: 7.5%;
        margin-bottom: 7.5%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 1.5%;
        padding-bottom: 0.5%;
        border: 1px solid whitesmoke;
    }
    .catelistitem {
        padding-left: 2%;
        padding-right: 2%;
        margin-bottom: 5%;
    }
    .listitem {
        border: 2px solid whitesmoke;
        padding: 2%;
        margin-bottom: 10%;
    }
    .item {
        background-color: whitesmoke;
        padding-left: 5%;
        padding-right: 5%;
        padding-bottom: 5%;
        border-radius: 10%;
        margin-bottom: 5%;
    }
    .cateitem {
        border: 1.5px solid whitesmoke;
        border-radius: 10%;
        padding-left: 5%;
        padding-right: 5%;
        border-radius: 10%;
        margin-bottom: 30%;
        /* on mobile devices screens */
        @media only screen and (max-width: 320px) {
            margin-bottom: 10%;
        }
        @media only screen and (min-width: 320px) and (max-width: 480px) {
            margin-bottom: 10%;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {}
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {}
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {}
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {}
    }
    .serviceImg {
        margin-top: 1%;
    }
    .staffTitle {
        /* sub-subtitle character size */
        font-weight: bold;
        text-align: center;
        @media only screen and (max-width: 480px) {
            font-size: 4vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 2.5vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 3.75vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            font-size: 2.25vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 4vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 3.75vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 2.7vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 2.75vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 3.5vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 2.75vmin;
        }
    }
    .mgntStaff img {
        display: block;
        width: 80%;
        margin: auto;
    }
    .mgntStaff,
    .officeBld {
        margin: auto;
        margin-bottom: 5%;
    }
    .error404 {
        font-size: 2.5rem;
        margin: auto;
        padding-top: 100px;
        text-align: center;
        color: grey;
    }
    .list-group {
        border: 1px solid grey;
    }
    .table-responsive {
        width: 90%;
        margin: auto;
    }
    .table-bordered {
        width: 100%;
    }
    .img-fluid {
        width: 100%;
    }
    .aboutImg {
        border: 1px solid black;
    }
    .aboutimgcomp {
        width: 80%;
    }
    .aboutImgCont {
        width: 100px;
    }
    #techlist,
    #contactinfo {
        display: none;
    }
    .servicebtn {
        padding-top: 40px;
        margin-bottom: 5%;
    }
    .servicebtn button {
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-size: 3.2vmin;
    }
    .serviceImg {
        width: 100%;
    }
    /* need to review */
    .serviceForm form button {
        font-size: 2.5vmin;
    }
    .serviceForm form textarea {
        height: 20vh;
    }
    .miscelanious {
        padding-top: 3%;
        padding-bottom: 3%;
    }
    /* review stops here */
    .technologyInfo {
        background-color: white;
        padding-top: .1%;
        padding-bottom: .1%;
        margin-top: 10%;
        margin-bottom: .2%;
    }
    .btn-show-TechInfo {
        background-color: white;
        padding-top: 2%;
        padding-bottom: 2%;
    }
    .btn-show-TechInfo button {
        /* on mobile and other devices screens */
        margin-left: auto;
        margin-right: auto;
        display: block;
        background-color: black;
        color: white;
        font-family: Georgia, 'Times New Roman', Times, serif;
        border: black;
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            width: 20%;
            font-size: 3.5vmin;
            height: 7vh;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            width: 25%;
            font-size: 3.25vmin;
            height: 7vh;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            width: 20%;
            font-size: 2vmin;
            height: 4vh;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            width: 20%;
            font-size: 3.25vmin;
            height: 5vh;
        }
        /* on laptops small screens and ipad tablet larger screen */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            width: 35%;
            font-size: 2vmin;
            height: 4vh;
        }
        /* landscap orientation for smartphone devices small ipad */
        @media only screen and (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
            width: 40%;
            font-size: 4.25vmin;
            height: 7vh;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            width: 35%;
            font-size: 2.5vmin;
            height: 4.5vh;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            width: 30%;
            font-size: 4.25vmin;
            height: 7vh;
        }
        /* on mobile smart phone small screens on portrait orientation*/
        /* on mobile devices screens */
        @media only screen and (min-width: 321px) and (max-width: 480px) {
            width: 40%;
            font-size: 4vmin;
            height: 7vh;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            width: 40%;
            font-size: 5vmin;
            height: 7vh;
        }
        /* on mobile smaller devices screens */
        @media only screen and (max-width: 320px) {
            width: 30%;
            font-size: 3.5vmin;
            height: 8vh;
        }
    }
    .btn-show-TechInfo button:hover {
        background-color: darkgreen;
    }
    .techlist {
        display: none;
        background-color: white;
        color: black;
        font-family: Georgia, 'Times New Roman', Times, serif;
        margin-bottom: 5%;
        width: 90%;
        margin: auto;
        padding-left: 3%;
        /* on mobile devices screens */
        @media only screen and (min-width: 481px) {
            display: block;
            .techlistbar {
                .techlogo {
                    border-bottom: 4px solid whitesmoke;
                    border-left: 1px solid whitesmoke;
                    border-right: 1px solid whitesmoke;
                    border-top: 1px solid whitesmoke;
                    width: 5%;
                    height: 3%;
                    margin: 2%;
                }
            }
        }
    }
    .techlistmobile {
        /* on mobile and others devices screens */
        display: block;
        background-color: white;
        color: black;
        font-family: Georgia, 'Times New Roman', Times, serif;
        margin-bottom: 5%;
        width: 90%;
        margin: auto;
        padding-left: 3%;
        @media only screen and (min-width: 480px) {
            display: none;
        }
        .mobiletechlistbar {
            width: 90%;
            margin: auto;
            display: flex;
            .mobiletechlogo {
                border-bottom: 4px solid whitesmoke;
                border-left: 1px solid whitesmoke;
                border-right: 1px solid whitesmoke;
                border-top: 1px solid whitesmoke;
                width: 6%;
                height: 6%;
                margin: 2%;
            }
        }
    }
    .hcontactInfo {
        background-color: white;
        padding-top: .1%;
        padding-bottom: .1%;
        margin-top: 5%;
    }
    .hcontactus {
        font-family: Georgia, 'Times New Roman', Times, serif;
        .subtitle {
            color: green;
        }
        .contact {
            background-color: white;
            margin-bottom: 4%;
            margin-left: 5%;
            margin-right: 5%;
            color: green;
            padding-top: 2.5%;
            .Address,
            .Tel,
            .email {
                padding-top: 2.5%;
                text-align: center;
            }
            /* on small screens */
            @media only screen and (max-width: 320px) {
                height: 55vh;
                i {
                    font-size: 4vmin;
                }
            }
            @media only screen and (min-width: 321px) and (max-width: 480px) {
                height: 50vh;
                i {
                    font-size: 4vmin;
                }
            }
            /* on mobile smart phone small screens on landscape orientation*/
            @media only screen and (max-width: 480px) and (orientation: landscape) {
                height: 45vh;
                i {
                    font-size: 4.75vmin;
                }
            }
            /* on ipods and tablets screens */
            @media only screen and (min-width: 481px) and (max-width: 600px) {
                height: 45vh;
                i {
                    font-size: 2.5vmin;
                }
            }
            @media only screen and (min-width: 601px) and (max-width: 768px) {
                height: 40vh;
                i {
                    font-size: 2.5vmin;
                }
            }
            /* on mobile smartphone small screens on landscape orientation*/
            @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
                height: 80vh;
                i {
                    font-size: 4vmin;
                }
            }
            /* on laptops and small screens */
            @media only screen and (min-width: 769px) and (max-width: 1024px) {
                height: 35vh;
                i {
                    font-size: 2.25vmin;
                }
            }
            /* landscap orientation for smartphone devices and small ipad */
            @media only screen and (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
                height: 35vh;
                i {
                    font-size: 4.25vmin;
                }
            }
            /* on large screen and desktops screens */
            @media only screen and (min-width: 1025px) and (max-width: 1200px) {
                height: 30vh;
                i {
                    font-size: 2.75vmin;
                }
            }
            /* landscape orientation for ipad and tablet devices */
            @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
                height: 30vh;
                i {
                    font-size: 3vmin;
                }
            }
            /* on extra large screens */
            @media only screen and (min-width: 1201px) {
                height: 55vh;
                i {
                    font-size: 2.5vmin;
                }
            }
            /* laptop and large screens landscape orientation */
            @media only screen and (min-width: 1201px) and (orientation: landscape) {
                height: 40vh;
                i {
                    font-size: 3vmin;
                }
            }
        }
    }
    .btn-show-CtInfo {
        background-color: darkgreen;
        padding-top: 2%;
        padding-bottom: 2%;
    }
    .btn-show-CtInfo button {
        margin-left: auto;
        margin-right: auto;
        display: block;
        background-color: darkgreen;
        color: white;
        border: darkgreen;
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            width: 20%;
            font-size: 3.5vmin;
            height: 7vh;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            width: 20%;
            font-size: 3.25vmin;
            height: 6vh;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            width: 20%;
            font-size: 2vmin;
            height: 3.5vh;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            width: 20%;
            font-size: 3.25vmin;
            height: 4vh;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            width: 20%;
            font-size: 2vmin;
            height: 3.5vh;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
            width: 30%;
            font-size: 4.25vmin;
            height: 6vh;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            width: 30%;
            font-size: 2.5vmin;
            height: 3.5vh;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            width: 30%;
            font-size: 4.25vmin;
            height: 5vh;
        }
        /* on mobile devices screens */
        @media only screen and (min-width: 321px) and (max-width: 480px) {
            width: 30%;
            font-size: 5vmin;
            height: 6vh;
        }
        /* on mobile devices screens */
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            width: 30%;
            font-size: 4vmin;
            height: 6vh;
        }
        /* on mobile smaller devices screens */
        @media only screen and (max-width: 320px) {
            width: 30%;
            font-size: 2.5vmin;
            height: 4.5vh;
        }
    }
    .btn-show-CtInfo button:hover {
        background-color: darkgreen;
    }
    footer {
        /* on mobile and other devices screens */
        padding-top: 2%;
        padding-bottom: 4%;
        font-family: Georgia, 'Times New Roman', Times, serif;
        background-color: green;
        background-image: linear-gradient(green, darkgreen, #21421e);
        .copyright {
            p {
                color: white;
                text-align: center;
            }
        }
        .socialmedialink {
            display: flex;
            width: 90%;
            margin: auto;
            a {
                text-decoration: none;
            }
            .fa-facebook,
            .fa-instagram,
            .fa-linkedin,
            .fa-twitter {
                color: white;
                text-align: center;
            }
            .fa-twitter::before {
                content: "𝕏";
            }
        }
        .footerLinks {
            text-align: center;
            margin-top: 1%;
            a {
                color: white;
                text-decoration: none;
            }
        }
        /* on mobile smart phone small screens on portrait orientation*/
        @media only screen and (max-width: 320px) {
            height: 140px;
            .copyright {
                p {
                    font-size: 3.75vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 4vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 3.75vmin;
                a {
                    padding: 5px 10px;
                }
            }
        }
        @media only screen and (min-width: 321px) and (max-width: 480px) {
            height: 140px;
            .copyright {
                p {
                    font-size: 3.75vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 4vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 3.75vmin;
                a {
                    padding: 10px 20px;
                }
            }
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            height: 130px;
            .copyright {
                p {
                    font-size: 2vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 2.25vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 2vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
        /* on mobile smart phone small screens on landscape orientation*/
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            height: 120px;
            .copyright {
                p {
                    font-size: 4.5vmin;
                }
            }
            .socialmedialink {
                padding-left: 75px;
                a {
                    padding: 5px 20px;
                    font-size: 4.75vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 4.75vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            height: 110px;
            .copyright {
                p {
                    font-size: 3.75vmin;
                }
            }
            .socialmedialink {
                padding-left: 75px;
                a {
                    padding: 5px 20px;
                    font-size: 4vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 3.75vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
        /* on laptops small screens and ipad tablet larger screen */
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
            height: 160px;
            .copyright {
                p {
                    font-size: 1.75vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 2vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 1.75vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
            height: 120px;
            .copyright {
                p {
                    font-size: 4vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 4.25vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 4vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            height: 130px;
            .copyright {
                p {
                    font-size: 2.25vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 2vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 2.25vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            height: 130px;
            .copyright {
                p {
                    font-size: 2.75vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 3vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 2.75vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            height: 150px;
            .copyright {
                p {
                    font-size: 2vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 2.25vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 2vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            height: 150px;
            .copyright {
                p {
                    font-size: 2.75vmin;
                }
            }
            .socialmedialink {
                a {
                    padding: 5px 20px;
                    font-size: 3.25vmin;
                }
                .fa-facebook,
                .fa-instagram,
                .fa-linkedin,
                .fa-twitter {
                    width: 25%;
                }
            }
            .footerLinks {
                font-size: 2.75vmin;
                a {
                    padding: 10px 10px;
                }
            }
        }
    }
    .fa-at,
    .fa-envelope,
    .fa-phone {
        width: 60%;
    }
    /* french version */
    .frtext {
        color: black;
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-style: italic;
        /* on small screens */
        @media only screen and (max-width: 480px) {
            font-size: 6vmin;
        }
        @media only screen and (max-width: 480px) and (orientation: landscape) {
            font-size: 6.25vmin;
        }
        /* on ipods and tablets screens */
        @media only screen and (min-width: 481px) and (max-width: 768px) {
            font-size: 6.5vmin;
        }
        /* on mobile smartphone small screens on landscape orientation*/
        @media only screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
            font-size: 6.75vmin;
        }
        /* on laptops and small screens */
        @media only screen and (min-width: 769px) and (max-width: 896px) {
            font-size: 7vmin;
        }
        /* landscap orientation for smartphone devices and small ipad */
        @media only screen and (min-width: 769px) and (max-width: 896px) and (orientation: landscape) {
            font-size: 7.25vmin;
        }
        @media only screen and (min-width: 897px) and (max-width: 1024px) {
            font-size: 7.5vmin;
        }
        /* landscap orientation for smartphone devices larger screen */
        @media only screen and (min-width: 897px) and (max-width: 1024px) and (orientation: landscape) {
            font-size: 7.75vmin;
        }
        /* on large screen and desktops screens */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) {
            font-size: 8vmin;
        }
        /* landscape orientation for ipad and tablet devices */
        @media only screen and (min-width: 1025px) and (max-width: 1200px) and (orientation: landscape) {
            font-size: 8.25vmin;
        }
        /* on extra large screens */
        @media only screen and (min-width: 1201px) {
            font-size: 8.5vmin;
        }
        /* laptop and large screens landscape orientation */
        @media only screen and (min-width: 1201px) and (orientation: landscape) {
            font-size: 8.75vmin;
        }
    }
    .frintropage {
        background-image: url("images/welcome4.jpg");
        background-repeat: no-repeat;
        height: 100vh;
        @media only screen and (max-width: 480px) {
            padding-top: 50%;
        }
        @media only screen and (min-width: 481px) {
            padding-top: 10%;
        }
        .frintrotext-body {
            width: 90%;
            margin: auto;
            padding: 2%;
            .bottombar {
                border-bottom: 10px solid grey;
            }
            .frwelcome-text {
                @media only screen and (max-width: 480px) {
                    width: 98%;
                    margin: auto;
                    padding-left: 7.5%;
                }
            }
        }
    }
}