/*
Theme Name: pacer-chemical-Correct
Theme URI: 
Author: pixelscape
Author URI: 
Description: A custom css theme based on twentytwentyfive for pacer chemical
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: pacer-chemical-correct
Tags: 
*/

/*navigation styling */


.navigation-top{
    gap: 16px;
}

#cta_get_in_touch{
    display: none;
}

li.wp-block-navigation-item.get_in_touch_desktop.wp-block-navigation-link {
    display: none;
}
.container, .container > .wp-block-cover__inner-container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.max-container-sizing, .contact_us{
    max-width: 1200px;
    
}

header{
    position: sticky;
     top: 0;
  z-index: 2;
  background-color: white;
}


/*Animation classes.*/
.animated { 
    opacity: 0; 
    transform: translateX(-50px); 
    transition: 800ms ease; 
    
} 
.fade-anim { 
    transform: translateX(0); 
    opacity: 1; 
    
}

.solutions_content > figure {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.wp-block-column.max-container-sizing.has-border-color.has-global-padding.is-layout-constrained.wp-container-core-column-is-layout-01341c1a.wp-block-column-is-layout-constrained {
    margin: auto;
}

 @media screen and (min-width: 600px){
     #cta_get_in_touch{
    display: block;
}
.overlay_hero{
    width: 50%;
}

#hero_video{
    max-height: 1000px;
    width: 100%;
     justify-content: flex-start;
     height: 85vh;
}

#hero_video > .wp-block-cover__inner-container{
    height: 100%;
    display: flex;
}


#hero_overlay_container{
    margin:0;
    padding: 0;
    width: 60%;
    min-height: 100%;
}

#hero_overlay{   
    background-color:#f2c144c7;
    min-height: 100%;
    clip-path: polygon(0 0, 100% 0, 60% 100%, 0 100%);
    justify-content: center;
    display: flex;
    align-items: center;
}

#overlay_content{
    max-width: 720px;
    padding: 32px;
    align-items: center;
    height: fit-content;
    width: 75%;
}

#hero_overlay > #overlay_content {
    padding-right: 56px;
}
     
.solutionsgrid{
display: grid;
grid-template-columns:auto auto auto auto!important;
   }
.whoweare {
     grid-column: 1 / span 4 !important;
  }
.oursolutions{
 grid-column: 1 / span 4 !important;
  }
  
  .solutions_content > figure {
align-items: flex-start;
}
  
}