*{ margin:0; padding:0; box-sizing: border-box;}
@font-face {

    font-family: 'Syne-Regular';

    src: url('./font/Syne-Regular.woff2') format('woff2'),

        url('./font/Syne-Regular.woff') format('woff');

    font-weight: normal;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Syne-Medium';

    src: url('./font/Syne-Medium.woff2') format('woff2'),

        url('./font/Syne-Medium.woff') format('woff');

    font-weight: 500;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Syne-Bold';

    src: url('./font/Syne-Bold.woff2') format('woff2'),

        url('./font/Syne-Bold.woff') format('woff');

    font-weight: bold;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Syne-SemiBold';

    src: url('./font/Syne-SemiBold.woff2') format('woff2'),

        url('./font/Syne-SemiBold.woff') format('woff');

    font-weight: 600;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Syne-ExtraBold';

    src: url('./font/Syne-ExtraBold.woff2') format('woff2'),

        url('./font/Syne-ExtraBold.woff') format('woff');

    font-weight: bold;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'a_noteregular';

    src: url('./font/a-note.regular-webfont.woff2') format('woff2'),

         url('./font/a-note.regular-webfont.woff') format('woff');

    font-weight: normal;

    font-style: normal;



}










a{ text-decoration: none;}
html{ font-size: 62.5%; scroll-behavior: smooth;}
body{ background-color: #000; padding: 1rem 0 ;     font-family: 'Syne-Medium';
    font-size: 1.2rem;}
section.top {
    padding: 2rem 0 0;
}
h1, h2, h3, h4 {
    font-family: 'Syne-SemiBold';
}
.logo img {
    width: 12rem;
    height: auto;
}
nav ul{ display: flex; list-style: none; justify-content: flex-end;}
nav ul li a {
    color: #fff!important;
    padding: 1rem 2rem!important;
    font-size: 1.6rem!important;
    font-weight: lighter;
}
.banner {
    background: url('/img/5132772\ 1.png');
    background-size: 100% 100%;
    min-height: 431px;
    position: relative;
    padding: 6rem 0 0 0;
    margin-bottom: 3rem;
}

.banner::before {
    content: '';
    background: url('./img/5132772\ 1.png');
    position: absolute;
    top: 6rem;
    height: 100%;
    width: 100%;
    background-size: 100% 100%;
    left: 0;
    z-index: 0;
}
.banner::after {
    content: '';
    background: url('./img/arrow-curve\ 1.png');
    position: absolute;
    top: 10rem;
    height: 81%;
    width: 68%;
    background-size: 100% 100%;
    left: 19rem;
    z-index: 0;
}
.mobile::before {
    content: '';
    background: url('./img/logistics.gif');
    position: absolute;
    top: 24%;
    height: 422px;
    width: 210px;
    background-size: 100% 100%;
    left: 52%;
    z-index: 9;
}

.mobile::after {
    content: '';
    background: url('./img/burger.gif');
    position: absolute;
    top: 27%;
    height: 442px;
    width: 220px;
    background-size: 100% 100%;
    left: 31%;
    transform: rotate(24deg);
    z-index: 9;
    transform-origin: center;
	    border-radius: 23px;
}
.banner h1 {
    font-size: 5rem;
    color: #fff;
    margin-bottom: 13rem;
    font-weight: lighter;
    position: relative;
    z-index: 1;
    font-family: "Syne", sans-serif;
    letter-spacing: 4px;
}
.banner .icon {
    position: absolute;
    bottom: -1%;
    width: 4rem;
    height: 4rem;
    left: 22rem;
}
.banner .icon img{ width: 100%;}

.banner h2 {
    font-size: 4rem;
    color: #fff;
    margin-bottom: 1rem;
    position: relative;
    z-index: 11;
    text-shadow: 0 0 10px BLACK;
}
span.pluss {
    color: #41D475;
    font-size: 3rem;
    position: absolute;
    right: 14%;
    top: 19%;
    font-weight: bold;
}
span.brand {
    position: absolute;
    right: 9.8%;
    font-size: 1.5rem;
    color: #fff;
    top: 27%;
}
.contact {
    transform: rotate(180deg);
    letter-spacing: 2px;
    writing-mode: vertical-rl;
    position: fixed;
    right: -2px;
    top: 23vh;
    color: #fff;
    padding: 2rem 1rem;
    font-size: 1.6rem;
    background: rgb(65,212,117);
    background: linear-gradient(180deg, rgba(65, 212, 117, 1) 0%, rgb(36 90 55) 100%);
	border-width: 2px 0 2px 2px;
    border:solid #1b1E1E;
    border-radius: 0px 20px 20px 0;
    z-index: 33;
}
.tech{
    width: 100%; padding: 15rem 0 10rem;
}
.view_box {
    width: 100%;
    border: 2px solid #41D475;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
   padding: 4rem 0;
    border-radius: 2rem;
}
.view_box .icon{}
.view_box .icon img{}
.view_box .cont {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 2rem 4rem;
    color: #fff;
}
.view_box .cont h3{}
.view_box .cont  p{ text-align: center;}
.btn{ width: 100%; text-align: center; padding: 3rem 0;}
.btn a{ background-color: #41D475; color: #1b1E1E; font-size: 1.4rem; border-radius: 2rem; 
    border: none; padding: 1rem 8rem; font-weight: 600;    display: inline-block;}
.enterprise{ width: 100%; padding: 1rem 0 2rem;}
.en_left{width: 100%; display: flex;}
.en_left img{ width: 90%; height: auto;}

.en_right{ color: #fff; display: flex; flex-direction: column;}
.en_right h2{ font-size: 5rem; line-height: 6rem; font-weight: 600;}
.en_right p{ font-size: 1.8rem; line-height: 2.6rem; font-weight: 400;}
.en_right p span{ color: #41D475;font-size: 5rem; line-height: 6rem; font-weight: 700;}
.en_right div p{font-size: 2.5rem; line-height: 3rem; font-weight: 600;}
.invest{ width: 100%; padding: 5rem 0;}
.invest .heading{ width: 100%; color: #fff; display: flex; justify-content: center; flex-direction: column; align-items: center;}
.invest .heading h2{  width: 65%;font-size: 4rem;font-weight: 600; line-height: 5rem; text-align: center;  }
.invest .heading p {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.2rem;
    text-align: center;
    padding: 2rem 0;
    width: 65%;
}
.invest .invest_img{width: 100%; display: flex; justify-content: center; align-items: center;}
.invest .invest_img video{ width: 60%; height: auto;}
.reports {
   /* width: 100%;
    padding: 10rem 3rem;
    position: relative;
    margin-top: 15rem;*/
    background: url('img/4880206\ 1.png') rgba(65, 212, 117, 0.9);
    background-size: cover;
    background-blend-mode: multiply;
	border-radius:4rem;
}  

.reports .heading{ display: flex;    align-items: center;}
.reports .heading h2 {
    color: #fff;
    font-size: 4rem;
    font-weight: 600;
    line-height: 4rem;
    text-align: left;
    text-shadow: 5px 9px 6.8px #00000099;
}
.reports .heading img {
    width: 71%;
    height: auto;
    margin: 3rem 0;
}
.reports button{
    background: transparent;
    border: none;
    outline: none;
}

.reports .mid_img {
    position: absolute;
    bottom: 0;
    left: 39%;
    width: 300px;
    height: auto;
    z-index: 9;
}
.serviceslide .carousel-inner {
    padding-top: 70px!important;
}
.mid_img-margin-top{margin-top: -70px;}
.reports .heading p{color: #fff; }
.reports .list_report{display: flex; height:100% ;justify-content: center;  flex-direction: column;}
.reports .list_report ul{ list-style: none; display: flex; flex-direction: column;}
.reports .list_report ul li {
    display: flex;
    justify-content: stretch;
    margin: 1rem 0;
    align-items: center;
}
.reports .list_report ul li img{width: 2.5rem;  height: 2.5rem; }
.reports .list_report ul li span{ margin-left: 1rem; font-size: 2rem; font-weight: 600;  line-height: 3rem; color: #fff; }
.our_stack{ width:100%; padding: 6rem 0; position: relative;}
.our_stack .heading{ width: 100%; padding: 2rem; background: #41D475; display: flex; flex-direction: column;
    justify-content: center; align-items: center;
    }
    .our_stack .heading h2{  font-size: 5rem;  font-weight: 600; line-height: 7rem;
        text-align: center;}
        .our_stack .heading p{ width: 72%;       font-size: 1.4rem;   font-weight: 400;  line-height: 2rem;
            text-align: center;
            }
            .our_stack .sub-heading{ width: 100%; position: relative; padding: 3rem 0; }
            .our_stack .sub-heading h2{color:#fff;
                font-size: 5rem;
                font-weight: 600;
                line-height: 6rem;
               
                }
                .our_stack .sub-heading p {
                    color: #fff;
                    font-size: 1.4rem;
                    font-weight: 400;
                    line-height: 2.5rem;
                    width: 74%;
                }
                .clients{ width:100%; position: relative; padding: 5rem 0;display: flex;flex-wrap: wrap;

                }
                .clients .clients_box {
                    width: 22%;
                    margin: 1% 1.5%;
                    height: 110px;
                    background-color: #fff;
                    padding: 2rem;
                    border-radius: 10px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    
                }
                .clients .clients_box img{ width:70%; }
                .case-studies{ width: 100%; padding: 3rem 0; position: relative;}

                .case-studies .sub-heading{ width: 100%; position: relative; padding: 1rem 0;
                display: flex; justify-content: space-between; }
                .case-studies .sub-heading h2{color:#fff;
                    font-size: 5rem;
                    font-weight: 600;
                    line-height: 6rem;width: 30%;
                   
                    }
                    .case-studies .sub-heading p {
                        color: #fff;
                        font-size: 1.4rem;
                        font-weight: 400;
                        line-height: 2.5rem;
                        width: 34%;
                    }
                    .case_box{ width: 100%; color: #fff; }
                    .case_box img{ width:100%}
                    .case_box h4 {
                        font-size: 2.5rem;
                        font-weight: 600;
                        line-height: 3rem;
                        
                        text-transform: uppercase;
                    }
                    .case_box span {
                        font-size: 2rem;
                        font-weight: 600;
                        line-height: 3rem;
                        text-align: left;
                    }
                
.case_box p {font-size: 1.5rem; font-weight: 400;line-height: 2rem;margin-top: 1rem;text-align: justify;
              width: 90%; }
.case_box .icon{width: 4rem;
                        height:4rem;
                        
                       
                        }
.contact_sec{ width:100%; padding: 5rem 0; position: relative;}
.contact_sec h4{ color: #fff;
    font-size: 4rem;
    font-weight: 600;
    line-height: 4rem;
    
     }
.contact_sec .contact1{ width: 100%; margin: 2rem 0; display: flex; justify-content: flex-end;background-color: #41D475;
     border-radius: 4rem 0 4rem 0;  padding: 3rem 0; position: relative;}
     .contact_sec:before {
        content: '';
        background: url('./img/iPhone\ 15.png');
        position: absolute;
        top: 2rem;
        left: rem;
        width: 48%;
        height: 100%;
        z-index: 9;
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }
.contact_sec .contact1 .form-input{ position: relative; width:80%}
.contact_sec .contact1 .form-input input,.contact_sec .contact1 .form-input textarea{ width:100%; border: none; border-bottom: .2rem solid #000;
background-color: transparent; color: #000; min-height: 6rem; padding: 1rem 0rem;font-size: 2rem;
line-height:4rem;}
.contact_sec .contact1 .form-input input:focus,.contact_sec .contact1 .form-input textarea:focus{  outline: none;}
::placeholder {  color: #000;opacity: 1;}  
  ::-ms-input-placeholder {   color: #000;  }
  .contact_sec .contact1 .form-input button { background-color: #fff; font-size: 1.4rem; color: #000;border:none;
outline: none; padding: 1rem 2rem; border-radius: 2rem; margin-top: 2rem;}
.footer{ width: 100%; padding: 3rem 0; position: relative; border-bottom: 1px solid #fff;}
.footer h4{ color: rgba(255,255, 255, 0.5); 
    font-size: 2rem;
    font-weight: 600;
    line-height: 3.4rem;
    text-align: left;
    }
.footer ul{ width:50%; display: flex; flex-direction: column; float: left; padding: 0; list-style: none;}
.footer ul li a{ color: #fff ;font-size:1.3rem; padding: 2rem 0;
    font-weight: 600;
    line-height: 3rem;
    text-align: left;}
footer{width: 100%; padding: 3rem 0; position: relative; }
footer h4{ color: rgba(255,255, 255, 0.5); margin-bottom: 3rem;
    font-size: 2rem;
    font-weight: 600;
    line-height: 3.4rem;
    text-align: left;
    }
    footer .f_p {
        width: 52%;
        display: flex;
    }
    footer p {
        
        display: flex;
    }
    footer  img{ width:3rem; height: 3rem; margin-right: 2rem;}
    footer  span{ color: #fff; font-size: 1.5rem; }
    /*.carousel-item.active,.carousel-item {
       
        width: 75%;
       
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transition: transform .6s ease-in-out;
        margin-left: 14%;
        background: #fff;
        padding: 3rem;
        border-radius: 2rem;
    }*/
    .carousel-item p{
        
        font-size: 1.5rem;
        font-weight: 400;
        line-height: 2rem;
       border-radius: 2rem;
    }
   
    .me-8 {
        margin-right: 8rem!important;
    }
   .contact2{ width: 100%; margin:0; background-color: #41D475;
         padding: 2rem; position: relative;}
     .contact2 .form-input{ position: relative; width:100%}
     .contact2 .form-input input, .contact2 .form-input textarea{ width:100%; border: none; border-bottom: .2rem solid #000;
    background-color: transparent; color: #000; min-height: 6rem; padding: 1rem 0rem;font-size: 2rem;
    line-height:4rem;}
     .contact2 .form-input input:focus, .contact2 .form-input textarea:focus{  outline: none;}
    ::placeholder {  color: #000;opacity: 1;}  
      ::-ms-input-placeholder {   color: #000;  }
       .contact2 .form-input button.submit { background-color: #fff; font-size: 1.4rem; color: #000;border:none;
    outline: none; padding: 1rem 2rem; border-radius: 2rem; margin-top: 2rem;    float: right;}
    .contact2 .form-input button.danger { background-color: #231f1f; font-size: 1.4rem; color: #fff;border:none;
        outline: none; padding: 1rem 2rem; border-radius: 2rem; margin-top: 2rem; margin-left: 1rem;    float: right;}

        .modal-content {
         
            border-radius: 2rem ;
            
        }


      .reports .carousel-item.active,.reports .carousel-item {
            width: 100%;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            transition: transform .6s ease-in-out;
            margin-left: 0;
            background: transparent;
            padding: 0;
            border-radius: 0;
        }
        .reports .carousel {
           
            z-index: 0;
        }

        .case_box1{ width: 100%; }
        .case_box1 img{ width:100%;  }
        .case_box1 h4 {
            font-size: 2.5rem;
            font-weight: 600;
            line-height: 3rem;
            
            text-transform: uppercase;
        }
        .case_box1 span {
            font-size: 2rem;
            font-weight: 600;
            line-height: 3rem;
            text-align: left;
        }
    
.case_box1 p {font-size: 1.5rem; font-weight: 400;line-height: 2rem;margin-top: 1rem;text-align: justify;}
.case_box1 .icon{width: 4rem;
            height:4rem;
            }
.testi .carousel-item.active, .testi .carousel-item {
       
        width: 75%;
       
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transition: transform .6s ease-in-out;
        margin-left: 14%;
        background: #fff;
        padding: 3rem;
        border-radius: 2rem;
    }
    .testi .carousel-item p{
        
        font-size: 1.5rem;
        font-weight: 400;
        line-height: 2rem;
       border-radius: 2rem;
    }



.navbar-toggler-icon{filter: invert(1);}
.navbar-toggler{border-color:#fff}









@media only screen and (max-width: 700px){
	.mid_img-margin-top {
    margin-top:0px;
}
	.clients .clients_box {
		width: 47%;}
	.case-studies .sub-heading h2, 
	.case-studies .sub-heading p {
    width: 100%;
}
	
	.case-studies .sub-heading {
		display: block;}
	
	.reports {
    padding-top: 30px;
}
	.contact_sec:before {display: none;
    }
	
	.mobile::before {
    content: '';
    background: url('./img/logistics.gif');
    position: absolute;
    top: 41%;
    height: 242px;
    width: 120px;
    background-size: 100% 100%;
    left: 58%;
    z-index: 9;
}

.mobile::after {
    content: '';
    background: url('./img/burger.gif');
    position: absolute;
    top: 35%;
    height: 272px;
    width: 130px;
    background-size: 100% 100%;
    left: 14%;
    transform: rotate(24deg);
    z-index: 9;
    transform-origin: center;
}
	.banner h2 {
		font-size: 2rem;}
		span.pluss {
    right: 14%;
    top: 24%;
}
span.brand {
    right: 9.8%;
    top: 32%;
}
	.banner {
    background: url(/img/5132772 1.png);
    background-size: 100% 100%;
    min-height: 465px;
    position: relative;
    padding: 6rem 0 0 0;
    margin-bottom: 0rem;
    overflow: hidden;
}.banner h1 {
	font-size: 4rem;}
	.tech {
    padding: 5rem 0 10rem;
}
	.en_left img {
    width: 100%;
}
	nav ul li a {
	border-bottom: 1px solid #777!important;
}
	
	
}