.plus {
    width:5px;
    padding:3px 14px 3px 14px;
}

.minus {
    width:5px;
    padding:3px 14px 3px 14px;
}

.ydata {
  margin-left : 10px;
  }

.ydataad {
    width : 340px;
    margin-left : 20px;
}

.cg_yxdata {
    overflow: hidden;
    resize: none;
    overflow-wrap: normal;
    word-wrap: normal;
}


.sticky2 {
    position: fixed;
    top: 90px;
    z-index: 1000;
}

.cg_header {
    color: #ff8c00;
}

.cg_mainheader {
    color: #2A98C3;
    font-weight: bold;
}


.cg_tiles {
    margin:10px;
    border-radius:10px;
}

.cg_visualizers {
    margin-left : 20px;
}

.cg_btn_result {
    margin: 0 10px 15px 13px;
    width :200px;
}

.cg_btn_templates {
    margin : 18px 0 18px 0;

}

.cg_iframe_templates {
    border-radius:10px;
    width:500px;
    display : block;
}

.cg_iframe_horizontal {
    width : 1000px;
    display : block;
}

.cg_messagebox {
    margin: 20px;
    font-weight: bold;
    position: relative;
}

.cg_preview_button {
    margin:5px 10px 45px 10px;
}


th.cg_excel_header {
    background-color: #90A4AE;
    border: 1px #eeeeee solid;
    color: #0e0e0e;
    font-weight: bold;
    font-size: 16px;
}

td.cg_excel_cell {
    border: 1px #eeeeee solid;
}

.cg_excel_data {
    border: none;
    outline: none;
    background-color: transparent;
    padding: 0px;
    margin: 0px;
    width: 100%;
    font-size: 14px;
    text-align: right;
}


.cg_excel_x {
    text-align: left;

}

.cg_navbar {
    position : relative !important;
}

.cg_menulinks {
    cursor : pointer;
    margin-left : 11px;
    color : #1c99e6;
    font-weight: bold;
}
.cg_menulinks:hover {
    text-decoration: underline;
}

.material-symbols-outlined {
    cursor: pointer;
    font-size: 24px;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.betahidden {
    /*display : none;*/
}

.cg_guide_header {
    color: #ff8c00; /* Existing color property */
    margin-top: 50px; /* Add this line to create space above */
}


.cg_text_orange {
    color: #ff8c00; /* Existing color property */
}

.cg_social_media_icons {
    margin : 10px;
}


.help_img_container {
    /* border: 3px solid #ccc;
    border: 1px solid #ccc;
    display: block;
    margin-left: auto;
    margin-right: auto;
     */
    margin: 20px auto; /* Space around image */
    display: block; /* Center image */
    width: 70%; /* Maintain consistency */
}
.help_text {
    margin: 40px 0 20px 20px; /* Define top and bottom margins explicitly */
    line-height: 1.5; /* Set line spacing for readability */
    text-align: justify; /* Optional: Justify text for consistency */
}

.help_accordion {
    margin-left: 50px;
}

.guide_rounded_shadow {
        width: 60%; /* Set image width to 70% */
        border-radius: 10px; /* Rounded corners */
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Adds a subtle shadow */
        margin-bottom: 50px !important;; /* Optional: Adds spacing below the image */
}



.footer-text-right {
     float: right; /* Floats the text to the right */
     font-size: 1.00rem; /* Keeps font size consistent */
     margin-left: 15px; /* Adds some spacing between the copyright and the language links */
     color: white; /* Sets the "Languages" text to white */
 }
 
 .footer-text-right a {
     color: #1889c1; /* Sets the color of the language links to aqua blue */
     text-decoration: none; /* Removes underline from links */
 }
 
 .footer-text-right a:hover {
     text-decoration: underline; /* Adds underline on hover */
     color: #00B7B7; /* Optionally, change color on hover (darker aqua) */
 }

 .cg_btn_action {
     background-color: #ff8c00;
     color : #ffffff;
     padding : 10px 15px 10px 15px;
     margin : 10px;
 }

 .cg_btn_action:hover {
     color : #ffffff;
     background-color: #fdb528;
 }

 .cg_fb_container {
     padding:10px 0 3px 3px;
     background-color:white;
     border-radius:5px;
     border:solid 1px gray;
 }

 .cg_ra1 {
     --ad-size: '728x90';
     width : 728px;
     height : 90px;
     border : solid 1px silver;
     padding : 5px;
     margin-bottom: 30px;
     cursor: pointer;
     display : none;
 }



@media (min-width: 990px) and (max-width: 1400px)  {

    .sticky {
        position: relative;
    }


    .cg_preview_button {
        margin:5px 10px 65px 40px;
        width:250px;
    }



}



@media (max-width: 1200px) {




    .sticky {
        position: relative;
        top: 0;
        z-index: 1;
    }

    .cg_preview_button {
        margin:5px 10px 65px 40px;
        width:250px;
    }

}

@media (max-width: 990px) {

    .pin-sticky {
        display: none;
    }

    .cg_desktop_only {

        display: none;
    }

    .cg_fb_container {
        zoom : 0.6;
    }

}

/* Default style for large screens */
.responsive-image {
     width: 70%;
     max-width: 800px; /* Maximum width for large screens */
     height: auto; /* Maintain aspect ratio */
     margin-bottom: 20px;
     border: 2px solid #ccc;
     overflow: hidden; /* Prevents any content overflow from the card */
 }

 
 /* For screens smaller than 1200px */
 @media (max-width: 1200px) {
     .responsive-image {
         max-width: 600px; /* Shrink image for medium screens */
     }
 }
 
 /* For screens smaller than 990px (like mobile devices) */
 @media (max-width: 990px) {
     .responsive-image {
         max-width: 80%; /* Full width on small screens */
     }

     .cg_iframe_templates {
         border-radius:10px;
         width:500px;
         zoom : 0.5;
     }

     .cg_iframe_horizontal {
         width : 500px;
         zoom : 0.5;
     }

     .cg_ra1 {
         --ad-size: '300x250';
         width : 300px;
         height : 250px;
     }
 }


/* For screens smaller than 990px (like mobile devices) */
@media (min-width: 990px) and (max-width: 1275px) {

    .cg_iframe_templates {
        border-radius:10px;
        width:500px;
        zoom : 0.6;
    }

    .cg_iframe_horizontal {
        width : 800px;
        zoom : 0.8;
    }
}
 
 /* Ensure the image is responsive and contained properly */
 .card img {
     max-width: 70%;  /* Ensures the image doesn't exceed its container width */
     height: auto;     /* Maintains the image's aspect ratio */
     display: block;   /* Ensures the image is treated as a block-level element */
     margin: 0;        /* Removes any automatic centering or extra margins */
     float: none;      /* Ensure no floating */
 }
 
 /* Ensure the text stays below the image */
 .card-body {
     clear: both;      /* Clears any floats, forcing content to appear below the image */
     margin-top: 20px; /* Add spacing between image and text */
 }



ul.share-buttons{
    list-style: none;
    padding: 0;
}

ul.share-buttons li{
    display: inline;
}

ul.share-buttons .sr-only{
    position: absolute;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
}



/* SHARE THIS CODE */
ul.share-buttons{
    list-style: none;
    padding: 0;
}

ul.share-buttons li{
    display: inline;
}

ul.share-buttons .sr-only{
    position: absolute;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
}














/* LEO AND AI FRIEND WAS HERE Ensure the table is responsive and looks good on all devices */
.table-responsive {
    overflow-x: auto; /* Maintains horizontal scrolling for small screens */
}

/* Custom table styling */
.custom-table {
    width: 100%;
    border-collapse: collapse;
}

/* Style for table headers and cells */
.custom-table th,
.custom-table td {
    padding: 18px 16px; /* Increase padding to make rows taller (default is around 8px, so 24px is roughly 3x) */
    vertical-align: middle; /* Center content vertically */
    line-height: 1.2; /* Improve readability */
    text-align: left;
}

/* Ensure the table rows are taller */
.custom-table tr {
    height: auto; /* Allow the row to expand based on content and padding */
}

/* Stack the list items vertically on smaller screens */
.custom-table ul {
    padding-left: 20px;
    margin: 0;
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
    .custom-table th,
    .custom-table td {
        padding: 16px 8px; /* Slightly reduce padding on smaller screens */
        font-size: 13px; /* Reduce font size for better fit */
    }

    /* Make the table cells stack or wrap better */
    .custom-table td {
        display: block; /* Stack cells vertically on very small screens */
        text-align: left;
        width: 100%;
        box-sizing: border-box;
    }

    /* Add a label for each cell to clarify the column on mobile */
    .custom-table td::before {
        content: attr(data-label);
        font-weight: bold;
        display: block;
        margin-bottom: 5px;
    }

    /* Hide the table header on mobile since we're labeling the cells */
    .custom-table thead {
        display: none;
    }

    /* Ensure the table rows don't have a fixed height on mobile */
    .custom-table tr {
        display: block;
        margin-bottom: 20px;
        border-bottom: 1px solid #ddd;
    }
}

@media (max-width: 991px) {

    .cg_mobile_hide {
        display: none;
    }
}

     /* Hide bullet points in the Ad Placement column with higher specificity */
 .table.custom-table ul.no-bullets {
     list-style: none !important;
     padding-left: 0 !important;
 }
/* Keep spacing consistent for all list items */
.table.custom-table li {
    margin-bottom: 5px;
}
/* Make headers larger */
.table.custom-table th {
    font-size: 0.9rem;           /* Slightly smaller than 1.1rem */
    font-weight: 600;          /* A bit bolder than normal (bold is 700) */
    /* color: #333;               Optional: darken the text for clarity */
    color: #6366f1;
}

.d-lg-inline-block {
    padding-bottom: 120px;
}

[data-aa-adunit="/21722279357/970x250_OB_chartgo"] {
    margin-bottom : 20px;
}
