

            body{
                font-family: 'Noto Kufi Arabic', sans-serif;
                background-color: #F2F2F2;

            }
            .section{
            }


            #smallHeader{
                display: none;
            }


            #logo{
                position: absolute;;
                top: 1%;
                right: 3%;
                background-color:rgb(10, 10, 10);
            }
            #smallScreenLogo{
                top: 0%;
                /* background-color:rgba(10, 10, 10, .5); */
                text-align: center;
            }

            #largScreenImg{
                width:230px;
                height: auto;
                background-color:rgb(10, 10, 10);
            }





            .rect{
                width:  100%;
                height: 40px;
                background-color:rgb(10, 10, 10);


            }
            .rect1{
                transform: translateY(6px);
                width:  100%;
                height: 75px;
                background-color: rgba(0, 0, 0, 0.426);

            }
            form{
                padding-right:12.5px;
            }

            .largScreenSearch{
                border-radius:20px;
                border:0px solid rgb(78, 78, 78);
                padding:4px 10px;
                background-color:rgb(255, 255, 255);
                transition-duration: .5s;
                padding-right:12.5px;
                width:80%;

            }
            .largScreenSearch:hover,
            .largScreenSearch:focus
            {
                background-color:#ffffff;
                border:1px solid #8DC04B;
                -webkit-transform: translate(0px, -5px) scale(1.1);
                transform: translate(0px, -5px) scale(1.1);
                transition-duration: .5s;
                box-shadow: rgb(255, 255, 255) 0px 0.0625em 0.0625em, rgb(255, 255, 255) 0px 0.125em 0.5em, rgba(255, 255, 255) 0px 0px 0px 1px ;
            }



            .triangle-bottom-right {
                width: 30em;
                height: 0;
                border-style: solid;
                border-width: 8em 30px 0 8em;
                border-color: transparent transparent transparent rgb(151, 235, 158);
            }





            .trapezoid {
                transform: rotateX(180deg) translateX(1140px);

                border-bottom: 75px solid rgb(10, 10, 10);
                border-left: 90px solid transparent;
                border-right: 0px solid transparent;
                height: 0;
                width: 96em;
            }


            #firstNav{
                padding-right:25em;
                color:white;
            }


            #secondNav {
                padding-right:23em;
            }
            .category{
                text-decoration: none;
                color:white;
                padding-right:10.5px;
                padding-left:10.5px;
                font-size:14.5px;
                transition-duration: .5s;
            }

            .category:hover,
            .category:focus
            {
                text-decoration: none;
                /*background-color:#8DC04B;*/
                color:#fff;
                transition-duration: .5s;
                border:1px solid #8DC04B;
                /*-webkit-transform: translate(0px, -5px) scale(1.1);*/
                /*transform: translate(0px, -5px) scale(1.1);*/
                /* box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset; */
                padding: 10.5px 10.5px;
                /* border-radius:5px; */
                font-weight: bold;
                /**/
            }

            #largScreenImg {
                height: auto;
                width:200px;
            }

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

                .trapezoid {
                transform: rotateX(180deg) translateX(1140px);
                border-bottom: 75px solid rgb(10, 10, 10);
                border-left: 90px solid transparent;
                border-right: 0px solid transparent;
                height: 0;
                width: 90em;
                }
                #largScreenImg {
                    width:190px;
                    height: auto;
                }
                #firstNav {
                    padding-right:19em;

                }



                #secondNav {
                padding-right:19em;
                }
                .category {
                    padding-right:8.5px;
                    padding-left:8.5px;

                    font-size:14px;

                }
            }

            @media only screen and (max-width:1485px) {
                .trapezoid {
                transform: rotateX(180deg) translateX(1140px);
                border-bottom: 75px solid rgb(10, 10, 10);
                border-left: 90px solid transparent;
                border-right: 0px solid transparent;
                height: 0;
                width: 90em;
                }
                #largScreenImg {
                    width:190px;
                    height: auto;
                }
                #firstNav {
                    padding-right:18.3em;

                }


                #secondNav {
                    padding-right:15.5em;
                }
                .category {
                    padding-right:8px;
                    padding-left:8px;
                    font-size:13.5px;

                }

            }



            @media only screen and (max-width:1400px) {
                .trapezoid {
                transform: rotateX(180deg) translateX(1140px);
                border-bottom: 75px solid rgb(10, 10, 10);
                border-left: 90px solid transparent;
                border-right: 0px solid transparent;
                height: 0;
                width: 88.7em;
                }
                #largScreenImg {
                    width:180px;
                    height: auto;
                }
                #firstNav {
                padding-right:17.5em;

                }
                #secondNav {
               padding-right:14.5em;
            }
            .category {
                padding-right:7px;
                    padding-left:7px;
                font-size:13px;

                }
            }

            @media only screen and (max-width:1350px) {
                .trapezoid {
                transform: rotateX(180deg) translateX(1140px);
                border-bottom: 75px solid rgb(10, 10, 10);
                border-left: 90px solid transparent;
                border-right: 0px solid transparent;
                height: 0;
                width: 88em;
                }
                #largScreenImg {
                    width:170px;
                    height: auto;
                }
                #firstNav {
                padding-right:17em;

                }
                #secondNav {
               padding-right:13em;
            }
            .category {
                    padding-right:6.5px;
                    padding-left:6.5px;

                    font-size:12px;
                }
                .firstSearchForm{
                    padding-right:12.5px;
                    width:30%;
                }
                .largScreenSearch{
                    border-radius:20px;
                    border:0px solid rgb(78, 78, 78);
                    padding:4px 10px;
                    background-color:rgb(255, 255, 255);
                    transition-duration: .5s;
                    padding-right:12.5px;
                    width:80%;
                }
            }


            @media only screen and (max-width:1110px) {
                .rect{
                    display: none;
                }
                .rect1{
                    display: none;
                }
                .trapezoid{
                    display: none;
                }

                #firstNav {
                    display: none;

                }
                #secondNav {
                    display: none;
                }
                #largScreenImg {
                    display: none;
                }
                #smallHeader{
                display: block;
                background-color:rgba(10, 10, 10, .5);
                }
            }

            @media only screen and (min-width:1111px) {

                #smallHeader{
                    display: none;
                }
                #smallScreenImg{
                    display: none;

                }
            }
            #smallHeader{
                background-color:rgb(10, 10, 10);
            }

            .navbar-nav .nav-item .nav-link{
                color:rgb(255, 255, 255);
            }
            .smallScreenSearch{
                border-radius:10px;
                background-color:rgb(214, 214, 214);
            }
            .smallScreenSearch:hover{
                background-color:rgb(148, 148, 148);

            }



            .dropdown {
                position: relative;
                display: inline-block;
                z-index: 10;
            }

            .dropdown-content {
                display: none;
                position: absolute;
                background-color: #b8b8b8fa;
                min-width: 160px;
                box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
                padding: 12px 16px;
            }

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

            }


            .s003 form {
          width: 100%;
          margin-bottom: 10px;
          padding:0px;

        }

        .s003 form .inner-form {
          background: #fff;
          display: -ms-flexbox;
          display: flex;
          width: 100%;
          border: 1px solid #e2ebe3;
          -ms-flex-pack: justify;
              justify-content: space-between;
          -ms-flex-align: center;
              align-items: center;
          border-radius: 10px;
        }

        .s003 form .inner-form:hover{
            box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
            border-radius: 10px;

        }

        .s003 form .inner-form .input-field {
          height: 40px;
          width: 100%;
        }

        .s003 form .inner-form .input-field input {
          height: 100%;
          background: transparent;
          border: 0;
          display: block;
          width: 100%;
          padding: 10px 32px;
          font-size: 16px;
          color: #555;
        }

        .s003 form .inner-form .input-field.third-wrap {
          width: 40px;
        }

        .s003 form .inner-form .input-field.third-wrap .btn-search {
          height: 100%;
          width: 100%;
          white-space: nowrap;
          color: #fff;
          border: 0;
          cursor: pointer;
          background: #8DC04B;
          transition: all .2s ease-out, color .2s ease-out;
        }


        @media screen and (max-width: 992px) {
          .s003 form .inner-form .input-field {
            height: 50px;
          }
        }

        @media screen and (max-width: 767px) {
          .s003 form .inner-form {
            -ms-flex-wrap: wrap;
                flex-wrap: wrap;
            padding: 20px;
          }
          .s003 form .inner-form .input-field {
            margin-bottom: 20px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.1);
          }
          .s003 form .inner-form .input-field input {
            padding: 10px 15px;
          }
          .s003 form .inner-form .input-field.first-wrap {
            width: 100%;
            border-right: 0;
          }
          .s003 form .inner-form .input-field.first-wrap .choices__inner {
            padding: 10px 15px;
          }
          .s003 form .inner-form .input-field.first-wrap .choices[data-type*="select-one"]:after {
            right: 11.5px;
            border-color: #e5e5e5 transparent transparent transparent;
          }
          .s003 form .inner-form .input-field.second-wrap {
            width: 100%;
            margin-bottom: 30px;
          }
          .s003 form .inner-form .input-field.second-wrap input {
            border: 1px solid rgba(255, 255, 255, 0.3);
          }
          .s003 form .inner-form .input-field.third-wrap {
            margin-bottom: 0;
            width: 100%;
          }
        }

        .dropdown-content{
            background-color:rgba(26, 26 , 26, 0.74);
        }
        .dropdown-content p a:hover{
            background-color:#8DC04B;
        }


        .main-icons{
            position: absolute;
            left: 100px;
            display: inline;
        }


         ul {
        margin: 10px;
        padding: 10px;
        }
        .footer-section {
        background: #151414;
        position: relative;
        }
        .footer-cta {
        border-bottom: 1px solid #373636;
        }
        .single-cta i {
        color: hsl(96, 97%, 65%);
        font-size: 30px;
        float: right;
        margin-top: 8px;
        padding-left: 15px;
        }
        .cta-text {
        padding-left: 15px;
        display: inline-block;
        }
        .cta-text h4 {
        color: #fff;
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 2px;
        }
        .cta-text span {
        color: #757575;
        font-size: 15px;
        }
        .footer-content {
        position: relative;
        z-index: 2;
        }
        .footer-pattern img {
        position: absolute;
        top: 0;
        left: 0;
        height: 330px;
        background-size: cover;
        background-position: 100% 100%;
        }
        .footer-logo {
        margin-bottom: 30px;
        }
        .footer-logo img {
            max-width: 200px;
        }
        .footer-text p {
        margin-bottom: 14px;
        font-size: 14px;
        color: #7e7e7e;
        line-height: 28px;
        }
        .footer-widget-heading h3 {
        color: #fff;
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 10px;
        position: relative;
        }
        .footer-widget ul li {
        display: inline-block;
        /* float: left; */
        width: 50%;
        margin-bottom: 5px;
        }
        .footer-widget ul li a:hover{
            color: hsl(96, 97%, 65%);
        }
        .footer-widget ul li a {
        color: #878787;
        text-transform: capitalize;
        }
        .footer-logo {
        margin-bottom: 30px;
        }
        .footer-logo img {
            max-width: 200px;
        }
        .footer-text p {
        margin-bottom: 14px;
        font-size: 10px;
            color: #7e7e7e;
        line-height: 28px;
        }
        .footer-social-icon a {
        color: #fff;
        font-size: 16px;
        margin-right: 15px;
        }
        .footer-social-icon i {
        height: 40px;
        width: 40px;
        text-align: center;
        line-height: 38px;
        border-radius: 50%;
        }
        .facebook-bg{
        background: #3B5998;
        }
        .telegram-bg{
        background: #2AABEE;
        }
        .youtube-bg{
        background:  #FF0000;
        }
        .copyright-area{
        background: #202020;
        padding: 25px 0;
        }
        .copyright-text p {
        margin: 0;
        font-size: 14px;
        color: #878787;
        }

        .footer-menu li {
        display: inline-block;
        margin-left: 20px;
        }
        .footer-menu li:hover a{
            color: hsl(96, 97%, 65%);
        }
        .footer-menu li a {
        font-size: 14px;
        color: #878787;
        }



        .breadcrumb{
        background: none;
        color:#000;

    }

    .breadcrumb ul {
        display: flex;
        list-style-type: none;
        color: #000;
    }

    .breadcrumb li::before {
        content: " > ";
    }

    .breadcrumb li:first-child::before {
        content: "";
    }
