/* Custom CSS to remove label borders */
form label {
    border: none; /* Removes the border */
    background: none; /* Removes any background */
    padding: 0; /* Optional: Adjust padding */
}


.background-div {
    width: 100%;
    height: 500px;
    background-image: url("{% static 'images/legianbeach.png' %}");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


#gemstone-regular {
            font-family: "Rubik Gemstones", system-ui;

        }

.resizedImage {
    width: 200px;
    height: 150px;
    border : solid 2px;
}
.italic-text {
    font-style : italic;
}
.container {
            width: 100%;
            max-width: 960px; /* Optional: Set maximum width */
            margin: 0 auto;   /* Center align the container */
            border : none;
            text-color : grey;

        }

.bg-header {
    padding : 10px, 10px, 10px
}

.bd-solid {
    border : 2px solid grey;
    background : #e6e6e6;

}
.text-address {
    width : 600px;
    word-wrap: break-word;
}

.text-city {
    width : 700px;
    word-wrap: break-word;
}
.text-country {
    width : 500px;
    word-wrap: break-word;
}


.fasthand-regular {
            font-family: "Fasthand", cursive;
            font-weight: 400;
            font-style: normal;
        }

ul {
            list-style-type: square;
            margin-left : 16px; /* Remove default margin */
            padding: 0; /* Remove default padding */
        }

li {
            margin-bottom: 5px; /* Add margin between list items */
        }


a {
            text-decoration: none; /* Remove underline */
            color: inherit;
        }

text-black {
            color : black;
        }
a:hover {
            color : grey;

        }

a:visited {
            color : white;
        }

body {
            font-family: 'Helvetica Neue', Arial, sans-serif;

        }
#textMenu {
            background-color : #ff66cc;
            text-color : white;
        }
div.bodySize {
            width : 100%;
            margin-top : 0;
            margin-left : auto;
            margin-right : auto;
        }
div.bodyTop {
            width : 100%;
            margin-top : 0;
            margin-left : auto;
            margin-right : auto;
        }

.dropdown:hover .dropdown-content {
            display: block;
            }

p {
            font-size : 14px
        }

div.subbodySize {
            margin : 0 auto;
            align-items : center;
            justify-content : center;
        }

navbar.right {
            float : right
        }

ul.right {
            text-align : right
        }


.container img {
            position: relative;
            margin: 0 auto;

        }

.imgcenter {
            display:flex;
            align-items:center;
            justify-content:center;
            text-align:center;
            width=100%;
            height=100%;
            object-fit:cover;
        }
.image {
            max-width: 100%;
            height: auto;
            object-fit: cover;  /*Maintain image aspect ratio */
        }

.imagelogo {
            width : 10%;
            height: 10%;

        }
.text-overlay {
            position: absolute;
            padding : 5x;
            top : 50%;
            left: 50%;
            text-align:center;
            transform: translate(-50%, -50%);
            color: #990033;

            font-size: 60px;
            font-weight: bold;
            z-index: 1; /* Place text on top */
        }

.text-nav {
            position : absolute;
            background-color : #33eeff;
            text-color: white;
        }

.ImageHome {
            max-width:100%;
            height: auto;
            object-fit:cover;
        }

.text-center {
            display: flex;
            align-items: center;
            justify-content: center;
            text-align:center;
            padding : 40px;
        }
.text-border {
            display: flex;
            align-items: center;
            justify-content: center;
            text-align:center;
            padding : 10px;
        }

.text-video {
            display: flex;
            align-items: center;
            justify-content: center;
            text-align:center;
            padding : 5px;
        }
.text-footer {
            font-family: 'Roboto', sans-serif;
        }

.bodyfooter {
            width : 80%;
            margin-top : 2%;
            margin-left : auto;
            margin-right : auto;
            background-color:#666666;
            color:#e6e6e6;
            padding : 20px;
            font-family : 'lato', sans-serif;
            font-size : small;
        }

img, video {
            max-width: 100%;
            height: auto;
        }

        /* For desktop: */
        .col-1 {width: 8.33%;}
        .col-2 {width: 16.66%;}
        .col-3 {width: 25%;}
        .col-4 {width: 33.33%;}
        .col-5 {width: 41.66%;}
        .col-6 {width: 50%;}
        .col-7 {width: 58.33%;}
        .col-8 {width: 66.66%;}
        .col-9 {width: 75%;}
        .col-10 {width: 83.33%;}
        .col-11 {width: 91.66%;}
        .col-12 {width: 100%;}

@media only screen and (max-width: 768px) {
        /* For mobile phones: */
            [class*="col-"] {
                width: 100%;
            }
            body {
                font-size: 14px; /* Adjust font size for smaller screens */
            }
        }


/* Styles for screens 768px and larger (e.g., desktops) */
@media (min-width: 768px) {
            /* Add desktop-specific styles here */
            [class*="col-"] {
                width: 100%;
            }
            body {
                font-size: 16px;
            }
        }

.form-input {
            width: 100%; /* Responsive full width */
            max-width: 400px; /* Limit maximum width */
            padding: 10px; /* Add padding */
            font-size: 16px; /* Improve readability */
        }

.carousel-inner img {
    width: 100%;
    height: 100%;
  }


.myMenuDiv {
    background-color: grey; /* Set background color */
    width: 100%; /* Example width */
    height: 200px; /* Example height */
}