@charset "utf-8";
/* Ice Club - Order Ice enquiry pages (consumer info page + retailer/wholesaler/events-hospitality forms) */

/* Intro layout (product photo + copy) */
#orderIce #intro 			{ overflow:hidden; padding-bottom:1.5em; }
#orderIce #intro .img		{ position:absolute; width:40%; height:100%; bottom:0; right:4%;
							  background-repeat:no-repeat; background-position:center bottom; background-size:contain; }
#orderIce #intro .img img	{ display:block; width:80%; margin:0 auto 0 }
#orderIce #intro .txt		{ width:50%; }
#orderIce #intro .txt p		{ line-height:160%; }

/* LOGOs */
#orderIce .logos 			{ flex-wrap:wrap; max-width:1100px; }
#orderIce .logos .img 		{ width:20%; max-width:200px; line-height:0; }

/* diamondCollection (consumer page's Eden Farm order box) */
#diamondCollection 				{ text-align:center; max-width:800px; margin:0 auto; }
#diamondCollection .logo 		{ max-width:200px; margin:0 auto; }
#diamondCollection .logo img 	{ display:block; width:100%; }

/* Product toggle cards (retailer/wholesaler enquiry form) */
#products					{ display:flex; gap:1em; margin:0.5em 0 2em; }
#products .product			{ width:33.3%; padding:3px; }
#products .product a		{ display:block; background:#FFF; border:5px solid #CACAD9; padding:20px 10px; text-align:center; text-decoration:none; }
#products .product a .img	{ width:50%; max-width:150px; margin:0 auto; }
#products .product .img img	{ display:block; width:100%; }
#products .product a p.txt	{ color:#B02828; font-weight:700; margin:0; padding:12px 0; }
#products .product a .tick	{ position:absolute; bottom:-22px; left:50%; margin-left:-20px;
							  display:block; height:40px; width:40px; border-radius:20px;
							  background:#CACAD9; color:#FFF; font-size:25px; padding-top:7px; text-align:center; }

#products .product a:hover			{ border-color:#238C00; }
#products .product a:hover p.txt	{ color:#000; }
#products .product a:hover .tick	{ background:#238C00; }

#products .product a.selected			{ border-color:#2F89B0; }
#products .product a.selected .tick	{ background:#2F89B0; }

#products .product a.selected:hover		{ border-color:#B20000; }
#products .product a.selected:hover .tick	{ background:#B20000; }

/* Quote menu (revealed when the "I want a quote" priority is checked) */
.form-sub-box 					{ border:1px dashed #CCC; background:#FFF; padding:1em 2em; margin:1em 0; }
#quoteMenu1 {}
#quoteMenu2 {}

/* Depot repeater */
#depots { padding:1px 0 0.5em; }
.depot { display:flex; background:#EAF0F7; border:1px solid #96B4CB; border-radius:10px; padding:10px; margin:10px 0; gap:1em; }
.depot-num { padding:8px 10px 0; font-weight:bold; color:#B02828; }
.depot-col input { font-size:1.1em !important; padding:0.4em 0.5em !important; }

/* Strip native <button> chrome from #delDepot so it reads as a plain text link */
.btn-reset { background:none; border:none; padding:0; margin:0; font:inherit; cursor:pointer; text-decoration:underline; }

@media all and (min-width: 1281px) and (max-width: 1400px) {
	#orderIce #intro .img		{ right:3%; }
	#orderIce #intro .txt		{ width:51%; }
}
@media all and (min-width: 1025px) and (max-width: 1280px) {
	#orderIce #intro .img		{ right:2%; }
	#orderIce #intro .txt		{ width:52%; }
}
@media all and (min-width: 1025px) and (max-width: 1140px) {
	#orderIce #intro .img		{ right:1%; }
	#orderIce #intro .txt		{ width:53%; }
}
@media all and (max-width: 1024px) {
	#orderIce #intro			{ overflow:visible; }
	#orderIce #intro .img		{ right:auto; bottom:auto; top:-30px; left:240px; width:200px; height:150px; background-position:bottom left; }
	#orderIce #intro .txt		{ width:100%; }

	#products .product a		{ padding:17px 7px; }
	#products .product a .img	{ width:60%; }
}
@media all and (max-width: 900px) {
	#orderIce #intro .img		{ top:-25px; left:230px; width:200px; height:140px; }
}
@media all and (max-width: 768px) {
	#orderIce #intro .img		{ left:auto; right:1%; }
	#orderIce #intro .txt		{ width:100%; }

	#products .product a		{ border-width:4px; padding:15px 6px; }
	#products .product a .img	{ width:70%; }

	.depot-num .w { display:none; }
	#quoteMenu1.form-sub-box 	{ padding: 1em 1.5em; margin: 1em 0; }
}
@media all and (max-width: 650px) {
	#products					{ flex-wrap:wrap; margin:0.5em 0 2em; }
	#products .product			{ width:100%; padding:2px; }
	#products .product a		{ padding:2% 2% 2% 25px; text-align:left; }
	#products .product a .img	{ float:left; width:20%; max-width:100px; margin:0; }
	#products .product .img img	{ width:100%; }
	#products .product a p.txt	{ float:right; margin:0; padding:7% 0 0; width:74%; font-size:3.5vw; }
	#products .product a .tick	{ position:absolute; bottom:50%; left:-17px; margin-left:0; margin-bottom:-15px;
								  height:30px; width:30px; border-radius:15px; font-size:18px; padding-top:5px; text-align:center; }
	#products .product a:after	{ display:block; content:" "; clear:both; }
}
@media all and (max-width: 600px) {
	#orderIce #intro .img		{ top:-30px; width:190px; height:130px; }
}
@media all and (max-width: 500px) {
	#orderIce #intro .img		{ top:-30px; width:190px; height:130px; }
	#products .product a .img	{ width:24%; }
	#products .product a p.txt	{ padding-top:8%; width:70%; font-size:3.7vw; }

	#depots { padding:1px 0 0.5em; }
	.depot { border-radius:7px; padding:7px; margin:7px 0; gap:0.5em; }
	.depot-num { padding:4px 0px 0; }
	.depot-col input { font-size:1em !important; padding:0.4em 0.4em !important; }

	#quoteMenu1.form-sub-box 	{ padding: 1em 0.7em; margin:1em -0.5em; }
}
@media all and (max-width: 450px) {
	#orderIce #intro .img		{ top:-35px; right:0; width:45%; height:120px; }
}
@media all and (max-width: 400px) {
	#orderIce #intro .img		{ top:-40px; height:120px; }
}
@media all and (max-width: 350px) {
	#orderIce #intro .img		{ top:-40px; height:120px; }
	#products .product a p.txt	{ padding-top:7%; }
}