body{
  position: relative !important ;
  background-attachment: fixed;
  background-size: cover;
    background-image: url(../graphics/body-bk.jpg);
}
p{
    color: white;
}
h2{
    color: white;
}
h3{
    color: white;
}
 /*  Fonts  */
.font-cairo {font-family: 'Cairo', sans-serif !important; letter-spacing: -1px !important;}
.font-amiri {font-family: 'Amiri', serif !important; letter-spacing: 0 !important;}
.font-openSans {font-family: "Open Sans", "Helvetica", "Arial", sans-serif !important; }

@font-face {
    font-family: aref-regular;
    src: url('../fonts/aref-regular.ttf');
    }

.youtube-promo{
    width: 80%;
    margin: auto;
    margin-bottom: 50px;
}
.video-promo-head{
    background-color: #a20013;
    color: white;
    padding: 7px;
    font-weight: 400 !important;
    font-size: 18px;
}
/* color over rides */
:root {
    --vlGrey: #EBEBEB;
    --lGrey: #C3C3C3;
    --mGrey: #454040;
    --dGrey: #202020;
		--main-color: #a20014;
		--support-color: #eeba00;
}

/* coloring */
.csVLG { color: var(--vlGrey);}
.csLG { color: var(--lGrey);}
.csMG {  color: var(--mGrey);}
.csDG {  color: var(--dGrey) !important;}
.csM {  color: var(--main-color)!important;}
.csS {  color: var(--support-color);}
.csW {  color: #fff;}

.bgVLG { background-color: var(--vlGrey);}
.bgLG { background-color: var(--lGrey);}
.bgMG {  background-color: var(--mGrey);}
.bgDG {  background-color: var(--dGrey);}
.bgM {  background-color: #a20014 !important;}
.bgS {  background-color: var(--support-color);}
.bgW {  background-color: #fff;}

#mob{
    height: 100vh !important;
}
#mob h1{
    font-size: 38px;
    margin-top: 25px;
    color: white;
    font-weight: 100 !important;
}
#mob h3{
    width: 65%;
    font-size: 22px;
    line-height: 30px;
    font-weight: bold !important;
    margin-bottom: 28px;
}
.text-center-sec01{
    display: flex;
}
.credit-container{
    color: white;
    font-weight: bold;
    font-size: 14px;
}

.sec03-box{
    background-color: whitesmoke;
}
.sec03{
    display: flex;
    align-items: baseline;
}
.sec03 img{
    display: flex;
    align-items: baseline;
    margin-left: 10px;
}


.danger-sign {
    position: absolute;
    top: 92px;
    right: 90px;
}
.danger-sign img{
    width: 300px;
}
.sec03-final-p {
    margin-top: 13px;
    font-weight: 500 !important;
}
    /* addthis */

        .at-expanding-share-button.at-expanding-share-button-desktop .at-expanding-share-button-toggle-bg>span {
            background-color: var(--main-color)!important;
        }
        .at-expanding-share-button[data-position=bottom-left] {
            left: 10px;
        }
    /* addthis */

        .map-container{
            display: flex;
            flex-direction: row;
            align-items: center;
        }
        .map-container .progress02{
            margin-right: 20px;
        }
    .sec-descrip{
        position: absolute;
        left: 7px;
        bottom: -6px;
        font-size: 15px;
        font-weight: 800;
    }
        .at-expanding-share-button-mobile-container .at-expanding-share-button-mobile .at-expanding-share-button-toggle-bg>span {
            background-color:   #e71d36!important;
            color: #e71d36!important;
        }
        .lead {
            font-weight: 300 !important;
            font-size: 19px;
            line-height: 31px;
        }

        .bk-text-black{
            background-color: black;
            display: inline-block;
            padding: 4px 6px 1px 10px;
        }
        section{
            background-color: #ffffff00 !important;
        }
        .full-bottom{
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
            position: absolute;
            z-index: -1;
            background-image: linear-gradient(to top,#060606e3,#060606e3, #020202a1 ,#02020245, #02020200);
        }
        .full-lyar{
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
            position: absolute;
            z-index: -1;
            background-image: linear-gradient(to top,#020202cc,#02020245, #02020214 ,#02020214, #02020214);
        }

        .lyar-bottom{
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
            position: absolute;
            z-index: -1;
            background-image: linear-gradient(to top,#060606e3,#060606e3, #020202a1 ,#02020245, #02020200);
        }
        .lyar-top{
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
            position: absolute;
            z-index: -1;
            background-image: linear-gradient(to top, #00000000,#06060600, #0202028a ,#020202ba, #020202fc);
        }
        .lyar-right{
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
            position: absolute;
            z-index: -1;
            background-image: linear-gradient(to right,#00000000,#06060600, #02020200 ,#02020200, #02020226);
        }
        .logo2 {
            position: absolute;
            left: 25px;
            top: 25px;
            z-index: 99999999999 !important;
        }
        .logopic {
            width: 115px;
        }

        .text-bottom-sec01{
            display: flex;
            justify-content: flex-end;
            vertical-align: text-top;
            margin: auto;
            text-align: right;
            margin-top: 36px;
            z-index: 3;
            position: relative;
        }



        .sec01-container{
            position: relative;
            display: flex;
            justify-content: center;
            padding-bottom: 90px;
            padding-top: 60px;
        }
        .tomattos-bk{
            position: absolute;
            right: 0;
            z-index: -1;
            top: 0;
            width: 410px;
        }
        .sec01-row01{
            display: flex;
            margin-bottom: 40px;
            padding-right: 40px;
            align-items: flex-end;
        }
        .sec01-row02{
            display: flex;
            margin-bottom: 40px;
            padding-right: 40px;
            align-items: flex-end;
        }

        .sec01-row02{
            display: flex;
            margin-bottom: 40px;
        }
        .sec01-row01 p{
            width: 50%;
            text-align: right;
            padding-right: 20px;
            margin-top: 18px;
        }
        .sec01-row01 img{
            width: 80px;
        }
        .sec01-row02 img{
            width: 70px;
        }
        .sec01-row02 .num{
            color: #56b358;
            font-size: 73px;
            font-weight: 100 !important;
            margin-right: 14px;
            margin-left: 14px;
        }
        .sec01-row02 .text{
            color: white;
            font-weight: 800;
        }
        .sec01-container-p{
            font-size: 18px;
            text-align: right;
            font-weight: 900 !important;
            padding-right: 40px;
        }
        .sec01-container-content{
            margin-right: 100px;
        }


        /* section03 */
                .sec03-box-img img{
                    width: 100%;
                }
                #section03 h3{
                    font-weight: 100 !important;
                    font-size: 34px;
                }
                .sec03-cut-row{
                    display: flex;
                    align-items: flex-end;
                    margin-top: 40px;
                }
                .sec03-inpho-col .des{
                    color: white;
                    font-weight: bold !important;
                    margin-top: 7px;
                    margin-bottom: 20px;
                }
                .row-secound-sec03 p{
                    margin-bottom: 16px;
                    font-size: 18px;
                    font-weight: 800 !important;
                }
                .row-secound-sec03 p span{
                   color: #a20014;
                }
                .sec03-text-col{
                    margin-left: 50px;
                }
                .sec03-text-col p{
                    font-size: 19px;
                    opacity: .5;
                    font-weight: 800 !important;
                }

                .sec03-charts-row{
                    display: flex;
                    margin-top: 20px;
                    margin-bottom: 50px;
                }
                .sec03-charts-col .col-row{
                    display: flex;
                    align-items: center;
                }
                .chart-des{
                    color: white;
                    font-weight: bold;
                }
                .col-row .thousand{
                    color: white;
                   margin-right: 14px;
                }
                .col-row .thousand span{
                    font-size: 40px;
                    font-weight: 100px;
                }
                .sec03-charts-col{
                    margin-left: 50px;
                }
                .sec03-progress-row02 {
                    display: flex;
                    width: 100%;
                }
                .sec03-progress-col02-a{
                    color: white;
                    width: 30%;
                }
                .sec03-progress-col02-a .bk{
                    background-color: #4f7480;
                    color: white;
                    height: 60px;
                    display: flex;
                    align-items: center;
                    padding-right: 10px;
                }
                .sec03-progress-col02-b{
                    color: white;
                    width: 20%;
                }
                .sec03-progress-col02-b .bk{
                    background-color: #8da7be;
                    color: white;
                    height: 60px;
                    display: flex;
                    align-items: center;
                    padding-right: 10px;
                }
                .sec03-progress-col02-c{
                    color: white;
                    width: 50%;
                }
                .sec03-progress-col02-c .bk{
                    background-color: #a20014;
                    color: white;
                    width: 50%;
                    height: 60px;
                    display: flex;
                    align-items: center;
                    padding-right: 10px;
                }
                .sec03-progress-col02-a .des{
                    margin-top: 11px;
                    font-weight: 800;
                    font-size: 15px;
                }
                .sec03-progress-col02-b .des{
                    margin-top: 11px;
                    font-weight: 800;
                    font-size: 15px;
                }
                .sec03-progress-col02-c .des{
                    margin-top: 11px;
                    font-weight: 800;
                    font-size: 15px;
                }
                .sp-title{
                    font-weight: 100;
                    font-size: 41px;
                    margin-left: 9px;
                }
        /* section03 */


        .sec05-num-head{
            color: #a20014;
            font-size: 50px;
            font-weight: 100 !important;
            margin-top: 87px;
            margin-bottom: 10px;
        }
        #section05 h3{
            font-weight: 100 !important;
        }



        /* section06 */
            .sec06-menu{
                display: flex;
                padding-top: 25px;
                justify-content: center;
            }
            #story02{
                display: none;
            }
            #story03{
                display: none;
            }
            .pie-chart span, .pie-chart i {
                display: inline-block;
                font-size: 28px;
                z-index: 2;
                color: #a20014 !important;
                font-weight: 100 !important;
            }
            .sec06-menu{
                background-color: #ffffff;
            }
            .sec06-content-container{
                position: relative;
            }
            .sec06-content-bk{
                position: absolute;
                left: 0;
                top: 0;
                z-index: -1;
                height: 100%;
                width: 100%;
                object-fit: cover;
            }
            .all-stories {
                display: flex;
                flex-direction: column;
                align-items: baseline;
                color: #1c1a1a;
                width: 55%;
            }
            .all-stories-content p{
                color: #1c1a1a;
                text-align: right;
                font-weight: 500;
                font-size: 16px;
                line-height: 25px;
            }
            .all-stories-head{
                display: flex;
                align-items: flex-end;
                border-bottom: solid 1px #979797;
                padding-bottom: 10px;
                margin-bottom: 40px;
            }
            .all-stories-head .des{
                font-size: 18px;
                font-weight: 900;
                margin-left: 10px;
                margin-right: 9px;
            }
            .all-stories-head .num{
                color: #a20014;
                font-weight: bold;
                font-size: 19px;
            }
            .all-stories-head img{
                display: flex;
                align-items: flex-end;
                width: 60px;
            }
            .daonload-img{
                text-align: right;
            }
            .daonload-img img{
                width: 180px;
                margin-top: 15px;
                margin-bottom: 40px;
            }
            .content-chart-container {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                margin-top: 40px;
                margin-bottom: 40px;
            }
            .chart-col06 .num{
                color: #564c4c;
                font-size: 31px;
                font-weight: bold;
            }
            .chart-col06 .title{
                color: #564c4c;
                font-weight: bold;
            }
            .sec06-menu-all{
                color: #564c4c;
                font-size: 19px;
                font-weight: 800;
                width: 15%;
                text-align: center;
                padding-bottom: 12px;
                margin-left: 10px;
                border-bottom: solid 4px #c2c2c2;
                cursor: pointer;     
            }
            .activeStory-Nav{
                border-bottom: solid 4px #a20115 !important;
                color: #a20115 !important;
            }
            .activeStory{
                display: block !important;
            }
            .notactiveStory{
                display: none;
            }
         /* section06 */
         .section14 .text-left{
             opacity: 0.8;
         }
        

         .sec07-r0w{
            margin-bottom: 40px;
            margin-top: 35px;
         }
         .sec03-box .text{
            text-align: center;
            color: #1c1a1a;
            font-size: 20px;
            font-weight: 900 !important;
            padding-bottom: 10px;
            text-transform: uppercase;
         }
         .sec03-box{
            transition: all .5s;
            position: relative;
            height: 100%;
         }
         .box-hover{
            position: absolute;
            width: 100%;
            height: 100%;
            color: white;
            background-color: #000000d9;
            transition: all .5s;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding-top: 35px;
         }
         .video-cont-main{
            justify-content: center;
         }
         .video-cont-main02{
            width: 70%;
            margin: auto;
            margin-top: 50px;
         }
         #chemic02{
             display: none;
         }
         #chemic03{
            display: none;
        }
        #chemic04{
            display: none;
        }
        #chemic05{
            display: none;
        }
        .all-head-chemic{
            font-size: 18px;
            font-weight: 700;
            margin-bottom: 8px;
            margin-top: 12px;
            text-transform: uppercase; 
            cursor: pointer;       
        }
        .all-chemic .activeStory{
            display: block;
        }
        .all-chemic .notactiveStory{
            display: none;
        }
        .all-chemic{
            background-color: #a278012e;
            height: 100%;
            width: 100%;
            padding-top: 14px;
        }
      
      @media (max-width:992px) {

    }

      @media (max-width:769px) {
        
      }

    @media (max-width: 720px) {
        #header-video {display: none;}
        #header-mobile {display: block;}
    }

    @media screen and (max-width: 480px)  {
        .youtube-promo{
            width: 100%;
            margin: auto;
            margin-bottom: 50px;
        }
        .video-promo-head{
            background-color: #a20013;
            color: white;
            padding: 7px;
            font-weight: 400 !important;
            font-size: 14px;
        }
        .logopic {
            width: 84px;
        }
        #mob h1 {
            font-size: 34px;
            margin-top: 25px;
            color: white;
            font-weight: 100 !important;
        }
        #mob h3 {
            width: 100%;
            font-size: 21px;
            line-height: 30px;
            font-weight: bold !important;
            margin-bottom: 28px;
        }
        .danger-sign {
            position: absolute;
            top: 0;
            right: 0;
            background-color: #000000ad;
            width: 100%;
            height: 100%;
        }
        .quote-img-sec14{
            width: 62px;
             margin-bottom: 10px;
        }
        #section14 h3{
            font-size: 25px;
        }
        .video-cont-main02 {
            width: 100%;
        }
        .video-cont-main .col-md-6{
            margin-bottom: 15px;
        }
        #section11 h3{
            font-size: 20px;
        }
        .sec-descrip {
            position: absolute;
            right: 7px;
            bottom: -6px;
            text-align: right;
            font-size: 15px;
            font-weight: 800;
            left: unset;
        }
        #section05 h3 {
            font-weight: 100 !important;
            margin-top: 55px;
        }
        .video-cont-main .col-md-3{
            margin-bottom: 15px;
        }
        .sec03-charts-row{
            flex-direction: column;
        }
        .sec03-charts-col {
            margin-left: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .sec03-cut-row{
            flex-direction: column;
            align-items: center;
        }
        .sec03-text-col {
            margin-left: 0;
        }
        .chart-des {
            color: white;
            text-align: center;
            font-weight: bold;
            margin-bottom: 20px;
        }
        .map-container{
            margin-bottom: 43px;
            margin-top: 25px;
        }
        .sec03 {
            display: flex;
            align-items: baseline;
            justify-content: center;
        }
        .row-secound-sec03 p{
            text-align: center
        }
        #section03 h3 {
            font-weight: 100 !important;
            font-size: 30px;
            line-height: 38px;
        }
        .sec03-progress-col02-c .bk{
            width: 100%;
        }
        .sec03-progress-col02-a {
            color: white;
            width: 100%;
            margin-bottom: 10px;
            text-align: center;
        }
        .sec03-progress-col02-b {
            color: white;
            width: 100%;
            margin-bottom: 10px;
            text-align: center;
        }
        .sec03-progress-col02-c {
            color: white;
            width: 100%;
            margin-bottom: 20px;
            text-align: center;
        }
        .sec03-progress-row02{
            flex-direction: column;
        }
        .sec03-progress-col02-a .bk{
            justify-content: center;
        }
        .sec03-progress-col02-b .bk{
            justify-content: center;
        }
        .sec03-progress-col02-c .bk{
            justify-content: center;
        }
        .sec03-progress-col02-a .des{
            margin-bottom: 20px;
        }
        .sec03-progress-col02-b .des{
            margin-bottom: 20px;
        }
        .sec03-progress-col02-c .des{
            margin-bottom: 20px;
        }
        .sec01-container-content {
            margin-right: 0;
        }
        .sec01-row02 .num{
            font-size: 59px;
        }
        .sec01-row02 img {
            width: 55px;
        }
        .sec01-row01 img {
            width: 67px;
        }
        .sec01-row01{
            align-items: center;
            margin-bottom: 10px;
        }
        .tomattos-bk{
            display: none;
        }
        .sec01-row02 .text{
            text-align: right;
            line-height: 22px;
        }
        .sec01-container-p {
            font-size: 15px;
            text-align: center;
            font-weight: 900 !important;
            padding-right: 0;
            width: 80%;
            margin: auto;
        }
        .content-chart-container {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            margin-top: 40px;
            margin-bottom: 40px;
        }
        .all-stories {
            width: 100%;
        }
        .daonload-img {
            text-align: center;
        }
        .sec06-menu-all{
            width: 100%;
            line-height: 24px;
            font-size: 16px;
            margin-left: 2px;
            margin-right: 2px;
        }
        .all-stories-head{
            justify-content: center;
        }
        .chart-col06{
            margin-top: 45px;
        }
        .pie-chart{
            margin-top: 5px;
        }
        .all-stories{
            align-items: center;
        }
        .all-chemic
        {
            width: auto;
            margin-top: 11px;
        }
        .all-chemic .col-md-8 p{
            margin-top: 15px;
        }
        .col-mob-sec07{
            display: flex;
            justify-content: center;
        }
        
    }