﻿body {
    /*padding-top: 50px;
    padding-bottom: 20px;*/

    padding-top: 0px;
    padding-bottom: 0px;
}

a {
    color: #38A3F5; /*#1972e6;*/
}

    a:hover {
        color: #38A3F5; /*#1972e6;*/
    }

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/

.greenColor {
    color: #00ff00;
}

.light-grey-background-color {
    background-color: #F5F5F4;
}

.light-grey-background-color2 {
    background-color: #F5F5F4;
}


.palevioletredColor {
    color: palevioletred;
}

.menu-border-style {
    border-color: grey;
    border: 1px;
    border-style: solid;
    padding: 10px;
    border-radius: 5px;
}


.DiveMoreExplore2 {
    height: 260px;
    width: 163px;
    padding: 0px;
    display: inline-block; /* Makes the spans behave as inline elements but allows setting width and height */
    /*            border: 1px solid #ccc;*/
    position: relative;
}

.DiveMoreExplore2m {
    /*  height: 260px;
    width: 160px;*/
    padding: 0px;
    display: inline-block; /* Makes the spans behave as inline elements but allows setting width and height */
    /*            border: 1px solid #ccc;*/
    position: relative;
    margin-top: 5px;
}

.DiveExplore {
    /*padding: 0px;
    display: inline-block;*/ /* Makes the spans behave as inline elements but allows setting width and height */
    /*border: 1px solid #ccc;
    position: relative;*/
}

.text-block {
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: #010430;
    color: white;
    /*     padding-left: 2px;
            padding-right: 2px;*/
    font-size: x-small;
    text-align: left;
    width: 100%;
}

.text-block-more2 {
    position: absolute;
    bottom: 0px;
    right: 0px;
    background-color: #010430;
    color: white;
    /*     padding-left: 2px;
            padding-right: 2px;*/
    font-size: x-small;
    text-align: left;
    width: 100%;
    overflow-wrap: break-word; /* For better browser support */
    word-wrap: break-word; /* For older browser support */
}

.text-block-more2m {
    position: absolute;
    bottom: 0px;
    right: 0px;
    background-color: #010430;
    color: white;
    /*     padding-left: 2px;
            padding-right: 2px;*/
    font-size: x-small;
    text-align: left;
    overflow-wrap: break-word; /* For better browser support */
    word-wrap: break-word; /* For older browser support */
    width: 32vw;
}

#map {
    height: 100%;
}

.text-h2 {
    /*color: #3C4043;*/
    /*color: #545454;*/
    /*    color: #5a5a5a;*/
    color: #505050;
    font-size: 18.8px; /*20.8px; */ /*22.8px;*/ /*23.8px;*/ /* 21.8px;*/ /*on update also update line height*/
    line-height: 26px; /* 1.2% of size*/
    font-weight: 500;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    /*font-family: "Google Sans", Roboto, Arial, sans-serif;*/
    /*    font-family: Verdana, Geneva, Tahoma, sans-serif;*/
}

.text-h3 {
    color: #000108; /*006FB2;*/
    font-size: 18px;
    /*font-weight: bold;*/
}

.q-site-container {
    width: 100%;
    display: flex;
    height: 100%;
}

#leftbox {
    float: left;
    flex-grow: 1;
    height: 100%;
    /*     border-right-color: gray;
            border-right: 21px !important;
            border-left-color: gray;
            border-left: 21px !important;*/
    /*background-color: #4d4d4d;*/
}

#middlebox {
    float: left;
    /*  background: gray;*/
    width: 1000px;
    height: 100%;
    /*            border-block-start-width: thick;
            border-inline-start-color: aqua;*/
}

#rightbox {
    float: right;
    /* background: #4d4d4d;*/
    /*       border-left-color: gray;
            border-left-width: 11px;*/
    flex-grow: 1;
    height: 100%;
}

.search-button {
    height: 22px;
    /* padding: 6px 12px;*/
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.search-button23 {
    height: 28px;
    /* padding: 6px 12px;*/
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.text-button {
    height: 22px;
    /* padding: 6px 12px;*/
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.text-button23 {
    height: 28px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #041d2b;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.some-references {
    /*border-color: aqua;*/
    font-size: small;
    font-weight: 600;
    /*  padding-inline-end: 10px;*/
    padding-inline-start: 5px;
    float: right;
    padding-top: 5px;
}

.some-references-i {
    /*border-color: aqua;*/
    font-size: 5px;
    font-weight: 100;
    /*  padding-inline-end: 10px;*/
    padding-inline-start: 10px;
    float: right;
    padding-top: 6px;
    padding-right: 0px;
    margin-right: 0px;
}

.ref-store {
    /*          color: #8c7c31;*/
    color: white;
}

.ref-shop {
    color: white;
    /*blue*/
}

.ref-wikipedia {
    /* color: white;*/
}

.ref-google-maps {
    color: white;
}

.ref-geohack {
    color: white;
}

.ref-webcams {
    color: white;
}

.ref-email {
    font-weight: 100;
    width: 200px;
    float: right;
    text-align: left;
    /*  padding-top: 10px;*/
    /*  font-size: small;*/
    /*todo : float bottom??? */
    font-size: 12px;
}

.ref-email-envelope {
    text-align: left;
    /*  padding-top: 10px;*/
    /*  font-size: small;*/
    /*todo : float bottom??? */
    margin-top: 2px;
    font-size: 12px;
}

.ref-phone {
    font-weight: 100;
    width: 200px;
    float: right;
    text-align: left;
    /* padding-top: 10px;*/
    /* font-size: small;*/
    /*todo : float bottom??? */
    margin-top: 2px;
}

.contacts-color {
    color: #329ba8;
    fill: #329ba8;
    /*font-size: 15.8px;*/
    font-size: 14.2px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/*.ref-phone-m {
    color: #2a61a8;*/
/*    width: 200px;*/
/*float: left;

    text-align: left;*/
/*    padding-left: 15px;
    */
/* padding-top: 10px;*/
/* font-size: small;*/
/*todo : float bottom??? */
/*}*/


/* #505373*/

#title-div {
    background: linear-gradient(to right, #01063d, #383c6b, #01063d);
}

#media-div2 {
    /*background: linear-gradient(to right, #01063d, #383c6b, #01063d);*/
}

.blue-color {
    color: #006FB2;
}

.outer-div {
    display: flex;
    justify-content: center; /* Horizontally center the child elements */
}

.inner-div {
    width: 1000px; /* Set the width of the inner div */
}

.container {
    display: flex;
}

.left-div {
    width: 700px;
    /*   background-color: aqua;*/
}

.right-div {
    width: 300px;
    float: right;
    /*    background-color: bisque;*/
}

.right-div2 {
    width: 270px;
    float: right;
}

.more-to-explore {
    background-color: #010626;
}

.more-to-explore2 {
    background-color: #000108;
}

.more-to-explore23 {
    background-color: #F2F4F6;
}

.q-site-navbar {
    background-color: #000108;
}

.q-site-navbar2 {
    /*  background-color: #000108;*/
    /*background-color: #001c1c;*/
    /* background: linear-gradient(to right, #000000, #333333, #000000);*/
    /*    background: linear-gradient(to right, #000000, #333333, #000000);*/
}

.q-site-navbar233 {
    border-bottom: solid 1px #e6e6e6;
    /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
    /* border-bottom: solid 1px #bfbfbf;*/
    /*  background-color: #000108;*/
    /*    background-color: #ebf0f5;*/
    background-color: /*#F2F4F6;*/ #e6f5fa;
    /* background: linear-gradient(to right, #000000, #333333, #000000);*/
    /*    background: linear-gradient(to right, #000000, #333333, #000000);*/
}

.q-site-navbar233b {
    /*    border-bottom: solid 1px #bfbfbf;*/
    /*  background-color: #000108;*/
    background-color: #F2F4F6;
    /* background: linear-gradient(to right, #000000, #333333, #000000);*/
    /*    background: linear-gradient(to right, #000000, #333333, #000000);*/
}

.q-site-navbar25 {
    /*  background-color: #000108;*/
    /*background-color: #001c1c;*/
    /* background: linear-gradient(to right, #000000, #333333, #000000);*/
    border-bottom: solid 1px #bfbfbf;
}

.q-site-navbar25b {
    /*  background-color: #000108;*/
    /*background-color: #001c1c;*/
    /* background: linear-gradient(to right, #000000, #333333, #000000);*/
    /*    border-bottom: solid 1px #bfbfbf;*/
}

.q-site-navbar252 {
    /*  background-color: #000108;*/
    /*background-color: #001c1c;*/
    /* background: linear-gradient(to right, #000000, #333333, #000000);*/
    /*    border-bottom: solid 1px #bfbfbf;*/
}

.q-site-navbar23 {
    /*  background-color: #000108;*/
    /*background-color: #001c1c;*/
    /* background: linear-gradient(to right, #000000, #333333, #000000);*/
    border-bottom: solid;
    border-color: blue;
    border-width: 1px;
}

.hr-style {
    background-color: #f2f2f2;
    width: 645px;
    margin-left: 0px;
}

.hr-style2 {
    background-color: #f2f2f2;
    width: 645px;
    /*            padding-top: 5px;
            padding-bottom: 5px;*/
    margin: 0px;
    margin-top: 6px;
    margin-bottom: 6px;
}

.hr-style22 {
    background-color: #f2f2f2;
    width: 605px;
    /*            padding-top: 5px;
            padding-bottom: 5px;*/
    margin: 0px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.hr-style2-os {
    background-color: #f2f2f2;
    width: 700px;
    /*            padding-top: 5px;
            padding-bottom: 5px;*/
    margin: 0px;
    margin-top: 6px;
    margin-bottom: 6px;
}

.hr-style2-os-m {
    background-color: #f2f2f2;
    width: calc(100vw - 50px);
    /*            padding-top: 5px;
            padding-bottom: 5px;*/
    margin: 0px;
    margin-top: 6px;
    margin-bottom: 6px;
}

.hr-style2-m {
    background-color: #f2f2f2;
    /*            padding-top: 5px;
            padding-bottom: 5px;*/
    margin: 1px;
    margin-top: 1px;
    margin-bottom: 1px;
}

.explore-h {
    /*background-color: #f2f2f2;*/
    padding-top: 20px;
    /* color: #055973;*/
    color: #000108;
    font-size: x-large;
}

.media-q-site-m {
    /* background-color: #212442;*/
    width: 200px;
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    font-size: 12.8px;
    font-weight: 700; /*600;*/
    border-radius: 20px;
    /*color: #b4dcfa;*/
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    background-color: /*#eef6ff;*/ #e3f0ff;
    border: 1px solid #d2e6f5;
}

.media-q-site {
    /* background-color: #212442;*/
    background: linear-gradient(to right, #113242, #021c2e);
    border: 1px solid #272a42;
    width: 200px;
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 38px;
}

.media-q-site22 {
    /*    background-color: #CACACA;*/
    /*    background: linear-gradient(to right, #113242, #021c2e);*/
    /* border: 1px solid #f0f0f0;*/
    /*    width: 200px;*/
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    background-color: #ebf0f5;
    border: solid 1px #d2e6f5;
    /*box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); */ /* Slightly darker and wider shadow */
    /*transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;*/
}

    .media-q-site22:hover,
    .media-q-site22:visited,
    .media-q-site22:focus {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); /* Slightly darker and wider shadow */
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    }

.media-q-site234 {
    /* background-color: #212442;*/
    /*    background-color: #cacaca;
    border: 1px solid #dedede;*/
    width: 100%;
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    background-color: /* #eef6ff; */ #e3f0ff; /*#ebf0f5;*/
    /*box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);*/ /* Slightly darker and wider shadow */
    /*transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;*/
    border: solid 1px #d2e6f5;
}

    .media-q-site234:hover,
    media-q-site234:visited,
    media-q-site234:focus,
    media-q-site234:active {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    }


.media-q-site2342 {
    /* background-color: #212442;*/
    /*    background-color: #cacaca;
    border: 1px solid #dedede;*/
    width: /*180px;*/ 265px;
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
}

.media-q-site2 {
    /* background-color: #212442;*/
    background-color: #cacaca;
    border: 1px solid #dedede;
    width: 200px;
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
}

.media-q-site23 {
    /*    border: 1px solid #dedede;*/
    border: 1px solid #123456;
    width: 200px;
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
}

.media-titles {
    font-size: 12.8px;
    /*   color: dimgray;*/
    font-weight: 600;
}

.media-titles-m {
    font-size: 11.8px;
    /*   color: dimgray;*/
    font-weight: 600;
}

.text-h-some {
    /* font-size: 26px;*/
    position: relative;
    /* display: inline-block;*/ /* Ensures the pseudo-element aligns with the text */
    padding-left: 10px;
}

    .text-h-some::before {
        content: "";
        position: absolute;
        left: 0px; /* Adjust the position to move the line left of the text */
        width: 3px; /* Width of the vertical line */
        top: 1px; /* 2 pixels above the text */
        bottom: 1px; /* 2 pixels below the text */
        background-color: #38a3f5; /* Color of the vertical line */
        margin-right: 2px;
    }

.text-h-some2 {
    /*    font-size: 22px;*/
    position: relative;
    /* display: inline-block;*/ /* Ensures the pseudo-element aligns with the text */
    padding-left: 10px;
    font-weight: 600;
}

    .text-h-some2::before {
        content: "";
        position: absolute;
        left: 0px; /* Adjust the position to move the line left of the text */
        width: 3px; /* Width of the vertical line */
        top: 1px; /* 2 pixels above the text */
        bottom: 1px; /* 2 pixels below the text */
        background-color: #38a3f5; /* Color of the vertical line */
        margin-right: 2px;
    }

.text-h-some-m {
    position: relative;
    /*display: inline-block;*/ /* Ensures the pseudo-element aligns with the text */
    padding-left: 10px;
    /*padding-top: 1px;
    padding-bottom: 1px; */ /*006FB2;*/
}

    .text-h-some-m::before {
        content: "";
        position: absolute;
        left: 0px; /* Adjust the position to move the line left of the text */
        width: 3px; /* Width of the vertical line */
        top: -1px; /* 2 pixels above the text */
        bottom: 3px; /* 2 pixels below the text */
        background-color: #38a3f5; /* Color of the vertical line */
        margin-right: 2px;
    }

/*        share bellow*/
.navbar {
    background-color: #333;
    overflow: hidden;
    padding: 10px;
}

.share-button {
    float: right;
    color: white;
    font-size: 15px !important;
    cursor: pointer;
    /*    padding-right: 0px !important;
    margin-right: 0px !important;*/
}

.share-options {
    display: none;
    position: absolute;
    right: 10px;
    top: 100px;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.share-option {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

    .share-option:hover {
        background-color: #f1f1f1;
    }

    .share-option:hover,
    .share-option:focus,
    .share-option:active {
        text-decoration: none !important;
        outline: none;
    }

.padded-text {
    padding-top: 5px; /* Adjust the value as needed */
    padding-bottom: 5px; /* Adjust the value as needed */
    display: inline-block; /* Ensures the padding is applied properly */
}

.q-ref-title {
    font-size: 14px;
    color: #000108;
    font-weight: bold;
}

.padded-text-d {
    padding-top: 2px; /* Adjust the value as needed */
    padding-bottom: 2px; /* Adjust the value as needed */
    display: inline-block; /* Ensures the padding is applied properly */
}

.q-ref-title-d {
    font-size: initial;
    color: #000108;
    font-weight: bold;
}

.flex-link {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width: 605px;
}

.flex-link-os {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width: 645px;
}

.flex-link-os-m {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width: calc(100vw - 55px);
}

/*.flex-link-os {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width: contain;
}*/

.flex-link-os {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    flex-wrap: nowrap;
}

.right-content {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
}

.icon-wrapper {
    flex-shrink: 0;
    margin-left: 8px; /* Space between text and icon */
}

.flex-link-m {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0 5px;
    text-decoration: none;
}

.link-content {
    flex: 1;
    min-width: 0; /* Prevents text from pushing icon off screen */
}

.right-align {
    margin-left: auto;
}

.fa-comments-o {
    color: #38a3f5;
}

.mylabels {
    color: #989fa6;
    font-size: 13px;
}

.mylabels-categories {
    color: #666666;
    /*background-color: #f5f5f5;*/
    background-color: #E6F5FA;
    font-size: 14px;
    padding: 1px 10px;
    border-radius: 2px;
    margin-right: 3px;
}

.mylabels-attributes {
    color: #666666;
    background-color: #f9fae6;
    /*background-color: #E6F5FA;*/
    font-size: 14px;
    padding: 1px 4px;
    border-radius: 2px;
    margin-right: 3px;
}

.mylabels-dots {
    color: #666666;
    background-color: #f5f5f5;
    /*background-color: #E6F5FA;*/
    font-size: 14px;
    padding: 1px 4px;
    border-radius: 2px;
    margin-right: 3px;
}

.location-column {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.location-column-baseline {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    justify-content: flex-end;
}

.location-item {
    font-weight: 500;
    /*  color: #a6a6a6;*/
    color: #15BCE8; /*#1972e6; */ /*#3277b4;*/
    display: flex;
    justify-content: flex-end;
    gap: 2px;
    font-family: Arial, sans-serif;
}

.location-item-baseline {
    align-items: baseline;
}

.moreList-content {
    overflow: hidden; /* Important for height transitions */
    transition: max-height 0.5s ease-in-out; /* Adjust 0.5s for speed */
    max-height: 500px; /* Adjust this value to a sensible max height */
}

    .moreList-content.collapsed {
        max-height: 0; /* Collapsed state */
    }


.my-rating {
    /* color: #02e3f7;*/
    color: /*#FFD60A;*/ #4addf7;
}

.q-rating {
    /*    color: #db9442;*/
    color: #FFD60A;
}

.star-color {
    color: /*#f9fae6*/ #FFD60A;
    font-size: 10px;
}

.star-color2 {
    color: /*#f5f5f5;*/ /*#8f8f8f*/ #aba9a9;
    font-size: 10px;
}

.comment-color {
    font-size: 10px;
}

/*feature*/
.scroll-container23 {
    width: 100%;
    max-width: 600px;
    position: relative;
    padding: 0;
    margin: 0;
    height: 0;
    background-color: aqua;
}

.scroll-content23 {
    display: flex;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    padding: 10px 0 10px 0;
    margin: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: 8px;
    /*            height: 20px;*/
    white-space: nowrap; /* Prevent words from wrapping to the next line */
    align-items: center; /* Vertically center the items */
}

    .scroll-content23::-webkit-scrollbar {
        display: none;
    }

.category-group23 {
    display: flex;
    align-items: center;
    white-space: nowrap;
    padding: 10px 5px 0 5px;
    margin: 0 5px 0 5px;
    /*        border: 1px solid #e5e7eb;
        border-radius: 20px;
        background-color: #fff;*/
}

.category-link23 {
    /*        border-color: #212936;
        border-radius: 10px;
        background-color: #212936;
        font-size: small;
        font-weight: 200;
        text-decoration: none;
        padding: 1px 4px;*/
    color: #38a3f5;
    /*   color: #757575;*/
    /*    color: #797e85;*/
    font-size: 12px;
    text-decoration: none;
    padding: 1px 7px;
    border: solid;
    border-width: 1px;
    /*  border-color: #797e85;*/
    border-color: /*#b3b3b3;*/ #38a3f5; /*#808080;*/ /*#3c3c3c;*/
    border-radius: 20px;
    /*    background-color: #F2F4F6;*/
    margin: 0;
}

/* end feature*/

/*start main img  main video*/

.content-container {
    display: flex;
    gap: 2px;
    /*    margin-bottom: 10px;*/
}

.frame-img-profile {
    width: 217px;
    height: 325px;
    overflow: hidden;
    /*    dddddd flex-shrink: 0;*/
    border-radius: 10px;
}

.image-container-profile {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    border: 1px solid #20256e;
}

    .image-container-profile img {
        /*height and width are set by aspect ratio*/
        object-fit: cover;
        object-position: center;
    }

.video-content {
    width: 580px;
    height: 325px;
    border-radius: 10px;
    flex-shrink: 0;
}

/*end main img  main video*/

/*start main img     */

.frame-img-profile-180-270-d {
    width: 180px;
    height: 270px;
    overflow: hidden;
    display: flex;
    border-radius: 10px;
    position: relative;
}

.image-container-profile-180-270-d {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    border: 1px solid #20256e;
}

    .image-container-profile-180-270-d img {
        /*height and width are set by aspect ratio*/
        object-fit: cover;
        object-position: center;
        border: 1px solid #20256e;
        border-radius: 10px;
    }

/*end main img */


/*start main img   m  */

.frame-img-profile-24-36-m {
    width: 24vw;
    height: 36vw;
    overflow: hidden;
    display: flex;
    border-radius: 10px;
    position: relative;
}

.image-container-profile-24-36-m {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}

    .image-container-profile-24-36-m img {
        /*height and width are set by aspect ratio*/
        object-fit: cover;
        object-position: center;
        border-radius: 10px;
    }

.image-container-profile-24-36-m2 {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}

    .image-container-profile-24-36-m2 img {
        /*height and width are set by aspect ratio*/
        object-fit: cover;
        object-position: center;
        border-radius: 10px;
    }

.text-content {
    display: inline;
}


/*end main img m */

.frame-img-126 {
    /*width: 129px;*/ width: 123px;
    /*height: 126px;*/ height: 123px;
    overflow: hidden;
    display: flex;
}

.image-container-126 {
    /*width: 129px;*/ width: 123px;
    height: 100%;
    overflow: hidden;
    /* display: flex;*/
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}

    .image-container-126 img {
        width: 100%;
        height: 150%;
        object-fit: cover;
        object-position: center;
    }


.frame-img-33-m {
    width: calc((100vw - 30px - 14px) / 3); /*   2*15 margin ... 2*7 gap*/
    height: calc((100vw - 30px - 14px) / 3);
    overflow: hidden;
    display: flex;
}

.image-container-33-m {
    width: calc((100vw - 30px - 14px) / 3); /*   2*15 margin ... 2*7 gap*/
    height: 100%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}

    .image-container-33-m img {
        width: 100%;
        height: 150%;
        object-fit: cover;
        object-position: center;
        border-radius: 10px;
    }

.icon-wrapper-2 {
    flex-shrink: 0;
    margin-left: 8px; /* Space between text and icon */
    display: flex;
    align-items: center;
}

/*.flex-link-m-2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0 5px;
    text-decoration: none;
}*/

.moreR {
    width: 100%;
}

    /* Ensure consistent display when shown */
    .moreR td {
        width: 100%;
    }

.link-content-2 {
    flex: 1;
    min-width: 0; /* Prevents text from pushing icon off screen /
    }
    .icon-wrapper-2 {
        flex-shrink: 0;
        margin-left: 8px; / Space between text and icon */
}

.flex-link-m-2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0 5px;
    text-decoration: none;
}

    .flex-link-m-2:hover,
    .flex-link-m-2:focus,
    .flex-link-m-2:visited {
        text-decoration: none;
    }

.media-arrows-color {
    color: #808080;
}

.media-arrows {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    color: white;
    opacity: 0.5; /* Makes the buttons semi-transparent */
    background-color: rgba(0, 0, 0, 0.3); /* Slight background for better visibility */
    padding: 10px;
    border-radius: 5px;
    text-decoration: none;
}

    .media-arrows:hover {
        opacity: 1; /* Make it fully visible on hover */
    }

.media-arrows-m {
    position: absolute;
    top: 52%;
    transform: translateY(-50%);
    font-size: 20px;
    color: white;
    opacity: 0.5; /* Makes the buttons semi-transparent */
    background-color: rgba(0, 0, 0, 0.3); /* Slight background for better visibility */
    padding: 10px;
    border-radius: 5px;
    text-decoration: none;
}

.media-arrows-m2 {
    position: absolute;
    top: 50%;
    transform: translateY(-34%);
    font-size: 20px;
    color: white;
    opacity: 0.5; /* Makes the buttons semi-transparent */
    background-color: rgba(0, 0, 0, 0.3); /* Slight background for better visibility */
    padding: 10px;
    border-radius: 5px;
    text-decoration: none;
}

.left-arrow {
    left: -10px;
}

.right-arrow {
    right: -10px;
}

.review-class {
    font-size: 12.8px;
    font-weight: 500;
    color: #d44e4e;
    font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
}

.review-m {
    align-self: flex-start;
    margin-top: auto;
    height: 20px;
    width: 200px;
    padding: 2px;
    float: left;
    text-align: left;
    margin-bottom: 5px;
}

.category-link:hover,
.category-link:focus,
.category-link:active {
    text-decoration: none;
    outline: none; /* optional: removes the dotted border */
}

.category-link4:hover,
.category-link4:focus,
.category-link4:active {
    text-decoration: none;
    /*   outline: none; */ /* optional: removes the dotted border */
}

.subcategory-link:hover,
.subcategory-link:focus,
.subcategory-link:active {
    text-decoration: none;
    outline: none; /* optional: removes the dotted border */
}

.subcategory-link4:hover,
.subcategory-link4:focus,
.subcategory-link4:active {
    text-decoration: none;
    /* outline: none; */ /* optional: removes the dotted border */
}


.frame-img-profile-180-270-d2 {
    width: 160px;
    height: 240px;
    overflow: hidden;
    display: flex;
    border-radius: 10px;
    position: relative;
}

.image-container-profile-180-270-d2 {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}

    .image-container-profile-180-270-d2 img {
        /*height and width are set by aspect ratio*/
        object-fit: cover;
        object-position: center;
        border-radius: 10px;
    }

.media-label {
    text-align: left;
    font-size: /* 14.8px;*/ /*12.8px;*/ 14.2px;
    /*    font-weight: 500;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;*/
    font-weight: /*500;*/ 400;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #333333;
    padding-right: 6px;
    padding-left: 6px;
}

.text-h4 {
    color: #453c59;
    /*font-size: 15.8px;*/
    font-size: 14.2px;
    font-weight: 600;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.text-h4-more {
    color: #1d72cc;
    font-size: 10.8px;
    font-weight: bold;
}

.color-follow {
    color: #17212b;
    fill: #17212b;
    /*font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;*/
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.category-background-icon-fill {
    fill: /*#F2F4F6;*/ #e6f5fa;
}

.category-background-icon-fill-2 {
    fill: #15BCE8;
}

.info-icon-fill {
    /*fill: #ccc;*/
    fill: #78b4c8;
}

.category-related-fill {
    fill: white;
}

.category-related-fill-2 {
    fill: #15BCE8;
}

.heading-shortcut {
    float: right;
    color: #b3b3b3;
    font-size: 12px;
    width: 12px;
    font-weight: 100;
    background-color: #F2F4F6;
}

a:focus:not(:focus-visible) {
    outline: none !important;
}
