@media (max-width: 1024px) {
    header {
        padding: 10px 50px;

    }
    header .nav{
        display: none;
    }
    .mobnav{
        display: flex;
    }
    .ramadan{
        position: absolute;
        right: 0;
        top: 0;
        margin-top: 100px;
        z-index: 0;
    
    }
    .logo .ramadan{
        margin-top: 90px;

    }

    .main-section {
        padding: 10px 50px;
        position: relative;
        z-index: 1;

    }

    .right-side {
        width: 70%;
    }

    .left-side img {
        display: none;
    }

    .circles-main {
        display: block;
    }

    .news-section {
        padding: 10px 50px;
        margin-bottom: 0px;
        margin-top: 100px;

    }

    .carousel-item img {

        height: 500px;
    }

    .about-news {
        z-index: 1;
        padding: 15px 10px;
        bottom: 0;
        position: absolute;
        margin-left: 5%;
        bottom: 0;
        width: 90%;
        font-size: 15px;

    }

    .about-news-description {

        padding: 10px 20px;
        width: 100%;
        font-size: 20px;
        height: 80px;
        margin-bottom: 30px;
        
        border-top-left-radius: 20px;
        border-bottom-right-radius: 20px;
    }

    .about-news-title p {
        font-size: 20px;
    }

    .values-section {
        padding: 50px 50px;
        margin-bottom: 70px;
        margin-top: 50px;

    }

    .vesion-section {
        padding: 10px 50px;
        margin-bottom: 100px;
        margin-top: 50px;
    }
    .vesion-box{

        display: none;
       
    }
    .right-vesion{
        display: flex;
        justify-content: center;
    }
    .left-vesion-iraq{
        padding: 0px 50px;
        
    }
    .iraq-title{
        display: flex;
        align-items: center;
        justify-content: end;
        margin-bottom: 0px;
        margin-top: 0px;
    
    }
    .vesion-box-tablet .iraq-title img{
        width: 100px;
    }
    .vesion-box-tablet{display: flex;}
    .vesion-box-tablet img{
        width: 70%;
        margin-bottom: 50px;
    }
    .vesition-items h3{
        margin: 10px;
        padding: 10px 15px;
        font-weight: 400;
        margin-bottom: 30px;
        font-size: 20px;
        border: #0E3763 1px solid;
        border-top-left-radius: 20px;
        border-bottom-right-radius: 20px;
    
    }
    .our-service-image img{
        width: 100%;
    }

    .news-items{
        display: flex;
        flex-direction: column-reverse;
        justify-content: end;
        
        margin: 50px 0px;
    }
    .last-news-section{
        padding: 10px 50px;
        margin-bottom: 100px;
        margin-top: 150px;
    }
    .title-news{
        margin: 0px;
        padding: 10px 5px;
        border-top-left-radius: 20px;
        border-bottom-right-radius: 0px;
        text-align: center;
    }
    .left-side-news{
        
        padding: 0px 0px;
        margin-top: 30px;
        display: flex;
        flex-direction: column;
        justify-content: end;
        align-items: end;
    }
    .about-news-section{
        padding: 0px 0px;
        font-size: 20px;
        margin-bottom: 30px;
        font-weight:350;
    }
    .values-section2{
        margin-bottom: 70px;
        margin-top: 100px;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
      
        
    }
    .values2{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        flex-wrap: nowrap;
        padding: 0px 0px;
    }
    .ana img{
        margin: 5px 0px
    }
    .ana {
        margin: 40px 0px
    }
    footer {
        display: flex;
        
        flex-direction: column-reverse;
        justify-content: space-between;
        width: 100%;
        background-image: url('/style/images/Footer.svg'); /* Background image path */
        background-size: cover; /* Scale the background image to cover the entire footer */
        background-position: center; /* Center the background image */
        color: white; /* Text color */
        padding: 50px 10px; /* Add padding to create some space around the content */
    }
    .fast-links{
        display: flex;
        flex-direction: column;
        justify-content: end;
        align-items: end;
        
        padding-right: 50px;
        width: 100%;
    }
    .footer-center{
        margin-top: 50px;
        display: flex;
        justify-content: end;
        padding-right: 50px;

    }
    #media{
        display: none;
    }
    #mediatablet{
        display: block;
    }
}

/* Mobile styles */
@media (max-width: 768px) {
    header {
        padding: 20px 20px;

    }
    header .nav{
        display: none;
    }
    

    .main-section {
        padding: 10px 20px;
        position: relative;
        z-index: 1;

    }
    .main-btn a{
        margin: 10px 0px;
    }

    .btn1{
        width: 150px;
    }
    
    .btn2{
        width: 150px;
        height: 50px;
        margin-left: 20px;
    }

    .right-side {
        width: 100%;
    }
    .right-side p{
        font-size: 18px;
        width: 340;
    }
    .right-side h3{
        color: #96C11F;
        font-size: 35px;
    }
    .left-side img {
        display: none;
    }

    .circles-main {
        display: none;
    }
    .ana img{
        width: 80px;
        margin: 5px 0px
    }
    .news-section {
        padding: 10px 20px;
        margin-bottom: 0px;
        margin-top: 50px;

    }

    .carousel-item img {

        height: 300px;
    }

    .about-news {
        z-index: 1;
        padding: 15px 10px;
        bottom: 0;
        position: absolute;
        margin-left: 5%;
        bottom: 0;
        width: 90%;


    }

    .about-news-description {

        padding: 10px 20px;
        width: 100%;
        font-size: 14px;
        height: 80px;
        margin-bottom: 0px;
        
        border-top-left-radius: 15px;
        border-bottom-right-radius: 15px;
    }

    .about-news-title p {
        font-size: 14px;
    }
    .about-news-title {
        background-color: #96C11F;
        color: white;
        padding: 15px 25px 48px 20px;
        width: 100%;
        border-top-left-radius: 30px;
        margin-bottom: -50px;
    }
    .circles{
    
        display: none;
    }
    .values-section {
        padding: 50px 20px;
        margin-bottom: 70px;
        margin-top: 50px;

    }
    .values img{
        width: 120px;
    }
    .vesion-section {
        padding: 10px 20px;
        margin-bottom: 100px;
        margin-top: 50px;
    }
    .vesion-box{
        display: none;
       
    }
    
    .vesion-box-tablet{
        margin-top: 50px;
        display: flex;}
    .vesion-box-tablet img{
        width: 70%;
        margin-bottom: 50px;
    }
    .vesition-items h3{
        margin: 10px;
        padding: 10px 5px;
        font-weight: 400;
        margin-bottom: 10px;
        font-size: 14px;
        border: #0E3763 1px solid;
        border-top-left-radius: 15px;
        border-bottom-right-radius: 15px;
    
    }
    .vesition-items{
        display: flex;
        justify-content: end;
        flex-wrap: wrap;
        margin-bottom: 30px;
    }
    .vesition-items2 h4{
        margin: 10px;
        padding: 10px 10px;
        font-weight: 300;
        font-size: 16px;
        border: #96C11F 1px solid;
        border-top-left-radius: 20px;
        border-bottom-right-radius: 20px;
    
    }
    .readmore{
        text-decoration: none;
        padding: 5px 35px;
        margin: 10px;
        color: black;
        font-family: "Noto Kufi Arabic", sans-serif;
        background-color: #0E3764;
        color: white;
        border-top-left-radius: 20px;
        border-bottom-right-radius: 20px;
       
    }
    .our-service-image img{
        width: 100%;
    }

    .news-items{
        display: flex;
        flex-direction: column-reverse;
        justify-content: start;
        
        margin: 50px 0px;
    }
    .last-news-section{
        padding: 10px 20px;
        margin-bottom: 100px;
        margin-top: 150px;
    }
    .title-news{
        margin: 0px;
        padding: 10px 5px;
        border-top-left-radius: 30px;
        border-bottom-right-radius: 0px;
        text-align: center;
    }
    .title-news h4{
        font-size: 16px;
    }
    .about-news-section{
        font-size: 1px;
        font-weight:850;
    }
    .left-side-news{
        
        padding: 0px 0px;
        margin-top: 30px;
        display: flex;
        flex-direction: column;
        justify-content: end;
        align-items: end;
    }
    .right-side-news img{
        width: 90%;
    }
    .about-news-section{
        padding: 0px 0px;
        font-size: 16px;
        font-weight:350;
    }
    .values-section2{
        margin-bottom: 70px;
        margin-top: 50px;
        position: relative;
      
        
    }
    .left-vesion-iraq{
        padding: 0px 20px;
        
    }
    .left-vesion-iraq h4,.left-vesion-iraq h5{
        font-size: 16px;
    }
    .vesion-box-tablet .iraq-title img{
        width: 50px;
        margin-bottom: 25px;
    }
    footer {
        display: flex;
        
        flex-direction: column-reverse;
        justify-content: space-between;
        width: 100%;
        background-image: url('/style/images/Footer.svg'); /* Background image path */
        background-size: cover; /* Scale the background image to cover the entire footer */
        background-position: center; /* Center the background image */
        color: white; /* Text color */
        padding: 20px 5px; /* Add padding to create some space around the content */
    }
    .fast-links{
        display: flex;
        flex-direction: column;
        justify-content: end;
        align-items: end;
        
        padding-right: 10px;

        width: 100%;
    }
    .footer-center{
        margin-top: 50px;
        display: flex;
        flex-direction: column;
        justify-content: end;
        align-items: end;
        padding-right: 20px;

    }
    .footer-center-left h4, .footer-center-right h4{
        font-size: 12px;

    }
    .footer-border{
        margin: 0px 0px 20px 10px;
         padding: 10px 30px;
         font-weight: 200;
         font-size: 12px;
         border: #96C11F 1px solid;
         border-top-left-radius: 20px;
         border-bottom-right-radius: 20px;
     }
    .fast-links h4{
        margin-bottom: 30px;
        font-weight: 200;
        text-decoration: none;
        font-size: 12px;
    
    }
    .footer-center-left{
        margin-right: 0px;
    }
    #media{
        display: none;
    }
    #mediatablet{
        margin-top: 20px;
        display: block;
    }
    #mediatablet h5{
        font-size: 12px;
    }
    .copyright{
        margin-top: 20px;
        font-size: 12px;
    }
    .mobnav{
        display: flex;
    }
    .logo img{
        width: 150px;
    }
    .media{
        display: flex;
        justify-content: space-between;
        width: 100%;
    }
    .media i{
        font-size: 30px;
        margin: 10px;
    }
    .ramadan{
        position: absolute;
        right: 0;
        top: 0;
        margin-top: 70px;
        z-index: 0;
    
    }
    .ramadan-section1 img{ 
        width:90%;
        border-radius: 20px;
    }
}