header {
	position: absolute;
	width: 100%;
	z-index: 5;
	height: 0;
	left:50%;
	transform: translateX(-50%);
}
#header_and_nav {
	background: none;
}
header #logo a {
	background-image: url(../_img/header/sims4home-logo.png);
}

#nav_activate {
	position: absolute;
	top: 120px;
	right: auto;
	left: 66.6666%;
	width: 33.33333%;
	text-align: center;
}
header #nav_activate {
	animation: heartbeat 1.3s ease-in-out infinite both;
}





#nav_activate a {
	display: inline-block;	
	text-decoration: none;
	text-align: center;
	line-height: 1.3333;
	height: auto;
	padding: 12px 30px;
	background-color: rgba(255,255,255,1);
	color: #991620;
	text-transform: uppercase;
	font-size: 1.09em;
	font-weight: 400;
	transition: all 0.2s ease-in-out;
}
#nav_activate a:hover {
	background-color: rgba(0,0,0,0.9);
	color: #F9B233;
}

#hero {
	display: flex;	
	flex-wrap: nowrap;
	justify-content: space-between;
	height: 785px; 
	background: linear-gradient(45deg, #e94e1b 0%, #f9b133 100%);
}


#hero section#hero_primary {
	width: 945px;
	flex-shrink: 1;
	background-image: url(../_img/home/hero_photo.jpg);
	background-position: 0 0;
	background-size: cover;
	position: relative;

}
#hero section#hero_secondary {
	width: 465px;
	flex-shrink: 1;
	background: linear-gradient(45deg, #f9b133 0%, #e94e1b 100%);
	position: relative;

}
/** primary hero content */
h1#sticker {
	width: 220px;
	height: 220px;
	position: absolute;
	top: 50px;
	right: 50px;
	background: #F9B233;
	color: #fff;
	text-align: center;
	border-radius: 220px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 0 20px;
	font-weight: 300;
	font-size: 1.4em;
	line-height: 1.2;
	transform: rotate(-15deg);
	box-shadow: 5px 5px 5px rgba(0,0,0,0.05);
}
#hero_primary #sub_heads {
	position: absolute;
	bottom: 0;
	width: 100%;	
	padding: 30px 0 30px 0;
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%);
}
#hero_primary  #sub_heads h2, 
#hero_primary  #sub_heads p {
	color: #fff;	
	text-align: center;
	font-size: 1.68em;
	line-height: 1.4;
}
#hero_primary  #sub_heads h2 em {
	font-style: normal;
}



/** secondary hero content */
#hero_secondary h2 {
	position: absolute;
	top: 240px;
	left: 50%;
	transform: translateX(-50%);
	font-size: 1.6em;
	line-height: 1.3;
	color: #fff;
	width: 380px;

	text-align: center;
}
#hero_secondary h2 i {
	font-style: normal;

}
#hero_secondary #home_free {
	background-image: url(../_img/home_free.png);
	width: 304px;
	height: 250px;
	background-size: contain;
	background-repeat: no-repeat;
	text-indent: -56000px;
	position: absolute;
	left: 50%;
	transform: translateX(-52%);
	bottom: 50px;
}

/** product_carousel section**/
#product_carousel .container {
	background: #991620;
	padding-top: 60px;
	padding-bottom: 60px;
}
#product_carousel .column {
	width: 100%;	
	min-height: 0;
	min-width: 0;
}

#product_carousel  .content .huge_button {
	text-align: center;
	margin-bottom: 60px;
}
#product_carousel  .content .huge_button a {
	display:  inline-block;
	border: 1px solid #fff;
	font-size: 1.91em;
	line-height: 1.1;
	padding: 10px 30px;
	color: #fff;
	text-decoration: none;
	transition: all 0.2s ease-out;
}
#product_carousel  .content .huge_button a:hover {
	background: rgba(255,255,255,1);
	color: #991620;
}

#product_carousel .column  .content .product_carousel  {
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
	min-height: 0;
	min-width: 0;
}
/* tweaks to slick styling */
.content .slick-slide {
    margin: 0 15px;
}
.content .slick-slide img {
	transform: scale(0.7);
	transition: all 0.5s ease-out;
	display:block;
	width:100%;
}
.content .slick-center img {
	transform: scale(1);
}
.content .slick-list {
    margin: 0 -15px;
}

/* Arrows */
.content  .slick-prev,
.content  .slick-next {
	 font-size: 0;
    line-height: 0;
    position: absolute;
 	top: 0;
	z-index: 500;
    display: block;
    width: 50px;
    height: 100%;
    padding: 0;
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
	background: transparent;
	background-repeat: no-repeat;
	background-position: center;
	transition: opacity 0.2s ease-out;
}
.content .slick-prev {
	left: -70px;	
	background-image: url(../_img/home/carousel_prev.png);
}
.content .slick-next {
	right: -80px;
	background-image: url(../_img/home/carousel_next.png);
}
.content .slick-prev:hover,
.content .click-next:hover {
	opacity: 0.7;	
}
#product_carousel .content h3 {
	text-align: center;
	padding-top: 1em;
	font-size: 2.1em;
	color: #fff;
	line-height: 1.1;	
}


/* product chooser */
#product_chooser .container {
	background-color: #fff;
	background-image: url(../_img/home/product_chooser_BG.jpg);
	background-position: center bottom;
	background-repeat: no-repeat;
	padding-top: 60px;
	padding-bottom: 60px;
}
#product_chooser .column {
	width: 100%;	
	min-height: 0;
	min-width: 0;
}
#product_chooser .content h2 {
	text-align: center;
	padding-top: 0.5em;
	padding-bottom: 1em;
	font-size: 2em;
	color: #E94E1B;
	line-height: 1.1;	
}

#product_chooser_buttons {
	max-width: 1105px;
	width: 95%;
	margin-left: auto;
	margin-right: auto;
	display: flex;	
	justify-content: space-between;

}

#product_chooser_buttons .pc_button {
	max-width: 500px;
	transition: all 0.2s ease-in-out;
}
#product_chooser_buttons .pc_button:hover {
	transform: scale(1.02);
	box-shadow: 0 0 50px rgba(0,0,0,0.25);
}

#pc_button_data {
	margin-right: 15px;
}
#pc_button_voice {
	margin-left: 15px;
}

#product_chooser_buttons .pc_button img {
	max-width: 100%;
	height: auto;
	display: block;
}
#product_chooser_buttons .pc_button p {
	margin-bottom: 0;
}
#product_chooser_buttons .pc_button h3, .pc_desc {
	display: none;
}
#product_chooser_buttons .pc_button  .pc_secondary {
	text-align: center;
	font-size: 0.9em;
	padding: 1em 2em 2em 2em;
	color: #fff;
	border-top: 1px solid #fff;
	
}
#product_chooser_buttons .pc_button  .pc_secondary p:first-of-type {
	margin-bottom: 1em;
}
#pc_button_data .pc_secondary {
	background: #991620;
}
#pc_button_voice .pc_secondary {
	background: #e75a22;
}
.content .pc_secondary p.button {
	box-shadow: 0 0 10px rgba(0,0,0,0.2);	
}
.content #pc_button_data p.button a {
	font-weight: 700;
	background: #fff;
	color: #991620;
	
}
.content #pc_button_voice p.button a {
	font-weight: 700;
	background: #fff;
	color: #991620;
	
}

.content p.button input:hover,
.content p.button a:hover,
.content p.button span:hover {
	background: #991620;
}



/** TOP UP SECTION **/
#top_up .container {
	background-image: url(../_img/home/top_up_large.jpg);	
	background-position: center top;
	background-size: cover;
	padding-top: 100px;
}

#top_up .container .content {
	height: 0;
	padding-bottom: 52.48%;	
}
#top_up .container .content > div:first-of-type {
	position: absolute;
	width: 70%;
	height: 100%;
	top: 0; left: 0;
}
#top_up .container .content h2 {
	text-align: center;
	color: #E94E1B;
	font-size: 3.1em;
	font-weight: 300;
	line-height: 1.5;
}
#top_up .container .content h3 {
	text-align: center;
	color: #E94E1B;
	font-size: 1.5em;
	font-weight: 700;
	line-height: 1.5;
	margin-bottom: 2em;
}
#top_up .container .content p#top_up_button  {
		text-align: center;
}
#top_up .container .content p#top_up_button a {
	font-size: 2.2em;
	font-weight: 300;
	line-height: 1.5;
	border: 2px solid #E94E1B;
	color: #E94E1B;
	text-transform: uppercase;
	padding: 0 0.6em;
	background-color: rgba(255,255,255,0.3);
	text-decoration: none;
	transition: all 0.2s ease-out;
}
#top_up .container .content p#top_up_button a:hover {
	background-color: rgba(255,255,255,1);
}


/** why choose **/
#why_choose .container {
	padding-top: 90px;	
}
#why_choose .content h2 {
	font-size: 2.25em;
	line-height: 1.5;
	color: #991620;
	font-weight: 300;
	text-align: center;
}
#why_choose .content  h2 + h3 {
	font-size: 1.6em;
	line-height: 1.5;
	color: #991620;
	font-weight: 700;
	text-align: center;
	margin-bottom: 40px;
}

#why_choose .why_choose_holder {
	max-width: 960px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}

#why_choose .why_choose_holder section {
	flex-basis: 50%;
	margin-bottom: 20px;
}
#why_choose .why_choose_holder section h3,
#why_choose .why_choose_holder section p {
	margin: 0 15px;
	padding: 0 10px;

	text-align: center;
}
#why_choose .why_choose_holder section h3 {
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 100px;
	margin-top: 40px;	
	font-size: 1.22em;
	margin-bottom: 0.2em;
}

#why_choose .why_choose_holder .why_charges   {
	order: 0;
}
#why_choose .why_choose_holder .why_reliable   {
	order: 2;
}
#why_choose .why_choose_holder .why_contracts   {
	order: 1;
}
#why_choose .why_choose_holder .why_service   {
	order: 3;
}

#why_choose .why_choose_holder .why_charges  h3 {
	background-image: url(../_img/home/icon_charges.png);
}
#why_choose .why_choose_holder .why_reliable  h3 {
	background-image: url(../_img/home/icon_sim.png);
}
#why_choose .why_choose_holder .why_contracts  h3 {
	background-image: url(../_img/home/icon_cross.png);
}
#why_choose .why_choose_holder .why_service  h3 {
	background-image: url(../_img/home/icon_service.png);
}
#why_choose .why_choose_holder section p {
	font-size: 1.08em;	
}


/* Solutions heading */
#solutions_heading  h2 {
	font-size: 2.25em;
	line-height: 1.5;
	color: #991620;
	font-weight: 300;
	text-align: center;
}

/* shop tweaks <!------------------------------- v2 Jan 2022 */
body.has_cart #nav_activate {
	display: none;	
}
#view_cart {
	top: 120px;
	right: 30px;
	border-bottom-left-radius: 0;
	border-top: none;
}

@media (max-width: 1350px) {
	#nav_activate {
		top: 100px;
		text-align: center;
	}
	
	#hero section#hero_primary {
		flex-basis: 66.6666%;
		width: auto;
	}
	#hero section#hero_secondary {
		flex-basis: 33.3333%;
		width: auto;
	}
	
	#hero_secondary h2,
	#hero_secondary #home_free {
		text-align: center;
		background-position: center;
		max-width: none;
		box-sizing: border-box;
		width: calc(100% - 2em);
		font-size: 2.75vw;

	}
	#hero_secondary #home_free {
		width: calc(100% - 2em);
	}
}

@media (max-width: 1240px) {
	#nav_activate a {
		padding: 12px 20px;
		font-size: 1em;
	}
	#hero section#hero_primary {
		background-position: -120px 0;
	}
	#hero_primary  #sub_heads h2, 
	#hero_primary  #sub_heads p {
		font-size: 1.5em;
		padding: 0 0.4em;
		line-height: 1.4;
	}
}


@media (max-width: 1140px) {
	#hero section#hero_primary {
		background-position: -190px 0;
	}
}

@media (max-width: 1040px) {
	h1#sticker {
		top: 20px;
		right: 30px;
	}
}



@media (max-width: 940px) {
	
	#hero section#hero_primary {
		background-image: url(../_img/home/hero_photo_rev.jpg);	
	}
	
	#nav_activate a {
		background-color: rgba(255,255,255,0.7);
		color: #222;
		transition: all 0.2s ease-in-out;
	}
	#nav_activate a:hover {
		background-color: rgba(0,0,0,0.9);
		color: #F9B233;
	}

	#nav_activate {
		top: 350px;
		left: auto;
		right: 25px;
	}
	#view_cart {
		top: 350px;
	}
	
	/* burger */
	#open_nav {
		border: 1px solid #fff;
		border-radius: 5px;
		background-color: rgba(233, 81, 28, 1);
		background-color: #991620;
	}


	#hero {
		display: block;	
		height: auto;
	}
	#hero section#hero_primary {
		width: 100%;
		height: 0;
		padding-top: 83.07%;
		background-position: 0 0;
	}
	#hero section#hero_secondary {
		width: 100%;
		background: #991620;
		position: relative;
		display: flex;
		padding: 3em 2em 3em 2em;
	}
	
	h1#sticker {
		top: 50px;
		right: 50px;
	}
		
	/** secondary hero content */
	#hero_secondary h2,
	#hero_secondary #home_free {
		margin: 0 0.4em;
		padding: 0.3em 0;
		position: static;
		top: auto;	left: auto; right: auto; bottom: auto;
		width: auto;
		height: auto;
		flex: 1;
		transform: none;
	}
	
	#hero_secondary h2 {
		max-width: none;
		text-align: center;
	}
	#hero_secondary #home_free {

	}

	/* Arrows */
	.content  .slick-prev,
	.content  .slick-next {
		display: none !important;
	}
	
	/** TOP UP SECTION **/
	#top_up .container {
		background-image: url(../_img/home/top_up_mobile.jpg);	
		background-position: center top;
		background-size: cover;
		padding-top: 60px;
	}

	
	#top_up .container .content {
		height: 0;
		padding-bottom: 119%;
	}
	#top_up .container .content > div:first-of-type {
		width: 100%;
	}
	#top_up .container .content p#top_up_button  {
		
	}
	#top_up .container .content p#top_up_button a {
		font-size: 2.1em;
		padding: 0 0.4em;
		background: none;
	}
}

/***************************************
*
* 740 pixels and down
*
* we use vw as unit for all text sizes and most widths, so should scale back happily
*
*
***************************************/

@media (max-width: 740px) {
	/* new hero */
	#hero section#hero_primary {
		padding-top: 100%;
		background-image: url(../_img/home/hero_photo_mobile_rev.jpg);
	}
	/** green sticker */
	h1#sticker {

		width: 25vw;
		height: 25vw;
		border-radius: 25vw;
		
		top: 10vw;
		right: auto;
		left: 50vw;
		

		padding: 0 20px;
		font-size: 4vw;
		line-height: 1;

		box-shadow: 5px 5px 5px rgba(0,0,0,0.2);
	}
	
	
	#nav_activate {
		top: 40vw;
		right: 20px;
	}
	#view_cart {
		top: 40vw;
		right: 20px;
	}
	#nav_activate a {
		padding: 1vw 2vw;
		font-size: 3.5vw;
	}

	#hero_primary  #sub_heads h2, 
	#hero_primary  #sub_heads p {
		font-size: 3.6vw;
		padding: 0 0.4em;
		line-height: 1.4;
	}
	#hero section#hero_secondary {
		padding: 2em 1em 2em 1em;
	}
	#hero_secondary h2 {
		font-size: 5vw;
	}

	
	
	/* carousel section */
	#product_carousel .container {
		background: #991620;
		padding-top:5vw;
		padding-bottom: 8vw;
	}

	#product_carousel  .content .huge_button {
		margin-bottom: 5vw;
	}
	#product_carousel  .content .huge_button a {
		font-size: 5.5vw;
		padding: 0.5em 1em;
	}
	.content .slick-slide,
	.content .slick-list {
		margin: 0;
	}
	#product_carousel .content h3 {
		padding-top: 1em;
		font-size: 5.5vw;
		line-height: 1.1;	
	}
	
	/* ran out of data early? */
	#top_up .container {
		padding-top: 5vw;
	}
	#top_up .container .content h2 {
		font-size: 8.2vw;
	}
	#top_up .container .content h3 {
		font-size: 4vw;
		margin-bottom: 7vw;
	}
	#top_up .container .content p#top_up_button  {
		
	}
	#top_up .container .content p#top_up_button a {
		font-size: 6vw;
		padding: 0 0.4em;
	}
	
	
	/* why choose single column */
	#why_choose .container {
   	 	padding-top: 8vw;
		padding-bottom: 0;
	}
	
	#why_choose .content h2 {
		font-size: 7vw;

	}
	#why_choose .content  h2 + h3 {
		font-size: 4.6vw;
		margin-bottom: 8vw;
	}


	#why_choose .why_choose_holder {
		display: block;
	}
	#why_choose .why_choose_holder section {
		margin-bottom: 20px;
	}
	#why_choose .why_choose_holder section h3,
	#why_choose .why_choose_holder section p {
		margin: 0 0;
		padding: 0 10px;
		text-align: center;
		font-size: 4.1vw;
	}
	#why_choose .why_choose_holder section h3 {
		padding-top: 100px;
		margin-top: 40px;	
		font-size: 4.6vw;
		margin-bottom: 0.2em;
	}

}

/***************************************
*
* 600 pixels and down
*
* extra rules for the "product chooser" added August 2022
*
*
***************************************/

@media (max-width: 600px) {
	#product_chooser_buttons {
		max-width: 1105px;
		width: 95%;
		margin-left: auto;
		margin-right: auto;
		display: block;	
		justify-content: space-between;
	
	}
	
	#product_chooser_buttons .pc_button {
		max-width: 500px;
		transition: all 0.2s ease-in-out;
	}
	#product_chooser_buttons .pc_button:hover {
		transform: scale(1.02);
		box-shadow: 0 0 50px rgba(0,0,0,0.25);
	}
	
	#pc_button_data {
		margin-right: 0;
		margin-bottom: 30px;
	}
	#pc_button_voice {
		margin-left: 0;
	}

	
	
}



@media (max-width: 480px) {
	#nav_activate {
		top: 50vw;
	}
	#view_cart {
		top: 50vw;
	}
	#nav_activate a {
		padding: 1vw 1.5vw;
		font-size: 4.8vw;
	}

}