/*
Theme Name: Joy Theme
Theme URI: https://wordpress.org/themes/twentytwenty/
Template: twentytwenty
Author: Emma Lynn Guy
Author URI: https://wordpress.org/
Description: A custom WordPress theme developed for Joy Cone, this is a child of the twentytwenty theme.
Tags: blog,one-column,custom-background,custom-colors,custom-logo,custom-menu,editor-style,featured-images,footer-widgets,full-width-template,rtl-language-support,sticky-post,theme-options,threaded-comments,translation-ready,block-styles,wide-blocks,accessibility-ready
Version: 1.1.2
Updated: 2023-02-22 23:23:00
*/

/*
 * 
 * FONTS
 * 
 */
body.blog a:hover{
	color: #fff;
}
.skip-link{
	visibility:visible;
}

.display-none {
  display: none;
}

body{
	overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6,th,a{
	font-family: "Montserrat",sans-serif !important;
}
p,ol,ul,li,td{
	font-family: 'Source Sans Pro', sans-serif !important;
}

/*
 * UI/UX ELEMENTS
 * 
 *
 */
.joy-button{
	padding:5px 30px !important;
	background-color:rgb(229,21,50) !important;
	color:white !important;
	border:2px solid rgb(229,21,50) !important;
	font-size:15px !important;
	letter-spacing:1.5px !important;
	font-weight:700 !important;
	border-radius:20px !important;
	transition:.35s linear !important;
	text-transform:uppercase !important;
	font-family: "Montserrat",sans-serif !important;
}
.joy-button:hover{
	background-color:white !important;
	color:rgb(229,21,50) !important;
	border:2px solid rgb(229,21,50) !important;
	text-decoration:none !important;
}
.joy-button-white{
	padding:5px 30px;
	background-color:white;
	color:#C90102;
	border:2px solid white;
	font-size:15px;
	letter-spacing:1.5px;
	font-weight:700;
	border-radius:20px;
	transition:.35s linear;
	text-transform:uppercase;
	font-family: "Montserrat",sans-serif;
}
.joy-button-white:hover{
	background-color:#C90102;
	color:white;
	border:2px solid white;
	text-decoration:none;
}
.joy-button-blue{
	padding:5px 30px;
	background-color:#145ea9;
	color:white;
	border:2px solid #145ea9;
	font-size:15px;
	letter-spacing:1.5px;
	font-weight:700;
	border-radius:20px;
	transition:.35s linear;
	text-transform:uppercase;
	font-family: "Montserrat",sans-serif;
}
.joy-button-blue:hover{
	background-color:white;
	color:#145ea9;
	border:2px solid #145ea9;
	text-decoration:none;
}
.joy-button-nfs{ 
	padding:5px 30px;
	background-color:rgb(229,21,50);
	color:white !important;
	border:1px solid rgb(229,21,50);
	font-size:15px;
	letter-spacing:1.5px;
	font-weight:700;
	border-radius:20px;
	transition:.35s linear;
	text-transform:uppercase;
	font-family: "Montserrat",sans-serif;
}
.joy-button-nfs:hover{
	background-color:white;
	color:rgb(229,21,50) !important;
	border:1px solid rgb(229,21,50);
	text-decoration:none;
	cursor:pointer;
}
.product-button {
    transition: .3s ease;
    padding: 0px 30px;
    background-color: #f3f3f3;
    font-size: 16px;
    text-align: center;
    text-decoration: none !important;
	color:#6f6d6d !important;
    font-weight: 700;
    width: 100%;
    margin-top: 8px;
    border-radius: 6px;
    min-height: 100px;
    justify-content: center;
    align-items: center;
    display: flex;
	text-transform:uppercase;
}
.product-button:hover{
	background-color:#c60f14;
	color:white;
}
.full-recipe-button{
	color:#6f6d6d !important;
	padding:10px 40px;
	border-radius:40px;
	font-weight:700;
	background-color:#f3f3f3;
	text-transform:uppercase;
	font-family: "Montserrat",sans-serif;
	text-align:center;
	z-index:99;
}
.full-recipe-button:hover{
	text-decoration:none;
	color:white !important;
	background-color:#bd281d;
}
.featured-links{
	margin-top:-3%;
}
.featured-link-button{
	margin-right:1.75rem;
	padding:5px 20px;
	font-size:16px;
	color:rgb(0,80,161);
	transition:.35s ease-in;
	text-decoration:none;
	border-radius:40px;
	text-transform:uppercase;
	font-weight:700;
	font-family: "Montserrat",sans-serif;
	z-index:12;
}
.featured-link-button:hover{
	background-color: #1560a6;
	color:white;
	text-decoration:none !important;
}
/* Styling for recipe archive pagination buttons */
.page-numbers{
	font-size:24px;
	padding:5px 40px;
	color:#C90102;
}
.page-numbers:hover{
	background-color:#145FA9;
	color:white;
	text-decoration:none;
}
.page-numbers.current:hover,.page-numbers.dots:hover{
	background-color:white;
}
.page-numbers.current,.page-numbers.dots{
	color:#145FA9;
}
.page-numbers.dots{
	padding:5px 20px;
}
.next.page-numbers:hover,.prev.page-numbers:hover{
	background-color:#145FA9 ;
	color:white;
}
.next.page-numbers,.prev.page-numbers{
	padding:5px 40px;
	font-size:24px;
	color:rgb(0,80,161);
}
/* Next and Previous button for recipe detail page */
.prev,.next{
	padding:0px 5px;
	height:75px;
	width:175px;
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
	color:white;
	font-size:14px;
	background-color:rgba(255,255,255,0.16);
	transition:.15s ease-in;
	font-family: "Montserrat",sans-serif !important;
	text-align:center;
}
.prev,.next p{
	margin-bottom:0px !important;
}
.prev:hover,.next:hover{
	background-color:rgba(255,255,255,0.26);
}
.outer-thumbnail{
	padding-bottom: 5px;
	border-bottom:5px solid transparent;
	transition:.15s ease-in;
}
.outer-thumbnail:hover{
	border-bottom:5px solid rgb(0,80,161);
}
.cone-thumbnail,.box-thumbnail,.nf-thumbnail,.ingr-thumbnail{
	width:50px;
	height:50px;
	background-size:cover;
	background-position:center;
	background-color:#cdcdcd;
}
.social-icons a, body:not(.overlay-header) .primary-menu ul, .header-footer-group button, .header-footer-group .button, .header-footer-group .faux-button, .header-footer-group .wp-block-button:not(.is-style-outline) .wp-block-button__link, .header-footer-group .wp-block-file__button, .header-footer-group input[type="button"], .header-footer-group input[type="reset"], .header-footer-group input[type="submit"]{
	text-transform:uppercase;
	font-family: "Montserrat",sans-serif !important;
}
.close{
	color:#244e75;
	font-size:35px;
	font-weight:500;
	position:absolute;
	bottom:90%;
	left:90%;
	opacity:1 !important;
}
.close:hover{
	color:#C90102;
}

.btn-holder{
	max-width:100vw !important;
}
.btn.btn-link{
	background-color:transparent;
	font-size:1.5rem;
	color:color:rgb(0,80,161);;
}
.joy-button-tour{
	height:35px;
	width:45%;
	border:2px solid white;
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius:20px;
	font-size:1.3rem;
	text-transform:uppercase;
	text-align:center;
	font-weight:700;
	font-family: "Montserrat",sans-serif !important;
	transition:.35s linear;
		cursor:pointer;
}
.joy-button-tour:nth-of-type(1){
	margin-right:1rem;
}
.joy-button-tour:hover{

	background-color:white;
	color:rgb(20, 95, 169);
	border:2px solid rgb(20, 95, 169);
}
.joy-button-small{
	padding:5px 15px;
	background-color:rgb(229,21,50);
	color:white;
	font-size:12px;
	letter-spacing:1.5px;
	font-weight:700;
	border-radius:20px;
	transition:.35s linear;
}
.joy-button-small:hover{
	background-color:white;
	color:rgb(229,21,50);
}
.recipe-overlay h2.ignore {
  color: white;
  font-family: 'Source Sans Pro', sans-serif !important;
}

/*
 * 
 * END UI/UX ELEMENTS
 * 
 */

/*
 * 
 * SITE HEADER  
 * 
 */

.nav-shadow{
	position:absolute;
}
.mock .social-row{
	margin-left:0 !important;
}
.mock .section-inner{
	width:100% !important;
}
.mock .header-navigation-wrapper{
	width:100% !important;
	justify-content:center !important;
}
.mock .social-row{
	width:165px !important;
}
.mock .primary-menu-wrapper{
	display:flex;
	width:100%;
	justify-content:center;
}
.mock ul.primary-menu{
	margin:-.8rem 0 0 0 !important;
}receipt
.mock #mega-menu-wrap-primary{
	display: flex;
    justify-content: center;
    width: 100% !important;
}
.mock #mega-menu-wrap-primary #mega-menu-primary{
	display:flex !important;
}

.mega-sub-menu a{
	text-align:left !important;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item{
	width:150px;
}
.mega-menu-link{
	text-align:center !important;
}
.social-row{
	position:relative;
	top:-5px;
	width:176px;
	display:flex;
}
.social-row .fa{
	color:#b5e0fb !important;
	font-size:24px;
	padding:0px 5px;
}
.social-row .fa:hover{
	color:white !important;
}
.social-row .fa:before{
	transition:.15s ease-in;
}
.menu-modal-inner{
	background-color:#145FA9 !important;
}
.menu-modal-inner a{
	color:#6fabd2 !important;
}
.header-footer-group, body:not(.overlay-header) #site-header .toggle, .menu-modal .toggle{
	color:#6fabd2 !important;
}
/* Styling for custom Joy Cone header element */
.joy-header{
	color:rgb(0,80,161);
	letter-spacing:1.5px;
}
.joy-header-center{
	color:rgb(0,80,161);
	letter-spacing:1.5px;
	text-align:center;
	text-transform:uppercase;
}
#site-header{
	position:fixed;
	left:0;
	right:0;
	top:0;
	z-index:9999;
	transition:.15s ease-in;
}
/* Logo loads offset 45px from top, slides up once scrollY > 50 */
#joy-logo{
	position:relative;
	top:0px;
	transition:.15s ease-in;
}


#joy-logo:hover {
		position:relative;
		top:2px;	
  transition: 0.3s;	
}
#joy-logo-2{
	position:absolute;
	opacity:1;
	top:21px;
	transition:.15s ease-in;
	/*width:175px;*/
}

/* The background color of the logo */
.custom-logo a {
	background-color:#145FA9 !important;
}
.mobile-home{
		display:none !important;
}
@media (max-width: 1140px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	.social-row,.ghost{
		display:none !important;
	}
}

@media (max-width: 992px) {
    .header-inner.section-inner {
        height: 50px;
    }
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	.custom-logo{
		display:none !important;
	}
	.mobile-home{
		display:block !important;
	}
	.header-inner.section-inner{
		height:50px;
	}
	.menu-bottom .social-menu{
		display:none !important;
	}
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	.custom-logo{
		display:none !important;
	}
	.mobile-home{
		display:block !important;
	}
	.toggle-inner{
		padding-top:0 !important;    
		background-color: #C90102 !important;
    	position: fixed;
    	top: 0;
    	left: 0;
    	width: 100vw;
		justify-content:space-between !important;
		align-items:center;
		height:35px;
		box-shadow:2px 2px 5px grey;
		padding-left:10px;
	}
	.header-inner.section-inner{
		height:0px
	}
	.header-inner .toggle path{
		fill:white;
	}
	.menu-bottom .social-menu{
		display:none !important;
	}
	.menu-modal{
		z-index:1000;
	}
}
/*
 * 
 * END SITE HEADER
 * 
 */

/*
 * 
 * SITE FOOTER
 * 
 */
.footer-copyright{
	font-family: "Montserrat",sans-serif !important;
}
#ca-act{
	color:white;
}
#privacy-notice:hover{
	color:white;
}
ul.footer-menu a{
	text-transform:uppercase;
}
.newsletter-form-text{
	color:white;
}
#fieldEmail{
	background-color:#C90102;
	border-left-color:#C90102;
	border-right-color:#C90102;
	border-top-color:#C90102;
	border-bottom:1px solid white;
	color:white;
}
#emailLabel{
	color:white;
}
#fieldName{
	background-color:#c90102;
	border-left:1px solid #c90102;
	border-right:1px solid #c90102;
	border-top:1px solid #c90102;
	border-bottom:1px solid white;
	color:white;
}
#nameLabel{
	color:white;
	margin-right:1rem;
}
.footer-form{
	width:75%;
	float:right;
}
.footer-form h1{
	color:white;
	text-transform:uppercase;
	letter-spacing:1.5px;
}
.footer-form p{
	color:white;
	font-size:15px;
}
.footer-form button{
	background-color:white !important;
	color:#C90102 !important;
	float:right;
	margin-top:1rem;
	padding:10px 30px;
	border-radius:30px;
	font-size:14px;
	font-weight:700;
}
.footer-social-icons a{
	padding:5px 5px !important;
	font-size:30px;
}
.footer-social-icons p:hover{
	text-decoration:none !important;
}
/* Newsletter form styling */
.newsletter input{
	margin-top:1rem;
	margin-bottom:1rem;
}
/* Newsletter form styling */
.newsletter{
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	text-align:center;
}
.has-footer-menu .footer-social{
	display:none !important;
	z-index:1 !important;
}
.newsletter-form-submit{
	background-color:white !important;
	border:2px solid white !important;
	padding:10px 60px !important;
	border-radius:40px !important;
	color:#C80104 !important;
	float:right;
	transition:.35s ease-in !important;
	font-family: "Montserrat",sans-serif;
}
.newsletter-form-submit:hover{
	background-color:#c80104 !important;
	color:white !important;
	text-decoration:none !important;
}
/* Newsletter form styling */
.newsletter-form-text{
	padding:10px 60px !important;
	background-color:#C80104 !important;
	border-top:1px solid #C80104 !important;
	border-right:1px solid #C80104 !important;
	border-left:1px solid #C80104 !important;
}
.joy-footer-logo{
	width:170px;
	margin-bottom:10rem;
}
/* Styling for the remainder of the footer */
.footer-social{
	justify-content:center !important;
	margin:0 !important;
}
.footer-top{
	flex-wrap:wrap;
		z-index:1 !important;
}
.footer-menu{
	flex-direction:column;
		z-index:1 !important;
}
.footer-widgets-outer-wrapper{
	display:none !important;
		z-index:1 !important;
}
.footer-nav-widgets-wrapper{
	margin-top:0rem !important;
		z-index:1 !important;
}
ul.footer-menu li{
	margin-left:3.5rem;
	margin-right:3.5rem;
}
ul.footer-menu a{
	color:white !important;
	letter-spacing:1.5px;
	padding:5px 30px;
	transition:.35s ease-in;
	border-radius:40px;
}
ul.footer-menu a:hover{
	background-color:white;
	text-decoration:none;
	color:#C90102 !important;
	letter-spacing:1.5px;
}
.footer-credits{
	color:white;
	width:100vw;
	display:flex;justify-content:space-between;
}
.social-row-footer{
	position:relative;
	top:-120px;
	left:50px;
	width:80vw;
}
.social-row-footer p{
	color:white;
	text-transform:uppercase;
	font-weight:700;
}
.social-row-footer .fa{
	font-size:30px;
	color:white;
	margin-right:1rem;
}
.social-row-footer a:hover{
	opacity:.7;
}
.footer-social-icons{
	position:relative;
	left:-90%
}
.footer-social-icons a:first-of-type{
	display:none !important;
}
#menu-item-2206 a::first-of-type{
	display:none !important;
}
.footer-social-icons::before{
	content:"Connect With Us";
	display:block;
	color:white;
	font-size:16px;
	text-transform:uppercase;
	height:30px;
}
#site-footer,.footer-nav-widgets-wrapper{
	background-color:#c90103 !important;
}
@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	.footer-menu,.social-row-footer,.joy-footer-logo,#{
		/*display:none !important;*/
	}
	.footer-top{
		justify-content:flex-start !important;
	}
	.newsletter{
		text-align:left !important;
		align-items:flex-start;
		display:block !important;
	}
	.has-footer-menu .footer-social-wrapper{
		width:100% !important;
	}
}
/*
 * 
 * END SITE FOOTER
 * 
 */

/*
 * 
 * SOCIAL LANDING PAGE
 * 
 */ 

.container-fluid.social-landing-page{
	background-color:#464646;
	padding:0;
}
.social-landing-page > .container{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:space-evenly;
	height:100vh;
	background-image:url("/wp-content/uploads/2020/05/3371ea01-ice-cream_0000000i20pd00000001o.jpg");
	background-size:cover;
	background-position:center;
	width:70%;
padding-top:125px;
}
.social-landing-page > .container > h1{
	color:white;
	font-weight:700;
	font-size:28px;
}
.social-landing-page > .container > a > img{
	width:195px;
}
.social-landing-page > .container > a,.social-landing-page > .container > h1{
	z-index:2;
}
.social-landing-page > .container > .social-landing-btn{
	color:white;
	border:4px solid white;
	width:400px;
	height:70px;
	border-radius:100px;
	background:linear-gradient(#e21d38, #b2050f);
	font-size:18px;
	font-weight:600;
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
.social-landing-btn:hover{
	background:linear-gradient(#3396EF, #3396EF) !important;
	text-decoration:none !important;
}
.bottom{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	height:60px;
	color:#beb191;
	font-size:12px;
	font-family:'montserrat';
	background-color:rgba(250,250,250,1);
}
.social-landing-page > .container > .social-landing-btn-follow{
	color:white;
	border:4px solid white;
	width:375px;
	height:70px;
	border-radius:100px;
	background:linear-gradient(#0d6bb1, #012969);
	font-size:18px;
	font-weight:600;
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
.social-landing-page > .container > .social-landing-btn-follow:hover{
	background:linear-gradient(#e21d38, #b2050f);
	text-decoration:none !important;
}
.landing-overlay{
	position:absolute;
	width:100%;
	height:100vh;
	background-color:rgba(0,0,0,.5);
}
@media (max-width:1024px){
	
}
@media (max-width:768px){
	
}
@media (max-width:480px){
	.social-landing-page > .container{
		width:100% !important;
		padding-top:75px;
	}
	.social-landing-page > .container > .social-landing-btn,.social-landing-page > .container > .social-landing-btn-follow{
	width:275px;
	height:50px;
	font-size:14px;
}
}
/*
 * 
 * END SOCIAL LANDING PAGE
 * 
 */

/*
 * 
 * EMPTY TEMPLATE
 * 
 */

.container-fluid.empty{
	padding-top:200px;
}
.container-fluid.empty > .container{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
}
.container-fluid.empty > .container p{
	font-size:16px;
}
.container-fluid.empty > .container h1{
	text-align:center;
}

@media (max-width:1024px){
	
}
@media (max-width:768px){
	
}
@media (max-width:480px){
	.container-fluid.empty{
	padding-top:50px;
}
}
/*
 * 
 * END EMPTY TEMPLATE
 * 
 */
/*
 * 
 * PRODUCT PAGE
 * 
 */

.product-recipes .the-recipes img {
object-fit: cover;

  width: 200px;
  height: 200px;
}
.product-recipes{
	display:flex;
}
.the-recipes{
	align-items:center;
}
.product-recipes img{
	width:100%;
	max-width:250px;
	padding-right:10px;
}
.hidden-feat-recipes{
	display:none;
}
.product-recipes{
	flex-direction:column;
}
.product-recipes .the-recipes{
	display:flex;
}
.product-recipes h3{
	color:rgb(0,80,161) !important;
}
.reduce-height{
	height:80%;
}
.product-tile:hover{
cursor:pointer
}
.hidden-product-feature{
	background-color:#d0e2ee;
}
.hidden-nf{
	display:none;
}
.hidden-product-feature .col-1{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
	height:60vh;
}
.hidden-product-feature .col img{
	max-height:45vh;
}
.hidden-product-feature .col-1 .container,.hidden-product-feature .col-1 img{
	background-color:white !important;
}
.hidden-product-feature .col-1 .container{
	display:flex;
	justify-content:center;
	align-items:center;
	height:100%;
	width:85%;
}
.hidden-product-feature .col-2{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:flex-start;
	padding:50px;
	height:60vh;
}
.pack-button{
	margin-top:1rem;
	margin-bottom:1rem;
}
.hidden-product-feature h2{
	margin:1rem 0 1rem 0;
	font-weight:600;
}
.hidden-product-feature .col-2 p,.hidden-product-feature .col-2 a{
	font-size:14px;
}
.hidden-product-feature .col-2 a{
	text-decoration:underline;
	cursor:pointer;
}
.hidden-product-description{
	display:none;
}
.product-img{
	display:none;
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	
	.hidden-product-feature .col-1{
		display:none !important;
		padding: 0px !important;
	}
	.hidden-product-feature .col-2{
		justify-content:flex-start !important;
	}
	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	
	
	.hidden-product-feature .col-1,.pack-button{
		display:none !important;
		padding: 0px !important;
	}
	.hidden-product-feature .col-2{
		flex:0 0 100% !important;
		max-width:100% !important;
		justify-content:flex-start !important;
	}
	.wrap{
		display:block !important;
	}
	.left-side{
		height:30vh;
	}
	.recipe-detail-content{
		margin:0 !important;
		max-width:100% !important;
		padding-top:25px !important;
		padding-left:25px !important;
		padding-right:25px !important;
	}
	.hide-image-mobile{
		display:none;
	}
	
}
/*
 * 
 * END PRODUCT PAGE
 * 
 */

/*
 * 
 * Home Page
 * 
 */
.home-page-recipes{
	padding:0px 50px;
	background-color:#DBE6F1;
	max-width:100vw !important;
	display:flex;
	justify-content:center;
	align-items:center;
}
.home-page-recipes .row{
	max-width:1800px !important;
	width: 100%;
}
.feat-recipe-header{
	text-transform:uppercase;
	color:#2e68ad;
	font-family:Montserrat;
	text-align:center;
	font-weight:900;
	font-size:26px;
	letter-spacing:1px;
	background-color:#DBE6F1;
	margin-bottom:0 !important;
}
.btn-holder{
	display:flex;
	justify-content:space-evenly;
	background-color:#DBE6F1;
}
.job-content-section .btn-holder{
	width:60%;
}
.btn-holder.home{
	padding:4rem 0;
}
/* Featured Product links on the homepage */
.featured-links{
	justify-content:center;
	align-items:center;
	padding-bottom:8%;
}

/* St. Jude section on the homepage */
.st-jude{
	max-width:100vw !important;
	display:flex;
	justify-content:center;
	align-items:center;
	background-color:#C90102;
	margin-top:2.5rem;
}
.st-jude .row{
	height:55vh;
	padding:0px 5vw;
	background-color:#c90103;
	max-width:1800px;
}
.st-jude .col{
	height:90%;
	position:relative;
	bottom:10%;
	border:2px solid #C90102;
}
.st-jude .col h3{
	position:relative;
	top:104%;
	text-align:center;
	color:white;
	font-family:Montserrat;
	font-weight:700;
}
.st-jude .copy{
	display:flex;
	flex-direction:column;
	padding-left:25px;
	justify-content:center;
	color:white;
	top:0;
	height:100%;
}

.st-jude .copy img{
	float:right;
}

.st-jude .copy h2{
	font-size:24px;
	font-family:Montserrat;
	text-transform:uppercase;
	letter-spacing:1.5px !important;
}
.st-jude-reg{
	position:absolute;
	font-size:16px !important;
}
.btn_and_image{
	display:flex;
	flex-direction:column;
	float:right;
}
.st-jude .copy h2 span{
	font-weight:900 !important;
}

.st-jude .copy p{
	font-size:16px;
	font-weight:600;
}
.st-jude .pic{
	background-size:cover;
	background-position:center;
	border-radius:15px;
}

/* Styling for the our story section */
.our-story{
	padding:7vh 5vw;
	height:70vh;
}

.our-story .copy{
	font-size:14px;
	margin-bottom:4rem;
}
.our-story h2{
	color:#2e68ad;
	font-family:Montserrat;
	font-size:24px;
	letter-spacing:1.5px !important;
}
.our-story h2 span{
	font-weight:900 !important;
}
.our-story h3{
	color:#616161;
	font-family:Montserrat;
	margin:1.25rem 0;
	font-weight:700;
}
.polaroid {
  background: #fff;
  padding: 1rem;
  box-shadow: 0 0.2rem 1.2rem rgba(0,0,0,0.2);
}
.polaroid > img{
  max-width: 100%;
  height: auto;
}
.caption {
  font-size: 14px;
  text-align: center;
  line-height: 2em;
}
.item {
  display: inline-block;
}
.tilt-a, .tilt-b{
	display:flex;
	flex-direction:column;
}
.tilt-a{
	justify-content:flex-end;
	transform:rotateZ(-7.5deg);
	z-index:9;
}
.tilt-a .item{
	width:275px !important;
}
.tilt-b .item{
	width:350px;
}
.tilt-b{
	justify-content:center;
	transform:rotateZ(7.5deg);
}

/* Styling for featured recipes on the website home page */
.featured-recipe{
	background-color:white;
}
.featured-recipe .col-lg-6{
	text-align:left;
	height:30vh;
	padding-top:30px;
	padding-left:30px;
}
.i-link{
	text-decoration:none !important;
}
.insta-header{
	display:flex;
	justify-content:center;
	align-items:center;
	height:75px;
}
.insta-header p{
	color:#35587e !important;
	font-size:26px;
	font-family:Montserrat;
	font-weight:900;
	margin-left:.5rem;
}
.insta-header p:hover{
	color:#C90102 !important;
}
.insta-header img{
	width:50px;
	box-shadow:0px 0px 5px 1px grey;
	border-radius:50%;
	margin-right:.5rem;
}
#sb_instagram #sbi_load .sbi_follow_btn svg{
	display:none;
}
#sbi_images:hover .sbi_item:not(:hover){
	filter:grayscale(.7);
	filter:brightness(50%);
}
#sb_instagram #sbi_load .sbi_follow_btn {
	float:right;
	margin-top:15px;
	margin-bottom:15px;
	margin-right:15px;
}
#sb_instagram .sbi_follow_btn a{
	border-radius:50px !important;
	background-color:#f3f3f3;
	color:#a7a7a7;
	font-family: "Montserrat",sans-serif !important;
	font-size:14px !important;
	font-weight:700 !important;
}
.featured-recipes .col-lg-6{
	max-width:48% !important;
	margin-right:2% !important;
}
.featured-recipe .col-lg-6 h2{
	margin-bottom:2rem;
}
.featured-recipe .col-lg-6 p{
	margin-bottom:2rem;
}
.featured-recipe .col-lg-6 p, .featured-recipe .col-lg-6 a{
	font-size:12px;
}
.featured-recipe .col-lg-6 p{
	color: #5D6B88;
}
.image-holder-a,.image-holder-b{
	background-size:cover;
	background-position:center;
	height:30vh;
	width:50%;
}
.recipe-image-holder{
	background-size:cover;
	background-position:center;
	height:35vh;
	width:50%;
}
.recipe-detail-col{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	padding:0px 35px;
}
.recipe-detail-col h2{
	font-weight:700;
}
.recipe-tile{
	flex:0 0 48%;
	margin:1%;
	transition:.15s ease-in;
	box-shadow: inset 0 0 0 1px #dddddd;
	border-radius:6px;
	cursor:pointer;
	background-color:white;
}

.recipe-image-holder{
	box-shadow: inset 0 0 0 1px #dddddd;
	transition:.15s ease-in;
}
.btn_and_image img{
	width:225px !important;
}
body{
	overflow-x:hidden !important;
}
.recipe-tile p{
	font-size:14px;
	color:#6a768e
}
.full-recipe-button:hover{
	text-decoration:none;
	color:white !important;
	background-color:#bd281d;
}
.featured-recipes .row{
	text-align:center;
}
.featured-recipe-content{
	padding:0 5vw;
	background-color:#DBE6F1;
}
.featured-recipe-content .joy-header-center{
	margin-bottom:2.5vw;
}
/* Styling for the featured product boxes on the home page */
#ft-product-img, #ft-product-img-2,#ft-product-img-3,#ft-product-img-4{
	transition:.15s ease-in;
	z-index:9;
}
.featured-product{
	display:flex;
	justify-content:center;
	align-items:center;
	flex:0 0 20% !important;
}
.featured-products{
	padding-top:5vh;
	max-width:100vw !important;
}
.featured-product-content{
	background-color:rgb(219,230,241);
	max-width:100vw !important;
}

@media (max-width: 1024px) {
  .job-content-section .btn-holder{
	width:75%;
}
	.recipe-image-holder{
		width:100% !important;
	}
	/* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Small Desktop) */
	
	.full-recipe-button{
		padding:10px 30px;
	}
	
	.our-story{
		height:50vh;
	}
}
@media (max-width: 768px) {
	/* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	.our-story{
		height:60vh;
	}
	.slide-in-left,.slide-in-right{
		display:none !important;
	}
	.featured-recipes .col-lg-6{
	max-width:100% !important;
		margin-right:0% !important;
}
	.image-holder-a,.image-holder-b{
	background-size:cover;
	background-position:center;
	height:25vh;
	width:100%;
}
	.st-jude .pic{
		display:none;
	}
	.job-content-section .btn-holder{
	width:90%;
}
	#sb_instagram #sbi_load .sbi_follow_btn{
		float:none !important;
	}
	.recipe-image-holder{
		width:100% !important;
	}
	.recipe-detail-col{
		padding:35px 35px !important;
		height:25vh;
	}
	.recipe-image-holder{
		height:35vh;
	}
	
	
}

@media (max-width: 480px) {
	.container{
	overflow-x:hidden !important;
}
	.recipe-tile p{
		font-size:18px !important;
	}
	.our-story{
		height:auto;
		display:flex;
		flex-direction:column-reverse;
	}
	.tilt-a{
		padding:25px;
	}
	.tilt-a .item{
		width:250px !important;
	}
	.btn-holder.home{
	display:none !important;
}
	.hide-mobile{
		display:none !important;
	}
	.btn-holder{
		flex-direction:column;
		text-align:center;
	}
	.btn-holder .joy-button{
		margin-top:1rem;
	}
	/*.job-content-section{
		height:60vh !important;
	}*/
	.job-content-section .btn-holder{
	width:100% !important;
}
	.job-title-section h1{
		font-size:2.25rem;
		text-align: center;
	}
	/* Selectors and styles affecting screens UP TO 480px (Phone) */
	#ft-product-img, #ft-product-img-2,#ft-product-img-3,#ft-product-img-4{
		max-width:35% !important;
	}
	.featured-product{
		flex:0 0 100% !important;
	}
	.featured-recipes .col-lg-6{
	max-width:100% !important;
		margin-right:0% !important;
		height:70vh;
}
	.image-holder-a,.image-holder-b{
	background-size:cover;
	background-position:center;
	height:25vh;
	width:100%;
}
	.featured-recipe .col-lg-6 p, .featured-recipe .col-lg-6 a{
	font-size:12px;
}
	.featured-recipe-content h1{
		display:none;
	}
	.btn-holder.container a{
		display:none !important;
	}
	.featured-recipe-b{
		display:none !important;
	}
	.st-jude .pic{
		display:none;
	}
	.st-jude .copy h2{
		font-size:18px !important;
	}
	.st-jude .copy p{
		font-size:12px !important;
	}
	.st-jude .row{
		height:65vh !important;
		padding:25px !important;
	}
	.st-jude .btn_and_image{
		float:none !important;
		margin:2rem 4rem !important;
	}
	.st-jude .btn_and_image img{
		margin-top:2rem;
	}
	.st-jude .copy a{
		text-align:center;
		padding:2.5px 10px;
		border-radius:15px;
		font-size:14px;
	}
	.st-jude .copy{
		height:60vh !important;
		padding-top:0 !important;
		padding-left:0 !important;
	}
	.featured-links, .featured-links a{
		display:block;
		text-align:center;
		margin:1rem 4rem !important;
	}
	.featured-links a{
		padding:5px 0px !important;
		background-color: #1560a6;
		color:white;
	}
}
/*
 * 
 * END HOME PAGE
 * 
 */

/* 
 * 
 * UX/UI Elements 
 *
 */
.myBtnContainer img{
	    width: 30px !important;
	
}
.card-body{
	font-size:14px;
	padding:35px;
}
.feat-image{
	background-image:url("/wp-content/uploads/2020/02/joy-cone-reindeer-reshoot-3.jpg");
	background-size:cover;
	background-position:center;
	height:100vh;
	width:100vw;
}


.special-row:nth-child(even){
	display:none;
}



.packaging .page-content .page-form .line-right-fs{
	margin-bottom:2.5rem;
}
.test-clip{
	height:200px;
	width:400px;
	background-color:red;
 
}
.card-header:hover,.card-header:focus{
	border-bottom:1px solid rgba(201, 1, 2,1) !important;
}
.card-header button:hover,.card-header button:focus{
	text-decoration:none !important;
}

.number-wrap .nf-field-element{
	width:50% !important;
}
.number-wrap{
	display:block !important;
}
.floatRight{
	float:right;	
}
.l > a{
	display:none;
}
.hero{
    display:flex;
    flex-direction: row;
    background-size:cover;
    background-position:center;
    height:30vw;
    align-items: center;
    justify-content: center;
	max-height:650px;
}
.hero-tours{
	background-image:url("/wp-content/uploads/2020/09/Joy_Website_Tours-page_header-image-1.png");
}
.hero.careers{
	background-image:url("/wp-content/uploads/2020/08/Joy_Website_carees-page_header-image-scaled.jpg");
	height:50vw;
	max-height:800px;
	display:none;
}
.hero.single-job{
	background-image:url("/wp-content/uploads/2020/02/iStock-1178814014.jpg");
}

.hero.home{
	background-image:url("/wp-content/uploads/2020/02/iStock-1140299946-scaled.jpg");
}
.hero.history{
	background-image:url("/wp-content/uploads/2020/05/Website-Redesign-Comments_Page_20_Image_0006.jpg");
}
.hero.recipes{
	background-image:url("https://joycone.com/wp-content/uploads/2021/01/applecrispenjoyabowls.jpg");
	background-size:cover;
	background-position:center;
}
.hero.crafts{
	background-image:url("https://joycone.com/wp-content/uploads/2021/01/Mini-Waffle_130626_0218.jpg");
	background-size:cover;
	background-position:50% 30%;
}
.hero.about{
	background-image:url("/wp-content/uploads/2020/02/joycone_scarecrows.jpg");
}
.hero.family{
	background-image:url("https://joyblog.joycone.com/wp-content/uploads/2019/12/joy-cone-december-social-50.jpg");
}
.hero.food-service{
	background-image:url("https://joycone.com/wp-content/uploads/2020/05/frenchtoast3.png");
}
.hero.hero-blank{
	background-position:top;
}
.hero.hero-gb{
	background-position:center;
	height:37vw;
}
.hero.promo{
	background-image:url("https://joyblog.joycone.com/wp-content/uploads/2019/06/joycone_milkshakes1.png");
	background-position:top;
}
.link-text{
	text-decoration:underline !important;
	text-decoration-color:white !important;
}
.main .container{
	max-width:1800px;
}
.food-service-tile{
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	align-items:center;
	text-align:center;
	padding:25px;
}



@media (max-width: 1200px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	.hero{
		
	}
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	.hero{
		height:37vw;
	}
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	.food-service-tile{
		display:flex;
		flex-direction:column;
		align-items:center;
	}
	.archive-food-service-content.container-fluid img{
		max-width:100px !important;
	}
	.hero{
		height:23vh;
	}
}

/*
 * 
 * CONSUMER PRODUCTS ARCHIVE
 * 
 */

.hero.products {
	background-image:url("https://joycone.com/wp-content/uploads/2024/01/product-page-header.jpg");
}

.product-box{
	box-shadow: inset 0 0 0 1px #dddddd;
	transition: all .3s ease;
	border-radius: 6px  !important;
	background-color: #ededed;
	position: relative;
    margin: auto;
    overflow: hidden;
    width: 100%;
}
.product-box img {
    max-width: 100%;
    transition: all 0.3s;
    display: block;
    width: 100%;
    height: auto;
	transform: scale(1);
}
.product-box img:hover{
	transform: scale(1.1);
}
.archive-product-content .col-lg-4:hover .product-box{
	box-shadow: inset 0 0 0 12px #a9a9a9;
}
.archive-product-content .col-lg-4:hover .product-button{
	background-color:#c60f14 !important;
	color:white !important;
}
.archive-product-content{
	width:75%;
	padding-bottom:20px;
	max-width:1600px !important;
}
.product-tile{
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	align-items:center;
	padding:25px !important;
}
.archive-product-content h1{
	width: 100%;
	color:#1460a6;
   text-align: left; 
   border-bottom: 3px solid #cee2ef; 
   line-height: 0.1em;
   margin: 25px 0 20px;
   font-weight:700;
}
.archive-product-content h1 span{ 
  background:#fff;  
  padding: 0px 5px 0px 0px;

}


.p-thumbnails{
	display:flex;
	width:75%;
	justify-content:space-evenly;
	position:absolute;
	bottom:1%;
}
.poster-choices{
	display:flex;
}
.hand-choice,.soft-choice{
	flex-basis:50%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
#fs-archive-header{
	letter-spacing:1px;
	font-size:18px;
}
.line-right-fs{
	font-size:25px;
	letter-spacing:1.5px;
	text-transform:uppercase;
	font-weight:700;
	width: 100%;
	color:#C90102;
   text-align: left; 
   border-bottom: 3px solid #cee2ef; 
   line-height: 0.1em;
   margin: 25px 0 20px
}
.line-right-fs span{
	background:#fff;  
	padding: 0px 5px 0px 0px;
}
.cookie-header{
	font-size:16px;
	font-weight:bold;
	color:#016baf;
}
.cookie-subheader{
	font-size:16px;
	color:#016baf;
}
.spec-header{
	color:#C90102;
	font-size:18px;
}
.cookie.container{
	max-width:80vw;
}
.packaging p{
	font-size:16px;
}
.equipment{
	max-width:80vw;
}
.equipment-brochure{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
}
.archive-food-service-content.container-fluid img{
	max-width:150px;
}
.single-food-service-product.container-fluid,.archive-food-service-content.container-fluid,.packaging.container-fluid,.poster-container.container-fluid{
	margin-top:2.5rem;
}
.cookie.container{
	margin-top:10vh;
}
.archive-food-service-content.container-fluid p,.single-food-service-product.container-fluid p{
	font-size:16px;
}
@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	#fs-archive-header{
	line-height:1.2;
}
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	#fs-archive-header{
	line-height:1.2;
}
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	.archive-product-content .col-lg-4{
		margin-top:2.5rem;
	}
	.archive-product-content{
		max-width:100vw !important;
	}
	.hidden-product-feature .col-2{
		padding:0px 55px !important;
	}
	.line-right-fs{
		line-height:30px;
	}
	.product-recipes .the-recipes img {
    object-fit: cover;
    width: 100px !important;
    height: 100px !important;
	}
}

/*
 * 
 * SINGLE PRODUCT
 * 
 */
.product-pics{
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
}
.product-content{
	background-color:#DBE6F1;
	align-items:center;
	justify-content:center;
	display:flex;
	flex-direction:column;
	padding:50px;
}
@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	
}

/*
 * 
 * RECIPES ARCHIVE
 * 
 */ 
.hero-recipes{
	background-image:url("/wp-content/uploads/2020/02/iStock-1140299946-scaled.jpg");
}
.archive-recipe-content{
	width:90%;
}
.recipe-tile{
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
}

@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	.recipe-image-holder{
		height:auto !important;
	}
	.recipe-detail-col{
		padding:35px 35px !important;
		margin:0 auto;
	}
	.recipe-image-holder,.recipe-detail-col{
		height:40vh !important;
	}
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	.recipe-tile:hover .recipe-image-holder{
	box-shadow: none;
}
	.recipe-tile:hover,.recipe-tile:focus{
		box-shadow:inset 0 0 0 1px #dddddd;
	}	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	.recipe-overlay{
		position:relative !important;
		top:60% !important;
		height:50% !important;
		width:100% !important;
	}
	.recipe-overlay h1{
		font-size:24px !important;
	}
	.next-prev-container{
		justify-content:space-between !important;
		position:fixed !important;
		bottom:0px !important;
		left:0px !important;
		width:100%;
	}
	.next-prev-container a{
		width:45%;
	}
	.next,.prev{
		background-color:#145FA9 !important;
		width:100% !important;
	}
	.recipe-image-holder{
		width:100%;
		height:40vh;
	}
	.recipe-tile{
		margin:1.5em 0;
		flex:0 0 100%;
		
	}
	.recipe-tile:hover .recipe-image-holder{
	box-shadow: none;
}
	.recipe-tile:hover,.recipe-tile:focus{
		box-shadow:inset 0 0 0 1px #dddddd;
	}	
	.left-side{
		height:45vh;
	}
	.page-numbers,.page-number.next{
		padding:5px 5px !important;
	}
	.page-numbers{
		font-size:16px !important;
	}
	.page-numbers.next,.page-numbers.prev{
		font-size:12px !important;
		background-color:white !important;
	}
	.page-numbers.dots{
		padding:0px 0px !important;
	}
	.recipe-pagination{
		margin-top:3rem !important;
		margin-bottom:3rem !important;
		justify-content:space-between;
	}
}
/*
 * 
 * SINGLE RECIPE
 * 
 */

.hero.recipe{
	background-image:url("https://joyblog.joycone.com/wp-content/uploads/2019/06/joycone_milkshakes1.png");
	background-position:top;
}

.contactus-link {
  font-size: 14px;
  font-family: 'Source Sans Pro', sans-serif !important;
  line-height: 1.5;
  letter-spacing: -0.015em;
  margin-bottom: 1rem;
  margin: 0 0 1em 0;
}


.recipe-hover-overlay{
	top:0;
	left:0;
	width:100%;
	height:100%;
	position:absolute;
	transition:.15s ease;
	border-radius:6px;
}
.recipe-tile:hover .recipe-hover-overlay{
	box-shadow: inset 0px 0 0 15px rgba(0,0,0,.2);
	border-radius:6px;
}
.the-content{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
.recipe-detail-content p,li{
	font-size:16px;
}
.recipe-detail-content h1{
	font-size:40px;
	font-weight:900;
	text-align:center;
}
.recipe-detail-content h2{
	font-size:26px;
}
.recipe-detail-content h3{
	font-size:22px;
}
.recipe-detail-content  img{
	width:100%;
}
.recipe-detail-content{
	margin:200px auto 0;
	max-width:75%;
}
.recipe-pagination{
	width:100vw;
	display:flex;
	justify-content:flex-start;
	align-items:center;
	margin-bottom:1rem;
}
.recipe-overlay{
	height:35%;
	width:100%;
	background-color:rgba(0,0,0,.6);
	position:absolute;
	bottom:0;
	padding:15px 15px;
}
.recipe-overlay h1{
	color:white;
	font-size:34px;
	text-transform:uppercase;
	font-weight:700;
}
.recipe-date{
	color:white;
	font-size:16px;
}
.recipe-date span{
	text-transform:uppercase;
}
.prev-title{
	margin-bottom:0 !important;
}
.next-prev-container{
	display:flex;
	justify-content:flex-end;
	align-items:center;
	color:white;
}
.next-prev-container .prev{
	margin-right:1rem;
}
.next p,.next p{
	margin-bottom:0 !important;
}
.next-prev-container:hover a{
	text-decoration:none;
}
.recipe-content{
	align-items:center;
	justify-content:center;
	display:flex;
	flex-direction:column;
}
@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	
}
/*
 * 
 * TIMELINE
 * 
 */
* {
  box-sizing: border-box;
}
.bottom-backdrop{
	display:flex;
	justify-content:flex-end;
	align-items:center;
}

.bottom-photo{
	border:none !important;
	width:200px;
}
.Joe-img{
	position:relative;
	right:350px;
	bottom:250px;
	width:275px;
}

.tablepress tfoot th, .tablepress thead th {
    
    min-width: 100px;

}

.left-0 .svg-container{
	position:relative;
	width:300px;
	height:235px;
	right:-105%;
	top:-135%;
}
.left-0 .svg-container p{
	margin-top:12px;
	font-size:14px;
	color:#145FA9;
}
.left-0 .svg-container img {
  position:absolute;
	top:0;
	padding:3px;
  width:100%;
		height:100%;
  text-align: center;
}
.left-0 .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  fill: #145FA9;
  transition: all .8s ease-out 0s;
  stroke-width: 4px;
}

.left-0 .svg-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  fill: #eee;
}

.right-2 .svg-container{
	position:relative;
	width:375px;
	height:300px;
	left:-75%;
	top:-130%;

}
.right-2 .svg-container img{
  position:absolute;
	top:0;
	padding:3px;
  width:100%;
	height:100%;
  text-align: center; 

}
.right-2 .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  fill: #eee;
  transition: all .8s ease-out 0s;
  stroke-width: 4px;

}

.right-2 .svg-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  fill: #eee;
		
}
.ghost{
	visibility:hidden !important;
	width:120px !important;
}

.left-3 .svg-container{
	position:relative;
	width:375px;
	height:300px;
	right:-105%;
	top:-85%;
}
.left-3 .svg-container img{
  position:absolute;
	top:0;
	padding:3px;
  width:100%;
		height:100%;
  text-align: center;  
}
.left-3 .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  fill: #eee;
  transition: all .8s ease-out 0s;
  stroke-width: 4px;
}

.left-3 .svg-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  fill: #eee;
}


.left-5 .svg-container{
	position:relative;
	width:375px;
	height:300px;
	right:-105%;
	top:-205%;
}
.left-5 .svg-container img{
  position:absolute;
	top:0;
	padding:3px;
  width:100%;
		height:100%;
  text-align: center;  
}
.left-5 .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  fill: #eee;
  transition: all .8s ease-out 0s;
  stroke-width: 4px;
}

.left-5 .svg-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  fill: #eee;
}

.right-4 .svg-container{
	position:relative;
	width:350px;
	height:233px;
	right:75%;
	top:-120%;
}

.right-4 .svg-container img:nth-of-type(1){
  position:absolute;
	top:0;
	padding:3px;
  width:50%;
	height:100%;
  text-align: center; 
}

.right-4 .svg-container img:nth-of-type(2){
  position:absolute;
	top:0;
	right:0;
	padding:3px;
  width:50%;
	height:100%;
  text-align: center; 

}
.right-4 .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  /*fill: #eee;*/
  transition: all .8s ease-out 0s;
  stroke-width: 4px;

}

.right-4 .svg-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  /*fill: #eee;*/
		
}

.right-6 .svg-container{
	position:relative;
	width:375px;
	height:300px;
	left:-80%;
	top:-150%;
}

.right-6 .svg-container img{
  position:absolute;
	top:0;
	padding:3px;
  width:100%;
	height:100%;
  text-align: center; 

}
.right-6 .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  fill: #eee;
  transition: all .8s ease-out 0s;
  stroke-width: 4px;

}

.right-6 .svg-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  fill: #eee;
		
}



.right-9 .joe-container{
	position:relative;
	width:375px;
	height:300px;
	left:-75%;
	top:-45%;
}
.right-9 .david-container{
	position:relative;
	width:325px;
	height:300px;
	bottom:60%;
	left:25%;
}
.right-9 .joe-container img{
  position:absolute;
	top:0;
	padding:3px;
  width:100%;
	height:100%;
  text-align: center; 

}
.right-9 .david-container img{
  position:absolute;
	top:0;
	padding:3px;
  width:100%;
	height:100%;
  text-align: center; 

}
.right-9 .joe-container .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  fill: #eee;
  transition: all .8s ease-out 0s;
  stroke-width: 4px;

}
.right-9 .david-container .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  fill: #eee;
  transition: all .8s ease-out 0s;
  stroke-width: 4px;

}
.right-9 .joe-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  fill: #eee;
		
}
.right-9 .david-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  fill: #eee;
		
}



.bottom-backdrop .svg-container{
	position:relative;
	width:275;
	height:185px;
	left:0%;
	top:0%;
}

.bottom-backdrop .svg-container img{
  position:absolute;
	top:0;
	padding:3px;
  width:275px;
	height:100%;
  text-align: center; 

}
.bottom-backdrop .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset:1400px;
  fill: #eee;
  transition: all .8s ease-out 0s;
  stroke-width: 4px;

}

.bottom-backdrop .svg-container:hover .button-outline {
  stroke-dasharray:1400px;
  stroke-dashoffset: 0px;
  fill: #eee;
		
}
.timeline-modal-caption{
	font-size:20px !important;
}
/* The actual timeline (the vertical ruler) */
.timeline img{
	border:2px solid #145FA9;
}
.timeline-image{
	transition:.15s ease-in;
	border:none !important;
	cursor:pointer;
}
.timeline {
  position: relative;
  max-width: 1800px;
  margin: 0 auto;
  margin-bottom:50px
}

/* The actual timeline (the vertical ruler) */
.timeline::after {
  content: '';
  position: absolute;
  width: 6px;
  background-color: #145FA9;
  top: 40px;
  bottom: 0;
  left: 50%;
  margin-left: -3px;
}

/* Container around content */
.timeline-container {
  padding: 25px 0px;
  position: relative;
  background-color: inherit;
  width: 50%;
}

/* The circles on the timeline */
.timeline-container::after {
  content: '';
  position: absolute;
  width: 25px;
  height: 25px;
  right: -13px;
  background-color: #145FA9;
  border: 4px solid white;
  top: 40px;
  border-radius: 50%;
  z-index: 99;
}
#history-header{
	margin-top:2.5rem;
	font-weight:700;
}
.history-fire{
	width:400px;
	position:relative;
	left:-400px;
	top:-175px;
}
.history-cone-display{
	position:relative;
	width:375px;
	right:-105%;
	top:-85%;
}
.history-flexible{
	position:relative;
	width:400px;
	right:-105%;
	top:-400%;
}
.history-flag-building {
    position: relative;
    width: 550px;
    left: -600px;
    top: -400%;
}
.image-with-caption{
	position:relative;
	width:300px;
	left:115%;
	top:-135%;
	color:white;
}
.image-with-caption p{
	font-size:12px;
}
.double-image{
	display:flex;
	justify-content:center;
	width:190px;
	position:relative;
	top:-115%;
	left:-400px;
	z-index:99;
}
.double-image-backdrop{
	width:100%;
	height:250px;
	background-color:#145FA9;
	position:absolute;
	right:100%;
	top:10%;
}
.double-image-backdrop::after{
	content:'';
	position:absolute;
	width:6px;
	background-color:white;
	left:100%;
	margin-left:-3px;
	height:100%;
	z-index:99;
}
.top-backdrop{
	width:100%;
	height:250px;
	background-color:#145FA9;
	position:absolute;
	left:100%;
	top:10%;
}
.top-backdrop::after{
	content:'';
	position:absolute;
	width:6px;
	background-color:white;
	left:0%;
	top:10%;
	margin-left:-3px;
	height:90%;
	z-index:99;
}

.bottom-backdrop{
	width:100%;
	height:300px;
	background-color:#145FA9;
	position:absolute;
	right:100%;
	top:10%;
}

#content-1{
	width:100%;
	height:275px;
}
.content p{
	font-size:16px;
	color:#145FA9;
	padding:25px;
}
.content-1980s{
	width:100%;
	height:250px;
}

/* Place the container to the left */
.left {
  left: 0;
}

/* Place the container to the right */
.right {
  left: 50%;
}

/* Add arrows to the left container (pointing right) */
.left::before {
  content: "Year";
  height: 25px;
  position: absolute;
  top: 40px;
  width: 75px;
  z-index: 1;
  right: 15px;
	text-align:center;
font-size:16px;
	background-color:#145FA9;
	color:white;
	border-radius:15px;
	font-weight:700;
}
.left-0{
	height:250px;
}
.left-0::before{
	content:"1918";
	background-color:transparent;
	top:17%;
}
.left-0::after{
	background-color:white;
}
.left-1::before{
	content:"1934";
}
.left-2::before{
	content:"1944";
}
.left-3::before{
	content:"1970s";
}
.left-4::before{
	content:"1990";
}
.left-5::before{
	content:"1992";
}
.left-6::before{
	content:"1993";
}
.left-7::before{
	content:"2005";
}
.left-8::before{
	content:"2010";
}
/* Add arrows to the right container (pointing left) */
.right::before {
  content: "Year";
  height: 25px;
  position: absolute;
  top: 40px;
  width: 75px;
  z-index: 1;
  left: 15px;
	text-align:center;
	font-size:16px;
	background-color:#145FA9;
	color:white;
	border-radius:15px;
	font-weight:700;
}
.right-1::before{
	content:"1943";
	
}
.right-2::before{
	content:"1964";
	
}
.right-3::before{
	content:"Late 60s";
}
.right-4{
	height:250px;
}
.right-4::before{
	content:"1980's";
}
.right-4::after{
	content:"1980's";
	z-index:99;
}
.right-5::before{
	content:"1995";
}
.right-extra::before{
	content:"1999";
}
.right-6::before{
	content:"2000";
}
.right-7::before{
	content:"2003";
}
.right-8::before{
	content:"2009";
}
.right-9::before{
	content:"2016";
}
.right-10::before{
	content:"2018";
}
.right-10{
	height:300px;
}
.right-10::after{
	content:"2018";
}

.right-10 .content{
	width:100%;
	height:300px;
	border-radius:0;
	position: absolute;
    top: 10%;
}
.right-4::before,.right-10::before{
	display:none;
}
.right-4::after,.right-10::after{
	background-color:white;
	border:2px solid #145FA9;
	width:150px;
	border-radius:15px;
	left:-75px !important;
	text-align:center;
	font-size:16px;
	color:#145fa9;
	font-weight:700;
	top:15px !important
}



.right-4 .content,.right-10 .content,.left-0 .content{
	background-color:#145FA9;
}
.right-4 .content p, .right-10 .content p,.left-0 .content p{
	color:white;
}
/* Fix the circle for containers on the right side */
.right::after {
  left: -12px;
}
.left-1{
	height:90px;
}
.left-2{
	height:100px;
}
.right-1{
	height:100px;
}
.right-2,.right-3{
	height:200px;
}
.left-3{
	height:350px;
}
.left-4,.left-6{
	height:100px;
}
.left-5{
	height:150px;
}
.right-5,.right-7{
	height:125px;
}
.right-6{
	height:200px;
}
.left-7{
	height:100px;
}
.right-8{
	height:125px;
}
.left-8{
	height:125px;
}
.right-9{
	height:600px;
}
.right-extra{
	height:100px;
}
/* The actual content */
.content {
  padding: 20px 20px;
	display:flex;
	justify-content:flex-end;
	align-items:center;
  background-color: white;
  position: relative;
}

/* Media queries - Responsive timeline on screens less than 768px wide */

@media screen and (max-width: 768px) {
	.home-page-recipes .row {
		width: auto;
	}
	button.toggle.close-nav-toggle.fill-children-current-color {
		margin-top: 30px;
		outline: 0;
	}
	.col-lg-6.recipe-detail-col {
		height: auto !important;
	}
	.footer-top.has-footer-menu.has-social-menu {
		flex-direction: column;
		align-items: center;
	}

	.footer-top.has-footer-menu.has-social-menu img.joy-footer-logo {
		margin-bottom: 30px;
	}

	.footer-social-icons {
		text-align: center;
		margin-top: 30px;
	}

	.footer-form {
		margin-top: 30px;
		width: 75%;
		float: none;
		margin: 0px auto;
		margin-top: 30px;
	}
	.st-jude .row {
	    height: auto !important;
	}
	.featured-products.row.container {
		margin-left: 0px;
	}
	.st-jude .copy {
    	text-align: center;
	}
	.btn_and_image img {
	    margin: 0px auto;
	}
	.our-story.row {
    text-align: center;
	}
	.our-story.row .item {
	    margin: 0px auto;
	    margin-bottom: 30px;
	}
}


@media screen and (max-width: 480px) {
/* Place the timelime to the left */
  .timeline::after {
    left: 31px;
  }
	.left,.right{
		height:auto !important;
	}
	#content-1{
		height:auto !important;
		width:auto !important;
	}
	.content-1980s{
		height:auto !important;
		width:auto !important;
	}
	.right-10, .right-10 .content{
		height:auto !important;
		width:auto !important;
	}
/* Full-width containers */
  .timeline-container {
    width: 100%;
    padding-left: 70px;
    padding-right: 25px;
  }

/* Make sure that all arrows are pointing leftwards */
  .timeline-container::before {
    left: 45px;
    border-width: 10px 10px 10px 0;
    border-color: transparent white transparent transparent;
  }
	.left-0::before{
		display:none;
	}
	.left-0::after{
		content:"1918";
		text-align:center;
	font-size:16px;
	border-color:#145FA9 !important;
	color:#145FA9 !important;
	border-radius:15px;
	font-weight:700;
	height:30px;
		width:65px;
		left:0px !important;
		
	}
/* Make sure all circles are at the same spot */
  .left::after, .right::after {
    left: 19px;
  }
	.right-4::after,.right-10::after{
		left:45px !important;
	}
/* Make all right containers behave like the left ones */
  .right {
    left: 0%;
  }
}
@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	
}

/*
 * 
 * GIVING BACK 
 *
 */
.giving-back-container{
	display:grid;
	grid-template-columns: auto auto auto;
	margin:3vh 0;
	grid-gap:2px;
}
.giving-back-container .item{
	/*background-image:url('/wp-content/uploads/2020/04/stjude_featurephoto.jpg');*/
	background-attachment:fixed;
	background-size:cover;
	background-position:center;
}
.giving-back-container .item-1{
	grid-column-start:1;
	grid-column-end:3;
	grid-row-start:1;
	grid-row-end:3;
}
.giving-back-container .item-2{
	grid-row-start:1;
	grid-row-end:4;
}
.giving-back-container .item-3{
	grid-column-start:1;
	grid-column-end:3;
}
.giving-back-container .item-4{
	grid-row-start:4;
	grid-row-end:6;
}
.giving-back-container .item-5{
	grid-column-start:2;
	grid-column-end:4;
	grid-row-start:4;
	grid-row-end:7;
}

.giving-back-container .item-7{
	grid-row-start:7;
	grid-row-end:9;
}
.giving-back-container .item-8{
	grid-column-start:2;
	grid-column-end:4;
}
.giving-back-container .item-10{
	grid-column-start:3;
	grid-column-end:4;
	grid-row-start:8;
	grid-row-end:11;
}
.item-overlay{
	background-color:rgba(141, 193, 245, 0.74);
	height:100%;
	width:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
	transition:.65s ease;
	cursor:pointer;
	overflow-y:hidden;
	padding:35px 0;
}
.item-overlay p.up{
	font-size:14px;
	text-align:center;
	padding:0px 25px;
	transform:translateY(45vh);
	transition:.55s ease;
}
.item-overlay p.gb-right{
	font-size:14px;
	text-align:center;
	padding:0px 25px;
	transform:translateX(75vw);
	transition:.55s ease;
}
.item-overlay:hover p.gb-right{
		transform:translateX(0);
}
.item-overlay:hover{
	background-color:rgba(224, 240, 255, .74);
}
.item-overlay img{
	width:45%;
	transition:.65s ease;
	padding-bottom:10px;
}
.item-overlay:hover p.up{
		transform:translateY(-25%);
}
.item-overlay:hover img{
	transform:scale(1.1);
}
@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	
}
/*
 * 
 * END GIVING BACK
 * 
 */

/*
 * 
 * OUR COMPANY
 * 
 */

@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	
}
/*
 * 
 * END OUR COMPANY
 * 
 */


/*
 * 
 * CONTACT/QUALITY FEEDBACK/FAQ
 * 
 */
.faq-container{
	max-width:80vw;
	margin-bottom:5vh;
	margin-top:5vh;
}
.poster-container .page-content p{
	font-size:16px;
}

.container-fluid.contact{
	max-width:100vw;
	margin-top:2.5rem;
}
.page-content{
	display:flex;
	flex-direction:row-reverse;
	justify-content:center;
	align-items:flex-start;
}
.page-content .location-info,.fs-side{
	display:flex;
	flex-direction:column;
	margin-right:3.5rem;
	width:30%;
}
.page-content .joy-header{
	text-transform:uppercase;
	font-weight:700;
}
.page-content .location-info a,.fs-side a,.oc-grid-item-1 > div > a{
	font-size:18px;
	font-weight:700;
	color:rgb(0,80,161);
	padding:5px 10px;
	text-transform:uppercase;
}
.page-content .location-info a:hover, .fs-side a:hover,.oc-grid-item-1 > div > a:hover{
	background-color:#d7e5f0;
	color:rgb(0,80,161) !important;
	text-decoration:none !important;
}
.page-content a.current-link,.oc-container > .side-menu > a.current-link{
	border:2px solid rgb(0,80,161);
}
.page-content .location-info hr{
	border-top:2px solid rgb(0,80,161);
	margin-left:0;
	margin-right:0;
	margin-top:2rem !important;
}
.pa-location h2,.az-location h2{
	color:rgb(0,80,161) !important;
	font-weight:700 !important;
	font-size:18px;
	text-transform:uppercase;
}
.pa-location p,.az-location p{
	color:#626262;
	font-size:14px;
}
.contact .page-form a{
	color:#145ea9 !important;
	text-decoration:underline;
}
.contact a:hover, .contact a:focus{
	color:#c50000 !important;
}
.contact .page-form p {
	font-size:14px;
}
.contact .page-form p span{
	color:red;
}
.contact .page-form .nf-form-fields-required{
	display:none;	
}
.contact .page-form .nf-field-label label{
	color:rgb(0,80,161) !important;
	font-weight:700 !important;
	font-size:16px !important;
	line-height:18px !important;
	text-transform:uppercase;
}
.contact .page-form .nf-field-element input,.contact .page-form .nf-field-element textarea{
	background-color:#fafbfc !important;
	border-radius:10px !important;
}
.contact .page-form #nf-field-4,.contact .page-form #nf-field-103{
	float:right;
	background-color:#145ea9 !important;
	border:2px solid #145ea9;
	border-radius:35px !important;
	padding:2px 35px !important;
	font-weight:700 !important;
}
.contact .page-form #nf-field-4:hover,#nf-field-4:focus,.contact .page-form #nf-field-103:hover, #nf-field-103:focus{
	text-decoration:none !important;
	background-color:white !important;
	color:#145ea9;
}
.mb-0 .btn{
	white-space:normal !important;
	text-align:left;
}
@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	
}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	.contact .page-content{
		display:block;
	}
	.location-info{
		width:100% !important;
	}
	.page-content .location-info a{
		display:none !important;
	}
	.page-content .location-info{
		text-align:center;
	}
}
/*
 * 
 * END CONTACT
 * 
 */ 

/*
 * 
 * EMPLOYMENT
 * 
 */
/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
  background-color: transparent;
  width: 450px;
  height: 300px;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
  outline: none; /* Remove default browser outline */
}

.flip-card:focus {
  outline: 2px solid #007BFF; /* Optional: Add a custom outline for focus indication */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card:focus .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  color: black;
}

/* Style the back side */
.flip-card-back {
  background-color: #145FA9;
  color: white;
  transform: rotateY(180deg);
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}

.job-tile{
	transition:.15s ease-in;
	border:2px solid #145FA9;
}
.job-tile:hover{
	border:15px inset rgba(0,0,0,.3);
	border-radius:25px;
}
.job-tile-link:hover{
	text-decoration:none;
}
.job-tile{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	height:25vh;
	background-color:#145FA9;
	color:white;
	margin-bottom:15px;
}
.job-tile a{
	color:white;
}
.job-tile a:hover{
	color:white;
	text-decoration:underline;
}
.job-widgets{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	padding:0px 50px 50px 50px;
	margin-top:7em;
}
.job-widgets .col{
	padding:50px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	text-align:center;
}
.job-widgets .col img{
	max-width:450px;
}
.job-widgets .col .flip-card .flip-card-front img{
	width:450px;
}
.job-widgets .col p{
	font-size:16px;
}
.job-widgets .col h2{
	font-size:24px;
	font-weight:600;
}
.flip-card-back{
	padding:0px 25px;
}
.job-title-section{
	background-color:#145FA9;
	height:40vh;
	display:flex;
	justify-content:center;
	align-items:center;
}
.job-content-section{
	background-color:#DBE6F1;
	padding:25px 25px;
	height:auto;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
}
.job-content-section p{
	font-size:18px;
}
.job-content-section p span {
	color:#145FA9;
	font-weight:700;
}
.job-header{
	color:white;
	font-weight:700;
}
@media (max-width: 1024px) {
  /* Selectors and styles affecting screens UP TO 1024px (Large Tablet/Desktop) */
	
}

@media (max-width: 768px) {
    /* Selectors and styles affecting screens UP TO 768px (Small Tablet) */
	.job-widgets p{
		font-size:16px !important;
	}
	.job-widgets h2{
		font-size:30px !important;
	}

}

@media (max-width: 480px) {
    /* Selectors and styles affecting screens UP TO 480px (Phone) */
	.job-widgets .col{
		padding:0 !important;
	}
	.job-widgets p{
		font-size:12px !important;
	}
	.job-widgets h2{
		font-size:22px !important;
	}
	.job-widgets .col .flip-card .flip-card-front img{
	width:350px;
}
	.flip-card{
		width:350px !important;
		height:275px !important;
	}
}
/*
 * 
 * END EMPLOYMENT
 * 
 */
/*
 * 
 * COMING SOON
 * 
 */
.container-fluid.coming-soon{
	height:75vh;
	display:flex;
	justify-content:center;
	align-items:center;
	background-color:rgba(20, 95, 169,.75);
}
.container-fluid.coming-soon >div > h1{
	color:white;
	text-transform:uppercase;
	font-size:30px;
	letter-spacing:1.5px;
	font-weight:700;
	text-align:center;
}
.container-fluid.coming-soon >div{
	z-index:2;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
.container-fluid.coming-soon >div > img{
	width:250px;
}
.container-fluid.coming-soon .btn-holder{
	background-color:inherit;
	margin-top:2.5rem;
}
.container-fluid.coming-soon .btn-holder a{
	margin-right:1rem;
}
.coming-soon-overlay{
	position:absolute;
	top:0;
	left:0;
	height:75vh;
	width:100%;
}
/*
 * 
 * END COMING SOON
 * 
 */
/*
 * 
 * TOURS
 * 
 */ 
.the-tour-form-response{
	text-align:center;
}
.tours > .container{
	padding:25px 0px;
	width:100%;
	height:auto;
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
}
.tours .container .tour{
	height:65vh;
	width:100%;
	background-size:cover;
	background-position:center;
	color:white;
}
.tour-overlay{
	display:flex;
	justify-content:space-between;
	align-items:center;
	position:relative;
	height:100%;
	width:100%;
	background-color:rgba(0,0,0,.3);
	padding:0px 15px;
}
.tours .container .all-tours{
	display:grid;
	grid-template-columns: repeat(1,1fr);
    grid-gap: 5px;
	width:100%;
}
.tour-panel{
	padding:10px 20px;
	background-color:rgba(20, 95, 169,.8);
	height:75%;
	width:50%;
}
.tour-panel-content{
	height:100%;
	width:100%;
	display:flex;
	justify-content:space-evenly;
	align-items:center;
	flex-direction:column;
	padding:50px 0px;
}
.tour-form-row-1,.tour-form-row-2{
	/*display:flex;*/
	display:block;
}
.tour-panel-content > h2,.tour-panel-content > h3,.tour-panel-content > div{
	width:100%;
}
.tour-panel-content >h2{
	font-size:2.75rem;
	font-weight:700;
	text-transform:uppercase;
}
.tour-panel-content > h3{
	font-size:2rem;
	font-weight:700;
}
.tour-button-container{
	display:flex;
}
.tours-form-container{
	visibility:hidden;
	display:none;
	height:75%;
	width:48%;
}
#postData{
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-direction:column;
	background-color:rgba(20, 95, 169,.8);
	padding:15px;
	height:100%;
}
#postData input{
	height:15px;
	text-align:center;
}
#postData #joyFormSubmit{
height:35px !important;
	width:80% !important;
	border:2px solid white !important;
	display:flex !important;
	justify-content:center !important;
	align-items:center !important;
	border-radius:20px !important;
	font-size:1.65rem !important;
	text-transform:uppercase !important;
	text-align:center !important;
	font-weight:700 !important;
	font-family: "Montserrat",sans-serif !important;
	transition:.35s linear !important;
	padding:0 !important;
	margin:0 !important;
	background-color:rgba(20, 95, 169,.8) !important;
	letter-spacing:-0.015em !important;
	line-height:1.5 !important;
	text-decoration:none !important;
}
#postData #joyFormSubmit:hover{
background-color:white !important;
	color:rgb(20, 95, 169) !important;
	border:2px solid rgb(20, 95, 169) !important;
}
#postData #joyFormSubmit:focus{
	outline:none !important;
}
	#tourName{
	display:none;
	visibility:hidden;
}

#tourLabel span{
	font-family: "Montserrat",sans-serif !important;
	font-weight:700;
	text-transform:uppercase;
	font-size:20px;
}
.the-tour-form-response{
	font-size:24px;
}
@media (max-width:1024px){
	
}
@media (max-width:768px){
	
}
@media (max-width:480px){
	.tour-overlay{
		flex-direction:column;
		justify-content:flex-start;
	}
	.tours-form-container{
		height:60%;
		width:80%;
	}
	.tour-panel{
		height:35%;
		width:80%;
	}
	.tours .container .tour{
		height:90vh;
	}
	.tour label,.tour input{
		font-size:1rem;
	}
	.the-tour-form-response{
		font-size:14px;
	}
}
/*
 * 
 * END TOURS
 * 
 */

/*
 * 
 * SLIDE INS
 * 
 */
.slide-in-left{
	height:25%;
	width:35%;
	position:absolute;
	max-width:375px;
	left:-90px;
	top:60rem;
/* 	background-image:url("https://joycone.com/wp-content/uploads/2021/05/Joy_fried-ice-cream_feature-image-1.png"); */
	background-image:url("https://joycone.com/wp-content/uploads/2021/06/big-Joy_sundae-image.png");
	background-size:cover;
	background-position:right;
	z-index:99;
	transition:.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
   
}
.slide-in-left:hover{
	transform:translateX(65px);
}
.slide-in-right{
	height:25%;
	width:35%;
	position:absolute;
		max-width:375px;
	right:-90px;
	top:60rem;
	background-image:url("/wp-content/uploads/2020/05/right.png");
	background-position:left;
	background-size:cover;
	z-index:99;
	transition:.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.slide-in-right:hover{
	transform:translateX(-65px);
}
.slide-in-right p{
    color: white;
    text-transform: uppercase;
    position: relative;
    top:11.5%;
    left:10%;
    font-weight: 900;
    font-size: 16px;
        letter-spacing: 1px;
    font-family: 'montserrat' !important;
}
.slide-in-left p{
    color: white;
    text-transform: uppercase;
    position: relative;
    top:11.5%;
		left:45%;
    font-weight: 900;
    font-size: 16px;
     letter-spacing: 1px;
    font-family: 'montserrat' !important;
}

body{
	overflow-x:hidden;
}
@media (max-width:1024px){
	
}
@media (max-width:768px){
	
}
@media (max-width:480px){
	.slide-in-right,.slide-in-left{
		display:none;
	}
}


/* For 110% zoom ADA issues */
@media screen and (max-width: 1170px) {
  div#myBtnContainer { 
    height: 62px;
    width: 62px;
    right: 10px;
    bottom: 70px;
    padding: 11px 6px;
   }


div#myBtnContainer img {
		width: 15px;
	}

	div#myBtnContainer h3 {
		height: 100%; 
	  font-size: 10px !important;
	  margin-bottom: 0px;
	 margin-top: 2px;
	}


form#location_based_filter label {
    font-size: 1.7rem;
    margin-right: 10px !important;
    margin-bottom: 0px;
}
form#location_based_filter select#location
{
	    font-size: 1.5rem !important;
    height: 33px !important;
    padding-left: 2px !important;
    border-width: 0.5px;
}
form#location_based_filter button {
	font-size: 1.4rem !important;
    margin-left: 7px !important;
    padding: 7px;
}


}


/* For 125% zoom ADA issues */
@media screen and (max-width: 1040px) {

div#myBtnContainer { 
    height: 57px;
    width: 57px;
    right: 10px;
    bottom: 58px;
    padding: 6px 6px;
   }

div#myBtnContainer img {
		width: 15px;
	}

	div#myBtnContainer h3 {
		height: 100%; 
	  font-size: 10px !important;
	  margin-bottom: 0px;
	 margin-top: 2px;
	}


form#location_based_filter label {
    font-size: 1.7rem;
    margin-right: 10px !important;
    margin-bottom: 0px;
}
form#location_based_filter select#location
{
	    font-size: 1.5rem !important;
    height: 33px !important;
    padding-left: 2px !important;
    border-width: 0.5px;
}
form#location_based_filter button {
	font-size: 1.4rem !important;
    margin-left: 7px !important;
    padding: 7px;
}

#job-holder .job-tile h2 {
  text-align: center;
}


}


/* For 150% zoom ADA issues */
@media screen and (max-width: 870px) {
div#myBtnContainer { 
    height: 51px;
    width: 51px;
    right: 10px;
    bottom: 58px;
    padding: 6px 6px;
   }

div#myBtnContainer img {
		width: 15px;
	}

	div#myBtnContainer h3 {
		height: 100%; 
	  font-size: 10px !important;
	  margin-bottom: 0px;
	 margin-top: 2px;
	}

form#location_based_filter label {
    font-size: 1.7rem;
    margin-right: 10px !important;
    margin-bottom: 0px;
}
form#location_based_filter select#location
{
	    font-size: 1.5rem !important;
    height: 33px !important;
    padding-left: 2px !important;
    border-width: 0.5px;
}
form#location_based_filter button {
	font-size: 1.4rem !important;
    margin-left: 7px !important;
    padding: 7px;
}



.job-widgets {
  padding-bottom: 30px;
}

.job-widgets .col {
  padding-bottom: 0px;
  padding-top: 40px;
}

.job-widgets .flip-card {
	margin-bottom: 0px;
	padding: 0px 20px;
}

.job-widgets .flip-card img {

  width: 100% !important;
}

.job-widgets .flip-card-back h2 {
  font-size: 22px !important;
}

.job-widgets .flip-card-back p {
  font-size: 13px !important;
}

.job-widgets #h-current-openings { 
  font-size: 1.9rem;
  margin-top: 18px;
}

#job-holder .job-tile {
  padding-top: 7px;
}

#job-holder .job-tile h2 {
  font-size: 1.6rem;
    margin-bottom: 0px;
}

#job-holder .job-tile h3 {
  font-size: 1.6rem;
}

#job-holder .pagination-wrap {
  margin-bottom: 0px;
  margin-top: 0px;
}

#job-holder .page-link {
  font-size: 13px;
}



}

/* For 175% zoom ADA issues */
@media screen and (max-width: 750px) {
div#myBtnContainer {
    height: 34px;
    width: 34px;
    right: 5px;
    bottom: 2px;
    padding: 3px 6px;
   }

div#myBtnContainer img {
		width: 8px;
	}
	div#myBtnContainer p {
		margin-bottom: 0px;
	}
	div#myBtnContainer h3 {
		height: 100%; 
	  font-size: 7px !important;
	  margin-bottom: 0px;
	 margin-top: 2px;
	}

form#location_based_filter label {
    font-size: 1.7rem;
    margin-right: 10px !important;
    margin-bottom: 0px;
}
form#location_based_filter select#location
{
	    font-size: 1.5rem !important;
    height: 33px !important;
    padding-left: 2px !important;
    border-width: 0.5px;
}
form#location_based_filter button {
	font-size: 1.4rem !important;
    margin-left: 7px !important;
    padding: 7px;
}



.job-widgets {
  padding-bottom: 30px;
}

.job-widgets .col {
  padding-bottom: 0px;
  padding-top: 40px;
}

.job-widgets .flip-card {
	margin-bottom: 0px;
	padding: 0px 60px;
}

.job-widgets .flip-card img {

  width: 100% !important;
}

.job-widgets .flip-card-back h2 {
  font-size: 18px !important;
}

.job-widgets .flip-card-back p {
  font-size: 11px !important;
}

.job-widgets #h-current-openings { 
  font-size: 1.9rem;
  margin-top: 18px;
}

#job-holder .job-tile {
  padding-top: 7px;
}

#job-holder .job-tile h2 {
  font-size: 1.6rem;
    margin-bottom: 0px;
}

#job-holder .job-tile h3 {
  font-size: 1.6rem;
}

#job-holder .pagination-wrap {
  margin-bottom: 0px;
  margin-top: 0px;
}

#job-holder .page-link {
  font-size: 13px;
}

}



/* For 200% zoom ADA issues */
@media screen and (max-width: 650px) {
div#myBtnContainer {
    height: 32px;
    width: 32px;
    right: 5px;
    bottom: 2px;
    padding: 3px 6px;
   }

div#myBtnContainer img {
		width: 7px;
	}
	div#myBtnContainer p {
		margin-bottom: 0px;
	}
	div#myBtnContainer h3 {
		height: 100%; 
	  font-size: 6px !important;
	  margin-bottom: 0px;
	 margin-top: 2px;
	}

form#location_based_filter label {
    font-size: 1.6rem;
    margin-right: 10px !important;
    margin-bottom: 0px;
}
form#location_based_filter select#location
{
	    font-size: 1.5rem !important;
    height: 33px !important;
    padding-left: 2px !important;
    border-width: 0.5px;
}
form#location_based_filter button {
	font-size: 1.4rem !important;
    margin-left: 7px !important;
    padding: 6px;
}



.job-widgets {
  padding-bottom: 30px;
}

.job-widgets .col {
  padding-bottom: 0px;
  padding-top: 40px;
}

.job-widgets .flip-card {
	margin-bottom: 0px;
	padding: 0px 60px;
}

.job-widgets .flip-card img {

  width: 100% !important;
}

.job-widgets .flip-card-back h2 {
  font-size: 18px !important;
}

.job-widgets .flip-card-back p {
  font-size: 11px !important;
}

.job-widgets #h-current-openings { 
  font-size: 1.9rem;
  margin-top: 18px;
}

#job-holder .job-tile {
  padding-top: 7px;
}

#job-holder .job-tile h2 {
  font-size: 1.6rem;
    margin-bottom: 0px;
}

#job-holder .job-tile h3 {
  font-size: 1.6rem;
}

#job-holder .pagination-wrap {
  margin-bottom: 0px;
  margin-top: 0px;
}

#job-holder .page-link {
  font-size: 13px;
}


}


/* For 250% zoom ADA issues */
@media screen and (max-width: 520px) {

div#myBtnContainer {
    height: 27px;
    width: 27px;
    right: 5px;
    bottom: 2px;
    padding: 3px 6px;
   }

div#myBtnContainer img {
		width: 6px;
	}
	div#myBtnContainer p {
		margin-bottom: 0px;
	}
	div#myBtnContainer h3 {
		height: 100%; 
	  font-size: 4px !important;
	  margin-bottom: 0px;
	 margin-top: 2px;
	}

form#location_based_filter label {
    font-size: 1.6rem;
    margin-right: 10px !important;
    margin-bottom: 0px;
}
form#location_based_filter select#location
{
	    font-size: 1.5rem !important;
    height: 33px !important;
    padding-left: 2px !important;
    border-width: 0.5px;
}
form#location_based_filter button {
	font-size: 1.4rem !important;
    margin-left: 7px !important;
    padding: 6px;
}



.job-widgets {
  padding-bottom: 30px;
}

.job-widgets .col {
  padding-bottom: 20px;
}

.job-widgets .flip-card {
	margin-bottom: 13px;
	padding: 0px 70px;
}

.job-widgets .flip-card img {

  width: 100% !important;
}

.job-widgets .flip-card-back h2 {
  font-size: 14px !important;
}

.job-widgets .flip-card-back p {
  font-size: 9px !important;
}

.job-widgets #h-current-openings { 
  font-size: 1.8rem;
}

#job-holder .job-tile {
  padding-top: 7px;
}

#job-holder .job-tile h2 {
  font-size: 1.4rem;
    margin-bottom: 0px;
}

#job-holder .job-tile h3 {
  font-size: 1.4rem;
}

#job-holder .pagination-wrap {
  margin-bottom: 0px;
  margin-top: 0px;
}

#job-holder .page-link {
  font-size: 13px;
}

}

/* For 300% zoom ADA issues */
@media screen and (max-width: 430px) {
  div#myBtnContainer {
    height: 23px;
    width: 23px;
    right: 5px;
    bottom: 2px;
    padding: 3px 6px;
   }

div#myBtnContainer img {
		width: 6px;
	}
	div#myBtnContainer p {
		margin-bottom: 0px;
	}
	div#myBtnContainer h3 {
		height: 100%; 
	  font-size: 4px !important;
	  margin-bottom: 0px;
	 margin-top: 2px;
	}

form#location_based_filter label {
    font-size: 1.5rem;
    margin-right: 10px !important;
    margin-bottom: 0px;
}
form#location_based_filter select#location
{
	    font-size: 1.3rem !important;
    height: 33px !important;
    padding-left: 2px !important;
    border-width: 0.5px;
    width: 27% !important;
}
form#location_based_filter button {
	font-size: 1.4rem !important;
    margin-left: 7px !important;
    padding: 6px;
    width: 14% !important;
}



.job-widgets {
  padding-bottom: 30px;
}

.job-widgets .flip-card {
	margin-bottom: 13px;
	padding: 0px 70px;
}

.job-widgets .flip-card img {

  width: 100% !important;
}

.job-widgets .flip-card-back h2 {
  font-size: 14px !important;
}

.job-widgets .flip-card-back p {
  font-size: 9px !important;
}

.job-widgets #h-current-openings { 
  font-size: 1.8rem;
}

#job-holder .job-tile {
  padding-top: 7px;
}

#job-holder .job-tile h2 {
  font-size: 1.2rem;
    margin-bottom: 0px;
}

#job-holder .job-tile h3 {
  font-size: 1.2rem;
}

#job-holder .pagination-wrap {
  margin-bottom: 0px;
  margin-top: 0px;
}

#job-holder .page-link {
  font-size: 13px;
}

ul.footer-menu a  {
  font-size: 14px;
  padding: 5px 7px;
}

}



/* For 400% zoom ADA issues */
@media screen and ( max-width: 350px ) {
	div#myBtnContainer {
	height: 23px;
    width: 23px;
    right: 5px;
    bottom: 2px;
   padding: 3px 6px;
	}
 	div#myBtnContainer img {
		width: 6px;
	}
	div#myBtnContainer p {
		margin-bottom: 0px;
	}
	div#myBtnContainer h3 {
		height: 100%; 
	  font-size: 4px !important;
	  margin-bottom: 0px;
	 margin-top: 2px;
	}

form#location_based_filter label {
    font-size: 1rem;
    margin-right: 10px !important;
    margin-bottom: 0px;
}
form#location_based_filter select#location
{
	    font-size: 0.9rem !important;
    height: 33px !important;
    padding-left: 2px !important;
    border-width: 0.5px;
    width: 27% !important;
}
form#location_based_filter button {
	font-size: 1.3rem !important;
    margin-left: 7px !important;
    padding: 7px;
    width: 16% !important;
}

.job-widgets {
  padding-bottom: 30px;
}

.job-widgets .flip-card {
	margin-bottom: 13px;
	padding: 0px 80px;
}

.job-widgets .flip-card img {

  width: 100% !important;
}

.job-widgets .flip-card-back h2 {
  font-size: 14px !important;
}

.job-widgets .flip-card-back p {
  font-size: 9px !important;
}

.job-widgets #h-current-openings { 
  font-size: 1.8rem;
}

#job-holder .job-tile {
  padding-top: 7px;
}

#job-holder .job-tile h2 {
  font-size: 1.2rem;
    margin-bottom: 0px;
}

#job-holder .job-tile h3 {
  font-size: 1.2rem;
}

#job-holder .pagination-wrap {
  margin-bottom: 0px;
  margin-top: 0px;
}

#job-holder .page-link {
  font-size: 13px;
}

ul.footer-menu a  {
  font-size: 11px;
  padding: 5px 7px;
}


}

/* ADA issues */
#site-footer {
  padding: 0px 0px 4.3rem 0px;
}

#site-footer .section-inner {
  padding-top: 4.3rem;
}

.footer-top {
  padding-top: 0px;
}


/*
 * 
 * END SLIDE INS
 * 
 */
body.logged-in.admin-bar #site-header {top:30px}
li#mega-menu-item-55 {
    width: 200px !important;
}
/*Fixing responsive issue on history timeline*/
@media (min-width: 1040px) and (max-width: 1360px) {
    .right-10 {
        height: 400px !important;
    }
    .right-10 .content{
    	height: 400px !important;
    }
    .bottom-backdrop{
    	height: 400px !important;
    }
}
@media (min-width: 900px) and (max-width: 1039px) {
    .right-10 {
        height: 470px !important;
    }
    .right-10 .content{
    	height: 470px !important;
    }
    .bottom-backdrop{
    	height: 470px !important;
    }
}
@media screen and ( max-width: 899px ) {
	.right-10 {
        height: 600px !important;
    }
    .right-10 .content{
    	height: 600px !important;
    }
    .bottom-backdrop{
    	height: 600px !important;
    }
}