﻿@media only screen and (max-width: 1200px) {
	.footPhone {	margin-right:10px;}
	.footEM {	margin-right:10px;}	
	#footTowns {padding:20px 10px!important;}
}
@media only screen and (max-width: 1100px) {
	.homeIntro { margin:0 30px; }
}
@media only screen and (max-width: 1084px) {
	.logo { margin:0 auto; }
	.grid .row.head {
		display: flex;			/* in case some pages swap display */
		flex-wrap: wrap;		/* allow wrapping */
		flex-direction: column;	/* stack top-to-bottom */
		align-items: stretch;
	}

	/* override Ivory’s column widths at matching specificity */
	.grid .row.head > [class^="col-"],
	.grid .row.head > [class*=" col-"] {
		flex: 0 0 100% !important;	/* overrides flex-basis */
		max-width: 100% !important;	/* overrides width cap */
		width: 100% !important;		/* belt + suspenders */
		box-sizing: border-box;		/* include padding in width */

		/* if Ivory uses floats on some breakpoints, neutralize them */
		float: none !important;
		clear: both;
		display: block;			/* safe default for floated grids */
	}
	.mainCo {	margin-top:-20px; margin-bottom:10px;}
	.headerR {padding-left:25px;	padding-right:50px;}

}
@media only screen and (max-width: 825px) {
	.grid .row > .col-6 {
		flex: 0 0 80% !important;	/* take full row */
		max-width: 100% !important;	/* stop at 100% */
		width: 100% !important;		/* belt + suspenders */
		float: none !important;		/* neutralize any floats */
		display: block;				/* clean reset */
		margin:0 auto;
	}
	.headline1 {
		width:100%;
		margin:10px auto;
		text-align:center;
		padding-right:none;		
	}
	.quote {margin-top:25px;}
	.barSloganSM {	margin: 10px auto;}
	.headPic img { max-width:100%;}
	
}	

@media only screen and (max-width: 800px) {
	.headerServ { font-size:1.8em;}
	.headerCo {font-size:1.2em;}
	.headLogo {max-height:175px;}
}

@media only screen and (max-width: 780px) {
	.menu-container { width:95%;}
}
@media only screen and (max-width: 670px) {
	.mainCo {	 font-size:2em;}
	.logo {	 width:200px; height:200px;}
	.grid .row > .col-6 {
		flex: 0 0 90% !important;	/* take full row */
	}
	.ctaBox {padding:25px 10px;}
	.ctaHL {font-size:1.35em;}
	.ctaPH {font-size:1.35em;}	
}



@media only screen and (max-width: 625px) {
	.footServ {	flex: 0 0 100%;}
	.lineRight { border-right:none; text-align:center;}
	.lineRight footServ { /*width:100%;*/ }	
	.footServT, .footSHeadT {	text-align:center;}
	.footServing {	margin-top: 20px;}
	.footCo{text-align:center;}
	.footAdr{text-align:center;}
	.footPhone{text-align:center;}
	.footEM{text-align:center;}	
	.noMob{	display:none;}	
	.LogoCoBox {	margin:0 auto;display:block}
	.footSocial{margin:0; margin-top:-15px;}
	.footPhone {margin:20px 0 10px 0;}
	.ctaHL {line-height:1em;}
	.quote {width:100%}
	.logo {	 width:150px; height:150px;}	
}


/* ---------- Narrow screens ---------- */
@media (max-width: 750px) {
	.simple-slider { aspect-ratio: auto; height: 200px; }

	.simple-slider .slide {
	  position: absolute;
	  inset: 0;
	  overflow: hidden;
	  opacity: 0;
	  pointer-events: none;
	  transition: opacity 240ms ease;
	  will-change: opacity;
	}
	.simple-slider .slide.is-active {
	  opacity: 1;
	  pointer-events: auto;
	}
	
	/* Image fills & crops */
	.simple-slider .slideIMG {
	  position: absolute; inset: 0;
	  width: 100%; height: 100%;
	  object-fit: cover;
	  display: block;
	  z-index: 0;
	}	
	.simple-slider .slideCap {
	  position: absolute;
	  left: 0; top: 25%;
	  width: 76%;
	  max-width: 920px;
	  background-color: rgba(245, 0, 57, 0.75);
	  color: #fff;
	  padding: 20px 50px 20px 80px;
	  border-top-right-radius: 10px;
	  border-bottom-right-radius: 10px;
	  z-index: 1;
	  box-sizing: border-box;
	}
}

@media (max-width: 500px) {
  .simple-slider .slide { height: 200px; }
  .simple-slider .slideCap {
    padding: 10px 14px;
    margin-left: 8px;
    top: 25%;
    bottom: auto;
    
    width: calc(100% - 16px);
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
  }
}
