#content {
	display: flex;
	flex-direction: column;
	justify-items: center;
}

/* Skeleton styles */
.skeleton-loading {
    position: relative;
    overflow: hidden;
}

.skeleton-loading::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

.skeleton-filter {
    height: 30px;
    margin-bottom: 15px;
    background-color: #f0f0f0;
}

.skeleton-sort {
    width: 150px;
    height: 30px;
    background-color: #f0f0f0;
}

.skeleton-refinement {
    width: 100%;
    height: 30px;
    background-color: #f0f0f0;
}

.skeleton-item {
    display: flex;
    margin-bottom: 20px;
    background-color: #fff;
    box-shadow: 0 3px 8px rgba(0,0,0,0.25);
}

.skeleton-image {
    width: 45%;
    height: 200px;
    background-color: #f0f0f0;
}

.skeleton-content {
    width: 55%;
    padding: 15px;
}

.skeleton-title {
    width: 80%;
    height: 24px;
    margin-bottom: 15px;
    background-color: #f0f0f0;
}

.skeleton-text {
    width: 100%;
    height: 16px;
    margin-bottom: 10px;
    background-color: #f0f0f0;
}

.skeleton-pagination {
    width: 300px;
    height: 30px;
    margin: 20px auto;
    background-color: #f0f0f0;
}

#inventoryresults {
	display:flex;
	flex-direction: column;
}

.inventoryheader h1 {
-webkit-text-stroke-color:white;
-webkit-text-stroke-width:1px;
text-align:center
}

.inventoryheader h1 a,.inventoryheader h1 a:hover {
color:white
}

.inventoryheader h2 a,.inventoryheader h2 a:hover {
color:#bdbdbd
}

.inventorycolumns {
flex-direction:row
}

.inventoryheader h2 {
color:white
}

.inventoryheader p {
color:white;
font-size:1.3em;
line-height:1.3em
}

p.disclaimer {
	font-size: .8em;
	color: #939799;
}

.inventoryheader {
align-items:center;
background-blend-mode:overlay;
background-position:center center;
background-repeat:no-repeat;
background-size:cover;
border-bottom:8px solid #bd2227;
display:flex;
flex-direction:column;
justify-content:center;
padding:1em;
text-align:center
}

.inventorybreadcrumb {
margin:.5em
}

.cards {
display:flex;
flex-wrap:wrap;
justify-content:space-between;
list-style:none;
margin:0 0 15px
}

.cards ol,ul {
margin:0
}

.card-wrapper {
display:flex;
flex:1;
justify-content:center;
margin:0;
position:relative
}

.card-wrapper input {
height:1px;
opacity:.01;
position:absolute;
width:1px
}

.card-wrapper label {
align-items:center;
background:#f8f8f8;
box-sizing:border-box;
color:#505a6c;
cursor:pointer;
display:flex;
flex:1;
height:50px;
justify-content:center;
margin:5px;
padding:6px;
position:relative;
transition:all 120ms ease-out;
width:80px
}

.card-wrapper label span {
display:block;
font-size:.8em;
font-weight:500;
text-align:center;
text-transform:uppercase
}

.card-wrapper label:after {
background:#BD2227;
bottom:0;
content:"";
display:block;
height:0;
left:0;
position:absolute;
right:0;
transition:height 120ms ease-out
}

.card-wrapper input:checked + label {
background:#4A4F86;
color:#fff;
transition:all .5s ease-in-out
}

.card-wrapper input:checked:focus + label {
background:#292D6B;
transition:all .5s ease-in-out
}

.card-wrapper input:checked + label:after {
height:5px
}

.inventorytitle {
background-color:#ededed;
color:#292D6B;
margin:0;
padding:10px 15px;
text-align:center;
text-transform:uppercase
}

.inventorytitle a {
color:#292D6B;
font-weight: 900;
text-decoration: none;
text-transform: uppercase;
}

.inventorytitle h3 {
font-size:1.4em;
margin-bottom:0
}

.inventorycard {
background-color:white;
box-shadow:rgba(0,0,0,0.25) 0 3px 8px;
display:flex;
flex-direction:column;
margin:0 0 50px;
padding:0;
position:relative
}

.yourprice {
align-self:center;
color:#fff;
display:flex;
flex-direction:column;
text-align:right
}

.yourprice label {
align-self:center;
color:#eee;
font-size:1em;
font-weight:500;
line-height:1em;
margin-right:8px
}

.yourprice span {
font-size:2.2em;
font-weight:800;
line-height:1em
}

.photosection {
align-content:center;
background:#EDEDED;
box-shadow:rgba(0,0,0,0.45) 15px 0 10px -10px;
z-index:1
}

.photosection img {
align-self:center;
height:100%;
object-fit:cover;
width:100%
}

.detailsection {
display:flex;
flex-direction:column;
height:365px;
min-width:400px;
overflow:hidden;
width:100%
}

.nwtnotes {
background-color:#ededed;
background-image:url(https://nationwidetrailers.com/media/2023/06/Features-Icon.png);
background-position-x:15px;
background-position-y:center;
background-repeat:no-repeat;
background-size:45px;
box-shadow:rgba(0,0,0,0.25) 0 3px 3px;
clip-path:polygon(0 0,95% 0,100% 100%,0% 100%);
}

.nwtnotes p:empty {
	display: none;
}

.nwtnotes p {
-webkit-box-orient:vertical;
-webkit-line-clamp:3;
color:#444444;
display: block;
display:-webkit-box;
font-size:1em;
font-weight:600;
line-height:1em;
margin:0;
max-height:3em;
overflow:hidden;
text-align:center;
text-overflow:ellipsis;
text-transform:uppercase;
padding:10px 50px 10px 65px;
}

.stockno {
color:#292D6B;
font-weight:900;
line-height:1em;
text-align:center;
text-decoration:none;
text-transform:uppercase
}
.callnow {
	text-align: center;
	text-wrap: balance;
}
.callnow a {
color:#292D6B;
font-size:1.6em;
font-weight:900;
margin:5px 0;
text-transform:uppercase;
}

.stocklocation {
color:#292D6B;
font-size:.7em;
font-weight:900;
line-height:1em;
text-transform:uppercase;
text-wrap: nowrap;
display: flex;
flex-direction: column;
text-align: center;
}

.stocksection {
align-items:center;
display:flex;
justify-content:space-around;
padding:5px
}

.inventorybuttons {
align-items:center;
display:flex;
flex-basis:55%;
justify-content:space-evenly;
padding:0 10px
}

.inventorybuttons button {
align-items:center;
display:flex;
flex:1 1 0;
flex-direction:row;
font-size:1em;
height:50px;
justify-content:center;
margin:0 5px
}

.inventorybuttons a {
display:flex;
flex:1 1 0
}

.inventorybuttons i {
font-size:1.2em
}

.ribbon-top-left {
left:-8px
}

.ribbon-top-left span {
top:15px
}

.ribbon {
height:60px;
overflow:hidden;
width:100%;
position: absolute;
}

.ribbon span:empty {
	display: none;
  }



.ribbon span {
background:linear-gradient(#fbe211 50%,#FEAE01 90%);
box-shadow:rgba(0,0,0,0.24) 0 3px 8px;
clip-path:polygon(100% 0,96% 49%,100% 100%,0% 100%,0% 0%);
color:#bd2227;
display:block;
font-size:1.2em;
font-weight:900;
line-height:1em;
padding:12px 25px;
position:absolute;
text-align:center;
text-shadow:0 1px 1px rgba(0,0,0,.2);
text-transform:uppercase
}

#learnmore {
margin:2% 4%
}

#searching {
align-content:center;
color:#292D6B;
font-weight:900;
text-align:center;
margin: 25px 0;
}

.img-overlay-container {
height:100%;
}

#filterButton {
display:none;
}

.monthlypayment {
background:#efefef;
color:#292D6B;
display:flex;
flex-direction:column;
font-size:1.5em;
font-weight:600;
height:59px;
justify-content:center;
text-align:center;
text-transform:uppercase;
width:120px
}

.monthlyPaymentAmount {
font-size:1.3em
}

.inventorycontent {
display:flex;
flex-direction:column;
max-width: 1440px;
padding: 0 1.5em;
}

.selectdiv {
padding:1em
}

.ribbon-1 {
background:#08769b;
box-shadow:0 0 0 999px #08769b;
clip-path:inset(0 -100%);
position:fixed
}

.selectdiv:after {
-moz-transform:rotate(90deg);
-ms-transform:rotate(90deg);
-webkit-transform:rotate(90deg);
border-bottom:1px solid #999;
color:#333;
content:'<>';
padding:0 0 2px;
pointer-events:none;
position:absolute;
right:11px;
top:18px;
transform:rotate(90deg)
}

.pricesection {
background-color:#BD2227;
bottom:15px;
box-shadow:inset 0 -5px 0 0 rgba(41,45,107,1);
clip-path:polygon(7% 0,100% 0%,100% 100%,3% 100%);
color:white;
display:flex;
height:65px;
position:absolute;
right:0;
width:100%;
z-index:2
}

.listprice {
background:#292D6B;
bottom:75px;
color:#e1e1e1;
font-size:.95rem;
font-weight:500;
left:11%;
padding: 5px;
position:absolute;
text-align:center;
width:125px;
z-index:5;
}

.listprice span {
line-height:2em
}

.listprice:empty {
    display: none;
}


.unitprice {
display:flex;
flex-basis:38%;
justify-content:space-around;
margin-left:7%
}

.aslowas {
color:#bd2227;
font-size:.5em;
font-weight:800
}

.mo {
font-size:.5em
}

.specsection {
display:flex
}

#refinementWrapper {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    padding: .5em 0;
}

#paginationWrapper {
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    width:  100%;
}
#pagination {
margin-bottom: 1.5rem;
}

#sortWrapper {
    display: flex;
	justify-content: flex-end;
}

#mobileheadline {
	display: none;
}

@media (max-width: 1400px) {
	.nwtnotes {
	display:none
	}
	.monthlypaymentwrapper {
	display:none
	}
	.stocksection {
	flex-direction:column
	}
}
	
@media (max-width: 1024px) {
	#filterButton {
		background-color:#bd2227;
		color: white;
		border: 1px solid white;
		border-radius: 10px;
		font-size:1.4em;
		font-weight: 900;
		padding: 5px 30px;
		display: block;
	}
	.yourprice {
		margin-right: 6%;
}

	#filterButtonWrapper {
		background: #292d6b;
		padding: 8px 0;
		position:fixed;
		border-top: 2px solid #bd2227;
		bottom:0;
		left:0;
		z-index:101;
		box-shadow: rgba(0, 0, 0, 0.45) 0px -5px 10px -5px;
		width: 100%;
		display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-evenly;
	}
	.listprice {
		background: none;
		bottom: 45px;
		left: 5%;
		font-size: 1.1rem;
		display: flex;
		flex-direction: column;
	}

	.listprice span {
		line-height:1em;
	}
	#resultstats, #search-box {
		display: none;
	}
	.toggle {
	padding:8px 0
	}
	
	.toggle-sale {
	padding:8px 0
	}
	h1 {
		text-align: center;
	}
	.img-overlay-container {
	min-height:unset
	}
	
	section#inventory {
	flex-direction:column
	}
	
	.selectdiv {
	padding:0
	}
	
	#learnmore {
		margin:5%
	}
	#mobileheadline {
		display: block;
	}
	#filterWrapper {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(255, 255, 255, 0.95);
		z-index: 100;
		overflow-y: auto;
		display: none;
		transition: opacity 0.3s ease-out;
    	opacity: 0;
		padding-bottom: 60px;
	}
	span.results-content, span.filter-content {
		display: flex;
		align-items: center;
	}
	#filterWrapper.active {
		opacity: 1;
	}
	#filterButton .icon {
		margin-right: 5px;
	}

	.ribbon-top-left:after {
	display:none
	}
	
	.inventorycontent {
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	padding:0;
	width:100%
	}

	#filters {
		margin: auto;
		margin-bottom: 50px;
	}


	#filterButton i {
	font-size:1.4em
	}
	
	#filterButton.clicked + #filterWrapper {
	height:100%
	}
	
	.ribbon span {
	clip-path:polygon(100% 0,96% 49%,100% 100%,0% 100%,0% 0%);
	padding:8px 25px;
	text-shadow:unset;
	width:unset
	}
	
	.ribbon {
	height:35px;
	top: 20px;
	}
	
	.ribbon-top-left span {
	top:unset;
	transform:unset
	}
	
	.inventoryheader {
	min-height:55vh;
	padding:1em
	}
	
	.desktoponly {
	display:none
	}
	
	.unitprice {
	flex-direction:row;
	justify-content:flex-end;
	}
	.callnow {
	font-size:1.2em;
	text-align:center
	}
	
	.photosection {
	height:unset;
	min-width:unset
	}
	

	.detailsection {
	height:unset;
	justify-content:end;
	min-width:unset;
	overflow:visible
	}
	
	.inventorytitle {
	background-color:#edededc2;
	top:0;
	z-index:5
	}
	
	table {
		margin-bottom: 0;
	}

	.ais-Pagination-link{
		padding: 0 .75rem;
	}
	
	#filterWrapper {
		display: none;
	}
	.pricesection {
	bottom:0;
	clip-path:unset;
	flex-direction:column;
	height:unset;
	position:unset
	}
	
	.inventorybuttons button {
	height:40px;
	margin:0
	}
	
	.inventorybuttons {
	padding:0
	}

	.inventorycard {
	align-items:center;
	border-top:7px solid #292d6B;
	height:unset;
	overflow:visible
	}

	.specsection {
	padding:15px
	}

	.skeleton-item {
        flex-direction: column;
    }

    .skeleton-image,
    .skeleton-content {
        width: 100%;
    }

    .skeleton-image {
        height: 150px;
    }
} /* end of mobile */