body {
    margin:0px;
    font-family: sans-serif;
    background-color: black;
    color: #31c48d;
}

.header-menu a{
    text-decoration:none ;
    color: #31c48d;
}

.blackborder {
 
 
 border-bottom: 1px solid   #31c48d; 
 border-bottom-width: 100%;
}

footer {
        border-top: 1px solid #31c48d;
}

.mobile-menu {
    display: none;

}

.closemenu {
    display: none;
 }
.container {
    margin: auto;
    display: flex;
   padding-left: 32px;
   padding-right: 32px;
   max-width: 1672px;

}

.blackborder .container {

    justify-content: space-between;
    align-items: center;
    padding: 16px;
   
}

.wpcf7-form-control.wpcf7-submit.has-spinner {
    background-image: url('data:image/svg+xml,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 width%3D%2218%22 height%3D%2218%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 stroke%3D%22currentColor%22 stroke-width%3D%222%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22 class%3D%22lucide lucide-send ml-2%22%3E%3Cpath d%3D%22m22 2-7 20-4-9-9-4Z%22%3E%3C/path%3E%3Cpath d%3D%22M22 2 11 13%22%3E%3C/path%3E%3C/svg%3E');
    background-repeat: no-repeat;
    background-position-x: right;   
    background-size: 18px;
    background-position-y: center;
    background-position: calc(100% - 10px) center;
    padding-right: 33px; 
    padding-left: 15px; 
}

.wpcf7-spinner {
    display: inline-block;
    width: 24px; 
    height: 24px; 
    background-size: cover;
    margin-left: 10px; 
    vertical-align: middle; 
    background-color: #31c48d;
}

.wpcf7-response-output {
    padding: 12px 17px;
    background-color: #014737; 
    color: black; 
    border: 1px solid  #31c48d ; 
    border-radius: 10px; 
    font-size: 16px;
    font-weight: 600;
    font-family: sans-serif;
    margin-top: 10px;
    margin-left: 0px; 
    text-align: center;
  
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
    border-color: initial; 
    border-radius: 9999px;
    background-color: #31c48d;
    padding: 10px;
}

.wpcf7 form .wpcf7-response-output {
    padding: 0.2em 1em;
   margin-top: 40px;
    margin-left: 0; 
    margin-right: 0; 
}


.accelerate .container {
   display: flex;
   flex-direction: column;
    align-items: center;
    padding: 16px;
   
color: #31c48d;
 padding-top: 300px;
 padding-bottom: 300px;
}

.accelerate {
    border-bottom: #31c48d solid 1px;
}


.contactmain {

    display: flex;
    justify-content: center;
    padding-left: 5%;
    padding-right: 5%;
    gap: 48px;
}

.gettouch {
    max-width: 600px;
}



.descriptions {
 margin-bottom: 20px;
font-size: 20px;
font-family: sans-serif;
font-weight: 600;

}


.subdesc {
    margin-bottom: 20px;
font-size: 16px;
font-weight: 400;
display: flex;
    align-items: center;

}


.subdesc svg {
    margin-right: 8px; 
  
}

.map-container {
    margin-top: 20px;
    border-radius: 15px; 
    overflow: hidden;
}




.contact-form {
    max-width: 600px;
    margin: 0 auto;
}

.contact-form label {
    display: block;
    margin-bottom: 10px;
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    padding: 10px;
    margin-bottom: 20px;
    background-color: #252f3f;
}

.contact-form input[type="submit"] {
    
    border: none;
    padding: 10px 20px;
    cursor: pointer;
}


.wpcf7 {
   
    padding: 20px; 
    border-radius: 8px; 
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); 
}


.wpcf7 .wpcf7-text,
.wpcf7 .wpcf7-textarea {
    margin-top: 8px;
    width: 100%; 
    padding: 12px; 
    margin-bottom: 15px; 
    border: 1px solid #31c48d; 
    border-radius: 4px; 
    font-size: 16px; 
    color: #31c48d;
    background-color: #252f3f;
}


.wpcf7 .wpcf7-submit {
    color: black;
    text-decoration: none;
    background-color: #31c48d;
    padding: 8px 16px 8px 16px;
    border-radius: 9999px;
   border: none;
    font-weight: 700;
    transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease!important;
}

.getin {
    font-size: 20px;
font-family: sans-serif;
font-weight: 600;

}



.wpcf7 .wpcf7-submit:hover {
    background-color: rgba(135,225,188); 
    transition: all 0.5s ease;
    background-color: rgba(135,225,188)!important;
    transform: scale(1.05)!important;
    cursor: pointer;
}


.wpcf7 .wpcf7-not-valid-tip {
    color: #014737; 
    font-size: 18px; 
    font-family: sans-serif;
    font-weight: 600;
    
}
#content a {
color: #31c48d;
text-decoration: none;

}

.mb-8 {
    font-size: 40px;
    font-weight: 600;
    font-family: sans-serif;
}


.text-3xl
{
    font-size: 40px;
    font-weight: 600;
    font-family: sans-serif;
}


#terms {
    font-size: 40px;
    font-weight: 600;
    font-family: sans-serif;
}


.contens {
    
    padding-left: 15%;
    padding-right: 15%;


}

.contens svg {
    margin-right: 8px;

    

}

.text-2xl {
    
    display: flex;
    align-items: center;
}



.mt-2 {
margin-top: 10px;
}



#contactcontainer {
    display: flex;
    flex-direction: column;
}

#contacttitle {
    padding-bottom: 64px;
    padding-top: 64px;
    padding-left: 16px;
    padding-right: 16px;
   margin: auto;
}
#bluegrad{

    display: flex;
    flex-direction: column;
    padding-top: 70px;
    padding-bottom: 70px;
}

#secondbut {
 width: 260px !important;
  display: flex;
  justify-content: center;
  margin: auto;
}

#whitetext
{
    font-family: sans-serif;
    margin: auto;
    color: white;
    margin-bottom: 16px;
}
#whitetitle
{
    font-family: sans-serif;
    margin-bottom: 16px;
color: white;
}
.solution .container{
 margin: auto;
    display: flex;
    justify-content: center;
   flex-direction: column;
    text-align: center;
    align-items: center;
    
color: #31c48d;
padding-top: 64px;
padding-bottom: 64px;


}

.section-gradient .container {

    display: flex;
 justify-content: center;
 flex-direction: column;
}


.from-green-400 {
    --gradient-from-color: #31c48d;
    --gradient-color-stops: var(--gradient-from-color), var(--gradient-to-color, rgba(49, 196, 141, 0)); }

    .to-blue-500 {
        --gradient-to-color: #3f83f8;
    }

    .bg-gradient-to-r {
        background-image: linear-gradient(to right, var(--gradient-color-stops)); }

.onebox {
margin-top: 32px;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 32px;
    
}

#boxsone {
    color:white;
    background-color: black;
}
.solution {
    border-bottom: #31c48d solid 1px;
}

#boxns {
    color: #31c48d;
   padding-bottom: 16px;
    text-align: center;
   
}

#boxsone.box {
   padding-bottom: 16px;
}

.custom-list {
    margin-left: -24px;
}

.marker {

    list-style: disc; 
    list-style-position: inside; 
    padding-left: 0; 
    color: #00ffcc;
}

#tex {
    margin-top: 8px;
}


#boxtextsol {
margin-top: 8px;
margin-bottom: 16px;
text-align: left;

}

.solution {

    padding-bottom: 64px;
    border-bottom: #31c48d solid 1px;
}

#solbox {

    background-color: black;
    border: #014737 solid 2px;
    max-width: 405px;
   display: flex;
   align-items: start;
   flex-direction: column;
   transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease;
 
   
   
   
}

#solbox:hover {
    background-color: #046c4e;
    transform: scale(1.05);
}



.learnmore {
    font-size: 16px;
    color: rgba(14, 159, 110);
    text-decoration: none; 
    display: flex;
    justify-content: left;
}

#titlesol {
  
    margin-bottom: 48px;
}

#descriptionacce
{
    font-family: sans-serif;
    color: rgba(255, 255, 255);
    margin-bottom: 32px;
    margin-left: auto;
    margin-right: auto;
    max-width: 672px;
    text-align: center;
}

#titleacce
{
    font-family: sans-serif;
     color: rgba(255, 255, 255);
     margin-bottom: 16px;
     width: 567px;
     font-size: 64px;
     font-weight: 700;
     

}

#acceback {
   

    background-image: url('https://wsstgprdphotosonic01.blob.core.windows.net/photosonic/ff5bdab8-3c61-4ffa-9945-1a754f83314f.png');
    background-size: cover;
    background-position: center; 
    height: 960px;
}

.swiper {
    color: rgba(255, 255, 255);
    text-align: center;
    
}
.menu {
    align-items: center;
}


.section-gradient {
    padding: 4rem 0; 
    background: linear-gradient(to bottom, black, #014737); 
}


#titlegradient 
{

margin: auto;
}


.logo {
  width: 142px;
  height: 36px;
}


#menu-menu-1 .menu-item a { 
    color: #31c48d;
    text-decoration: none;

}

#menu-secondmenu .menu-item a { 
    color: #31c48d;
    text-decoration: none;

}


#menu-menu-1 {
    display: flex;
    justify-content: space-between;

}
.menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.menu li {
    display: inline-block; 
    margin-right: 20px; 
}


#menu-solutions .menu-item a { 
    color: #31c48d;
    text-decoration: none;

}


#menu-company .menu-item a { 
    color: #31c48d;
    text-decoration: none;

}

.aboutus ul {
    list-style: none;
    padding: 0;
    margin: 0;
}


.aboutus {
    padding-left: 16%;
    padding-right: 16%;
   
    color: #31c48d;
    display: flex;
    justify-content: space-between;
flex-wrap: wrap;
}

.namediv {

    width: 170px;
    display: flex;
    flex-direction: column;
}
.test {
    width: 170px;
    display: flex;
    flex-direction: column;
}

.solutions {
    display: flex;
    flex-direction: column;
    width: 170px;
}

.company {
    display: flex;
    flex-direction: column;
    width: 170px;
}
.button {
    color: black;
    text-decoration: none;
    background-color: #31c48d;
    padding: 8px 16px 8px 16px;
    border-radius: 9999px;
    font-weight: 700;
    
}

.pioneering {

width: 100%;
color: #31c48d;
display:flex ;
align-items: center;
padding-top: 64px;
padding-bottom: 64px;
}

.pioneering .container {
    flex-direction: column;
    width: 1640px;
}

.titlepioneering {
    text-align: center;
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 48px;
}

.journey {
    display: flex;
    justify-content: space-between;
   gap: 32px;
}

.ourjour {
    max-width: 820px;
}

.innovation {
    background-color: #014737;
   max-width: 820px;
    padding:32px;
    border-radius: 8px;
   
}

.our {
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 24px;
}
.born {
    margin-bottom: 16px;
}
.innovationour
{
margin-bottom: 8px;
font-size: 24px;
font-weight: 600;
}
.rocket {
    margin-bottom: 16px;
}

.misandvis .container{
    align-items: center;
    margin: auto;
    color: #31c48d;
  
    display: flex;
    flex-direction: column;
}

.title {
    text-align: center;
    color: #31c48d;
font-size: 30px;
font-weight: 600;
    margin-bottom: 24px;
}

.misvisbox {
    display: flex;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 64px;
}

.block {
background-color: #014737;
max-width: 740px;
    padding: 32px;
    border-radius: 8px;
}



.blockname {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 8px;

}

.boxname {
    margin-bottom: 8px;
    font-size: 20px;
    font-weight: 600;
}

.box {
    background-color: #014737;
   width:475px;
    padding: 25px;
    border-radius: 8px;
    color: #31c48d;
 
 
}

.valuesname {
font-weight: 600;
    font-size: 30px;
    margin-bottom: 24px;
    text-align: center;
    color: #31c48d;

}

.values .container {
 padding-bottom: 64px;
    display: flex;
    flex-direction: column;
    
 
    text-align: center;
    align-items: center;
}

.blocks {
    
    max-width: 1640px;
    display: flex;
    flex-wrap: wrap;
    gap: 32px;

}

.boximg {

    height: 70px;
}

.boxtitle {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 8px; 
}

.impact .container {
    padding-bottom: 64px;
       display: flex;
       flex-direction: column;

       text-align: center;
       align-items: center;
   }

.join .container{
    align-items: center;
    margin: auto;
    color: #31c48d;
 
    display: flex;
    flex-direction: column;
    
}



.revolution {
    margin-bottom: 32px;
    text-align: center;
}

.started {
text-decoration: none;
background-color: #31c48d;
color: black;
    padding: 12px 32px;
    border-radius: 9999px;
margin-bottom: 64px;
transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease;
}

.started:hover {
    background-color: rgba(135,225,188);
    transform: scale(1.05);
}


.columnname {
    padding-top: 32px;
    padding-bottom: 32px;
font-size:20px;

}
.columntext {
    text-decoration: none;
    color: #31c48d;
    padding-bottom: 8px;
}

.buttoncontainer {
    align-items: center;
}


.columnimg {

color: #31c48d;
padding-right: 8px;
}

.footerimg {
    display: flex;
    justify-content: left;

}

.copyright {


    color: #31c48d;
 text-align: center;
    padding-top: 32px;
    padding-bottom: 32px;
}


.transform {
    --transform-translate-x: 0;
    --transform-translate-y: 0;
    --transform-rotate: 0;
    --transform-skew-x: 0;
    --transform-skew-y: 0;
    --transform-scale-x: 1;
    --transform-scale-y: 1;
    transform: translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y));
}

#boxsone:nth-of-type(2) {
    background-color: #046c4e; /* Замініть на бажаний колір */
}

.buttoncontainer {
    transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease!important;
   
    transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform!important;
    border-radius: 9999px;
}

.buttoncontainer:hover {

    background-color: rgba(135,225,188)!important;
    transform: scale(1.05)!important;
}

.button {
    transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease;
   
    transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
}

.button:hover {
    background-color: rgba(135,225,188);
    transform: scale(1.05);
}
#menu-menu-1 .menu-item a:hover { 
    color: #84e1bc;
    text-decoration: none;

}
   

#menu-solutions .menu-item a:hover { 
    color: #84e1bc;
    text-decoration: none;

}

#menu-company .menu-item a:hover { 
    color: #84e1bc;
    text-decoration: none;

}

@-webkit-keyframes pulse{50%{opacity:.5}}@keyframes pulse{50%{opacity:.5}}@-webkit-keyframes
 bounce{0%,100%{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}
 50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}
 @keyframes bounce{0%,100%{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier
(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}
.animate-none{-webkit-animation:none;animation:none}.animate-spin{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}.animate-ping{-webkit-animation:ping 1s cubic-bezier(0,0,.2,1) infinite;animation:ping 1s cubic-bezier(0,0,.2,1) infinite}.animate-pulse{-webkit-animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite;animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}

.animate-pulse {
    -webkit-animation: pulse 2s cubic-bezier(.4,0,.6,1) infinite;
    animation: pulse 2s cubic-bezier(.4,0,.6,1) infinite;
}


.animate-bounce {    -webkit-animation: bounce 1s infinite;
    animation: bounce 1s infinite;}

@media (max-width: 1707px) {
   .blocks {
    justify-content: center;
   }
   .box {
    width: 705px;
   }
   .block {
    width: 705px;
   }
  
}




@media (max-width: 1610px) {
    .blocks {
     justify-content: center;
    }
    .box {
     width: 645px;
    }
    .block {
     width: 645px;
    }

   
 }

 @media (max-width: 1500px) {
    .blocks {
     justify-content: center;
    }
    .box {
     width: 605px;
    }
    .block {
     width: 605px;
    }
    .ourjour {
        max-width: 770px;
    }
  
    }
 
    @media (max-width: 1410px) {
        .blocks {
         justify-content: center;
        }
        .box {
         width: 575px;
        }
        .block {
         width: 575px;
        }
        .ourjour {
            max-width: 720px;
        }
        }

        @media (max-width: 1360px) {
            .blocks {
             justify-content: center;
            }
            .box {
             width: 450px;
            }
            .block {
             width: 450px;
            }
            .ourjour {
                max-width: 520px;
            }
            .innovation {
                max-width: 520px;
            }
           

            #contactcontainer {
                padding-left: 0px;
                padding-right: 0px;
            }
           
            }
            
            @media (max-width: 1410px) {
                .map-container {
                    width: 550px;
                }
            }


            @media (max-width: 1370px) {
                .map-container {
                    width: 500px;
                }
            }

            @media (max-width: 1300px) {
                .map-container {
                    width: 450px;
                }
            }

            @media (max-width: 1200px) {
                .map-container {
                    width: 420px;
                }
            }

            @media (max-width: 1110px) {
               .contactmain {
                display: flex;
                flex-direction: column;
             margin: auto;
          
                
               }

               #wpcf7-f272-o1 {
               
                width: 677px;
              padding-left: 0px;
              margin: auto;
              
              
               }

               .getin {
                text-align: center;
               }


        
                
            

            .descriptions {
               text-align: center;
        
            }

            .subdesc {
              display: flex;
              justify-content: center;
            }


            .mapcent {
                display: flex;
                justify-content: center;
                
            }

            .map-container {
                width: 600px;
            }

            
            }


            @media (max-width: 1110px) {
                .contactmain {
                 display: flex;
                 flex-direction: column;
              margin: auto;
           
                 
                }
 
                #wpcf7-f272-o1 {
                
                 width: 377px;
               padding-left: 0px;
               margin: auto;
               
               
                }
 
                .getin {
                 text-align: center;
                }
 
 
                
                 
             
 
             .descriptions {
                text-align: center;
         
             }
 
             .subdesc {
               display: flex;
               justify-content: center;
             }
 
 
             .mapcent {
                 display: flex;
                 justify-content: center;
                 
             }
 
             .map-container {
                 width: 350px;
             }

             
             #mapbottom {
                width: 300px;
                margin: auto;
             }
 
            
            } 
 


            @media (max-width: 1100px) {
                .blocks {
                 justify-content: center;
                }
                .box {
                 width: 400px;
                }
                .block {
                 width: 400px;
                }
                .ourjour {
                    max-width: 470px;
                }
                .innovation {
                    max-width: 470px;
                }

                

               
                }

                @media (max-width: 1000px) {
                    .blocks {
                     justify-content: center;
                    }
                    .box {
                     width: 350px;
                    }
                    .block {
                     width: 350px;
                    }
                    .ourjour {
                        max-width: 400px;
                    }
                    .innovation {
                        max-width: 400px;
                    }

                    .aboutus {
                        padding-left: 20px;
                        padding-right: 20px;
                       
                    }
                    
                    }

                    @media (max-width: 910px) {
                        .blocks {
                         justify-content: center;
                        }
                        .box {
                         width: 270px;
                        }
                        .block {
                         width:270px;
                        }
                        .ourjour {
                            max-width: 300px;
                        }
                        .innovation {
                            max-width: 300px;
                        }

                         .journey {
                                justify-content: center;
                            }

                            
                        }

                        @media (max-width: 740px) {
                            .blocks {
                             justify-content: center;
                            }
                            .box {
                             width: 200px;
                            }
                            .block {
                             width:200px;
                            }
                            .ourjour {
                                max-width: 432px;
                            }
                            .innovation {
                                max-width: 366px;
                            }
                            .journey {
                                align-items: center;
                                flex-direction: column;
                                justify-content: center;
                            }

                            .column {

                                width: 230px;
                            }
                            
                            .onebox {
                                margin-top: 32px;
                                    display: flex;
                                    justify-content: center;
                                    flex-wrap: wrap;
                                    gap: 32px;
                                    
                                }
                            

                                #wpcf7-f272-o1 {
                
                                    width: 327px;
                                  padding-left: 0px;
                                  margin: auto;
                                  
                                  
                                   }
                            }

                            
                            @media (max-width: 630px) {
                                .blocks {
                                 justify-content: center;
                                }
                                .box {
                                 width: 420px;
                                }
                                .block {
                                 width:420px;
                                }
                                .ourjour {
                                    max-width: 420px;
                                }
                                .innovation {
                                    max-width: 420px;
                                }
                                .journey {
                                    flex-direction: column;
                                    justify-content: center;
                                }
    
                                .misvisbox {
                                    flex-direction: column;
                                }

                                .case {
                               
                                    color: #31c48d;
                                    text-decoration: none;
                                }
                                
                                .about {
                                    color: #31c48d;
                                    text-decoration: none;
                                    
                                }

                                #menu-menu-1 {
                                    display: flex;
                                    justify-content: space-between;
                                width: 195px;
                                }

                                .menu li {
                                    display: inline-block; 
                                    margin-right: 5px; 
                                }

                                .aboutus {

                                    display: flex;
                                }

                                .test {
                                    width: 200px;
                                }


                                .namediv {
                                    width: 200px;
                                }

                                .columnes {
                                    width: 200px;
                                }

                                .contactmain {
                                    display: flex;
                                    flex-direction: column;
                                    justify-content: center;
                                }

                                .gettouch {
                                    max-width: 470px;
                                   
                                }

                                
                                }
                      

                                       @media (max-width: 600px) {

                                    #titleacce {
                                      width: 500px;
                                    }
                                    .blocks {
                                     justify-content: center;
                                    }
                                    .box {
                                     width: 420px;
                                    }
                                    .block {
                                     width:420px;
                                    }
                                    .ourjour {
                                        max-width: 420px;
                                    }
                                    .innovation {
                                        max-width: 420px;
                                    }
                                    .journey {
                                        flex-direction: column;
                                        justify-content: center;
                                    }
        
                                    .misvisbox {
                                        flex-direction: column;
                                    }
    
                                    .case {
                                   
                                        color: #31c48d;
                                        text-decoration: none;
                                    }
                                    
                                    .about {
                                        color: #31c48d;
                                        text-decoration: none;
                                        
                                    }

                                    #menu-menu-1 {
                                        display: flex;
                                        justify-content: space-between;
                                    width: 195px;
                                    }

                                    .menu li {
                                        display: inline-block; 
                                        margin-right: 5px; 
                                    }

                                    #secondbut {
                                        width: 220px !important;
                                         display: flex;
                                         justify-content: center;
                                         margin: auto;
                                         text-align: center;
                                       }

                                       #whitetext {
                                        text-align: center;
                                       }

                                       .gettouch {
                                        max-width: 440px;
                                       
                                    }
                                    }


                                    @media (max-width: 500px) {
                                        .blocks {
                                         justify-content: center;
                                        }
                                        .box {
                                         width: 310px;
                                        }
                                        .block {
                                         width:310px;
                                        }
                                        .ourjour {
                                            max-width: 420px;
                                        }
                                        .innovation {
                                            max-width: 420px;
                                        }
                                        .journey {
                                            flex-direction: column;
                                            justify-content: center;
                                        }
            
                                        .misvisbox {
                                            flex-direction: column;
                                        }
        

                                        .name {
                                            font-size: 16px;
                                            color: #31c48d;
                                            font-weight: 700;

                                        }

                                        .menu {
                                            font-size: 16px;
                                            display: flex;
                                            flex-direction: column;
                                        }

                                        #menu-menu-1 {
                                            font-size: 16px;
                                            display: flex;
                                            flex-direction: column;
                                        align-items: center;
                                        }
                                        #menu-menu-1 .menu-item-42 { 
                                           padding-bottom: 7px;
                                        
                                        }

                                        #menu-menu-1 .menu-item-43 { 
                                            padding-bottom: 7px;
                                         
                                         }
                                        .button {
                                          
                                            color: black;
                                            text-decoration: none;
                                            background-color: #31c48d;
                                            padding: 4px 8px 4px 8px;
                                            border-radius: 9999px;
                                            font-weight: 700;
                                            text-align: center;
                                            
                                           
                                            
                                        }

                                        .menuToggle {
                                            margin-right: 0px;
                                        }

                                        .buttoncontainer {
                                            display: flex;
                                            flex-wrap: wrap-reverse;
                                        }
                                        #menu-menu-1 {
                                            display: flex;
                                            justify-content: space-between;
                                        width: 145px;
                                        }

                                        #titleacce {

                                            max-width: 355px;
                                            font-size: 48px;
                                        }
                                        .gettouch {
                                            max-width: 380px;
                                           
                                        }

                                        }

                                        @media (max-width: 450px) {
                                            #wpcf7-f272-o1 {
                
                                                width: 297px;
                                              padding-left: 0px;
                                              margin: auto;
                                              
                                              
                                               }
                                            
                                            
                                            .gettouch {
                                                max-width: 330px;
                                               
                                            }
    
                                        }
                                        @media (max-width: 400px) {
                                            .gettouch {
                                                max-width: 290px;
                                               
                                            }
    
                                        }

                                        @media (max-width: 350px) {
                                            .gettouch {
                                                max-width: 250px;
                                               
                                            }
    
                                        }



                                        @media (max-width: 450px) {
                                            .button {
                                                max-width: 200px;
                                            }
    
                                        }

                                        @media (max-width: 400px) {
                                            .blocks {
                                             justify-content: center;
                                            }
                                            .box {
                                             width: 270px;
                                            }
                                            .block {
                                             width:270px;
                                            }
                                            .ourjour {
                                                max-width: 420px;
                                            }
                                            .innovation {
                                                max-width: 420px;
                                            }
                                            .journey {
                                                flex-direction: column;
                                                justify-content: center;
                                            }
                
                                            .misvisbox {
                                                flex-direction: column;
                                            }
            
                                            .case {
    
                                                padding-top: 8px;
                                                margin-left: 0px;
                                                color: #31c48d;
                                                text-decoration: none;
                                            }
                                            
                                            .about {
                                                padding-top: 8px;
                                                color: #31c48d;
                                                text-decoration: none;
                                                margin-left: 4px;
                             
                                            }
    
                                            .name {
                                                font-size: 16px;
                                                color: #31c48d;
                                                font-weight: 700;
    
                                            }
                                            #menu-menu-1 {
                                                display: flex;
                                                justify-content: space-between;
                                            width: 125px;
                                            }
                                            .menu {
                                                font-size: 16px;
                                                display: flex;
                                                flex-direction: column;
                                            }
                                           
                                            .button {
                                                color: black;
                                                text-decoration: none;
                                                background-color: #31c48d;
                                                padding: 4px 8px 4px 8px;
                                                border-radius: 9999px;
                                                font-weight: 700;
                                                max-width: 150px;
                                            }

                                           
                                            }

                                            @media (max-width: 435px) {

                                                .button {
                                                    max-width: 165px;
                                                }
                                            }

                                            @media (max-width: 400px) {

                                                .button {
                                                    max-width: 125px;
                                                }
                                            }


                                          @media (max-width: 900px) {

                                         .mobile-menu {
                                            display: inline-block;
                                            margin-left: 10px;

                                         }

                                                .header-menu {
                                              
                                                    transform: translateX(100%);
                                                    position: fixed;
                                                    right: 0px;
                                                    background-color: #014737;
                                                    z-index: 2;
                                                    height: 100vh;
                                                    top:0px;
                                                    min-width: 250px;
                                                    border-left: 1px solid #31c48d;
                                                    padding: 20px 15px;
                                                    transition: all 0.5s ease;
                                                }
                                            .header-menu .menu ul{
                                                gap: 10px;
                                                display: flex;
                                                flex-direction: column;
                                             }

                                             .show {
                                                transform: translateX(0%);
                                             }


                                             .secondary_menu {
                                              
                                                transform: translateX(100%);
                                                position: fixed;
                                                right: 0px;
                                                background-color: #014737;
                                                z-index: 2;
                                                height: 100vh;
                                                top:0px;
                                                min-width: 250px;
                                                border-left: 1px solid #31c48d;
                                                padding: 20px 15px;
                                                transition: all 0.5s ease;
                                            }
                                        .secondary_menu .menu ul{
                                            gap: 10px;
                                            display: flex;
                                            flex-direction: column;
                                         }

                                         .show {
                                            transform: translateX(0%);
                                         }


                                             .closemenu {
                                                display: inline-block;
                                                position: absolute;
                                                right: 15px;
                                                top: 15px;
                                             }

                                          
                                            }
                                            
                                            
    section.page-hero {
        text-align: center;
        color: white;
        padding-top: 80px;
        padding-bottom: 80px;
        border-bottom: 1px solid #31c48d;
    }
    
    section.page-hero .title {
        color: white;
        font-family: sans-serif;
        font-size: 64px;
        font-weight: 700;
        margin-bottom: 16px;
    }
    
    section.page-hero .container {
            flex-direction: column;
    }
    
    section.page-hero .description {
        color: #84e1bc;
        font-family: sans-serif;
        font-size: 20px;
    }


section.two-row-blocks {
 padding-top: 64px;
 padding-bottom: 64px;
    
}


section.two-row-blocks .container {
    flex-wrap: wrap;
    gap: 40px;
    
}


section.two-row-blocks .container .block {
       width: calc(50% - 84px);
    max-width: unset;
}

@media (max-width: 800px) {
section.two-row-blocks .container .block {
       width: 100%;
}
}

section.two-row-blocks .container .title {
 text-align: left;
 color: white;
     font-size: 1.5rem;
    font-weight: 700;
}


section.two-row-blocks .container .subtitle {
     color: white;
     margin-bottom: 8px;
         font-size: 1.25rem;
    font-weight: 600;
}

section.two-row-blocks .container .subdescription {
     color: white;
}

section.two-row-blocks .subdescription + .subtitle {
    margin-top: 20px;
}