@charset "utf-8";
/* CSS Document */

/*
Poppins

ExtraLight 	200
Light 		300
Regular 	400
Medium 		500
SemiBold 	600
Bold 		700
ExtraBold 	800
Black 		900
*/




body 				{color: #333333; background-color: #FFFFFF; font-size: 1rem; font-family: "Readex Pro", sans-serif;}

h1, h2, h3, h4, h5	{color: #000000; font-weight: 700;}
h1					{}
h2					{}
h3					{}
h4					{}
h5					{}

strong				{font-weight: 600;}

a					{text-decoration:none; color: #000000; transition: 0.5s;}
a:hover				{text-decoration:none; color: #333333;}
a:visited			{text-decoration:none;}
a:focus,a:hover		{text-decoration:none;}

:root {
	--def-padding : 6rem;
	--cream-color : #E9E4D0;
	--light-cream-color : #fffdf3;
	--khakhi-color : #cc8f62;
	--green-color : #215630;
}

.navbar-toggler-icon 		{background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(205, 143, 99, 0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");}
.navbar-toggler				{border-color: rgba(205,143,99,0.30);}

.text-bg-dark				{background-color: #E9E4D0 !important;}


.offcanvas.offcanvas-end	{width: 300px;}


.page			{}


.menu-area .navbar-brand img 				{width: 150px;}
.menu-area .navbar-nav 						{align-items: center;}
.menu-area .navbar .navbar-nav .nav-link 	{padding: 0.5em 2em; text-align: center; font-weight: 500; font-size: 112.5%;}
.menu-area .nav-link						{color: #CD8F63;}
.menu-area .nav-link:focus,
.menu-area .nav-link:hover 					{color: #CD8F63;}

.navbar .navbar-nav .navbar-brand	{margin-right: 0; padding: 0; display: inline-block;}
.menu-area .navbar					{padding-top: 0; padding-bottom: 0; }
.menu-area .navbar-brand			{padding: 0;}

.menu-area .navbar .navbar-nav .nav-link span 	{display: inline-block;}

.menu-area .nav-link span::after 				{content: ''; display: block; width: 0; height: 2px; background: #CD8F63; transition: width .3s;}
.menu-area .nav-link span:hover::after 		{width: 100%;}


.menu-area				{position: fixed; top: 0; left: 0; z-index: 50; background-color: rgba(233,228,208,0.95); width: 100%; padding-top: 0.75rem; padding-bottom: 0.75rem; -webkit-transition: all 0.3s ease; transition: all 0.3s ease;}
.menu-area.sticky		{padding-top: 0.5rem; padding-bottom: 0.5rem; background-color: rgba(233,228,208,1); -webkit-box-shadow: 0px 5px 10px -5px rgba(0,0,0,0.5); box-shadow: 0px 5px 10px -5px rgba(0,0,0,0.1);}


.banner-area				{}
.swiper-caption				{position: absolute; right: 10%; bottom: 10%;}
.swiper-caption .line-a	 	{margin-bottom: 1rem; font-size: 400%; color: #FFFFFF; font-weight: 700; line-height: normal;}
.swiper-caption .line-b	 	{margin-bottom: 1rem; font-size: 125%; color: #FFFFFF; line-height: normal;}
.swiper-caption .line-c	 	{line-height: normal;}

.swiper-caption .line-c a	{line-height: normal; display: inline-block; padding: 0.75rem 2rem; background-color: var(--cream-color); color: var(--green-color); border-radius: 0.5rem;}


.swiper-caption .line-c a 	{-webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; overflow: hidden;}
.swiper-caption .line-c a:before {content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0;  background: var(--green-color); -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
.swiper-caption .line-c a:hover,
.swiper-caption .line-c a:focus,
.swiper-caption .line-c a:active 			{color: var(--cream-color);}
.swiper-caption .line-c a:hover:before,
.swiper-caption .line-c a:focus:before,
.swiper-caption .line-c a:active:before 	{-webkit-transform: scaleX(1); transform: scaleX(1);}



@keyframes fade-in {
from {opacity: 0; transform: translateY(50px);}
to {opacity: 1; transform: translateY(0);}
}

.swiper-slide .swiper-caption			{}
.swiper-slide-active .swiper-caption .line-a	{animation-name: fade-in; animation-duration: 0.5s; animation-delay: 0.5s; animation-fill-mode: both;}
.swiper-slide-active .swiper-caption .line-b	{animation-name: fade-in; animation-duration: 0.5s; animation-delay: 0.6s; animation-fill-mode: both;}
.swiper-slide-active .swiper-caption .line-c	{animation-name: fade-in; animation-duration: 0.5s; animation-delay: 0.7s; animation-fill-mode: both;}


.banner-area .swiper-slide				{overflow: hidden;}
.swiper-slide .banner-img 				{transform: scale(1.1); transition: all 0.8s ease-out;}
.swiper-slide-active .banner-img		{transform:scale(1);}


.banner-area .swiper-pagination-bullet			{background-color: #FFFFFF; opacity: 1;}
.banner-area .swiper-pagination-bullet-active	{background-color: var(--khakhi-color);}




.joy-of-baking			{padding-top: 10rem; padding-bottom: 10rem; background-color: var(--cream-color);}
.joy-of-baking h1 		{color: var(--green-color);}

.job-left				{position: relative; width: 100%; height: 100%;}
.job-left .line-a		{position: absolute; right: 0; top: 0; z-index: 3; width: 55%;}
.job-left .line-b		{position: absolute; left: 0; top: 20%; z-index: 2; width: 55%;}
.job-left .line-c		{position: absolute; left: 25%; top: -20%; z-index: 1;}




.job-left .line-a img,
.job-left .line-b img 	{border-top-left-radius: 15rem; border-top-right-radius: 15rem;}




.our-menu				{padding-top: var(--def-padding); padding-bottom: 2rem; background-color: var(--light-cream-color);}
.our-menu h1			{color: var(--khakhi-color);}

.our-menu-block			{border: 1px solid var(--khakhi-color); padding: 5px; border-top-left-radius: 10rem; border-top-right-radius: 10rem; position: relative;}
.our-menu-block .db		{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 9999;}
.our-menu-block .title	{position: absolute; top: 50%; left: 50%; width: auto; padding: 0.75rem 1rem; text-align: center; background-color: var(--green-color); color: #FFFFFF; border-radius: 0.5rem; transform: translateY(-50%); transform: translateX(-50%);}

.our-menu-block .our-menu-img img 		{border-top-left-radius: 10rem; border-top-right-radius: 10rem;}







.cake-types					{padding-top: var(--def-padding); padding-bottom: var(--def-padding); background-color: var(--cream-color);}
.cake-types .nav			{width: 100%; padding-right: 2rem; border-right: 2px solid var(--khakhi-color)}
.cake-types .nav .nav-item	{width: 100%;}

.cake-types .nav-pills .nav-link.active,
.cake-types .nav-pills .show>.nav-link 		{background-color: transparent; color: #000000; font-weight: 600;}

.cake-types .nav-link		{display: inline-block; width: 100%; color: #666666; text-align: right; position: relative;}

.cake-types .nav-pills .nav-link.active::after	{content: ""; position: absolute; right: -51px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; background-image: url("../images/our-menu/after.png"); background-repeat: no-repeat;}



.cake-type-block					{text-align: center; }
.cake-type-block .cake-type-img		{margin-bottom: 1rem;}
.cake-type-block .cake-type-desc	{}

.cake-type-block .cake-type-img img {border-radius: 2rem;}





.our-catering-title		{padding-top: 2rem; padding-bottom: 2rem; background-color: var(--light-cream-color);}
.our-catering-title h1 	{color: var(--khakhi-color);}

.our-catering			{background-color: var(--light-cream-color); position: relative;}



.our-catering-block-wrap				{position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%;}
.our-catering .our-catering-block		{padding: 10rem 5rem 5rem 5rem; background-color: rgba(233,228,208,0.90); border-top-right-radius: 25rem; border-top-left-radius: 25rem;}
.our-catering .our-catering-block h5 	{color: var(--green-color);}
.our-catering .our-catering-block ul 	{padding: 0; margin: 0; list-style: none;}
.our-catering .our-catering-block ul li {padding-top: 1rem; padding-bottom: 1rem; display: block;} 
.our-catering .our-catering-block ul li:last-child {padding-bottom: 0;}

.our-catering .our-catering-block ul li a 		{display: inline-block; color: var(--khakhi-color);}
.our-catering .our-catering-block ul li a:hover	{ color: var(--green-color);}



.our-catering .our-catering-block ul li a::after 		{content: ''; display: block; width: 0; height: 1px; background-color: var(--green-color); transition: width .3s;}
.our-catering .our-catering-block ul li a:hover::after 	{width: 100%;}





.image-big-list					{list-style:none; margin:0; padding:0;}
.image-big-list-item.active 	{display:block;}
.image-big-list-item 			{display:none; margin: 0 auto; text-align:center;}
.image-big-list-item img 		{transition: background 0.03s;}

.image-big-list-item 			{animation: fadeIn 0.5s;}
@keyframes fadeIn {
	0% {opacity: 0.5;}
	100% {opacity: 1;}
}




.image-small-list-item img 			{border: 3px solid #fff;}
.image-small-list-item.active img 	{border: 3px solid #ddd;}
.image-small-list-item 				{display:inline-block; margin: 0 3px;}
.page-container 					{width:960px; margin: 0 auto;}












.address-area 						{background-color: var(--cream-color);}
.address-area .address-area-left	{padding: 5rem; text-align: center; color: #747273;}
.address-area .address-area-left a  {color: #747273;}
.address-area .tray-holding			{width: 100%;}

.address-area-left .line-a			{margin-bottom: 2rem;}
.address-area-left .line-b			{margin-bottom: 1rem;}
.address-area-left .line-c			{margin-bottom: 1rem;}
.address-area-left .line-d			{margin-bottom: 1rem;}
.address-area-left .line-e			{margin-bottom: 1rem;}
.address-area-left .line-f			{margin-bottom: 0rem;}

.address-area-left .line-c a:hover	{color: var(--green-color);}

.address-area-left .line-d a 		{font-size: 125%;}
.address-area-left .line-d a:hover 	{color: var(--green-color);}
.address-area-left .line-d .list-inline-item:not(:last-child) {margin-right: 1rem;}


.address-area-left .line-f a 		{color: var(--green-color);}
.address-area-left .line-f a:hover 	{color: #000000;}


.footer			{background-color: #D9DDCE; padding-top: 1rem; padding-bottom: 1rem; font-size: 87.5%;}









/* ===== PRELOADER ===== */
#preloader	{position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--cream-color); z-index: 9999;}
#status		{width: 150px; height: 150px; position: absolute; left: 50%; top: 50%; margin: -75px 0 0 -75px;}

.floating 	{animation-name: floating; animation-duration: 3s; animation-iteration-count: infinite; animation-timing-function: ease-in-out;}
@keyframes floating	{
    from { transform: translate(0,  0px); }
    65%  { transform: translate(0, 15px); }
    to   { transform: translate(0, -0px); }
}
/* ===== PRELOADER ===== */










/* ----------- Non-Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) {
	  
.menu-area::after	{top: 47%; width: 75%;}
	  
}

/* ----------- Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) {
	  
	  

	  
	  
}


/* Laptop - For 1366 Resolution */
@media only screen
and (min-width: 1030px)
and (max-width: 1366px)
{
	

	
}


/* Laptop  - For 1024 Resolution */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
{
	
body 				{font-size: 87.5%;}
	
	





	
	
	
}


/* iPad Landscape */
@media only screen   
and (orientation : landscape)   
and (-webkit-min-device-pixel-ratio: 2)  
and (min-width : 768px)   
and (max-width : 1024px)   
{
	
body 				{font-size: 87.5%;}
	
	
.menu-area .navbar-brand img 	{width: 100px;}
.menu-area .navbar-brand 		{margin-right: 0;}

	
.swiper-caption				{left: 5%; bottom: 5%;}
.swiper-caption .line-a	 	{font-size: 300%;}
.swiper-caption .line-b	 	{font-size: 100%;}
	
	
.job-left .line-a		{right: 0; top: 0; width: 55%;}
.job-left .line-b		{left: 0; top: 15%; width: 55%;}
.job-left .line-c		{left: 25%; top: -15%;}		



.address-area .address-area-left	{padding: 2rem;}
	
	
.our-catering .our-catering-block		{padding: 7rem 3rem 1rem 3rem;}
.our-catering .our-catering-block ul li {padding-top: 0.25rem; padding-bottom: 0.25rem;}

	
}


/* iPad Portrait */
/* Orientation : Portrait */  
@media only screen   
and (orientation : portrait)   
and (-webkit-min-device-pixel-ratio: 2)   
and (min-width : 768px)   
and (max-width : 1024px)  
{

body 				{font-size: 87.5%;}
	
	
.menu-area .navbar-brand img 	{width: 100px;}
.menu-area .navbar-brand 		{margin-right: 0;}

	
	
.swiper-caption				{left: 5%; bottom: 5%;}
.swiper-caption .line-a	 	{font-size: 300%;}
.swiper-caption .line-b	 	{font-size: 100%;}
.swiper-caption .line-c	 	{}
	
	

.job-left .line-a		{right: 0; top: 0; width: 55%;}
.job-left .line-b		{left: 0; top: 15%; width: 55%;}
.job-left .line-c		{left: 25%; top: -15%;}	
	
	
.address-area .address-area-left	{padding: 2rem;}	
	
	
	
.our-catering .our-catering-block		{padding: 7rem 3rem 1rem 3rem;}
.our-catering .our-catering-block ul li {padding-top: 0.25rem; padding-bottom: 0.25rem;} 	

	
	
	
}

/* Generally, this dimension is recommended for mobile: - For 640 Resolution */  
@media only screen   
and (min-width : 360px)   
and (max-width : 640px)  
{
	
body 				{font-size: 87.5%;}
	
	
.menu-area .navbar-brand img 	{width: 100px;}
.menu-area .navbar-brand 		{margin-right: 0;}
	
	
.menu-area				{padding-top: 0.5rem; padding-bottom: 0.5rem;}
.menu-area.sticky		{padding-top: 0.25rem; padding-bottom: 0.25rem;}	

	
	
.banner-area			{margin-top: 70px;}

.swiper-caption				{left: 5%; bottom: 5%;}
.swiper-caption .line-a		{margin-bottom: 0rem; font-size: 250%;}
.swiper-caption .line-b		{margin-bottom: 0.5rem; font-size: 100%;}
.swiper-caption .line-c a	{padding: 0.5rem 1rem;}

	
	
.address-area .address-area-left		{padding: 1rem;}
	
	
.our-catering .our-catering-block		{padding: 1rem 1rem 1rem 1rem; border-top-right-radius: 1rem; border-top-left-radius: 1rem;}	
.our-catering .our-catering-block ul li {padding-top: 0.15rem; padding-bottom: 0.15rem;} 
	
	
}

/* Mobile - For 480 Resolution */
@media only screen
and (min-width : 320px)
and (max-width : 480px)
{
	
body 				{font-size: 87.5%;}
	
	
.menu-area .navbar-brand img 	{width: 100px;}
.menu-area .navbar-brand 		{margin-right: 0;}
	
	
.menu-area				{padding-top: 0.5rem; padding-bottom: 0.5rem;}
.menu-area.sticky		{padding-top: 0.25rem; padding-bottom: 0.25rem;}	

	
	
.banner-area			{margin-top: 70px;}

.swiper-caption				{left: 5%; bottom: 5%;}
.swiper-caption .line-a		{margin-bottom: 0rem; font-size: 250%;}
.swiper-caption .line-b		{margin-bottom: 0.5rem; font-size: 100%;}
.swiper-caption .line-c a	{padding: 0.5rem 1rem;}
	
	
	
.job-left				{position: relative; width: 100%; height: 100%;}
.job-left .line-a		{position: static; width: 50%; float: right;}
.job-left .line-b		{position: static; width: 50%; float: left; margin-top: 3rem;}
.job-left .line-c		{position: absolute; left: 25%; top: -15%; z-index: 1;}	

	
	
.address-area .address-area-left		{padding: 1rem;}	
	
	

.our-catering .our-catering-block		{padding: 1rem 1rem 1rem 1rem; border-top-right-radius: 1rem; border-top-left-radius: 1rem;}	
.our-catering .our-catering-block ul li {padding-top: 0.15rem; padding-bottom: 0.15rem;}
	
	
	
.cake-types .nav						{width: auto; padding-right: 0rem; border-right: none;}
.cake-types .nav .nav-item				{width: auto; margin-bottom: 1%; margin-right: 1%; height: 100%;}
.cake-types .nav .nav-item:last-child 	{margin-bottom: 0; margin-right: 0;}

.cake-types .nav-pills .nav-link.active,
.cake-types .nav-pills .show>.nav-link 		{background-color: var(--khakhi-color); color: #FFFFFF;}

.cake-types .nav-link		{width: 100%; color: #666666; text-align: inherit; position: static; background-color: var(--light-cream-color); height: 100%;}

.cake-types .nav-pills .nav-link.active::after	{content: none;}



.cake-type-block					{text-align: center; }
.cake-type-block .cake-type-img		{margin-bottom: 1rem;}
.cake-type-block .cake-type-desc	{}

.cake-type-block .cake-type-img img {border-radius: 2rem;}	
	



}
