/*
	GENERAL
======================================================================================================================== */
/* CTA
------------------------------------------------------------*/
a.cta {
	display: inline-block; padding-top: 15px; padding:12px 40px;
	font-size: 22px; font-style:normal; font-family: 'Raleway-Light';  text-decoration: none;
	box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.15); border-radius: 3px;
	transition: .3s ease background;
}
a.cta.cta-main { background: #F9AF4D; color: #fff; }
a.cta.cta-main:hover { background: #FFA52C; }
a.cta.cta-secondary { background: #fff; color: #5C4B51; }
a.cta.cta-secondary:hover { background: #EFEBEC; }
strong { font-weight: normal }





/*
	SECTION: HEADER
======================================================================================================================== */
#front-header {
	min-height: 957px; position: relative;
	background: #DEDAD7 url('/header-daniel.jpg') no-repeat center top /cover;
	text-align: center;
}
@media (min-height:1px) and (max-height:778px) {
	#front-header { height: 100vh; min-height: 500px; }
}

#front-header h1 {
	font-size: 40px; line-height: 120%; font-family: 'Raleway-Regular', sans-serif; font-style:normal; font-family: 'Raleway-SemiBold';  color: #5C4B51; text-shadow: 0 1px rgba(255, 255, 255, 0.5);
	margin: 0 auto 2%;
}
#front-header h2 {
	font-family: 'Raleway-Light'; font-size: 34px; font-style:normal; font-family: 'Raleway-Light';  color: #5C4B51; text-shadow: 0 1px rgba(255, 255, 255, 0.5);
	margin: 0 auto 3%; padding: 0 0 3%;
}

#front-header div.scroll-hint {
	position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%);
}
#front-header div.scroll-hint span { color: #fff; font-size: 18px; display: inline-block; margin: 0 0 10px; }
#front-header div.scroll-hint img { margin: 0 auto; }

#front-header a.cta { width: 240px; padding-left: 0; padding-right: 0; }
#front-header a.cta.cta-main { margin-right: 5px; }
#front-header a.cta.cta-secondary { margin-left: 5px; }




/*
	SECTION: HOW IT WORKS
======================================================================================================================== */
#front-how-it-works { padding: 100px 0 100px; min-height: 720px; position: relative; text-align: center; background: #F5F4F4; }
#front-how-it-works h3.section-title { color: #F06060; font-style:normal; font-family: 'Raleway-Light';  font-size: 48px; line-height: 100%; margin: 0 0 100px }

#front-how-it-works .side-image { position: absolute; }
#front-how-it-works .side-image.left { left: 0; top: 50%; transform: translateY(-50%); z-index: 1; }
#front-how-it-works .side-image.right { right: 0; bottom: 0; }

/* COLS */
#front-how-it-works .container { z-index: 10 }
#front-how-it-works h4 { margin: 0 0 20px; font-size: 30px; font-style:normal; font-family: 'Raleway-Light';  }
#front-how-it-works h4 strong{ font-style:normal; font-family: 'Raleway-SemiBold';  }
#front-how-it-works p { margin: 0; font-size: 17px; line-height: 160%; }

#front-how-it-works .col-lg-4 { position: relative }
#front-how-it-works .col-lg-4 .hint {
	position: absolute; left:51%; top: -35px; height: 37px; padding-left: 26px;
	background: url('/hiw-arrow-daniel.png') no-repeat left bottom;
	font-family: 'Shadows Into Light', cursive; color: #F06060; font-size: 20px;
}

#front-how-it-works .row.cta { margin-top: 80px}




/*
	SECTION: ADDITIONAL TEXT
======================================================================================================================== */
section.additional-text.text-1 { text-align: center; width: 100%; }
section.additional-text.text-1 ul { list-style: none; margin: 0 auto; padding: 0; }
section.additional-text.text-1 ul li {
	display: inline-block; padding: 15px 25px;
	text-align: center; color: #ACA3A6; font-size: 24px; font-style:normal; font-family: 'Raleway-Light';
	border-right: 1px solid #F5F4F4;
}
section.additional-text.text-1 ul li:last-child { border: none; }




/*
	SECTION TWO: CTA MEET OUR COOKIES
======================================================================================================================== */
section#front-cta-meet-our-cookies { background: #5C4B51; color: #fff; position: relative; }
section#front-cta-meet-our-cookies .left { width: 55%; float: left; }
section#front-cta-meet-our-cookies .left img { width: 100% }
section#front-cta-meet-our-cookies .right { width: 45%; float: left;  padding: 0 90px 0; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }

section#front-cta-meet-our-cookies h3 { font-size: 28px; font-style:normal; font-family: 'Raleway-SemiBold';  margin: 0 0 25px; }
section#front-cta-meet-our-cookies p { font-size: 22px; font-style:normal; font-family: 'Raleway-Light';  margin: 0 0 20px; }

section#front-cta-meet-our-cookies a.cta { margin-top: 20px; }




/*
	SECTION THREE: GIFT OCCASIONS
======================================================================================================================== */
section#front-gift-occasions { padding: 110px 0 160px; min-height: 785px; background: #F5F4F4; position: relative; text-align: center; }

section#front-gift-occasions h3 { font-size: 36px; font-style:normal; font-family: 'Raleway-Light';  margin: 0 0 90px; }
section#front-gift-occasions h3 strong { font-style:normal; font-family: 'Raleway-SemiBold';  }

section#front-gift-occasions .side-image { position: absolute; top: 50%; transform: translateY(-50%); }
section#front-gift-occasions .side-image.left { left: 0; width: 230px; }
section#front-gift-occasions .side-image.right { right: 0; width: 180px; }

/* OCCASION CIRCLES */
section#front-gift-occasions .row-1 { margin-bottom: 30px;}
section#front-gift-occasions .row-1 .wrap { width: 780px; }
section#front-gift-occasions .row-2 .wrap { width: 980px; }
section#front-gift-occasions .wrap { margin: 0 auto; }

section#front-gift-occasions .occasion-list a {
	float: left; display: block; width: 183px; height: 183px; padding-top: 67px; margin: 0 6px;
	border-radius: 999px; box-shadow: 5px 8px 17px 0px #E6DFDF; border-width: 5px; border-style: solid; border-color: transparent;
	font-style:normal; font-family: 'Raleway-SemiBold';  text-decoration: none; font-size: 18px; line-height: 120%;
	transition: .4s ease all;
}
section#front-gift-occasions .occasion-list a:hover { box-shadow: 0px 0px 30px 0px #CEC4C4; }


section#front-gift-occasions .occasion-list a.orange { background: #F9AF4D; color: #fff; }
section#front-gift-occasions .occasion-list a.orange:hover { border-color: #fff; }
section#front-gift-occasions .occasion-list a.white { background: #fff; color: #5C4B51; }
section#front-gift-occasions .occasion-list a.white:hover { border-color: #F9AF4D;  }




/*
	SECTION FOUR: INFO MESSAGE
======================================================================================================================== */
section#front-info-message { padding: 70px 0 100px; background: #5C4B51 url('/section-five-bg-daniel.png') no-repeat bottom center; }
section#front-info-message p { width: 536px; margin: 0 auto 20px; text-align: center; color: #fff; font-size: 18px; line-height: 170%}
section#front-info-message p.title { font-style:normal; font-family: 'Raleway-SemiBold';  font-size: 24px; margin: 0 auto 20px; }
section#front-info-message p a { color: #F3B562; }




















/*
	MEDIA QUERIES
======================================================================================================================== */
@media (min-width: 480px), (max-width: 480px) {

	/* HEADER
	------------------------------------------------------------*/
	#front-header { min-height: 450px; padding-top: 60px; }
	#front-header h1 { font-size: 24px; margin: 0; }
	#front-header h2 { font-size: 18px; }

	#front-header a.cta { width: 240px; }

	#front-header a.cta.cta-main { margin: 15px 0 15px; }
	#front-header a.cta.cta-secondary { margin: 0; }

	/* HOW IT WORKS
	------------------------------------------------------------*/
	#front-how-it-works { padding: 40px 0; min-height: auto; }
	#front-how-it-works h3.section-title { font-size: 30px; margin: 0 0 80px }
	#front-how-it-works h4 { margin: 0 0 15px; font-size: 20px; }
	#front-how-it-works p { font-size: 14px; }
	#front-how-it-works .col-lg-4 { margin-bottom: 80px; }
	#front-how-it-works .col-lg-4:last-child { margin-bottom: 40px; }
	#front-how-it-works .row.cta { margin-top: 0; }

	/* GIFT OCCASIONS
	------------------------------------------------------------*/
	section#front-gift-occasions { padding: 40px 0; min-height: auto; }
	section#front-gift-occasions h3 { font-size: 24px; margin: 0 0 30px; }

	section#front-gift-occasions .row-1 { margin-bottom: 0; }
	section#front-gift-occasions .row-1 .wrap,
	section#front-gift-occasions .row-2 .wrap { width: 100%; }
	section#front-gift-occasions .occasion-list a { width: 100%; height: auto; padding-top: 15px; padding-bottom: 15px; margin: 0 0 15px; border-radius: 5px; border-width: 2px; font-size: 16px; }
	section#front-gift-occasions .occasion-list a br { display: none }

	/*section#front-gift-occasions .occasion-list a.orange { background: #fff; color: #5C4B51; }
	section#front-gift-occasions .occasion-list a.orange:hover { border-color: #F9AF4D; }*/

	/* SECTION FOUR: INFO MESSAGE
	------------------------------------------------------------*/
	section#front-info-message { padding: 40px 0 60px; }
	section#front-info-message p { width: auto; padding: 0 5px; font-size: 14px; line-height: 150%; }
	section#front-info-message p.title { font-size: 20px; }

	/* MISC
	------------------------------------------------------------*/
	section.additional-text.text-1 { display: none }

}
/* END OF MIN & MAX 480
------------------------------------------------------------------------------------------------------------------------ */

/* FIX: HEADER */
@media (min-width:1px) and (max-width:550px) {
	#front-header h1, #front-header h2 { /*background: rgba(255, 255, 255, 0.7); border-radius: 3px;*/ padding: 6px 6px;  }
}
@media (min-width:1px) and (max-width:768px) {
	#front-header h1, #front-header h2 { /*background: rgba(255, 255, 255, 0.7); border-radius: 3px;*/ padding: 6px 6px;  }
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(1),
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(3),
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(5) { background: #F9AF4D; color: #fff; }
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(1):hover,
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(3):hover,
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(5):hover { border-color: #fff; }

	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(2),
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(4) { background: #fff; color: #5c4b51; }
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(2):hover,
	section#front-gift-occasions .occasion-list.row-2 a:nth-of-type(4):hover { border-color: #F9AF4D; }
}












@media (min-width: 768px) {

	/* HEADER
	------------------------------------------------------------*/
	#front-header { min-height: 800px; padding-top: 190px; }
	#front-header h1 { font-size: 30px; margin: 0 0 8px; }
	#front-header h2 { font-size: 24px; }

	#front-header a.cta { width: 240px; }

	#front-header a.cta.cta-main { margin: 0 5px 0 0; }
	#front-header a.cta.cta-secondary { margin: 0 0 0 5px; }

	/* HOW IT WORKS
	------------------------------------------------------------*/
	#front-how-it-works { padding: 80px 0 100px; min-height: 720px; }
	#front-how-it-works h3.section-title { font-size: 40px; margin: 0 0 100px }
	#front-how-it-works h4 { margin: 0 0 10px; font-size: 24px; }
	#front-how-it-works p { font-size: 16px; }
	#front-how-it-works .col-lg-4 { margin-bottom: 100px; }
	#front-how-it-works .row.cta { margin-top: 0; }

	/* GIFT OCCASIONS
	------------------------------------------------------------*/
	section#front-gift-occasions { padding: 80px 0 100px; min-height: auto; }
	section#front-gift-occasions h3 { font-size: 30px; margin: 0 0 70px; }

	section#front-gift-occasions .row-1 { margin-bottom: 30px; }
	section#front-gift-occasions .row-1 .wrap { width: 570px; }
	section#front-gift-occasions .row-2 .wrap { width: 100%; }
	section#front-gift-occasions .wrap { margin: 0 auto; }
	section#front-gift-occasions .occasion-list a { width: 130px; height: 130px; padding-top: 50px; padding-bottom: 0; margin: 0 6px; border-radius: 999px; border-width: 2px; font-size: 14px; }
	section#front-gift-occasions .occasion-list a br { display: inherit }

	section#front-gift-occasions .occasion-list a.orange { background: #F9AF4D; color: #fff; }
	section#front-gift-occasions .occasion-list a.orange:hover { border-color: #fff; }

	/* SECTION FOUR: INFO MESSAGE
	------------------------------------------------------------*/
	section#front-info-message { padding: 70px 0 80px; }
	section#front-info-message p { width: 536px; padding: 0; font-size: 17px; line-height: 150%; }
	section#front-info-message p.title { font-size: 22px; }

	/* MISC
	------------------------------------------------------------*/
	section.additional-text.text-1 { display: inherit }
	section.additional-text.text-1 ul li { padding: 10px 20px; font-size: 18px; }
}
/* END OF 768
------------------------------------------------------------------------------------------------------------------------ */












@media (min-width: 768px), (min-width: 480px), (max-width: 480px) {

	/* HEADER
	------------------------------------------------------------*/
	#front-header div.scroll-hint { display: none }


}
/* END OF 768, MIN 480 and MAX 480
------------------------------------------------------------------------------------------------------------------------ */












@media (min-width: 992px) {

	/* HEADER
	------------------------------------------------------------*/
	#front-header { min-height: 750px; padding-top: 190px;  }
	#front-header h1 { font-size: 30px; margin: 0 0 8px; }
	#front-header h2 { font-size: 24px; padding: 0}

}
/* END OF 992
------------------------------------------------------------------------------------------------------------------------ */












@media (min-width: 1200px), (min-width: 992px) {

	/* HEADER
	------------------------------------------------------------*/
	#front-header div.scroll-hint { display: inherit }

	#front-header a.cta { width: 240px; }
	#front-header a.cta.cta-main { margin: 0 5px 0 0; }
	#front-header a.cta.cta-secondary { margin: 0 0 0 5px; }

	/* HOW IT WORKS
	------------------------------------------------------------*/
	#front-how-it-works { padding: 100px 0 100px; min-height: 720px; }
	#front-how-it-works h3.section-title { font-size: 48px; margin: 0 0 100px }
	#front-how-it-works h4 { margin: 0 0 20px; font-size: 30px; }
	#front-how-it-works p { font-size: 17px; }
	#front-how-it-works .col-lg-4 { margin-bottom: 0; }
	#front-how-it-works .row.cta { margin-top: 80px}

	/* GIFT OCCASIONS
	------------------------------------------------------------*/
	section#front-gift-occasions { padding: 110px 0 160px; min-height: 785px; }
	section#front-gift-occasions h3 { font-size: 36px; margin: 0 0 90px; }

	section#front-gift-occasions .row-1 { margin-bottom: 30px; }
	section#front-gift-occasions .row-1 .wrap { width: 780px; }
	section#front-gift-occasions .row-2 .wrap { width: 980px; }
	section#front-gift-occasions .wrap { margin: 0 auto; }
	section#front-gift-occasions .occasion-list a { width: 183px; height: 183px; padding-top: 67px; margin: 0 6px; padding-bottom: 0; border-radius: 999px; border-width: 5px; font-size: 18px; }
	section#front-gift-occasions .occasion-list a br { display: inherit }

	/* SECTION FOUR: INFO MESSAGE
		------------------------------------------------------------*/
	section#front-info-message { padding: 70px 0 100px; }
	section#front-info-message p { width: 536px; padding: 0; font-size: 18px; line-height: 170%; }
	section#front-info-message p.title { font-size: 24px; }


	/* MISC
	------------------------------------------------------------*/
	section.additional-text.text-1 { display: inherit }
	section.additional-text.text-1 ul li { padding: 15px 25px; font-size: 24px; }

}
/* END OF 1200 AND 992
------------------------------------------------------------------------------------------------------------------------ */












@media (min-width: 1200px) {

	/* HEADER
	------------------------------------------------------------*/
	#front-header { min-height: 957px; padding-top: 230px; }
	#front-header h1 { font-size: 40px; margin: 0 0 8px; }
	#front-header h2 { font-size: 34px; padding: 0}
}
/* END OF 1200
------------------------------------------------------------------------------------------------------------------------ */









/* FIX: SECTION ONE: HOW IT WORKS
------------------------------------------------------------*/
@media (min-width:1px) and (max-width:989px) {
	#front-how-it-works .side-image.left,
	#front-how-it-works .side-image.right { display: none; }
}
@media (min-width:989px) and (max-width:1024px) {
	#front-how-it-works .side-image.left { width: 130px; top: 20%; }
	#front-how-it-works .side-image.right { width: 100px}
}
@media (min-width:1025px) and (max-width:1300px) {
	#front-how-it-works .side-image.left { width: 50px }
	#front-how-it-works .side-image.right { width: 50px}
}
@media (min-width:1300px) and (max-width:1430px) {
	#front-how-it-works .side-image.left { width: 100px }
	#front-how-it-works .side-image.right { width: 100px}
}
@media (min-width:1430px) and (max-width:1540px) {
	#front-how-it-works .side-image.left { width: 150px }
	#front-how-it-works .side-image.right { width: 140px}
}


/* FIX: SECTION TWO: CTA MEET OUR COOKIES
------------------------------------------------------------*/
@media (min-width:1px) and (max-width:400px) {
	section#front-cta-meet-our-cookies .left { width: 100%; }
	section#front-cta-meet-our-cookies .right { width: 100%; padding: 30px 20px; height: 100%; transform: none; bottom: 0; top: inherit; background: rgba(93,77,82,0.87); text-align: center;}
	section#front-cta-meet-our-cookies .cta { display: none }
	section#front-cta-meet-our-cookies h3 { font-size: 22px; margin: 0 0 10px;  }
	section#front-cta-meet-our-cookies p { font-size: 14px; margin: 0 0 5px; }
}
@media (min-width:400px) and (max-width:800px) {
	section#front-cta-meet-our-cookies .left { width: 100%; }
	section#front-cta-meet-our-cookies .right { width: 100%; padding: 20px 15px; transform: none; bottom: 0; top: inherit; background: rgba(93,77,82,0.87); text-align: center;}
	section#front-cta-meet-our-cookies .cta { display: none }
	section#front-cta-meet-our-cookies h3 { font-size: 20px; margin: 0 0 10px;  }
	section#front-cta-meet-our-cookies p { font-size: 16px; margin: 0 0 5px; }
}
@media (min-width:800px) and (max-width:1100px) {
	section#front-cta-meet-our-cookies .left { width: 100%; }
	section#front-cta-meet-our-cookies .right { width: 100%; padding: 30px; transform: none; bottom: 0; top: inherit; background: rgba(93,77,82,0.87); text-align: center;}
	section#front-cta-meet-our-cookies h3 { font-size: 24px; margin: 0 0 10px;  }
	section#front-cta-meet-our-cookies p { font-size: 20px; margin: 0 0 5px; }
}
@media (min-width:1100px) and (max-width:1300px) {
	section#front-cta-meet-our-cookies .left { width: 50%; }
	section#front-cta-meet-our-cookies .right { width: 50%; padding: 0 70px 0; }
	section#front-cta-meet-our-cookies h3 { font-size: 24px; margin: 0 0 25px; }
	section#front-cta-meet-our-cookies p { font-size: 20px; margin: 0 0 20px; }
}


/* FIX: SECTION THREE: GIFT OCCASIONS
------------------------------------------------------------*/

@media (min-width:1px) and (max-width:820px) {
	section#front-gift-occasions .side-image.left,
	section#front-gift-occasions .side-image.right { display: none; }
}
@media (min-width:820px) and (max-width:1300px) {
	section#front-gift-occasions .side-image.left { width: 100px; }
	section#front-gift-occasions .side-image.right { width: 60px; }
}
@media (min-width:1300px) and (max-width:1430px) {
	section#front-gift-occasions .side-image.left { width: 150px; }
	section#front-gift-occasions .side-image.right { width: 100px; }
}
@media (min-width:1430px) and (max-width:1540px) {
	section#front-gift-occasions .side-image.left { width: 180px; }
	section#front-gift-occasions .side-image.right { width: 130px; }
}
