:root {
	
	/* Colours to change */
	
	--primary: #FF5685;
	--secondary: #79DCEE;
	--third: #E2E9F5;
	--fourth: #161730;
	--button-main: #161730;
	--button-hover: #161730;
	--yellow: #FFC200;
	--black: #000000;
	--white: #FFFFFF;
	
	/* Elements to change */
	
	/* Navbar */
	--navbar-background: var(--black);
	--navbar-text: var(--white);
	--navbar-text-mobile: var(--primary);
	--navbar-text-hover: var(--secondary);
	--navbar-icon: var(--primary);
	--navbar-burger: var(--primary);
	--navbar-dropdown: var(--button-hover);
	
	/* Searchbar */
	--search-background: var(--primary);
	--search-button-background: var(--button-main);
	--search-button-color: var(--white);
	--search-button-background-hover: var(--button-main);
	--search-button-hover: var(--primary);
	--search-text: var(--primary);
	
	/* Breadcrumbs */
	--breadcrumb-background: var(--secondary);
	--breadcrumb-text: var(--white);
	--breadcrumb-text-hover: var(--primary);
	
	/* Banner Text */
	--banner-begin-text: var(--yellow);
	
	/* Featured Categories */
	--featcat-background: var(--primary);
	
	/* Categories */
	--cat-item-background-starter: var(--third);
	--cat-item-background-feast: var(--primary);
	--cat-item-background-banquet: var(--secondary);
	--cat-title-background: var(--white);
	--cat-title-text: var(--primary);
	
	/* Sub-Categories */
	--subcat-item-background: var(--primary);
	--subcat-title-background: var(--white);
	--subcat-title-text: var(--secondary);
	
	/* Footer */
	--footer-background: var(--black);
	--footer-text: var(--white);
	--footer-text-hover: var(--secondary);
	--footer-copyright-background: var(--primary);
	--footer-copyright-text: var(--white);
	
	/* Buttons */
	--buttons-color: var(--white);
	--buttons-background: var(--button-hover);
	--buttons-hover-color: var(--primary);
	--buttons-hover-background: var(--button-hover);
	
	/* Misc */
	--arrow-buttons-color: var(--primary);
	
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Login Page */

/* Amend login background by moving the background image */
.login__wrapper {
	background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0)), url('/-831409969/Handler/Picture/GU/F/ThemeImages/caters_login.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
    min-height: 85vh;
    position: relative;
	width: 100%;
	display: inline-block;
}

/* Amend login details section to centre */
.login__wrapper>.catfish-container {
    float: left;
	width: 600px !important;
	padding-top: 3rem;
}

/* Remove logo from login page above the welcome text */
.login__wrapper .page-title:before {
    content: '';
    display: inline-block;
    height: 20rem;
    width: 25rem;
    background-image: url('/-486303365/Handler/Picture/GU/F/ThemeImages/caters_login_logo.svg');
    background-size: 25rem 25rem;
    background-position: center center;
    background-repeat: no-repeat;
    margin-bottom: 0rem;
}

.input, .catfish-input, .catfish-select, .textarea, .catfish-textarea {
    border-radius: 8px;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Header */

.navbar {
	height: 7.71429em;
}

.navbar-burger {
	height: 7.71429em;
}

.ict-header-spacer {
    height: 7.71429em;
}

.navbar-item img {
    max-height: 7.71429em;
}

.is-header-logo {
    height: 6.5rem;
}

/* Change navbar background-color to black */
#main-nav {
	background-color: var(--navbar-background);
}

.mainNavShadow {
	box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}

a.navbar-text {
	color: var(--navbar-text-mobile);
}

a.navbar-icon {
	color: var(--navbar-icon);
}

a.navbar-text:hover {
	color: var(--navbar-text-hover);
}

.navbar-burger span {
	background-color: var(--navbar-burger);
}

/* Navigation Dropdown
Static Start */

/* Change the padding and font size for the categories navigation dropdown menu */
.header-categories .navbar-dropdown .navigationmenu {
    padding-top: 0;
    padding-bottom: 0;
	font-size: 0.875rem;
	padding-left: 0.875rem;
}

/* Change the padding on the categories navigation dropdown menu */
.column .navigationmenu {
	padding-top: 3rem;
}

/* Remove the title categories from the categories navigation dropdown menu */
.header-categories .navbar-dropdown .navigationmenu .navigationmenu--title {
    display: none;
}

/* Change the colors for when selecting a category in the categories navigation dropdown menu */
.header-categories .navbar-dropdown .navigationmenu ul li.active>a {
    background-color: inherit;
    color: inherit;
}

/* Navigation Dropdown
Static End */


.navbar-dropdown a.navbar-item:focus, .navbar-dropdown a.navbar-item:hover {
    background-color: #F5F9FB;
    color: var(--navbar-dropdown);
}

.navigationmenu ul a:hover {
    background-color: #F5F9FB;
    color: var(--navbar-dropdown);
}

.homepage-banner {
	height: 600px;
	opacity: 0.6;
	background-position: right;
}

.homepage-banner-title {
	font-size: 5em;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Searchbar */

/* .nav-search-container { */
	/* background-color: var(--search-background); */
/* } */

/* .nav-search-container .search-box { */
	/* margin-top: 3rem; */
/* } */

#navlower {
	background: var(--search-background);
}

#toprow .top-bar-section, #menurow .top-bar-section, #logorow .top-bar-section, #navlower .top-bar-section {
    justify-content: right;
}

#navlower .catfish-button {
    background: var(--search-button-background);
    color: var(--search-button-color);
	border: 0px;
	box-shadow: none;
}

#navlower .catfish-button:hover {
    color: var(--search-button-hover);
	background-color: var(--search-button-background-hover);
}

.search-box {
    max-width: 500px;
}

.search-box .searchbox {
    border-bottom-left-radius: 8px;
    border-top-left-radius: 8px;
    padding-left: 1rem;
	color: var(--search-text);
	border: 0px;
	box-shadow: none;
	font-weight: 500;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Breadcrumb */

section.section.breadcrumb-section.is-small {
	background-color: var(--breadcrumb-background);
	box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
	padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.breadcrumb .breadcrumb-item, .breadcrumb a {
    color: var(--breadcrumb-text);
	font-weight: 500;
}

.breadcrumb a:hover {
    color: var(--breadcrumb-text-hover);
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Home */

.has-background-custom-1 {
	background-color: var(--fourth);
}

.banner-list {
	line-height: 3.25rem;
}

.banner-sub-title {
	font-size: 3.25em !important;
	margin-bottom: 2rem !important;
}

.list-items {
	color: var(--secondary);
	font-size: 1.75rem;
}

.list-items i {
	margin-right: 1.25rem;
}

.list-items i.fa-mouse-pointer {
	margin-right: 1.75rem;
}

.banner-col-2 {
	height: 100%;
    align-items: end;
    display: flex;
}

.banner-text {
	font-size: 1.25rem;
	width: 80%;
	margin-bottom: 2rem !important;
}

.section-benefits {
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
	background-color: rgb(236, 233, 245);
}

.benefits-icon {
	font-size: 2em;
	color: var(--primary);
	margin-bottom: 1rem !important;
}

.benefits-text {
	font-size: 1.75rem;
	color: var(--fourth);
}

#section-arrow {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
	z-index: 2;
	position: absolute;
}

.fa-angle-double-down {
	font-size: 2em;
	color: var(--fourth);
}

.homeFeaturedCategoriesWrapper .bestsellers h3 {
    display: none;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Categories */

.homeFeaturedCategoriesWrapper {
	background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0)), url('/-1057499124/Handler/Picture/GU/F/ThemeImages/caters_category_background.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.homePageCategories.clearfix .catfish-container .listWrapper.columns.is-mobile.is-multiline.clearfix {
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.homeFeaturedCategoriesWrapper .small-product-item .category-item {
    position: absolute;
    top: 25%;
    height: 50%;
    width: 100%;
	border-radius: 5rem;
	align-content: center;
	box-shadow: rgba(0, 0, 0, 0.16) 10px 10px 6px, rgba(0, 0, 0, 0.23) 10px 10px 6px;
}

.homeFeaturedCategoriesWrapper .small-product-item .category-item .product-title {
	display: flex;
    justify-content: center;
}

.homeFeaturedCategoriesWrapper .small-product-item .category-item .product-title a {
    cursor: pointer;
    color: var(--white);
    font-size: 2.75rem;
    font-weight: 600;
	letter-spacing: 2px;
}

.homeFeaturedCategoriesWrapper .small-product-item .category-item .product-title {
        transform: none;
        transition: none;
        opacity: initial;
    }

.homePageCategories.clearfix .listItem.grid_3.column.is-6-mobile.is-6-tablet.is-3-widescreen:hover {
    transition: 0.2s;
    transform: scale(1.05);
}

.homeFeaturedCategoriesWrapper .listWrapper .listItem .small-product-item .category-item .picture img {
    object-fit: initial;
	border-radius: 5rem;
}

.listItem.grid_3.column.is-6-mobile.is-6-tablet.is-3-widescreen.item_1 > div > div > .picture img {
	background: var(--cat-item-background-starter);
}

.listItem.grid_3.column.is-6-mobile.is-6-tablet.is-3-widescreen.item_2 > div > div > .picture img {
	background: var(--cat-item-background-feast);
}

.listItem.grid_3.column.is-6-mobile.is-6-tablet.is-3-widescreen.item_3 > div > div > .picture img {
	background: var(--cat-item-background-banquet);
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Sub-Categories */

.sub-category-grid .listWrapper .item-box {
    filter: drop-shadow(2px 4px 6px rgb(151,131,120,0.2));
    -webkit-filter: drop-shadow(2px 4px 6px rgb(151,131,120,0.2));
	border-top: 0px;
}

.sub-category-grid .listWrapper .item-box .sub-category-item {
    background: var(--subcat-item-background);
}

.sub-category-grid .listWrapper .item-box .sub-category-item .category-title {
    padding: 1.5rem 0.5rem;
    transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    background: var(--subcat-title-background);
}

.sub-category-grid .listWrapper .item-box .sub-category-item .category-title a {
    color: var(--subcat-title-text);
	font-size: 1rem;
	font-weight: 600;
}

.category-subcategory-section.section .listItem.grid_3.column.is-6-mobile.is-6-tablet.is-3-widescreen:hover {
	transition: 0.2s;
    transform: scale(1.01);
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Products */

/* .arone-category-page { */
	/* background: linear-gradient(90deg, rgba(226,233,245,1) 0%, rgba(203,251,235,1) 25%, rgba(255,196,200,1) 50%, rgba(255,86,133,1) 75%, rgba(121,220,238,1) 100%); */
/* } */

h2 .product-title a {
	color: var(--primary);
}

.catfish-default-product-box {
    background: rgba(255, 255, 255, 0.4);
    border-radius: 1rem;
	padding: 1rem;
	box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}

.picture img {
	border-radius: 1rem;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Footer */

.catfish-footer {
	background-color: var(--footer-background);
	padding-top: 3rem;
	padding-bottom: 0px;
}

.catfish-footer #footerrow {
	margin-bottom: 1rem;
}

.catfish-footer ul a{
	font-weight: 500;
	padding-bottom: 0.25rem;
	color: var(--footer-text);
}

.catfish-footer ul a:hover {
    color: var(--footer-text-hover);
}

.footercopyrightrow {
	background-color: var(--footer-copyright-background);
	margin-top: 3rem;
}

.footer-copyright-text {
	font-weight: 500;
}

.footer-copyright-text a {
	color: var(--footer-copyright-text);
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Basket */

.shoppingcart__wrapper .cart-footer .checkout-buttons .checkout-buttons__wrapper 
.savebasketbutton, .shoppingcart__wrapper .cart-footer .checkout-buttons 
.checkout-buttons__wrapper .continueshoppingbutton {
    background-color: var(--primary);
    border-color: var(--white);
    color: var(--button-main);
}

.shoppingcart__wrapper .cart-footer .checkout-buttons .checkout-buttons__wrapper .savebasketbutton:hover, .shoppingcart__wrapper 
.cart-footer .checkout-buttons .checkout-buttons__wrapper .savebasketbutton.is-hovered, .shoppingcart__wrapper .cart-footer .checkout-buttons 
.checkout-buttons__wrapper .savebasketbutton:focus, .shoppingcart__wrapper .cart-footer .checkout-buttons .checkout-buttons__wrapper 
.savebasketbutton.is-focused, .shoppingcart__wrapper .cart-footer .checkout-buttons .checkout-buttons__wrapper .continueshoppingbutton:hover, 
.shoppingcart__wrapper .cart-footer .checkout-buttons .checkout-buttons__wrapper .continueshoppingbutton.is-hovered, .shoppingcart__wrapper 
.cart-footer .checkout-buttons .checkout-buttons__wrapper .continueshoppingbutton:focus, .shoppingcart__wrapper .cart-footer .checkout-buttons 
.checkout-buttons__wrapper .continueshoppingbutton.is-focused {
    background-color: var(--primary);
    color: var(--white);
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Buttons */

.catfish-button, .button {
    color: var(--buttons-color);
	background-color: var(--buttons-background);
    font-weight: bold;
	border: 0px;
	border-radius: 8px;
}

.catfish-button:active, .catfish-button.is-active, .button:active, .button.is-active,
.catfish-button:hover, .catfish-button.is-hovered, .button:hover, .button.is-hovered {
    border: 0px;
    color: var(--buttons-hover-color);
    background: var(--buttons-hover-background);
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Misc */

/* Remove the afterMainContainer section to reduce page size */
.afterMainContainer-inner {
	display: none;
}

/* Amend the width of the reference text box on the order reference page */
.payment-info .body table tbody tr td {
	width: 200px;
	width: 100%;
}

/* Megaedit Preview - Amend the colour of the arrow buttons */
.cf_imageViewer_prev:before, .cf_imageViewer_next:before {
    color: var(--arrow-buttons-color) !important;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Animation */

@keyframes rotate-bg {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

/* --------------------------------------------------------------------------------------------------------------------------------------------- Media Queries */

@media screen and (max-width: 767px) {
	/* .is-header-logo { */
		/* height: 3.5rem; */
	/* } */
	
	.column.is-6-mobile {
		width: 100%;
	}
	
	.footer-content {
		justify-content: center!important;
	}
	
	.banner-text {
		width: 90%;
	}
	
	.banner-content {
		background-position: left !important;
	}
	
	.section-benefits {
		padding-top: 3rem;
		padding-bottom: 3rem;
	}
}

@media screen and (min-width: 768px), print {
    .navbar {
        height: 7.71429em;
    }
	
	.navbar-burger {
        height: 7.71429em;
    }
	
	.navbar>.container {
        height: 7.71429em;
    }
}

@media screen and (min-width: 1088px) and (min-width: 768px) {
    
}

@media screen and (min-width: 1088px) {
	a.navbar-text {
		color: var(--navbar-text);
	}	
	
	.header-categories .navbar-dropdown .navigationmenu {
		padding-left: 0;
	}
}