﻿/*
PINKS
--ambient-color: #ef86c2;
--light-color: #e658a8;
--medium-color: #dd3594;
--dark-color: #d60f7f;
--highlight-color: #b10064;

PINKS 2
--ambient-color: #f9d1d1;
--light-color: #ffa4b6;
--medium-color: #f765a3;
--dark-color: deeppink;
--highlight-color: #a155b9;

TEAL
--ambient-color: aliceblue;
--light-color: lightblue;
--medium-color: teal;
--dark-color: midnightblue;
--highlight-color: crimson;

BLUE
--ambient-color: #b6cbe9;
--light-color: #4380d3;
--medium-color: #0f4fa8;
--dark-color: #05316d;
--highlight-color: orangered;

GREEN
--ambient-color: #e3ffe6;
--light-color: #99f699;
--medium-color: #008060;
--dark-color: #002e25;
--highlight-color: #DC143C;
*/

body{
--ambient-color: #e3ffe6;
--light-color: #99f699;
--medium-color: #008060;
--dark-color: #002e25;
--highlight-color: #DC143C;
}

/// @font-face 			{font-family: company; src: url(https://www.sewingcuts.co.uk/gabriola.ttf); font-display: swap; size-adjust: 130%; line-gap-override: 10%;}

@font-face 			{font-family: serif; font-style: italic;}

body				{background: rgb(249 250 251); font-family: sans-serif; font-size:16px; padding: 0px; margin: 0px;}
h1, h2, h3				{font-family: tahoma; font-weight: normal;}
br				{clear:both;}
hr				{clear:both; border: none; border-bottom: dotted 1px var(--highlight-color); margin:10px;}
a				{color: var(--medium-color);}
a:visited				{color: var(--medium-color);}
a:hover				{color: var(--dark-color);}
a:active				{color: var(--highlight-color);}

.all				{}
.header				{background: #ffffff;}

.header .quick_info			{background: var(--medium-color); width: 94%; padding: 5px 3% 5px 3%; min-height:25px; border-bottom: solid 1px white;}

.header .quick_info .contacts		{display:inline-block; width: 70%; vertical-align: middle;}
.header .quick_info .contacts a		{display:inline-block; color: var(--ambient-color); font-size:16px; margin: 0px 4% 0px 0px; text-decoration: none; letter-spacing: 1px; line-height:25px; background-repeat: no-repeat; background-position: left center;}
.header .quick_info .contacts a svg	{display:inline-block; vertical-align: top; padding-right:10px; }
.header .quick_info .contacts a span	{display:inline-block; vertical-align: top;}
.header .quick_info .contacts a:hover	{color: var(--dark-color);}
.header .quick_info .contacts a.phone	{}
.header .quick_info .contacts a.contact	{}

.header .quick_info .extras		{display:inline-block; width: 30%; vertical-align: middle; text-align: right;}

.header .quick_info .user		{display:inline-block; vertical-align: top; text-align:right;}
.header .quick_info .user a		{display:inline-block; color: var(--ambient-color);  font-size: 16px; text-decoration: none; line-height:25px;}
.header .quick_info .user a svg		{display:inline-block; padding-right:10px;}
.header .quick_info .user a span	{display:inline-block; vertical-align: text-bottom;}
.header .quick_info .user a:hover	{color: var(--dark-color);}

.header .quick_info .cart		{display:inline-block; vertical-align: top; text-align:right;}
.header .quick_info .cart a	 	{display:inline-block; color: var(--ambient-color);  font-size: 16px; text-decoration: none; line-height:25px;}
.header .quick_info .cart a svg		{display:inline-block; padding-right:10px;}
.header .quick_info .cart a span	{display:inline-block; vertical-align: text-bottom;}
.header .quick_info .cart a:hover	{color: var(--dark-color);}

.header .quick_info .socials		{display:inline-block; vertical-align: top; text-align:right;}
.header .quick_info .socials a		{margin: 0px 2%; display:inline-block; vertical-align:top; color: var(--ambient-color);}
.header .quick_info .socials a:hover	{color: var(--dark-color);}
.header .quick_info .socials a.image	{border:none;}
.header .quick_info .socials a svg	{}

///@font-face 			{font-family: company; src: url(https://www.sewingcuts.co.uk/gabriola.ttf); font-display: swap; size-adjust: 130%; line-gap-override: 10%;}

.header .textual				{display:inline-block; vertical-align: middle; width: 56%; margin: 20px 2% 20px 2%;}
.header .business				{display:block;}
.header .business .logo			{display:inline-block; width:50px; vertical-align:middle; margin-right:10px;}
.header .business .logo img			{width: 100%;}
.header .business .name			{display:inline-block; width: calc(100% - 70px); vertical-align:top;}
.header .business .name .company_name	{display:block; vertical-align:middle; margin-right:30px;}
.header .business .name .company_name img	{width:100%; max-width:400px; border:none;}
.header .business .name h1			{font-family: sans-serif; font-size: 30px; font-weight:bold; letter-spacing: 1px; padding:0px; margin:0px; text-shadow: 0px 0px 1px black;}
.header .business .name h1 a			{color: #000000; text-decoration: none;}
.header .business .name .company_tag		{padding: 0px 0px 0px 5px; margin: 0px; height: 30px; display: inline-block; letter-spacing: 1px;}
.header .menu				{margin-top:15px;}
.header .menu ul				{background: #ffffff; padding:0px; margin:0px; list-style-type:none; text-align: left;}
.header .menu ul li				{display:inline-block; height:30px; margin:5px 10px 0px 0px;}
.header .menu ul li a 				{color: var(--ambient-color); text-decoration:none; padding:7px 20px 8px; display:block; background: var(--medium-color); font: 12px arial, verdana, sans-serif; font-weight: bold; display:block;}
.header .menu ul li a:hover 			{background: var(--dark-color);}

.header .business_image		{width: 40%; margin: 0px 0% 0px 0px; display:inline-block; vertical-align: middle;}
.header .business_image > div 		{background-repeat: no-repeat; background-size: cover; background-position: center;}
.header .business_image > div > div 	{width:100%; height:180px; background:linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 20%, rgba(255,255,255,0) 100%);}

.page				{background: none; border-top: solid 1px var(--medium-color); }
.page .full_page 			{padding: 50px 5%;}
.page .index 			{}
.page .about			{}
.page .area			{}
.page .browse			{}
.page .catalogue			{}
.page .showcase			{}
.page .location			{}
.page .product			{}
.page .contact			{font-size: 18px;}
.page .coupon			{}
.page .faqs			{}
.page .item_details			{}
.page .not_found			{background-image: url('images/404.jpg'); background-repeat: no-repeat; background-size: initial; background-position: center; min-height: 600px; }
.full_page				{font-size:18px;}

.page .banner			{margin-bottom: 30px; background-repeat: no-repeat; background-size: cover; background-position: center;}
.page .banner .tile_left		{padding:10% 55% 10% 5%; width:40%; background: linear-gradient(to right, rgba(0,0,0,0.8), rgba(0,0,0,0.8) 40%,  rgba(0,0,0,0.0) 100%);}
.page .banner .tile_middle		{padding:10% 30%; width:40%; text-align: center; background: linear-gradient(to right, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.8) 30%, rgba(0,0,0,0.8) 70%,  rgba(0,0,0,0.2) 100%);}
.page .banner .tile_right		{padding:10% 10% 10% 50%; width:40%; background: linear-gradient(to right, rgba(0,0,0,0.0), rgba(0,0,0,0.8) 60%,  rgba(0,0,0,0.8) 100%);}
.page .banner p			{display: block; padding:5px 0px; margin:0px; color: #efefef; font-size: 25px; text-transform: capitalize; letter-spacing: -1px;}
.page .banner p.massive		{color: #efca2c; font-size:80px; font-weight:bold; margin:30px 0px; text-transform: uppercase; letter-spacing: -5px;}
.page .banner a			{display: inline-block; text-decoration: none; background-color:  var(--medium-color); color:  #ffffff; padding: 20px 40px; margin: 20px 0px 10px 0px; font-size: 18px;}
.page .banner a:hover		{background-color: var(--highlight-color);}

.page .tile 			{display:inline-block; width:46%; margin:20px 2% 100px 2%; vertical-align:top;}
.page .tile div.image			{display:inline-block; width:95%;  background-color: var(--ambient-color); vertical-align:top;  padding: 20px 0px 20px 5%; background-repeat: no-repeat; background-size: contain; background-position: right; margin: -2px; border: outset 2px var(--ambient-color);}
.page .tile div.image:hover 		{background-color: var(--light-color); border: outset 2px var(--light-color);}
.page .tile div.text			{display:inline-block; width:50%;}
.page .tile p			{display:block; margin:0px; padding: 20px 0px 0px 0px; font-size:25px;}
.page .tile strong			{display:block; margin:0px; padding: 20px 0px; font-weight: bold; font-size:30px; height:120px;}
.page .tile a			{display:block; margin:0px; padding: 20px 0px; color: var(--medium-color); font-size:18px; text-decoration: none; font-weight: bold;}
.page .tile a:hover			{color: var(--dark-color);}

.page .proposition			{padding-top: 70px; margin: 50px 0px 70px 0px; text-align: center; background-repeat: no-repeat; background-position: top center;}
.page .proposition strong		{display:block; margin: 10px 0px; padding: 0px; font-size:40px;}
.page .proposition p			{display:block; margin: 0px; padding: 0px; font-size:18px; line-height: 30px;}

.page .two_column			{margin: 50px 0px; width: 100%;}
.page .two_column .col_1		{display: inline-block; width:49%; vertical-align: top; margin-right: 1%;}
.page .two_column .col_1 img		{width:100%;}
.page .two_column .col_2		{display: inline-block; width:49%; vertical-align: top; margin-left: 1%;}
.page .two_column .col_2 h2		{margin-top: 0px;}
.page .two_column .col_2 p		{font-size: 18px; line-height: 30px;}
.page .two_column .col_2 ul		{list-style-type: circle;}
.page .two_column .col_2 li		{font-size: 18px; line-height: 30px; float:left; width: 50%;}

.page .notice			{background-repeat: no-repeat; background-size: cover; background-position: center; margin: 0px calc((100/90)*-5%) 30px;}
.page .notice > div			{padding:5% 5% 10% 5%; width:90%; text-align:center; background: rgba(0,0,0,0.85);}
.page .notice .top			{display: inline-block; width:100%; margin:50px 0px 100px 0px;}
.page .notice .left			{display: inline-block; width:47%; vertical-align: top; margin-right: 3%; text-align: left;}
.page .notice .right			{display: inline-block; width:47%; vertical-align: top; margin-left: 3%; text-align: left;}

.page .notice .top p			{display: block; padding:5px 0px; margin:0px; color: #efefef; font-size: 25px;}
.page .notice .top strong		{color: #efefef; font-size:40px; font-weight:bold; margin:30px 0px;}
.page .notice .left p,
.page .notice .right p			{display: block; padding:5px 0px; margin:0px; color: #efefef; font-size: 18px; line-height:35px;}
.page .notice .left strong,
.page .notice .right strong		{color: #efefef; font-size:30px; font-weight:bold; margin:30px 0px;}

.page .text_intro			{margin-bottom: 20px;}
.page .text_intro div			{align-items: center; display: flex; flex-flow: row wrap;}
.page .text_intro div b		{background-color: var(--medium-color); display: block;  flex: 1; height: 1px;}
.page .text_intro div strong		{color: #ffffff; font-size:30px; text-align: center; font-weight:normal; border:solid 1px var(--dark-color); padding:10px 20px; background: var(--medium-color); flex: 3;}
.page .text_intro p 			{text-align: center; font-size: 18px; line-height: 30px;}

.contact_form	{
	font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	background: #ffffff;
	box-shadow: #cccccc 0px 10px 20px;
	border: solid 1px rgb(229 231 235);
	margin: 35px auto;		
	padding: 35px;
	border-radius: 20px;
	max-width: 1800px;	
}

.contact_form h3	{
	color: rgb(17 24 39);
	font-size: 1.5rem;
	line-height: 2rem;
	margin: 0 0 0.5rem 0;
	font-weight: bold;
}

.contact_form p	{
	font-size: 0.875rem;
	line-height: 1.25rem;
	margin: 0 0 1rem 0;
	color: rgb(107 114 128);
}

.contact_form div.grid	{
	gap: 1rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: grid;
}

.contact_form input, 
.contact_form textarea	{
	font-family: inherit;
	background-color: rgb(249 250 251);
	border: solid 1px #eeeeee;
	border-radius: 0.75rem;
	padding: 0.75rem;
	font-size: 1rem;
	width: calc(100% - 1.5rem - 2px);
	margin-top: 1rem;
}

.contact_form input:focus, 
.contact_form textarea:focus {
	outline: 2px solid rgb(59, 130, 246, 0.5);
	outline-offset: 2px;
	border-color: transparent;
}

.contact_form input:focus::placeholder, 
.contact_form textarea:focus::placeholder 	{
	color:#dddddd;
}

.contact_form button	{
	font-family: inherit;
	background-color: var(--medium-color);
	color: #ffffff;
	border-radius: 0.75rem;
	padding-top: 1rem;
	padding-bottom: 1rem;
	font-size: 1.2rem;
	line-height: 1.75rem;
	width: 100%;
	margin-top: 1rem;
	font-weight: bold;
	border: 0;
}

.contact_form button:hover	{
	background-color: var(--dark-color);
	cursor: pointer;
}

.contact_form span	{
	display:block;
	margin-top: 1rem;
}

.contact_vcard			{background: #ffffff; border: solid 1px var(--medium-color); padding: 20px; min-height: 210px; margin-top: 80px;}
.contact_vcard h2			{display:block; margin-top:0px; padding-top: 0px;}
.contact_vcard strong		{display:block; font-size: 21px;}
.contact_vcard p			{display:block;}
.contact_vcard img			{float:right; height:210px;}

.contact_tiles			{}
.contact_tiles .contact_tile		{display: inline-block; width: 31%; margin: 30px 0% 30px 0%;}
.contact_tiles .contact_tile + .contact_tile	{margin: 30px 0% 30px 3.5%;}
.contact_tiles .contact_tile a		{display: block; color: var(--dark-color); text-decoration: none; padding: 30px 0px; text-align: center; background: var(--ambient-color); box-shadow: #cccccc 0px 10px 20px; border: solid 1px var(--medium-color); border-top: solid 3px var(--medium-color); border-radius: 0.5rem;}
.contact_tiles .contact_tile a:hover	{border-color: var(--dark-color);}
.contact_tiles .contact_tile a div		{background: var(--medium-color); display:inline-block; padding: 20px;}
.contact_tiles .contact_tile a:hover div	{background: var(--dark-color);}
.contact_tiles .contact_tile a strong	{display: block; padding-top: 40px; font-weight: normal; font-size:30px; min-height: 70px;}
.contact_tiles .contact_tile a span	{display: block; padding: 20px; font-size: 21px;}
.contact_tiles .contact_tile a svg	{color: var(--ambient-color);}
.g-recaptcha 			{}

.page .quote .quote_form						{font-size: 18px;}
.page .quote .quote_form fieldset					{padding: 10px 0px 10px 0px; margin-bottom: 20px; border:none; border-bottom: dotted 1px var(--highlight-color);}
.page .quote .quote_form legend					{font-weight:bold;}
.page .quote .quote_form .quote_form_label_full				{display: block; width: 100%; margin-bottom: 5px;}
.page .quote .quote_form .quote_form_text				{display: inline-block; width: 20%; margin-right: 5%; vertical-align: middle; text-align: right;}
.page .quote .quote_form .quote_form_input				{display: inline-block; width: 60%; vertical-align: middle; font-size: 18px; margin: 0px; font-family: sans-serif;}
.page .quote .quote_form .quote_form_textarea				{display: inline-block; width: 60%; vertical-align: middle; font-size: 18px; margin: 0px; height: 6em; background-color: var(--ambient-color); font-family: sans-serif;}
.page .quote .quote_form .quote_form_radio				{}
.page .quote .quote_form .quote_form_button_div				{text-align: left; padding: 50px 20% 10px 0px;}
.page .quote .quote_form .quote_form_button				{font-size: 18px; font-size: 50px; padding: 20px 150px; margin-left: 31%;}
.page .quote .quote_form .quote_form_required				{color: var(--highlight-color);}
.page .quote .quote_form .quote_form_input::placeholder	 		{color: #dddddd;}
.page .quote .quote_form .quote_form_input:focus	 			{background-color: var(--ambient-color);}
.page .quote .quote_form .quote_form_input:focus::placeholder 		{color: var(--ambient-color);}
.page .quote .quote_form .g-recaptcha					{display:inline-block; vertical-align: middle;}

.page .quote .quote_form .quote_form_file		{display: inline-block; width: 60%; vertical-align: middle; font-size: 18px; margin: 0px;}
.page .quote .quote_form .images			{position:relative; border: solid 1px #666666; width: 61%; display:inline-block; background-image: url('/images/upload.png'); background-size: 140px; background-repeat: no-repeat; background-position: center 20px; background-color: var(--ambient-color); overflow:clip;}
.page .quote .quote_form .images div			{position: absolute; left: 0%; width: 100%; top: 120px; text-align: center;}
.page .quote .quote_form .images div strong		{display:block; font-size: 1.2em;}
.page .quote .quote_form .images div span		{display:block;}
.page .quote .quote_form .images div em			{color: var(--medium-color);}
.page .quote .quote_form .images .quote_form_file		{position:relative; z-index:1; width:100%; height:220px; opacity:0; cursor: pointer;}
.page .quote .quote_form .image_preview		{}
.page .quote .quote_form .image_preview div		{width:19%; height: 150px; background-size: contain; background-position: center; background-repeat: no-repeat; display:inline-block; margin: 10px 0.5%;}

.page .area_map iframe			{width: 100%; border: solid 1px #2E312F; border-radius: 10px; background-image: url('/images/loading.gif'); background-repeat: no-repeat; background-position: top center;}

.catalogue .item			{display:inline-block; vertical-align: top; width: 50%;}
.catalogue .item a			{display: block; margin: 0px 20px 20px 0px; padding-bottom: 20px; text-decoration: none; box-shadow: 2px 2px 10px #dddddd;}
.catalogue .item a div		{max-height: 400px; text-overflow: clip; overflow: hidden; align-content: center; display: flex; flex-wrap: wrap;}
.catalogue .item img			{width:100%; border:solid 1px white;}
.catalogue .item a:hover		{box-shadow: 2px 2px 10px #bbbbbb;}
.catalogue .item em			{text-align: center; display:block; padding: 20px 0px 0px 0px; text-transform: capitalize; font-style:normal; font-size: 1.8em; text-overflow: ellipsis; overflow: hidden;}
.catalogue .item a:hover em		{text-decoration: none; text-decoration-color: var(--highlight-color);}
.catalogue .item p			{text-align: center; display:block;  margin: 5px 0px; font-size: 22px; font-weight: normal;}
.catalogue .item p strong		{font-weight: normal; color: #444444;}

.showcase_catalogue .item		{display:inline-block; vertical-align: top; width: 33.3%;}
.showcase_catalogue .item a		{display: block; margin: 0px 20px 20px 0px; padding-bottom: 5px; text-decoration: none; box-shadow: 2px 2px 10px #dddddd;}
.showcase_catalogue .item a div	{max-height: 400px; text-overflow: clip; overflow: hidden; align-content: center; display: flex; flex-wrap: wrap;}
.showcase_catalogue .item img	{width:100%; border:solid 1px white;}
.showcase_catalogue .item a:hover	{box-shadow: 2px 2px 10px #bbbbbb;}
.showcase_catalogue .item p		{text-align: center; display:block;  margin: 5px; font-size: 18px; font-weight: normal; height:42px; text-transform: capitalize;}
.showcase_catalogue .item p strong	{font-weight: normal; color: #444444;}

.page .booking				{}
.page .booking .item				{display:inline-block; vertical-align: top; width: 33%;}
.page .booking .item a			{display: block; margin: 0px 20px 20px 0px; text-decoration: none; color: #444;}
.page .booking .item a:hover strong		{text-decoration: underline;}
.page .booking .item a div			{}
.page .booking .item img			{width:100%;}
.page .booking .item strong			{display:block; margin: 5px 0px; text-transform: capitalize; height: 35px; font-weight:normal; font-size: 16px;}
.page .booking .item p			{display:block; margin: 5px 0px; font-size: 18px;}

.page .booking .booking_form			{display:inline-block; vertical-align:top; width:40%;}
.page .booking .booking_form fieldset		{display:block;}
.page .booking .booking_form legend		{display:block;}
.page .booking .booking_form label		{display:block;}
.page .booking .booking_form input		{}
.page .booking .booking_form textarea		{}
.page .booking .booking_form button		{}

.page .item_details .details			{padding:50px 5%;}
.page .item_details .left_item			{display:inline-block; vertical-align: top; width: 50%;}
.page .item_details .left_item .image_box		{position: relative;}
.image_box .image_arrow			{display:none; vertical-align: middle; width: 40px; text-align: left; font-size: 40px; position: absolute; top: 45%;}
.image_box .image_arrow_right		{text-align: right; right: 0px;}
.image_box:hover .image_arrow		{display:inline-block;}
.image_box .image_arrow a			{text-decoration: none; color: #000000; border: solid 1px var(--medium-color); padding: 30px 5px; background: var(--ambient-color); opacity: 0.5;}
.image_box .image_arrow a:hover		{background: var(--light-color); opacity: 0.7;}
.image_box .main_image			{display:inline-block; vertical-align: middle; width: 100%;}
.image_box .main_image a			{display: block;}
.image_box .main_image a img			{width: 100%;}
.page .item_details .gallery			{}
.page .item_details .gallery a			{display: inline-block; width: 24%; margin: 5px 1% 0px 0px;}
.page .item_details .gallery img			{width: 100%; border:solid 1px var(--light-color);}
.page .item_details .gallery img:hover		{border:solid 1px var(--medium-color); opacity: 0.75; cursor: pointer;}
.page .item_details .gallery img.active		{border:solid 1px var(--highlight-color); opacity: 0.75; cursor: unset;}

.page .item_details .right_item			{display:inline-block; vertical-align: top; width: 50%;}
.page .item_details .right_item > div		{margin-left: 40px;}
.page .item_details .success			{padding: 10px; text-align: center; margin-bottom: 30px; background:linear-gradient(to right, white 0%, var(--ambient-color) 20%, var(--ambient-color) 80%, white 100%); border-top: solid 1px var(--light-color); border-bottom: solid 1px var(--light-color);}
.page .item_details .success a			{text-decoration: none;}
.page .item_details p.business_name		{font-size: 14px; margin: 0px; padding: 0px; color: #666666; text-transform: uppercase; border-left: solid 7px var(--medium-color); padding-left: 10px;}
.page .item_details h1			{font-size: 40px; margin: 0px; text-transform: capitalize;}
.page .item_details h2			{margin: 0px 0px 40px 0px; padding: 0px; text-transform: capitalize;}
.page .item_details p.price			{font-size: 30px; padding: 0px; margin-bottom: 0px;}
.page .item_details p.price_details		{font-size: 16px; padding: 0px; margin-top: 0px;}
.page .item_details .call_to_action		{display:block; margin: 30px 0px;}
.page .item_details .call_to_action button		{font-size: 25px; display: block; width:100%; padding: 20px; text-align: center; border:solid 1px var(--medium-color); text-decoration: none; background-color: var(--light-color);}
.page .item_details .call_to_action button:hover	{background-color: var(--medium-color); border:solid 1px var(--dark-color); color:white; cursor: pointer}
.page .item_details ul			{font-size: 18px; line-height: 30px; list-style-type:circle;}
.page .item_details ul li::marker 		{}
.page .item_details .description		{font-size: 18px; line-height: 30px;}
.page .item_details p.list_details		{font-size: 18px; line-height: 30px;}
.page .item_details p.delivery_details		{font-size: 16px; padding-top: 20px; margin-top: 30px; margin-bottom:30px; border-top: solid 1px var(--highlight-color);}
.page .item_details table			{width: 100%; vertical-align: top; display:inline-table; table-layout: auto; border-collapse:collapse; text-align: left; text-transform: capitalize; border-top: solid 1px var(--light-color);}
.page .item_details th 			{text-align:left; letter-spacing: 1px; text-transform: capitalize; padding: 2% 2%; font-size:16px; color: black; background-color: var(--ambient-color);}
.page .item_details tr			{border-bottom: solid 1px var(--light-color);}
.page .item_details td			{padding: 2% 2%; vertical-align: middle;}

.page div.single			{display: block; padding: 0px 50px;}
.page div.double			{display: block; padding: 0px 50px; width: 70%;}

.page p.container			{border:dotted 1px #4380d3; background: #fff; padding: 10px; margin:10px 0; border-radius:5px;}
.page div.boxes			{margin: auto; display: inline-block;}
.page p.box			{font-size: 18px; background: white; text-align:center; padding: 10px 0; float:left; margin:20px; width:120px; height:100px; border-radius:5px; box-shadow: inset 0px 0px 5px #05316d, 2px 2px 2px #05316d;}
.page p.box span			{background: rgba(182,203,233,0.5); padding: 2px; display:block;}
.page p.importers			{background-image: url('images/imports.jpg');}
.page p.exports			{background-image: url('images/exports.jpg');}
.page p.distribution			{background-image: url('images/distribution.jpg');}

.location p.business_name		{font-size: 14px; margin: 0px; padding: 0px; color: #666666; text-transform: uppercase; border-left: solid 7px var(--medium-color); padding-left: 10px;}
.location h1			{font-size: 40px; margin: 0px; text-transform: capitalize;}
.location > .full_page > div		{line-height: 30px;}
.location .location_image		{float:right; width: 50%; padding: 0px 0px 20px 30px;}

.review				{background: #ffffff; margin:50px 0px; padding:20px 2%; border:solid 1px #dddddd; font-size: 18px; border-radius: 20px; width: 96%;}
.review svg			{color: var(--medium-color); vertical-align: top; display:inline-block;}
.review p				{margin: 0px; padding: 0px;}
.review .top			{margin: 20px; padding-bottom: 10px; border-bottom:solid 1px var(--highlight-color);}
.review .top .image			{display: inline-block; vertical-align: top; margin-right: 20px;}
.review .top .image img		{background-color: var(--light-color); border-radius: 30px; height: 60px;}
.review .top .name			{display: inline-block; vertical-align: top; }
.review .top .name strong		{display: block;}
.review .top .name p			{display: inline-block; vertical-align: top; padding-left: 8px; font-size: 16px; line-height: 20px;}
.review .top .location			{display: inline-block; vertical-align: top; color:#999999; float:right;}
.review .top .location p		{display: inline-block; padding-left: 8px;}
.review .middle			{margin: 20px;}
.review .middle .stars		{display: inline-block; vertical-align: top; width: 70%;}
.review .middle .stars img		{height: 30px; padding: 0px 1px 3px; margin-right:5px;}
.review .middle .stars .star		{background-color: var(--medium-color);}
.review .middle .stars .no-star		{background-color: #dddddd;}
.review .middle .span		{display: inline-block; vertical-align: top; width: 30%; color:#999999; text-align:right; font-style: italic;}
.review .bottom			{margin: 20px; padding-bottom: 20px; border-bottom:solid 1px #eeeeee;}
.review .bottom .summary		{margin-bottom: 20px; text-transform: capitalize;}
.review .bottom .text			{line-height: 30px;}
.review .bottom .text	p		{margin: 20px 0px;}
.review .footer			{margin: 20px; font-size: 16px; line-height: 20px;}
.review .footer .like 			{display: inline-block; vertical-align: top; padding-right: 5%;}
.review .footer .like span		{display: inline-block; vertical-align: top; padding-left: 10px;}
.review .footer .share 		{display: inline-block; vertical-align: top;}
.review .footer .share span		{display: inline-block; vertical-align: top; padding-left: 10px;}
.review .footer .flag 			{display: inline-block; vertical-align: top; float: right;}
.review .footer .flag span		{display: inline-block; vertical-align: top; padding-left: 10px;}

.area_list				{display: inline-block; vertical-align: top; width: 20%; padding-left: 5%;}
.area_list li			{list-style-type: circle; padding: 3px 0px;}

.faqs_tile 				{margin: 15px 0px; padding: 15px 0px; border-bottom: 1px dotted var(--highlight-color);}
.faqs_tile .question			{font-weight: bold; font-size: 18px; min-height:30px;}
.faqs_tile .answer			{min-height:30px; font-size: 18px;}
.faqs_tile .question span,
.faqs_tile .answer span		{font-size: 30px; font-weight: bold; width: 40px; display: inline-block;}
.faqs_tile .question span		{color: var(--highlight-color);}
.faqs_tile .answer span		{color: var(--dark-color);}
.faqs_tile .answer p			{display: inline; padding: 0px 0px 10px 0px;}

.people_tile 			{margin: 15px 0px; padding: 15px 0px; border-bottom: 1px dotted var(--highlight-color);}
.people_tile .image			{display:inline-block; width:25%; vertical-align: top;}
.people_tile .image img		{padding: 10px; border: outset 1px var(--ambient-color); width: 100%;}
.people_tile .content			{display: inline-block; vertical-align: top;  width:65%; margin-left:10%;}
.people_tile .title			{text-transform: capitalize; margin: 0px; color: var(--dark-color); padding-top: 10px;}
.people_tile .date			{font-size: 16px; color: var(--highlight-color);}
.people_tile .body			{font-size: 18px;}

.news_tile 			{margin: 15px 0px; padding: 15px 0px; border-bottom: 1px dotted var(--highlight-color);}
.news_tile .content			{display: inline-block; width:100%;}
.news_tile .image			{float: right; width:40%; margin: 0px 0px 20px 20px; padding: 10px; border: outset 1px var(--ambient-color);}
.news_tile .title			{text-transform: capitalize; margin: 0px; color: var(--dark-color); padding-top: 10px;}
.news_tile .date			{font-size: 16px; color: var(--highlight-color);}
.news_tile .body			{font-size: 18px;}

.link_tile 				{margin: 5px 0px; padding: 15px 0px; border-bottom: 1px dotted var(--highlight-color);}
.link_tile .image			{display:inline-block; width:25%; vertical-align: middle; text-align: center;}
.link_tile .image a			{display: inline-block; text-decoration: none; border: none;}
.link_tile .image a img		{border: none; max-height: 120px; width: 100%;}
.link_tile .content			{display: inline-block; vertical-align: middle;  width:74%; margin-left:1%;}
.link_tile .content .title		{text-transform: capitalize; margin: 0px; color: var(--dark-color); padding: 0px; font-size: 1.8em;}
.link_tile .content .title a		{text-decoration: none;}
.link_tile .content .code		{display: inline-block; color: var(--highlight-color); width:100%; text-decoration: none; text-wrap: wrap; overflow: hidden; text-overflow: ellipsis;}
.link_tile .content .terms		{display: block;}
.link_tile .content .date		{display: block; font-size: 16px; color: var(--highlight-color);}
.link_tile .content .body		{font-size: 1em;}
.link_tile .content .body p		{margin: 0px 0px 20px 0px;}


.coupons strong			{text-transform: capitalize;}
.coupon_form			{margin: 30px 0px;}
.coupon_form form fieldset		{background: var(--ambient-color); border-radius: 10px; padding: 50px; border: solid 1px var(--light-color); font-size: 24px; text-align: center;}
.coupon_form form legend		{background: var(--ambient-color); border-radius: 10px; font-size: 30px; padding: 20px 30px; border: solid 1px var(--light-color);}
.coupon_form form label		{display: inline-block; font-weight: 30px;}
.coupon_form form span		{}
.coupon_form form input		{font-size: 24px; padding: 1px 5px; letter-spacing: 2px; text-transform: uppercase; margin-right: 4px;}
.coupon_form form button		{display: inline-block; font-size: 24px;}

.calendar	 			{padding-top: 20px;}
.calendar .month 		{padding: 50px 1%; width: 98%; background: var(--medium-color); text-align: center;}
.calendar .month div,
.calendar .month a	 	{display:inline-block; vertical-align:top; color: var(--ambient-color); font-size: 18px; text-transform: uppercase; letter-spacing: 3px; text-decoration: none;}
.calendar .month .prev 	{float: left; padding-top: 10px;}
.calendar .month .next 	{float: right; padding-top: 10px;}

.calendar .weekdays 	{margin: 0px; padding: 10px 0px; font-size:18px; background-color: var(--light-color); border-bottom:solid 1px var(--medium-color);}
.calendar .weekdays div 	{display: inline-block; width: 14.28%; color: var(--dark-color); text-align: center;}

.calendar .days 		{padding: 0px 0px; margin: 0px; border-bottom: solid 1px var(--medium-color);}
.calendar .days div,
.calendar .days a 		{display: inline-block; width: 14.28%; text-align: center; padding: 12px 0px; font-size:16px; color: var(--dark-color); text-decoration: none;}
.calendar .days .active	{}
.calendar .days .active:hover	{background-color: var(--medium-color);}
.calendar .days .today 	{color: var(--ambient-color); background: var(--dark-color);}
.calendar .days .inactive 	{color: var(--medium-color); background: var(--ambient-color);}
.calendar .days .before 	{color: var(--dark-color); background: var(--highlight-color);}
.calendar .days .holiday 	{color: var(--dark-color); background: var(--highlight-color);}
.calendar .days .unavailable 	{color: var(--dark-color); background: var(--highlight-color);}

.shipping_image		{width: 45%; vertical-align: top; display:inline-block; margin: 0px; padding:0px; margin-right: 5%;}
.shipping_image img 	{width:100%;}
.shipping_image figcaption 	{background-color: var(--ambient-color); font-size:16px; font-weight:bold; padding: 10px 0px; text-align:center; border-top: solid 1px var(--light-color); border-bottom: solid 1px var(--light-color);}
.shipping_table		{width: 50%; vertical-align: top; display:inline-table; table-layout: auto; border-collapse:collapse; text-align: left; text-transform: capitalize; border-top: solid 1px var(--light-color);}
.shipping_table th 		{text-align:left; letter-spacing: 1px; text-transform: capitalize; padding: 2% 2%; font-size:16px; color: black; background-color: var(--ambient-color);}
.shipping_table tr		{border-bottom: solid 1px var(--light-color);}
.shipping_table td		{padding: 2% 2%; vertical-align: middle;}

.form			{margin:20px 0%;}
.form fieldset		{background: #ffffff; border:solid 1px var(--medium-color); padding:20px 0px;}
.form legend		{color: #000000; font-size:30px; border:solid 1px var(--medium-color); margin-left:10px; padding:10px 20px; background: var(--ambient-color);}
.form label		{padding:5px; display:block; font-size: 18px}
.form label > span		{font-size: 18px; line-height:25px; display:inline-block; width: 20%; text-align:right; vertical-align: middle; padding:5px 5% 5px 0px;}
.form label > span > span 	{color: var(--highlight-color);}
.form select,
.form input[type='text'],
.form input[type='email'],
.form input[type='url'],
.form input[type='password'],
.form input[type='file'],
.form input[type='tel'],
.form input[type='date'],
.form textarea		{width:70%; line-height:25px; font-size: 18px; height:25px; vertical-align: middle;}
.form textarea		{height: 6em;}
.form input[type='time']	{line-height:25px; font-size: 18px; height:25px; padding: 5px;}
.form input[type='file']	{width:auto; height:32px; border:none; padding: 5px; box-shadow:none;}

.form input::placeholder		{color: #dddddd;}
.form input:focus,
.form textarea:focus	 		{background-color: var(--ambient-color);}
.form input:focus::placeholder,
.form textarea:focus::placeholder 	{color: var(--ambient-color);}

.form p				{margin: 0 0 0 20%; padding: 0px 30px 20px 30px;}

.form input[readonly='readonly']		{background:#FFD9D9;}

.form select			{height:35px; line-height:35px;width: 50%;}
.form input[type='checkbox']		{margin:12px 10px 0px 10px;}
.form textarea			{height:6em; line-height: 20px;}

.form textarea:hover,
.form input:hover,
.form select:hover					{}

.form textarea:focus,
.form input:focus,
.form select:focus					{}
.form button					{margin: 10px 0px 0px 26%; font-size: 18px; padding:10px 60px;}

.form .g-recaptcha					{display:inline-block; vertical-align: middle;}

.form label img					{display:inline-block; vertical-align: middle; padding:10px;}
.form input.captcha					{margin-left: 20px; width: 80px;}
.form .small_txa					{width:60%; height:5em;}

.success_message					{background: var(--ambient-color); border: solid 2px limegreen; padding: 15px 20px; font-size: 18px;}
.notice_message					{background: var(--ambient-color); border: solid 2px orange; padding: 15px 20px; font-size: 18px;}
.error_message					{background: var(--ambient-color); border: solid 2px red; padding: 15px 20px; font-size: 18px;}

.footer				{margin-top: 100px;}
.footer .upper			{clear:both; background:#222222; padding:20px 10px 100px 10px; color: #ffffff; font-size: 18px; line-height: 30px;}
.footer .upper strong			{display:block; font-size: 28px; margin: 20px;}
.footer .upper p			{display:block; margin: 5px 20px;}
.footer .upper a			{color: #ffffff;}
.footer .upper .logo			{display:inline-block; margin:20px;}
.footer .upper .socials		{display:inline-block;}
.footer .upper .socials a		{display:inline-block; vertical-align: top; margin-left:20px;}
.footer .upper .socials a svg		{color: #ffffff;}
.footer .upper .about			{display:inline-block; vertical-align:top; width:33%; }
.footer .upper .open			{display:inline-block; vertical-align:top; width:33%; }
.footer .upper .contact		{display:inline-block; vertical-align:top; width:33%; }

.footer .lower			{background: var(--medium-color); padding:15px 5%;}
.footer .lower ul			{text-align:center; margin:0px; padding:0px;}
.footer .lower li			{display:inline; padding: 0px 20px;}
.footer .lower li a			{color: #ffffff; text-decoration: none;}
.footer .lower li a:hover		{text-decoration: underline;}


.payment_main				{display: inline-block; width:100%; padding: 0px 0% 30px 0%;}

.cart_container_full 				{margin: 0%; width: 100%; background: #ffffff; font-size:18px;}
.cart_container_full table			{color: black; table-layout: auto; width:100%; border-collapse:collapse; text-align: left; text-transform: capitalize; border-top: solid 1px var(--light-color);}
.cart_container_full table th 			{text-align:left; letter-spacing: 1px; text-transform: uppercase; padding: 1% 1%; font-size:16px; color: black; background-color: var(--ambient-color);}
.cart_container_full table th.value_head		{text-align:right;}
.cart_container_full table tr			{border-bottom: solid 1px var(--light-color);}
.cart_container_full table td			{padding: 1% 1%; vertical-align: middle; min-width: 20px;}
.cart_container_full table td a			{border: none; text-decoration: none;}
.cart_container_full table td img.image		{height: 100px;}
.cart_container_full table tr:nth-child(2n+2)		{background-color: none;}
.cart_container_full table td.value		{text-align: right;}
.cart_container_full table td.value span		{color: red;}	
.cart_container_full table .title			{text-align:right;}
.cart_container_full table .title form		{display:inline;}
.cart_container_full table .sub_total_row		{border-top: solid 1px var(--light-color);}
.cart_container_full table .discount_row		{}	
.cart_container_full table .discount_row input	{width:60%; max-width:120px;}	
.cart_container_full table .shipping_row 		{}
.cart_container_full table .shipping_row select	{width:60%; max-width:160px; font-size: 1em;}
.cart_container_full table .shipping_row label span	{margin: 0px 10px;}
.cart_container_full table .total_row 		{font-size:1em; color: black; background-color: var(--ambient-color);}
.cart_container_full table .more_info		{text-align: left;}
.cart_container_full table .inc_dec_del		{border:none; vertical-align: middle;}
.cart_container_full table .change_quantity	{display: inline;}
.cart_container_full table .change_quantity input	{width:40%; max-width:25px; margin:0 2%; text-align:center;}
.cart_container_full .empty			{padding: 20px 20px 20px 20px;}

.payment_buttons				{margin: 20px 0px;}
.payment_buttons a				{font-size: 25px; display: block; margin: 20px 0px;  padding: 20px; text-align: center; background-color: var(--medium-color); border:solid 1px var(--dark-color); color:white; text-decoration: none;}
.payment_buttons a:hover			{background-color: var(--medium-color); border:solid 1px var(--dark-color); color:white;}

.checkout_buttons				{width:100%; text-align:center; padding:0px 0px 20px 0;}
.checkout_buttons > strong			{display: block; text-align:left;padding:10px;}
.checkout_buttons a				{color: rgb(68,68,136); text-decoration: none; padding:10px 20px; border-radius:20px; border: none; display:inline-block; box-shadow: 2px 2px 2px #999999; text-align: center;}
.checkout_buttons a:hover			{box-shadow: 1px 1px 1px #666666;}
.checkout_buttons a span			{font-size: 1em; display:block;}
.checkout_buttons a strong			{font-size: 1.5em; display:block; letter-spacing: 3px;}

.checkout_address				{}
.checkout_address .required			{color: var(--highlight-color); font-size:12px;}
.checkout_address fieldset			{display: block; border: none; border-top: dotted 1px #888888; margin-bottom: 50px; max-width: 100%; padding: 0px;}
.checkout_address legend			{font-size: 1.8em; padding: 10px 10px 10px 0px;}
.checkout_address p			{padding: 0px 0px 0px 0px;}
.checkout_address label			{display: block; padding: 5px 3em 5px 0px; max-width: 100%; vertical-align: middle;}
.checkout_address label.fifty			{display: inline-block; vertical-align: middle;}
.checkout_address label.quarter		{display: inline-block; vertical-align: middle;}
.checkout_address label input			{display: inline-block; font-size: 1.2em; text-indent: 10px; max-width: 100%; vertical-align: middle;}
.checkout_address label select			{display: inline-block; font-size: 1.2em; padding: 0px 10px; max-width: 100%; vertical-align: middle;}
.checkout_address label span			{display: inline-block; width: 200px; padding: 0px 0px 5px 0px; vertical-align: middle;}
.checkout_address label.checkbox span		{display: inline-block; vertical-align: middle; width:200px; padding: 0px; margin-right: 20px; font-weight: normal;}
.checkout_address label.checkbox input		{display: inline-block; vertical-align: middle; position: relative;}
.checkout_address label em.required		{color: red; font-style:normal;}
.checkout_address button			{width: 100%; font-size: 25px; display: block; margin: 20px 0px; padding: 20px; text-align: center; background-color: var(--medium-color); border:solid 1px var(--dark-color); color:white; text-decoration: none;}
.checkout_address button:hover		{background-color: var(--medium-color); border:solid 1px var(--dark-color); color:white; cursor: pointer;}

.checkout_payment .failed			{padding: 10px; text-align: center; margin-bottom: 30px; background:linear-gradient(to right, white 0%, var(--ambient-color) 20%, var(--ambient-color) 80%, white 100%); border-top: solid 1px var(--light-color); border-bottom: solid 1px var(--light-color);}
.checkout_payment fieldset			{display: block; border: none; border-top: dotted 1px #888888; margin-bottom: 50px; max-width: 100%; padding: 0px;}
.checkout_payment legend			{font-size: 1.8em; padding: 10px 10px 10px 0px;}
.checkout_payment button.submit		{width: 100%; font-size: 25px; display: block; margin: 20px 0px; padding: 20px; text-align: center; background-color: var(--medium-color); border:solid 1px var(--dark-color); color:white; text-decoration: none;}
.checkout_payment button.submit:hover		{background-color: var(--medium-color); border:solid 1px var(--dark-color); color:white; cursor: pointer;}

.payment-processing			{margin: 50px 0px; font-size: 50px; text-align: center;}
.payment_received				{font-size: 72px; text-align: center; margin: 20px 0px;}

.payment_side					{display: inline-block; width:31%; padding: 30px 0% 30px 1%; vertical-align: top;}
.payment_side > div					{background-color: var(--ambient-color); padding: 60px 35px; border-radius: 30px; box-shadow: 0px 0px 10px #aaaaaa;}
.payment_side > div	strong,
.payment_side > div	p				{display: block}
.payment_side > div	strong.checkout_summary_title		{font-size: 1.4em; margin-bottom: 20px;}
.payment_side > div	strong.checkout_summary_title span	{font-size: 0.75em; line-height:1.5em;}
.payment_side > div	strong.checkout_summary_total	{font-size: 1.8em; padding: 30px 0px; margin-top: 80px; border-top: dashed 1px var(--light-color);}
.payment_side > div	span				{float:right;}
.payment_side > div	span.red				{color: red;}
.payment_side > div	p				{padding: 0px 10px; color: #333333;}
.payment_side > div	p a				{font-weight: bold; text-decoration: none;}


@media screen and (max-width: 1000px) {
	.page .tile strong			{font-size:25px; }
	.news_tile .image			{width:50%;}
	.link_tile .content .title		{font-size: 1.6em;}
	.area_list				{width: 45%; padding-left: 5%;}
}

@media screen and (max-width: 800px) {
	.header .textual			{width:96%;}
	.header .business_image		{display:none;}

	.page .tile 			{width:96%;}
	.page .banner .tile_left 		{width:60%; padding: 10% 35% 10% 5%;}
	.page .banner .tile_middle		{width:70%; padding: 10% 15%;}
	.page .banner p.massive		{font-size:50px; letter-spacing: 0px;}

	.contact_vcard img			{float:none; height:auto; width:100%; max-width: 400px;}
	.contact_tiles .contact_tile		{width: 100%;}
	.contact_tiles .contact_tile + .contact_tile	{margin: 30px 0% 30px 0%;}

	.page .two_column .col_1 		{width: 100%; margin: 0% 0% 20px 0%;}
	.page .two_column .col_2 		{width: 100%; margin: 0%;}

	.page .notice .left			{width:100%; margin: 0% 0% 100px; 0%;}
	.page .notice .right			{width:100%; margin: 0%;}

	.news_tile .image			{float: none; width:100%; margin: 0px; padding: 0px;}

	.people_tile .image			{width:45%;}
	.people_tile .image img		{padding: 0px;}
	.people_tile .content			{width:50%; margin-left: 5%;}

	.link_tile .image			{width:40%;}
	.link_tile .content			{width:58%; margin-left:2%;}
	.link_tile .content .title		{font-size: 1.4em;}

	.cart_container_full table td img.image	{height: 70px;}
	.catalogue .item			{width: 100%;}
	.catalogue .item a			{margin: 0px 0px 20px 0px;}

	.page .item_details .left_item		{width: 100%; margin-bottom: 20px;}
	.page .item_details .right_item		{width: 100%;}
	.page .item_details .right_item > div	{margin-left: 0px;}

	.footer .upper .about 			{width: 100%;}
	.footer .upper .open			{width: 100%;}
	.footer .upper .contact		{width: 100%;}
}

@media screen and (max-width: 600px) {
	.header .business .link div			{background-position: -1000px -1000px; padding-left: 0px;}
	.header .quick_info .contacts a			{letter-spacing: 0px; font-size:16px;}
}

@media screen and (max-width: 500px) {

	.header .business .name h1			{font-size: 25px;}
	.header .business .name .company_tag		{font-size: 15px; letter-spacing: 0px;}

	.header .business .link div h1			{font-size: 30px;}
	.header .business .link div p			{font-size: 15px; letter-spacing: 0px;}

	.header .quick_info .contacts			{display: block; width: 100%;}
	.header .quick_info .extras			{display: none;}
}

@media screen and (max-width: 400px) {

}