@import url("jquery.fancybox.css");
.page-id-maccas-journey video {
  width: 100%    !important;
  height: auto   !important;
}
.page-id-maccas-journey .main-video img {cursor:pointer;}
.page-id-maccas-journey #thevideo {display:none;}
.page-id-maccas-journey#page-content { background-color: #edd7a9; background-image: none;}
.page-id-maccas-journey .hero { height: 70px;}
.page-id-maccas-journey .banner {background: url('../images/themes/maccasjourney/tray-top-desktop.jpg') no-repeat  50% 0; height: 133px; display:block; }
.page-id-maccas-journey .bottom-tray {background: url('../images/themes/maccasjourney/tray-bottom-desktop.jpg') no-repeat  50% 0; height: 133px; display:block; }
.page-id-maccas-journey .row {max-width: 960px;}
.page-id-maccas-journey .row .col-md-12 {padding:0;}
.tray-container {background: url('../images/themes/maccasjourney/maccas-traybody.jpg') no-repeat 50% 0; max-width: 960px; width: 100%; display: block; overflow: hidden; height: 3775px; position: relative; -webkit-background-size:950px 3908px }
.page-id-maccas-journey .main-video {margin:0 auto; padding: 0px; max-width: 635px; max-height: 356px;}
.page-id-maccas-journey .main-video img {max-width: 100%}
.page-id-maccas-journey .heading-copy { font-size: 24px; color: #fff; line-height: 1.4em; max-width: 555px; padding-top: 20px; margin: 0 auto; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100;}
.page-id-maccas-journey .heading-copy .scroll { font-weight: 500; padding-top: 20px;}
.page-id-maccas-journey .top-section {margin: 0 auto; width: 100%; max-width: 800px; text-align: center; padding-top: 60px;}

/*Image icons */
.page-id-maccas-journey .icon-items, .page-id-maccas-journey .cta-text {position: absolute;}
.page-id-maccas-journey .cta-text a, .page-id-maccas-journey .cta-text { color: #000; font-size: 20px; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 600; text-align: center; line-height: 1.3em; text-decoration: none;}
.page-id-maccas-journey .cta-text a:hover { color: #620521;}
.page-id-maccas-journey .cta-arrow {background: url('../images/themes/maccasjourney/arrow.png') no-repeat 0 0; width: 10px; height: 20px; display: inline-block; margin-left: 10px; content: ''}


.page-id-maccas-journey #shortcut {background: url('../images/themes/maccasjourney/shortcut-route.png') no-repeat 0 0; height: 150px; width: 214px; top: 853px; right:121px;}
.page-id-maccas-journey #shortcut .cta-arrow { position: absolute; right: 25px;
top: 30%;}



.page-id-maccas-journey #burger {background: url('../images/themes/maccasjourney/burger.png') no-repeat 0 0; height: 143px; width: 143px; top: 987px; right:121px;}
.page-id-maccas-journey #scenic-view {background: url('../images/themes/maccasjourney/scenic-route.png') no-repeat 0 0; height: 193px; width: 180px; top: 1022px; left: 179px;}              

.page-id-maccas-journey #mccafe {height: 151px; width: 271px; top: 1359px; left: 117px;}
.page-id-maccas-journey #mccafe-text { display: block; top: 1525px; left: 164px;}

.page-id-maccas-journey #beetroot {background: url('../images/themes/maccasjourney/beetroot.png') no-repeat 0 0; height: 282px; width: 258px; top: 1190px; right: 78px;}
.page-id-maccas-journey #beetroot-text { display: block; top: 1483px; right: 166px;}

.page-id-maccas-journey #patty {background: url('../images/themes/maccasjourney/oz-patty.png') no-repeat 0 0; height: 258px; width: 299px; top: 1769px; left: 81px;}
.page-id-maccas-journey #patty-text { display: block; top: 2033px; left: 166px;}

.page-id-maccas-journey #flying {height: 151px; width: 271px; top: 2046px; right: 92px;}
.page-id-maccas-journey #flying-text { display: block; top: 2214px; right: 125px;}



.page-id-maccas-journey #petrol {background: url('../images/themes/maccasjourney/petrol.png') no-repeat 0 0; height: 179px; width: 449px; top: 2162px; left: 81px;}
.page-id-maccas-journey #petrol-text { display: block; top: 2355px; left: 205px;}


.page-id-maccas-journey #wrap {height: 151px; width: 271px; top: 2627px; left: 117px;}
.page-id-maccas-journey #wrap-text { display: block; top: 2794px; left: 175px;}



.page-id-maccas-journey #mcdelivery {background: url('../images/themes/maccasjourney/mc-delivery.png') no-repeat 0 0; height: 180px; width: 158px; top: 2557px; right: 253px;}
.page-id-maccas-journey #mcdelivery-text { display: block; top: 2750px; right: 240px;}

.page-id-maccas-journey #sugar {background: url('../images/themes/maccasjourney/sugar.png') no-repeat 0 0; height: 161px; width: 366px; top: 2918px; right: 143px;}
.page-id-maccas-journey #sugar-text { display: block; top: 3093px; right: 202px;}

.page-id-maccas-journey #pants {background: url('../images/themes/maccasjourney/pants.png') no-repeat 0 0; height: 183px; width: 209px; top: 3178px; left: 125px;}
.page-id-maccas-journey #pants-text { display: block; top: 3370px; left: 192px;}

.page-id-maccas-journey #whatsupnext {background: url('../images/themes/maccasjourney/whats-up-next.png') no-repeat 0 0; height: 207px; width: 347px; top: 3514px; right: 115px;}

.page-id-maccas-journey #whatsupnext .cta-arrow { position: absolute; top: 58px; left: 128px;}


/* Pop Up */

#maccas-journey .fancybox-skin { background-color: transparent!important;}
#beetroot-pop h2, #petrol-pop h2, #mcdelivery-pop h2, #patty-pop h2, #sugar-pop h2, #pants-pop  h2 { font-size: 24px; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 600;}


#beetroot-pop { max-width: 380px; width: 380px\9; background: transparent url('../images/themes/maccasjourney/beetroot-bg.png') no-repeat 0 0; color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 16px; padding: 45px; padding-top: 200px; height: 510px;}

#petrol-pop { max-width: 378px; width: 378px\9; background: transparent url('../images/themes/maccasjourney/petrol-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 16px; padding: 45px; padding-top: 140px; height: 441px;}

#mcdelivery-pop { max-width: 380px;  width: 380px\9; background: transparent url('../images/themes/maccasjourney/mcdelivery-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 16px; padding: 45px; padding-top: 185px; height: 433px;}


#patty-pop { max-width: 380px; width: 380px\9; background: transparent url('../images/themes/maccasjourney/patty-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 16px; padding: 45px; padding-top: 150px; height: 426px;}

#sugar-pop { max-width: 380px; width: 380px\9; background: transparent url('../images/themes/maccasjourney/sugar-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 16px; padding: 45px; padding-top: 140px; height: 396px;}


#pants-pop { max-width: 380px; width: 380px\9; background: transparent url('../images/themes/maccasjourney/pants-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 16px; padding: 45px; padding-top: 140px; height: 389px;}




/* Animation */


.slideDown{
	animation-name: slideDown;
	-webkit-animation-name: slideDown;	

	animation-duration: 1.7s;	
	-webkit-animation-duration: 1.7s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;	

	animation-iteration-count:infinite;
	-webkit-animation-iteration-count:infinite;

	visibility: visible !important;						
}

@keyframes slideDown {
	0% {
		transform: translateY(-5%);
	}
	50%{
		transform: translateY(0%);
	}
	100% {
		transform: translateY(-5%);
	}		
}

@-webkit-keyframes slideDown {
	0% {
		-webkit-transform: translateY(-5%);
	}
	50%{
		-webkit-transform: translateY(0%);
	}		
	100% {
		-webkit-transform: translateY(-5%);
	}	
}

#mcdelivery {
	animation-name: door;
	-webkit-animation-name: door;	

	animation-duration: 1.8s;	
	-webkit-animation-duration: 1.8s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;	

	animation-iteration-count:infinite;
	-webkit-animation-iteration-count:infinite;	

	visibility: visible !important;	
}

@keyframes door {
	0% {
		transform: translateX(-10%);
	}
	50%{
		transform: translateX(0%);
	}
	100% {
		transform: translateX(-10%);
	}	
}

@-webkit-keyframes door {
	0% {
		-webkit-transform: translateX(-10%);
	}
	50%{
		-webkit-transform: translateX(0%);
	}	
	100% {
		-webkit-transform: translateX(-10%);
	}
}

.slideRight{
	animation-name: slideRight;
	-webkit-animation-name: slideRight;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;	

	animation-iteration-count:infinite;
	-webkit-animation-iteration-count:infinite;	

	visibility: visible !important;	
}

@keyframes slideRight {
	0% {
		transform: translateX(-40%);
	}
	50%{
		transform: translateX(0%);
	}
	100% {
		transform: translateX(-40%);
	}	
}

@-webkit-keyframes slideRight {
	0% {
		-webkit-transform: translateX(-40%);
	}
	50%{
		-webkit-transform: translateX(0%);
	}	
	100% {
		-webkit-transform: translateX(-40%);
	}
}



.expandOpen{
	animation-name: expandOpen;
	-webkit-animation-name: expandOpen;	

	animation-duration: 1.3s;	
	-webkit-animation-duration: 1.3s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	visibility: visible !important;	
}

@keyframes expandOpen {
	0% {
		transform: scale(1.8);		
	}
	50% {
		transform: scale(0.95);
	}	
	80% {
		transform: scale(1.05);
	}
	90% {
		transform: scale(0.98);
	}	
	100% {
		transform: scale(1);
	}			
}

@-webkit-keyframes expandOpen {
	0% {
		-webkit-transform: scale(1.8);		
	}
	50% {
		-webkit-transform: scale(0.95);
	}	
	80% {
		-webkit-transform: scale(1.05);
	}
	90% {
		-webkit-transform: scale(0.98);
	}	
	100% {
		-webkit-transform: scale(1);
	}					
}




.expandOpen-loop{
	animation-name: expandOpen-loop;
	-webkit-animation-name: expandOpen-loop;	

	animation-duration: 2s;	
	-webkit-animation-duration: 2s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	animation-iteration-count:infinite;
	-webkit-animation-iteration-count:infinite;	

	visibility: visible !important;	
}

@keyframes expandOpen-loop {
	0% {
		transform: scale(0.9);		
	}
	50% {
		transform: scale(1);
	}		
	100% {
		transform: scale(0.9);
	}			
}

@-webkit-keyframes expandOpen-loop {
	0% {
		-webkit-transform: scale(0.9);		
	}
	50% {
		-webkit-transform: scale(1);
	}
	100% {
		-webkit-transform: scale(0.9);
	}					
}

/*Media Queries*/

@media (max-width: 823px) and (min-width: 0px){
.page-id-maccas-journey .content .row {width: 100%;}

.page-id-maccas-journey .main-video {padding: 30px;}
}




@media (max-width: 800px) and (min-width: 0px){
.page-id-maccas-journey .heading-copy { padding: 20px; font-weight: 300}

.page-id-maccas-journey .hero { height: 70px;}
.page-id-maccas-journey #shortcut {top: 853px; right:0px;}
.page-id-maccas-journey #scenic-view {top: 1022px; left: 20px;}
.page-id-maccas-journey #beetroot {top: 1190px; right: 0px;}
.page-id-maccas-journey #beetroot-text {right: 100px;}
.page-id-maccas-journey #burger {top: 940px; right: 5px;}
.page-id-maccas-journey #mccafe { left: 50px; top:}
.page-id-maccas-journey #mccafe-text {left: 80px;}

.page-id-maccas-journey #patty {left: -30px; top:1680px;}
.page-id-maccas-journey #patty-text {top: 1960px; left: 25px; background-size: 100%;}
.page-id-maccas-journey #petrol {left:0;}
.page-id-maccas-journey #petrol-text {left: 15px; top: 2350px;}
.page-id-maccas-journey #flying {right: 40px;}
.page-id-maccas-journey #flying-text {right: 20px; }
.page-id-maccas-journey #wrap { left: 15px; background-size: 100%;}
.page-id-maccas-journey #wrap-text { left: 15px;}
.page-id-maccas-journey #mcdelivery {right: 30px; top:2490px; background-size: 100%;}
.page-id-maccas-journey #mcdelivery-text {right: 50px; top: 2690px;}
.page-id-maccas-journey #sugar {right: -80px; background-size: 100%;}
.page-id-maccas-journey #sugar-text {right: 20px;}
.page-id-maccas-journey #pants {left: 10px; background-size: 100%; top: 3170px;}
.page-id-maccas-journey #pants-text {left: 30px;}
.page-id-maccas-journey #whatsupnext {right: 10px; background-size: 100%;}
.page-id-maccas-journey #whatsupnext-text {right: 15px;}





}

@media (max-width: 600px) { 

.page-id-maccas-journey .hero { height: 20px;}
.page-id-maccas-journey .banner {background: url('../images/themes/maccasjourney/tray-top-mobile.jpg') no-repeat  50% 100%; height: 135px; display:block; background-size: 100% }

.page-id-maccas-journey .bottom-tray {background: url('../images/themes/maccasjourney/tray-bottom-mobile.jpg') no-repeat  50% 0%; height: 133px; display:block; background-size: 100% }

}






@media (max-width: 480px) and (min-width: 0px){
.page-id-maccas-journey .bottom-tray { margin-top: -30px;}
.page-id-maccas-journey .tray-container {top: -30px;}
.page-id-maccas-journey #shortcut .cta-arrow { position: absolute; right: 15px;
top: 30%;}
.page-id-maccas-journey .youtube-thumb img { width: 100%;}
.page-id-maccas-journey .main-video {padding: 30px;}
.page-id-maccas-journey .top-section { padding-top: 50px;}
.page-id-maccas-journey .hero { height: 0px;}
.page-id-maccas-journey .heading-copy { font-size: 22px; line-height: 1.2em; padding-left: 30px; padding-right: 30px; font-weight: 300}
.page-id-maccas-journey .heading-copy .scroll { padding-top: 45px}
.page-id-maccas-journey #scenic-view {top: 980px; background-size: 100%; width: 160px; height: 172px;}
.page-id-maccas-journey #shortcut {top: 840px; width: 180px; height: 126px; background-size: 100%;}
.page-id-maccas-journey #beetroot {width: 168px; background-size: 100%; top: 1390px; right: -10px;}
.page-id-maccas-journey #beetroot-text {top: 1583px; right: 20px;}
.page-id-maccas-journey #mccafe {background-size: 100%; left: 15px; top: 1230px; width: 200px;}
.page-id-maccas-journey #mccafe-text {left: 15px; top: 1350px;}
.page-id-maccas-journey #burger {width: 110px; height: 110px; background-size: 100%;}

.page-id-maccas-journey #patty {left: -90px; top: 1700px; background-size: 100%;}
.page-id-maccas-journey #patty-text {top: 1960px; left: 25px; background-size: 100%;}
.page-id-maccas-journey #petrol {left:0; background-size: 100%; width: 300px; top: 2262px;}
.page-id-maccas-journey #petrol-text {left: 15px; top: 2400px;}
.page-id-maccas-journey #flying {right: 15px; top:2050px; background-size: 100%; width: 200px;}
.page-id-maccas-journey #flying-text {right: 20px; top: 2170px;}
.page-id-maccas-journey #wrap { left: 15px; background-size: 100%; top: 2750px;width: 200px;}
.page-id-maccas-journey #wrap-text { left: 40px; top: 2870px;}
.page-id-maccas-journey #mcdelivery {right: 30px; top:2490px; background-size: 100%; width: 140px; height: 159px;}
.page-id-maccas-journey #mcdelivery-text {right: 30px; top: 2660px;}
.page-id-maccas-journey #sugar {right: -20px; background-size: 100%; width: 220px; height: 97px; top: 2980px;}
.page-id-maccas-journey #sugar-text {right: 20px;}
.page-id-maccas-journey #pants {left: 10px; background-size: 100%; width: 130px; height: 114px; top: 3230px;}
.page-id-maccas-journey #pants-text {left: 30px; top: 3360px;}
.page-id-maccas-journey #whatsupnext {right: 10px; background-size: 100%; width: 200px; height: 119px;}
.page-id-maccas-journey #whatsupnext-text {right: 15px;}


#beetroot-pop h2, #petrol-pop h2, #mcdelivery-pop h2, #patty-pop h2, #sugar-pop h2, #pants-pop  h2 { font-size: 20px; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 600;}


#beetroot-pop { max-width: 320px; width: 320px\9; background: transparent url('../images/themes/maccasjourney/beetroot-bg.png') no-repeat 0 0; color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 14px; padding: 30px; padding-top: 170px; height: 430px; background-size: 100%; }

#petrol-pop { max-width: 320px; width: 320px\9; background: transparent url('../images/themes/maccasjourney/petrol-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 14px; padding: 35px; padding-top: 120px; height: 373px; background-size: 100%;}

#mcdelivery-pop { max-width: 320px; width: 320px\9; background: transparent url('../images/themes/maccasjourney/mcdelivery-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 14px; padding: 35px; padding-top: 150px; height: 365px; background-size: 100%;}


#patty-pop { max-width: 320px; width: 320px\9; background: transparent url('../images/themes/maccasjourney/patty-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 14px; padding: 35px; padding-top: 120px; height: 359px; background-size: 100%;}

#sugar-pop { max-width: 320px; width: 320px\9; background: transparent url('../images/themes/maccasjourney/sugar-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 14px; padding: 35px; padding-top: 120px; height: 333px; background-size: 100%;}


#pants-pop { max-width: 320px; width: 320px\9; background: transparent url('../images/themes/maccasjourney/pants-bg.png') no-repeat 0 0;  color: #000000; font-family: Lato,"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; text-align: center; font-size: 14px; padding: 30px; padding-top: 100px; height: 328px; background-size: 100%;}


.page-id-maccas-journey #whatsupnext .cta-arrow { position: absolute; top: 30px; left: 70px;}






}



@media (max-width: 320px) and (min-width: 0px){

#beetroot-pop { padding: 30px; padding-top: 130px; line-height: 1.2em;}

#petrol-pop { padding: 30px; padding-top: 90px; line-height: 1.2em;}

#mcdelivery-pop { padding: 30px; padding-top: 120px; line-height: 1.2em;}


#patty-pop { padding: 30px; padding-top: 100px; line-height: 1.2em;}

#sugar-pop { padding: 30px; padding-top: 100px; line-height: 1.2em;}

#pants-pop { padding: 30px; padding-top: 90px; line-height: 1.2em;}





	}