.view_country {
    margin-top: 77px !important;
}

.view_country1 {
    margin-top: -2px !important;
}

.value{
    margin-top: 30px !important;
    font-size: 34px !important;
    font-weight: bold;
}

.text-center{
    text-align: center;
}

.top-margin{
    margin-top: 50px !important;
}

.btn-size {
    width: 150px !important;
    margin: 0px 5px 0px 5px !important;
}

.top-height {
    margin-top: 26px !important;
}

.pd-top {
    padding-top: 50px !important;
}

.pd-down {
    margin-bottom: 25px !important;
}

/* .bg-color {
    background-color: rgb(233, 233, 92) !important;
} */

.active-category {
    font-weight: bold;
    color: #007bff;
}

.panel-heading .acc-icons {
    transition: transform 0.3s ease;
}

.panel-heading.active-category .acc-icons {
    transform: rotate(90deg);
}

.select-option {
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    box-sizing: border-box;
    font: inherit;
    margin: 0;
    font-family: inherit;
    display: block;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    box-shadow: none !important;
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #ccc;
    border-radius: 0;
    color: #3d5368;
    height: 46px;
    margin-bottom: 25px;
    padding-left: 20px;
    width: 100%;
    appearance: none;
    background-color: white;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns%3D%27http://www.w3.org/2000/svg%27 viewBox%3D%270 0 4 5%27%3E%3Cpath fill%3D%27%23000%27 d%3D%27M2 0L0 2h4z%27/%3E%3C/svg%3E'); /* Custom dropdown arrow */
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 10px 10px;
}

.select-option:focus {
    border-color: #66afe9;
    outline: none;
    box-shadow: 0 0 5px rgba(102, 175, 233, 0.5);
}

.p-style {
   margin-left: 10px !important;
   margin-top: -20px !important;
   padding-left: 8px;
}

.faq-content {
    border: 2px solid #66afe9 !important;
    padding-left: 15px;
    padding-right: 25px;
    margin-top: 100px;
    padding-top: 15px;
    padding-bottom: 15px;
    box-shadow: 0 0 5px #66afe9;
}
.small-text {
    font-size: 12px !important;
}
.key_text h6 {
    font-size: 12px !important;
    font-weight: bold !important;
}
.fun-content {
    margin-top: 100px !important;
}
.light-text{
    opacity: 50% !important;
    margin-bottom: -100px !important;
}

.small-text{
    margin-bottom: -10px !important;
}

.disabled {
    pointer-events: none;


}

.disabled span{
    background-color: grey !important;
}

.bg-color2 {
    background-color: #0487c9 !important;
}

.ind-links{
    color: #0487c9;
}

.val{
    color: black;
}

.unit-text{
    font-size: 14px;
    margin-left: 10px;

}

.top-margin-3 {
    margin-top: 100px !important;
}

.dark-text{
    font-weight: bold;
}



/* ========================================================== */
/* ============== Economy =================================== */

.ul-style {
    float:none !important;
    width:none !important;
}

.h4-style {
    margin-bottom: 10px !important;
    line-height: 21px;
    text-transform: capitalize !important;
}

.ul-style-2 {
    float:none !important;
}

.links {
    color: rgb(217, 29, 29) !important;
    pointer-events: none;

}



/* ========================================================== */
/* ============== Economy END=================================== */


/*muwaffaq custom style*/
.country{
    margin-top: 20px !important;
    /* margin-bottom: 50px !important; */
}
.t1{
    font-size: 15px !important;
    font-weight: bold !important;
}
.item-gap {
    margin-top: -30px !important;
}
.country2{
    margin-top: 50px !important;
}
.social-buttons-link i {
    color: white;
    margin-right: 5px;
}

.country_container1{
    margin-top: 1px !important;
}
.fun-title h3 {
    color: #f5f5f5;
    font-size: 26px;
    line-height: 42px;
    margin-bottom: 0px;
    font-weight: 600;
}
.fun-content {
    display: block;

}
.fun_text i {
    font-size: 20px;
    text-align: center;
    color:#0487c9;


    display: inline-block;
    line-height: 78px;
    font-weight: 100;
    width: 50px;
    height: 80px;
    border-radius: 50%;
}
.fun_text {
    text-align: left;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    padding: 5px 10px;
    position: relative;
    margin-bottom: 30px;
}
.fun_text::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 1px;
    background: #0487c9;
}
.fun_text .counter {
    color: #444;
    display: block;
    font-size: 20px;
    font-weight: bold;
    padding-bottom: 10px;
}
.fun_text h4 {
    margin-bottom: 0px;
}
.fun_text > h5 {
    color: #444;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0;
    line-height: 20px;
}

.country-list {
    /* display: grid; */
    grid-template-columns: repeat(3, 1fr); /* Adjust number of columns */
    gap: 20px; /* Adds space between items */
    margin: 20px 0;
}

/* .country-group {
    display: flex;
    flex-direction: column;
} */

.country-group span {
    background-color: #007bff;
    color: white;
    /* padding: 5px; */
    border-radius: 3px;
    font-weight: bold;
    /* margin-bottom: 10px; */
    text-align: center;
}

.country-group a {
    color: #007bff;
    text-decoration: none;
    margin-left: 20px;
    /* margin-bottom: 5px; */
    white-space: nowrap; /* Ensures no text wrapping */
}

.top-margin-2{
    margin-top: 77px !important;
}

.bottom-margin {
    margin-bottom: 60px !important;
}



.continent-background {
    position: relative;
    /* top: 93px; */
    background-color: #fff;
    border-radius: 5px;
    /* padding: 22px 30px; */
    z-index: 99;
    max-width: 300px;
    margin: 0 auto;
    margin-top: 25px !important;
    bottom: 25px !important;
    border: 2px solid #0487c9;


}

.continent-background:hover .continents {
    color: white; /* Change the text color to white on hover */
    /* background-color: #0487c9; */
}

.continents {
    color: black ;
    font-weight: bold;
    padding: 20px !important;
}

.topic-links {
    color: black !important;
    font-weight: bold;
    padding: 20px !important;
}


.text-small{
    font-size: 18px;
}

.center-text{
    text-align: center !important;
}





















@media (max-width: 991px) {
    .country_container,
    .country_container1 {
        padding: 30px 0;
    }
    .country {
        margin-bottom: 20px;
    }
    .fun_text h4 {
        font-size: 18px;
    }
    .social-buttons-link{
        color: #0487c9;
    }
    .fun_text {
        height: 170px !important;
    }
}


@media only screen and (max-width: 768px) and (min-width: 575px)  {
    .country_container,
    .country_container1 {
        padding: 20px 0;
    }
    .country {
        margin-bottom: 15px;
    }
    .fun_text h4 {
        font-size: 16px;
    }
    .breadcrumb {
        text-align: center;
    }
    .breadcrumb ul.breadcrumb-bg {
        font-size: 12px;
    }
    .social-buttons-link{
        color: #0487c9;
    }
     .fun_text {
         height: 200px !important; 
     } 
}


@media (max-width: 575px) {
    .fun_text h4 {

        margin-bottom: -50px !important;
        font-size: 14px;
    }
    .breadcrumb h3 {
        font-size: 20px !important;
        text-align: center !important;
    }
    .breadcrumb ul.breadcrumb-bg  {
        text-align: center !important;
    }
    .country_container,
    .country_container1 {
        padding: 10px 0;
    }
    .country {
        margin-bottom: -40px !important;
    }
    .country2{
        margin-top:0px !important;
    }
    .country3{
        margin-bottom: 50px !important;
    }
    .social-buttons-link{
        color: #0487c9 !important;
    }


}
/*muwaffaq custom style end*/





@media only screen and (max-width: 767px) {

    .breadcrumb {
        padding: 15px 10px;
    }

    .section-headline h3 {
        font-size: 20px;
    }

    .breadcrumb-bg {
        font-size: 14px;
    }

    .value {
        font-size: 18px;
    }

    .panel-heading h4 {
        font-size: 16px;
    }

    .panel-body p {
        font-size: 14px;
        padding: 5px;
    }

    .blog-btn {
        padding: 10px 20px;
        font-size: 14px;
        margin-top: 20px !important;
        width: 100% !important;
    }
    .center-text{
        text-align: center !important;
    }


    .overview-images canvas {
        width: 100% !important;
        height: auto !important;
    }


    .row .col-lg-2 {
        width: 100%;
        /* text-align: center; */
        margin-bottom: 15px;
    }

    .row .col-lg-10 {
        width: 100%;
        /* text-align: center; */
    }

    .sm-dvice {
        margin-right: 50px !important;
        margin-left: -50px !important;
        text-align: left !important;
        margin-top: -40px !important;
    }
}


@media only screen and (min-width: 768px) and (max-width: 991px) {

    .section-headline h3 {
        font-size: 24px;
    }

    .breadcrumb-bg {
        font-size: 16px;
    }

    .value {
        font-size: 22px;
    }

    .panel-heading h4 {
        font-size: 18px;
    }

    .panel-body p {
        font-size: 16px;
    }

    .blog-btn {
        padding: 12px 25px;
        font-size: 16px;
    }


    .overview-images canvas {
        width: 100% !important;
        height: auto !important;
    }

    .col-lg-2 {
        width: 30%;
        margin-bottom: 10px;
    }

    .col-lg-10 {
        width: 70%;
    }

    .div-topics h4::after{
        left: 11.3em !important;
    }
    .title-topics{
        margin-bottom: 40px !important;
        padding: 15px 225px !important;
    }
}

@media only screen and (min-width: 1024px) and (max-width: 1024px){
    .div-topics h4::after{
        left: 1em !important;
    }
    .title-topics{
        padding: 15px 15px !important;
    }
}

@media only screen and (min-width: 320px) and (max-width: 1024px){
    .div-topics h4::after{
        left: 1em !important;
    }
    .title-topics{
        margin-bottom: 40px !important;
        padding: 15px 15px !important;
    }
}

/* Desktop (larger screens)
@media only screen and (min-width: 992px) {
    /* Content layout for larger screens remains the same, but minor adjustments can be added if needed */

    /* .breadcrumb {
        padding: 20px 30px;
    }

    .section-headline h3 {
        font-size: 28px;
    }

    .breadcrumb-bg {
        font-size: 18px;
    }

    .value {
        font-size: 26px;
    }

    .panel-heading h4 {
        font-size: 20px;
    }

    .panel-body p {
        font-size: 18px;
    }

    .blog-btn {
        padding: 14px 30px;
        font-size: 18px;
    }

    /* Ensure canvas maintains aspect ratio */
    /* .overview-images canvas {
        width: 100% !important;
        height: 300px !important;
    } */
/* }  */


/* body {
  font-family: 'Courier New', Courier, monospace;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background-color: #f0f0f0;
} */

.typewriter, .typewriter1 {
    overflow: hidden;
    border-right: 2px solid black;
    white-space: nowrap;
    margin: 0 auto;
    font-size: 2em;
    letter-spacing: 0.1em;
}


.typewriter {
    animation: typing-deleting 2s steps(40, end) infinite;
}


.typewriter1 {
    animation: typing-deleting1 4s steps(40, end) infinite;
}
.amri-table {
    width: 100%;
    margin: 20px 0;
    margin-left: 10px;

}

.amri-table table {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
}

.amri-table td {
    padding: 12px 15px;

    vertical-align: middle;
}

.amri-table tr:nth-child(even) {
    background-color: #f9f9f9;
}

/* .amri-table tr:hover {
    background-color: #f1f1f1; /* Highlight row on hover */
/* } */

.ind-links {
    color: #007bff;
    text-decoration: none;
    font-weight: bold;
}



.val {
    font-weight: bold;
    text-align: right;
    color: #333;
}

.download-button {
    background-color: #0487c9;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 8px 27px;
    font-size: 12px;
    font-weight: bold;
    text-transform: capitalize;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    margin-left: 30px !important;
    margin-top: 30px !important;
    /* margin-bottom: -60px !important; */
}

.download-button:hover {
    background-color: #036fa1;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
    transform: translateY(-2px);
}

.download-button:active {
    background-color: #025c89;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
    transform: translateY(0);
}

.download-button:focus {
    outline: 2px solid #025c89;
    outline-offset: 2px;
}



@keyframes typing-deleting {
    0% {
        width: 0;
    }
    50% {
        width: 20%;
    }
    100% {
        width: 0;
    }
}

@keyframes typing-deleting1 {
    0% {
        width: 0;
    }
    50% {
        width: 45%;
    }
    100% {
        width: 0;
    }
}



@media screen and (max-width: 480px) {
    @keyframes typing-deleting {
        0% {
            width: 0;
        }
        50% {
            width: 70%;
        }
        100% {
            width: 0;
        }
    }

    @keyframes typing-deleting1 {
        0% {
            width: 0;
        }
        50% {
            width: 100%;
        }
        100% {
            width: 0;
        }
    }
}


@media screen and (min-width: 1024px) {
    .deposite-table table td {
        font-size: 1.1em;
        padding: 15px;
    }
}

@media screen and (max-width: 1024px) and (min-width: 768px) {
    .deposite-table table td {
        font-size: 1em;
        padding: 10px;
    }

    .diposite-box {
        padding: 15px;
    }
}

@media screen and (max-width: 768px) and (min-width: 480px) {
    .deposite-table table td {
        font-size: 0.9em;
        padding: 8px;
    }

    .diposite-box {
        padding: 10px;
    }

    .val {
        font-weight: bold;
    }
}


@media screen and (max-width: 480px) {
    .amri-table table td {
        font-size: 0.85em !important;
        padding: 5px !important;
        display: flex !important;

    }
    .amri-table table{
        width: 100% !important;
    }

    .amri-table table tr {
        display: flex !important;
        flex-direction: column !important;
    }
    .val {
        font-weight: bold !important;
        font-size: 1.1em !important;
    }

    /* .deposite-table table td:last-child {
        text-align: right;
    } */

    .blog-category .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
     
}



