:root{
    ---bgcolor:hsla(120, 55%, 22%, 0.925);
    ---bgtext:21px;
    ---smtext:16px;
    ---color:#010101;
  }

.sliders, .wrap , .slide , .slide-content{
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100vh;
    overflow-x: hidden;
    overflow-y: hidden;
}
.wrap{
    position: relative;
}

.slide-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    top:-0px;
    margin-top: -0px;
    background-color:rgb(0,0,0,0.500);
}
 .slide-content .caption{
    display: flex;
    justify-content: center;
    align-items: left;
    flex-direction: column;
    margin-top: -10em;
    width:50vw;
    transition: width 2s;
    
}
.caption .btn{background:black;width:20%;padding: 0.5em;color: #f1f1f1;;font-weight: 500;text-align: center;border-radius: 10px;}
.caption .btn:hover{background:rgb(11, 50, 92) ;}
.title{font-size: 32px;font-weight:600; color: #fff;box-shadow: 1px 1px 2px solid rgb(30, 96, 165);}
.slide p{font-size:18px; color: #fff;opacity: 1;font-weight: 400;}
.arrow{cursor: pointer;position:absolute; top: -30%; margin-top:30%;width: 0;height: 0;z-index:3;text-align: center;padding: 20px;background-color: #fff;
       border-radius: 50%;
     }
.arrow:hover{background:rgb(6, 44, 85) ;color: #fff;}
.left-arrow{margin-left: 30px;}
.right-arrow{right:0;margin-right: 30px;}
.fa{position: relative;top:-10px;right:9px;}
.hcsmholder{display: grid;grid-template-columns: 1fr 1fr 1fr 1fr;position: absolute;top:90%;left:0;right:0;z-index:3;gap:2px;}
.hcsmcont{background:rgba(20, 72, 128, 0.7) ;height: 20vh;padding: 1rem 1rem;display: grid;grid-template-columns: 3fr 1fr;gap:5px;}
.hcimg{padding:1rem 0rem}
.hcimg .fa{font-size:32px;color:#fff}
.hcont h4{font-size: 21px;font-weight: 400;color:#fff;margin: 0;padding: 0;}
.hcont p{font-size: 14px;font-weight: 400;color:#fff;}
.footer{background:var(---bgcolor);padding: 2rem;}
.footerholder{display: grid;grid-template-columns: repeat(auto-fit ,minmax(300px,1fr));gap:1rem;}
.fohead .fa{color: #f1f1f1;font-size: 32px;padding:10px 0px;}
.fohead .ftit{font-size: 21px;font-weight: 400;}
.fosocial{justify-content: center;align-items: center;padding: 10px 0px;}
.fosocial a{background:#f1f1f1;padding:15px;color:var(---bgcolor)}
.fopar p{color:#f1f1f1;font-size: 16px;font-weight: 300;line-height: 1.5em;}
.fohead a{font-size:24px;font-weight: 400;color:var(---color);margin-bottom: 20px;}
.folink ul{display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    padding-left: 0;}
.folink ul li{
    list-style: none;
    display: inline-block;
    width: calc(100% / 2);
    text-align:left;
    padding: 0.5rem 0rem;
}
.folink ul li a{display:block;color:#f1f1f1;padding: 5px;gap: 4px;}
.folink ul li a .fa{margin-right: 2px;}
.marque{width:100%;height: 15vh;overflow: hidden;}
.marqueholder{height:100%;display: flex;animation: scrolling 20s linear  infinite;}
@keyframes scrolling{
      0%{transform: translateX(100%);}
      100%{transform: translateX(-180%);}
}
.marqueimg{width: 20%;
    flex-shrink: 0;
    white-space: nowrap;}
.marqueholder:hover{animation-play-state: paused;}
.scrolimg{width: 80%;object-fit:contain;}