/*================================================================================
	Item Name: Materialize - Material Design Admin Template
	Version: 3.1
	Author: GeeksLabs
	Author URL: http://www.themeforest.net/user/geekslabs
================================================================================

NOTE:
------
PLACE HERE YOUR OWN CSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */


/*----------------------------------------
    Pricing Plan  Page
------------------------------------------*/
.plans-container .collection {
  border: none;
}

.plans-container .collection .collection-item {
  border-bottom: none;
  text-align: left;
  font-size: 1.07rem;
  line-height: 1.6em;
}

.plans-container .collection .collection-item:before {
  font-size: 1.28rem;
  line-height: 1.6em;
  color: #009315;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  content: "\e623";
  margin-right: 10px;
}

.plans-container .card .card-image {
  position: relative;
  width: 100%;
}

.plans-container .card .card-image .card-title-product {
  position: relative;
  font-size: 1.25rem;
	font-weight: 400;
  line-height: 1.6em;
  text-align: center;
  width: 100%;
  padding: 10px 15px;
  text-transform: uppercase;
  background: rgba(255, 255, 255, 0.5);
}

.plans-container .card .card-image .price {
  position: relative;
  font-size: 3rem;
  line-height: 1.6em;
  color: #fff;
  font-weight: 300;
  text-align: center;
}

.plans-container .card .card-image .price sup {
  font-weight: 100;
  font-size: 1.42rem;
  line-height: 1.6em;
  top: -35px;
}

.plans-container .card .card-image .price sub {
  font-weight: 100;
  font-size: 1.42rem;
  line-height: 1.6em;
  top: 0;
}

.plans-container .card .card-image .fiveitemprice {
  position: relative;
  font-size: 2rem;
  line-height: 2em;
  color: #fff;
  font-weight: 300;
  text-align: center;
}

.plans-container .card .card-image .price-desc {
  text-align: center;
  color: #fff;
  padding-bottom: 10px;
}

.plans-container .card .card-content {
  padding: 0;
}


.card .card-title-product {
  font-size: 15px;
  font-weight: 300;
}
.msgBubble {
    border-radius: 10px;
    background-color: #e40000!important;
    width: 295px;
    height: 94px;
    line-height: 22px;
    text-align: left;
    padding: 16px;
    color: #fff;
    font-size: 18px;
    font-style: italic;
    float: right;
}

/*
.card.sticky-action .card-action {
  z-index: 2;
}

.card.sticky-action .card-reveal {
  z-index: 1;
  padding-bottom: 20px;
}

ul.circle {
    list-style-type: circle;
}

ul.square {
    list-style-type: square;
}

ul.bullet {
    list-style-type: bullet;
}
*/
/*From Front Page Inline Styling*/
body{
		margin: 0px;
		padding: 0px;
		font-family:"Lucida Grande",Arial,sans-serif;
		box-sizing: border-box;
	}
	#container{
		max-width: 1140px;
		margin: 0 auto;
		background: #fff;
	}
	/* interpack banner start*/
	.banner-full {
		background-color: #003470;
		display: flex;
		justify-content: center;
		border-radius: 5px;
	}
	#interpack-long{
		max-width:100%;
	}
	#interpack-short{
		display: none;
		max-width:100%;
	}
	@media screen and (max-width:700px) {
		#interpack-long{
			display: none;
		}
			#interpack-short{
			display: unset;
		}
	}
	/* interpack banner end*/
	.flexible-packaging{
		border: 2px solid #8E8E8E;
	}
	.main-categories-row{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-evenly;
		margin: 2rem 0rem;
	}
	.category-card{
		width: 31%;
		height: 220px;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
		color: white;
		font-weight: 900;
		letter-spacing: .1rem;
		border-radius: 5px;
		position: relative;
	}
	.category-card:hover{
		box-shadow: 0px 0px 8px 3px rgb(165, 165, 165);
		transition: .273s ease;
		cursor: pointer;
	}
	.category-title{
		position: absolute;
		display: flex; 
		background-color: rgba(123, 123, 123, 0.75); 
		width: 100%;
		justify-content: center; 
		padding: 1rem 0rem;
	}
	/* We Can Fix Anything Banner Start*/
	.fix-anything-banner-container{
		margin-bottom: 2rem;
	}
	.fix-anything-banner{
		background-color: black;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: auto;
		height: 100px;
		border-radius: 5px;
	}
	.fix-anything-center{
		color: white;
	}
	.fix-anything-header{
		font-size: 32px;
		font-weight: 700;
		padding-bottom: 1rem;
		text-align: center;
	}
	.fix-anything-sub-header{
		display: flex;
		justify-content: space-evenly;
	}
	.sub-header-right a{
		background-color: #D32F2F;
		border-radius: 50px;
		padding: .5rem 2rem;
		font-size: 16px;
		color: white;
	}
	.sub-header-right a:hover{
		background-color: #2d2d2d;
		color: #D32F2F;
		box-shadow: 0px 0px 10px 3px #D32F2F;
		text-decoration: none;
	}
	.sub-header-left{
		font-size: 24px;
	}
	@media screen and (max-width:700px) {
	.overstock- img{
			display: none;
	}
	.overstock-banner{
			width: 100%;
			margin: auto;
			display: flex;
			align-items: center;
			justify-content: center;
	}
		.sub-header-left, .fix-anything-right{
			display: none;
		}
	} /* We Can Fix Anything Banner End*/
	/* Mobile Sizing Start */
	@media screen and (max-width: 428px){
		.fix-anything-header{
			font-size: 30px;
		}
		.useful-links-container a{
			font-size: 22px;
			list-style: none;
		}
		.bottom-search-header{
			padding: 0px 3rem;
			margin-bottom: 1rem;
			font-size: 22px;
		}
	} /* Mobile Sizing End */
	@media (max-width: 768px) {
		.company-customers-banner video{
			margin-top: 6.8rem;
			
		}
	}
	.slider-area h2 {
		text-align: center;
		font-family: impact;
		font-size: 0px;
		font-weight: 100;
		text-transform: uppercase;
		margin: 0px;
		color: #fff;
	}
	.wrapper {
		display: flex;
		width: 100%;
		margin: 2rem 0rem;
		overflow: hidden;
		height: 60px;
		display: flex;
		align-items: center;
	}
	.item {
		/* animation: animate 1s alternate linear infinite; */
		background-color: white;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 0px;
		/* padding: 6rem 3rem; */
	}
	.container:hover .item {
		animation-play-state: paused;
	}
	@keyframes animate {
		0% {
			transform: translate3d(0, 0, 0);
		}
		100% {
			transform: translate3d(-1100px, 0, 0);
		}
	}
	@media (max-width:767px) {
		.slider-area h2 {
			font-size: 30px;
		}
		.wrapper {
			width: 95%;
			border-radius: 0;
			padding: 0;
		}
	}
	.overstock-container{
		background: linear-gradient(rgba(168, 88, 3, 0.812), #d48702,rgba(168, 88, 3, 0.812));
		color: white;
		font-size: 26px;
		height: 100px;
		border-radius: 5px;
		display: flex;
		justify-content: center;
		align-items: center;
		font-weight: 600;
		margin-bottom: 2rem;
	}
	.medica-container{
		background-image: url('/images/medica-background.webp');
		background-position-x: 2rem;
		background-position-y: -107rem;
		color: white;
		font-size: 26px;
		height: 100px;
		border-radius: 5px;
		margin-bottom: 2rem;
		display: flex;
		align-items: center;
		text-align: center;
	}
	.medica-banner{
		font-size: 24;
		font-weight: 600;
		width: 520px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: auto;
	}
	.overstock-container:hover{
	transition: .322s ease;
	background-color: rgba(139, 95, 6, 0.861);
	}
	.card-1, .card-2, .card-3, .card-4, .card-5, .card-6{
		margin-bottom: 2rem;
	}
	.sixpack-row-1{
		display: flex; 
		flex-wrap: wrap; 
		justify-content: space-evenly; 
		align-items: center;
	}
	.sixpack-row-1 a:hover .sup-title{
		transition: .322s ease;
		color: rgb(175, 1, 1);
	}
	.sixpack-row-1 a:hover{
		box-shadow: 0px 0px 8px 3px rgb(165, 165, 165);
	}
	@media screen and (max-width: 1130px){
		.sixpack-row-1{
			max-width: 900px;
			margin: auto;
			justify-content: space-evenly;
		} 
		.sealer-card{
			display: none;
		}
		.main-categories-row{
			width: 100%;
			margin: auto;
			margin-top: 2rem;
			max-width: 900px;	
			justify-content: space-evenly;
		}
		.flexible-card, .sorbent-card, .sealer-card{
			margin-bottom: 2rem;
		}
		.card-1, .card-2, .card-3, .card-4{
			margin-bottom: 2rem;
		}
	}
	.flexible-packaging {
		position: relative;
		display: inline-block;
		overflow: hidden;
		cursor: pointer;
		width: 350px; 
		height: 200px; 
	}
	.flexible-image {
		width: 100%;
		height: 205px;
		background-image: url('https://www.sorbentsystems.com/assets/img/flexible-packaging-group-smml.webp'); 
		background-size: cover;
		background-position-x: 44%;
		transition: transform 0.59s, filter 0.3s;
		filter: brightness(70%); 
	}
	.desiccant-image {
		width: 100%;
		height: 215px;
		background-image: url('/images/sorbents-SSI.webp'); 
		background-size: cover;
		background-position-y: 50%;
		transition: transform 0.59s, filter 0.3s;
		filter: brightness(70%); 
	}
	.sealer-image {
		width: 100%;
		height: 215px;
		background-image: url('/images/sealers-SSI.webp'); 
		background-size: cover;
		background-position-y: 4%;
		transition: transform 0.59s, filter 0.3s;
		filter: brightness(70%); 
	}
	.flexible-packaging:hover .flexible-image, .flexible-packaging:hover .desiccant-image, .flexible-packaging:hover .sealer-image {
		transform: scale(1.05);
		filter: brightness(100%); 
	}
	.category-title {
		font-size: 24px;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		background-color: rgba(128, 128, 128, 0.7);
		color: #fff;
		padding: 5px 10px;
		box-shadow: 0px 0px 10px 5px rgba(218, 218, 218, 0.495);
		font-weight: bold;
	}
	.fade-animation {
	animation: fadeAnimation 0.8s ease-in-out forwards;
	}
	.overstock-banner{
		width: 520px;
		min-height: 100px;
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		text-align: center;
		font-size: 24;
		font-weight: 600;
	}
	@keyframes fadeAnimation {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}
	#carousel-title{
		margin-top: 2rem;
	}
	.sub-banner-text{
		font-size: 24px;
		font-weight: 600;
	}
	@media screen and (max-width: 768px){
		.main-categories-row, .sixpack-row-1{
			max-width: 500px;
		}
		#carousel-title{
			display: none;
			margin-bottom: 2rem;
		}
		.flexible-card{
			margin-top: 4.8rem;
		}
		.hall{ 
			display: none;
		}
		.medica-banner{
			width: 100%;
			justify-content: space-evenly;
			min-width: auto;
		}
		.medica-container{
			background-image: none;
			background-color: #082B51;
		}
		.medica-main{
			font-size: 26px;
		font-weight: 600;
		}
	}
	@media screen and (max-width: 374px){
		.sub-banner-text{
			font-size: 50px;
		}
		.medica-banner{
			justify-content: space-evenly;
		}
	}
	.overstock-banner img{
		width: 100px;
	}
	@media screen and (max-width: 949px){
		.medica-container{background-position-x: -6rem;}
		.medica-banner{
			text-align: center;
		}
	}
	.rollstock-container{
		background-image: url('/images/pts-both.png');
		background-color: #D5484E;
		background-size: contain;
		background-position-x: 35px;
		color: white;
		font-size: 26px;
		height: 100px;
		border-radius: 5px;
		display: flex;
		justify-content: center;
		align-items: center;
		font-weight: 600;
		margin-bottom: 2rem;
		filter: grayscale(80%);
	}
	.overstock-main{
		padding: 0rem 5rem;
		font-size: 32px;
		text-align: center;
		flex-direction: column;
	}
	.overstock-container:hover{
		transition: .322s ease;
		background-color: rgba(139, 95, 6, 0.861);
	}
	.pts-text{
		max-height: 100px;
		padding: 0px 2rem;
		background-color: #D5484E;
		box-shadow: 0px 0px 6px 18px #D5484E;
	}
	.rollstock-container:hover{
		transition: .322s ease;
		filter: grayscale(0%);
		animation: alternate;
		background-color: rgba(203, 14, 14, 0.803)
	}
	.rollstock-banner{
		width: 520px;
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		text-align: center;
		margin: 2rem 0rem;
		max-height: 100px;
		font-size: larger;
	}
	.rollstock-banner img{
		max-height: 100px;
		scale: 85%;
	}
	@media screen and (max-width: 550px){
		.rollstock-banner, .overstock-banner, .fix-anything-banner{
			width: 100%;
		}
		.sub-banner-text{
			font-size: 22px;
		}
		.fix-anything-banner{
			border-radius: 0px;
		}
		.rollstock-banner img, .overstock-banner img{
			display: none;
		}
		.rollstock-banner, .overstock-banner{
			display: flex;
			justify-content: center;
		}
		.rollstock-container, .medica-container, .overstock-container{border-radius: 0px;}
	}
	@media screen and (max-width: 478px){
		.sub-banner-text{
			display: none;
		}
		.rollstock-container{
			background-image: none;
		}
	}
	.teknapore-container:hover{
		transition: .322s ease;
		background-color: rgb(39, 76, 127)
	}
	.teknapore-container{
		background: linear-gradient(rgba(22, 87, 140, 0.687), #196ace, rgba(13, 63, 129, 0.687));
		background-size: cover;
		color: white;
		font-size: 24px;
		height: 100px;
		border-radius: 5px;
		display: flex;
		justify-content: center;
		align-items: center;
		font-weight: 600;
		margin-bottom: 2rem;
	}
	.packout-desktop { display: block; max-width: 1140px; margin: 20px auto; }
	.packout-mobile { display: none; }
	@media screen and ( max-width: 768px ) {
		.packout-desktop { display: none; }
		.packout-mobile { display: block; max-width: 500px; margin: 60px auto -55px; }
		}