/*======================================================
Screen Style Sheet
PROJECT
------------------------------------------------------
Author(s): NAME
Created: DATE
======================================================*/

/* Small Desktop */
@media(max-width: 1400px){
	#home-banner .social-media{
		display: none;
	}
	.buckets.three-columns.buckets-large.has-gallery .slick-prev {
        left: 10px;
    }

    .buckets.three-columns.buckets-large.has-gallery .slick-next {
        right: 10px;
    }

    .buckets .slick-slide {
        text-align: center;
    }

    .buckets .slick-slide div {
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
}

/* Tablet */
@media only screen and (max-width: 1199px) {
	body.logged-in #header{
		top: 32px;
	}
	body.logged-in #header.scrolling{
		top: 32px;
	}
	#wpadminbar{
		position: fixed;
	}
    /* Paragraph */
    body{
        padding-top: 80px;
    }
    a:hover,
    a:active{
        text-decoration: none;
    }
    /* Scaffolding */
	.t100{
		width: 100%;
	}
	.t100.wp-block-columns{
		flex-wrap: wrap !important;
	}
	.t100 .wp-block-column{
		width: 100% !important;
		flex-basis: 100%!important;
	}
	.t100 .wp-block-buttons.is-content-justification-right{
		justify-content: flex-start;
	}
	.t100 .wp-block-buttons.is-content-justification-center{
		justify-content: flex-start;
	}
	.t100 .wp-block-image.size-full img{
		max-height: 400px;
		width: auto;
	}
	.swap-tablet{
		flex-direction: column-reverse;
	}
	.no-gap{
		gap: 0 !important;
	}
	section > div > .wp-block-columns > .wp-block-column.has-background:first-child{
		padding-left: 20px;
		padding-right: 0;
	}
	section > div > .wp-block-columns > .wp-block-column.has-background:last-child{
		padding-right: 20px;
	}
	section > div > .wp-block-columns.t100 > .wp-block-column.has-background:first-child{
		padding-right: 20px;
	}
	section>div>.wp-block-columns.t100>.wp-block-column.has-background:last-child{
		padding-left: 20px;
	}

	/* Universal */
	.tel{
	    pointer-events: all;
	}
	.fancybox-stage{
		width: 80%;
		margin: 0 auto;
	}
	.fancybox-arrow{
		width: 40px;
	}
	
	.gallery-block {
		padding-left: 20px;
		padding-right: 20px;
	}
    /* Header */
	#header{
		padding-top: 0px;
		padding-bottom: 0px;
		height: 100px;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 100;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	}

	#header .logo img {
		height: 60px; /* Adjust as needed */
	}

	#header-bottom nav > div{
		display: none !important;
	}
	#header-bottom .search-trigger{
		padding-left: 0;
		line-height: 41px;
		width: 40px;
		moz-transition: none;
		-o-transition: none;
		-webkit-transition: none;
		transition: none;
	}
	#header-bottom .search-trigger.active{
		font-size: 20px;
		position: relative;
		top: 1px;
	}
	#header-bottom .search-trigger,
	#header-bottom .menu-trigger{
		font-size: 28px;
		font-weight: bold;
		width: 40px;
		margin:0 20px;
		padding:0;
		moz-transition: none;
		-o-transition: none;
		-webkit-transition: none;
		transition: none;
	}
	#header-bottom .menu-trigger.active i:before{
		content:'\f00d';
	}
	
	#header-bottom .contact,.search-container{
		display: none;
	}
	#header-top, #header-bottom{
		justify-content: flex-end;
		display: flex;
	}
	
	#search-dropdown{
		right: 0;
	}
	#search-dropdown.active{
		top: 100px;
	}
	.logged-in #search-dropdown.active{
		top: 152px;
	}
    
    
	.uagb-container-inner-blocks-wrap {
		padding-left: 20px;
		padding-right: 20px;
	}
	
    /* Banners */
    #home-banner,
    #home-banner .slide,
    #home-banner .constrain{
    	height: 450px;
    }
   
    /* Buckets */
	.buckets-large {
		justify-content: center !important;
	}
	/* Stats */
	.stats.five-columns .item,
	.stats.four-columns .item{
		width: 33.33%;
	}
	
	/* Quick Contact */
	#quick-contact{
		flex-wrap: wrap;
		padding-bottom: 0;
	}
	#quick-contact:after{
		display: none;
	}
	#quick-contact .column{
		width: 100% !important;
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
	#quick-contact .column:first-child{
		padding-bottom: 40px;
	}
	#quick-contact .column:last-child{
		padding-top: 40px;
	}
	#quick-contact h2{
		max-width: 100%;
	}
	
	/* Team */
	#team{
		margin-left: 0;
		margin-right: 0;
	}
	#team .item{
		width: 33.33%;
		max-width: 300px;
		margin-left: auto;
		margin-right: auto;
	}
	
	.boxslider-wrapper button.slick-arrow{
		top: 124%;
	}
	.boxslider-wrapper .buckets-intro .carousel .slick-next{
		right: auto;
		left:-118px;
		z-index: 100;
	}
	
	.boxslider-wrapper .buckets-intro .carousel .slick-prev{
		left: -201px;
		z-index: 100;
	}
	/* Footer */
	#footer .constrain{
		flex-wrap: wrap;
	}

}

@media only screen and (max-width: 1280px) {
	/* Mobile view - Stack leftboxslider and rightboxslider vertically */
    .boxslider-wrapper {
        flex-direction: column; /* Stack the items vertically */
        align-items: center; /* Center content */
    }

    .boxslider-wrapper .leftboxslider {
        width: 100%; /* Make the left box take full width */
        max-width: none; /* Remove max-width restriction */
        padding: 20px;
    }
	
	.news-grid {
		justify-content: center;
	}
	
	.news-item {
		max-width: 46%;
	}
	

    .boxslider-wrapper .rightboxslider {
        position: relative; /* Remove the absolute positioning */
        width: 100%; /* Make the right box take full width */
        left: 0; /* Align it to the left */
        top: auto; /* Reset top positioning */
        bottom: auto; /* Reset bottom positioning */
    }
	.boxslider-wrapper .rightboxslider .slick-list.draggable{
		padding-left: unset;
		padding-right: unset;
	}
	/* Left Gradient */
    .boxslider-wrapper .rightboxslider::before {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 136px;
	  height: 100%;
	  background: linear-gradient(90deg, #1C1C1C 0%, rgba(32, 32, 32, 0) 100%);
	  pointer-events: none;
	  z-index: 1;
	}
	
	/* Right Gradient */
    .boxslider-wrapper .rightboxslider::after {
	  content: "";
	  position: absolute;
	  top: 0;
	  right: 0;
	  width: 136px;
	  height: 100%;
	  background: linear-gradient(90deg, rgba(32, 32, 32, 0) 0%, #1C1C1C 100%);
	  pointer-events: none;
	  z-index: 1;
	}
	.boxslider-wrapper .slick-dots{
		position: relative;
	}
	
	.boxslider-wrapper button.slick-arrow{
		top: 10%;
	}
	.boxslider-wrapper .buckets-intro .carousel .slick-next{
		right: 42%;
		left:auto;
		z-index: 100;
	}
	
	.boxslider-wrapper .buckets-intro .carousel .slick-prev{
		left:42%;
		z-index: 100;
	}
	.boxslider-wrapper .slick-list.draggable{
		margin-top: 80px;
	}
	
	.boxslider-wrapper button.slick-arrow{
	}
	.boxslider-wrapper .buckets-intro .carousel .slick-next{
		top: 50%;
		right: auto;
		left:90%;
		z-index: 100;
	}
	
	.boxslider-wrapper .buckets-intro .carousel .slick-prev{
		top: calc(50% + 25px);
		left: 5%;
		z-index: 100;
	}
}
@media (max-width: 1024px) and (min-width: 977px) {
	body .uagb-container-inner-blocks-wrap .uag-hide-tab {
		display: block !important;
	}
}
@media(max-width: 991px){
	.main-banner{
		height: 500px;
		min-height: 350px !important;
	}
	/* Tabbed Content */
	.wp-block-ub-tabbed-content-tab-holder.vertical-tab-width{
		width: 100%;
	}
	.wp-block-ub-tabbed-content-tabs-title-tablet-horizontal-tab{
		flex-direction: column;
	}
	.wp-block-ub-tabbed-content-tab-title-vertical-wrap{
		border: 1px solid #B0B3B1;
		border-top: 0;
	}
	.wp-block-ub-tabbed-content-tab-title-vertical-wrap:first-child{
		border-top: 1px solid #B0B3B1;
	}
	.wp-block-ub-tabbed-content-tabs-content.vertical-content-width:after{
		display: none;
	}
	.wp-block-ub-tabbed-content-tabs-content.vertical-content-width{
		padding: 30px;
	}
	#header-top{
		display: none;
	}
	#header .constrain{
		padding-left: 16px;
		padding-right: 16px;
	}
	#header .logo{
		padding: 20px 0;
	}
	.mobile-header {
		display: flex;
		align-items: center;
		padding-left: 16px;
		padding-right: 16px;
	}
	.mobile-header > a {
		width: 50%;
	}
	.mobile-header .wp-block-button{
		width: 50%;
		display: flex;
		justify-content: flex-end;
	}
	.mobile-header .wp-block-button .wp-block-button__link{
		font-size: 14px;
	}
	
	.red-background-boxed.wp-block-uagb-container{
		padding: 50px 20px !important;
	}
}

@media only screen and (max-width : 768px) {
    .buckets.three-columns.buckets-large.has-gallery .slick-prev {
        left: -35px;
    }

    .buckets.three-columns.buckets-large.has-gallery .slick-next {
        right: -40px;
    }
	.main-banner{
		height: auto;
		min-height: unset !important;
	}
	.main-banner-button{
		position: absolute;
		top: 180%;
	}
	.scroll-line{
		display: none;
	}
	#request-a-quote .constrain.quick-form {
        display: flex;
        flex-direction: column;
    }
	#request-a-quote .left-box .fieldset{
		padding-right: 0;
	}
	#request-a-quote .right-box{
		display: none;
	}
	#quick-contact{
		padding-top: 0;
	}
	#quick-contact .wpcf7-form{
		padding: 0;
	}
	#request-a-quote .wpcf7-form{
		padding-left: 20px;
		padding-right: 20px;
	}
	#quick-contact .quick-contact-left, #quick-contact .quick-contact-right{
		display: block;
		width: 100%;
	}
	.wpcf7-form .fieldset {
		flex-direction: column;
		flex-wrap: nowrap;
	}

	.w25,.w30,.w33,.w40,.w50,.w60,.w66,.w70,.w75 {
		width: 100%;
	}
	.width-75, .width-25 {
        flex: 0 0 100%; /* Stack elements by setting width to 100% */
        text-align: center; /* Optional: center align content on mobile */
    }
	.three-columns .bucket,.four-columns .bucket,.five-columns .bucket {
		width: 50%;
	}
	.woocommerce-page table.cart .product-thumbnail {
        display: inline-block;
    }
}
/* Phone (portrait and landscape) */
@media only screen and (max-width : 767px) {
	body.logged-in #header{
		top: 46px;
	}
	body.logged-in #header.scrolling{
		top: 46px;
	}
	
	
	.news-item {
		max-width: 100%;
	}
	.two-columns .bucket,.three-columns .bucket,.four-columns .bucket,.five-columns .bucket {
		width: 100%;
	}
	
	#header .rfq-button{
		display: none;
	}
	#header-top a.tel{
		display: none;
	}
	
    /* Scaffolding */
	.swap-mobile{
		flex-direction: column-reverse;
	}
	section > div > .wp-block-columns > .wp-block-column.has-background:last-child{
		margin-top: -30px;
		padding-left: 12px;
	}
	.wp-block-buttons.is-content-justification-right{
		justify-content: flex-start;
	}
	
	
	/* Universal */
    .forms .input-group{
        width: 100%;
    }
	.table-responsive table{
        min-width: 767px;
    }
    .table-responsive:before{
        content: "Swipe to scroll »";
        font-size: 13px;
        font-weight: bold;
        color: #fff;
        margin-bottom: 5px;
        display: block;
        float: left;
    }
	.is-vertically-aligned-center .is-content-justification-center.wp-block-buttons .wp-block-button{
		margin-right: auto;
	}
	/* Banners */
	#home-banner{
		height: auto;
	}

	/* Buckets */
	.bucket{
	    width: 100%;
	}
	
    /* Tabbed Content */
	.wp-block-ub-tabbed-content-tabs-title-mobile-horizontal-tab{
		flex-direction: column;
	}
	.wp-block-ub-tabbed-content-tab-title-wrap{
		border-bottom: 0;
	}
	.wp-block-ub-tabbed-content-tab-title-wrap:last-child{
		border-bottom: 1px solid #929595;
	}
		
	/* Icon List */
	.icon-list.two-columns ul,
	.icon-list.three-columns ul,
	.icon-list.four-columns ul{
		-moz-column-count: 1;
		-webkit-column-count: 1;
		column-count: 1;
	}
	.icon-list + .wp-block-buttons{
		margin-top: 25px;
	}
	.icon-list + .link-wrapper{
		margin-top: 0;
	}
	/* Team */
	#team .item{
		width: 100%;
	}
	
	/* Stats */
	.stats.five-columns .item,
	.stats.four-columns .item,
	.stats.three-columns .item{
		width: 50%;
	}
	.stats .number{
		font-size: 40px;
    	line-height: 40px;
	}
	.stats p{
		font-weight: 400;
		font-size: 16px;
		line-height: 22px;
		letter-spacing: 0.02em;
	}
	
	/* Footer */
	#footer .column{
		width: 100%;
	}
	
	.boxslider-wrapper .buckets-intro .carousel .slick-next{
		top: 50%;
		right: auto;
		left:80%;
		z-index: 100;
	}
	
	.boxslider-wrapper .buckets-intro .carousel .slick-prev{
		top: calc(50% + 25px);
		left: 10%;
		z-index: 100;
	}
	.careers-bucket-wrapper .wp-block-uagb-container{
		height: unset !important;
	}
}

@media only screen and (max-width: 640px) {
	.gform_wrapper .attachment-wrapper,
	.gform_wrapper .gfield--type-submit.gfield--width-half{
		grid-column: span 12 !important;
	}
	#header .rfq-button{
		display: none;
	}
	#header-top a.tel{
		display: none;
	}
	.logged-in #search-dropdown.active,
	body.logged-in #mobile-menu
	{
		top: 147px;
	}
	
	.footer-copyright .separator:first-child {
		display: none
	}
	.main-banner h1{
		font-size: 28px;
	}
	.page-banner {
		padding-top: 80px;
	}
	.red-background-boxed.wp-block-uagb-container{
		background-size: cover;
	}
}
/* Phone (portrait) */
@media only screen and (max-width : 480px) {
	.mobile-only{
		display: block !important;
	}
	.hidden-mobile{
		display: none !important;
	}
	
	.buckets.five-columns.buckets-small.has-gallery .slick-track {
		gap: 64px;
	}
	.buckets.four-columns.buckets-intro.has-gallery .slick-track{
		gap: 88px;
	}
}