/* SITE SWITCHER */
#site-switcher{
	width: 100%; height: 40px;
	background-color:#F3EFEB;
	position: relative;
}

#main-navigation{
	margin-top: 40px;
}

.fixed-header #main-navigation{
	margin-top: 0;
}

#site-switcher #alternate-shop-link{
	display:block; width: 100%; text-align: center;
}

@media screen and (max-width: 500px) {
	#site-switcher #alternate-shop-link{
		text-align: left; padding-left: 16px;
	}
}

#site-switcher #alternate-shop-link a{
	display:inline-block; text-align: center; line-height:40px;
}


#site-switcher #alternate-shop-link a:hover{
	color: red;
}

#site-switcher #alternate-shop-link a:hover em{
	text-decoration: none;
}

#site-switcher #alternate-shop-link em{
	text-decoration: underline; font-style:normal;
}

#currencies{
	display:block; position: absolute; right: 20px; top: 10px;
}

#currencies a{
	display: inline-block; width: 50px; line-height: 19px; margin-left: 20px;
}

@media screen and (max-width: 40em) {
	#site-switcher #alternate-shop-link em span{
		display: none;
	}
	
	#currencies{
		right: 15px;
	}

	#currencies a{
		margin-left: 10px;
	}
}

#currencies span{					
	display:inline-block; line-height: 19px; vertical-align: middle;
}				

#currencies #union-jack, 
#currencies #star-spangled-banner{
	display:inline-block; width: 38px; height: 19px; margin-right: 4px;
}

/* USA/UK */
#alterate-shop-currency span:last-child{
	opacity: 0.8;
}

#alterate-shop-currency .cls-3, #alterate-shop-currency .cls-5, #alterate-shop-currency .b{
	fill: #000; opacity: 0.5;
}

#alterate-shop-currency:hover .cls-3, #alterate-shop-currency:hover .cls-5, #alterate-shop-currency:hover .b, #alterate-shop-currency:hover .i, #alterate-shop-currency:hover .g{
	opacity: 1;
}

/* USA */
#alterate-shop-currency:hover .cls-3{
	fill: #c9011c;
}

#alterate-shop-currency:hover .cls-5{
	fill: #2a3560;
}

/* UK */
#alterate-shop-currency .i, #alterate-shop-currency .g{
	stroke: #000; opacity: 0.5;
}

#alterate-shop-currency:hover .b{
	fill:#14247d;
}

#alterate-shop-currency:hover .i, #alterate-shop-currency:hover .g{
	stroke:#cd142b;
}

/* Basket */
#site-switcher-basket th{
	padding: 0;
	padding-top: 30px;
	padding-right: 10px;
}

#site-switcher-basket td{
	padding-top: 30px;
}

#site-switcher-basket p{
	margin-bottom: 1em;
}

#site-switcher-basket p.basket-message{
	color: rgba(22,65,148,1);	
}

#site-switcher-basket p.basket-note{
	color: rgba(148,170,205,1);
}

.union-jack,
.star-spangled-banner{
	display:inline-block; width: 38px; height: 19px; margin-right: 4px;
}


@media screen and (max-width: 35em){
	#site-switcher-basket th{
		display:table !important;
		margin-top: 30px;
		text-align: left;
		margin-left: 10px;
	}

	#site-switcher-basket td{
		padding-left: 10px;
		padding-top: 10px;
	}
}


/* MODAL */
#modal-overlay{width:100%; height:100%; position:fixed; top:0; left:0; background:#fff; z-index:11000;}
#modal{width:100%; border: 1px solid rgb(29,29,27); background-color: rgb(251,250,249); padding:15px 23px; max-width:908px; min-height:295px; position: fixed; top: 5vh; left: 50%; transform: translateX(-50%); z-index:11500}
#modal-close{display:block; position:absolute; top:15px; right:23px; z-index:100; width:17px; height:17px;}
#modal-content{width: 100%; height:100%;}
#modal-dismiss{position:absolute; bottom:15px; left:23px; font-size:25px;}
#modal h1{margin-bottom:45px;}
#modal a.shop-choice{display:block; float:left; width:360px; text-decoration:none; margin-bottom:20px;}
#modal a.shop-choice:hover span{text-decoration:none;}
#modal a.shop-choice:hover em{text-decoration:none;}
#modal #go-eu{margin-bottom:55px;}
#modal span.star-spangled-banner, #modal span.union-jack{width: 127px; display: block; float: left; height:70px; margin-right:20px;}
#modal .territory{display:block; font-size:25px; text-decoration: none; height:62px; margin-top:8px;}
#modal .territory em{font-size:15px; color:rgb(127,127,127); display:block; font-style: normal; padding-top:2px;}

@media all and (max-width: 908px){
	#modal{
		border-left: none; border-right: none;
	}	    
}

@media all and (max-device-width: 360px){
	#modal{padding:21px 17px; top:0; max-height:250px}
	#modal h1{margin-bottom:25px;}

	#modal a.shop-choice{
		width:100%;
	}

	#modal span.star-spangled-banner, #modal span.union-jack{
		width: 100px; height: auto;	
	}	    

	#modal .territory{font-size:23px; height:62px; margin-top:0px;}
	#modal .territory em{font-size:13px;}
	#modal-close{top:21px; right:17px;}
	#modal-dismiss{font-size:17px; left:17px;}
}

#modal .alternate-shop{
	opacity: 0.5;
}

#modal .alternate-shop:hover{
	opacity: 1;
}

#modal .alternate-shop .cls-3, #modal .alternate-shop .cls-5, #modal .alternate-shop .b{
	fill: #000;
}

#modal .alternate-shop:hover .cls-3, #modal .alternate-shop:hover .cls-5, #modal .alternate-shop:hover .b, #modal .alternate-shop:hover .i, #modal .alternate-shop:hover .g{
	opacity: 1;
}

/* USA */
#modal .alternate-shop:hover .cls-3{
	fill: #c9011c;
}

#modal .alternate-shop:hover .cls-5{
	fill: #2a3560;
}

/* UK */
#modal .alternate-shop .i, #modal .alternate-shop .g{
	stroke: #000; opacity: 0.5;
}

#modal .alternate-shop:hover .b{
	fill:#14247d;
}

#modal .alternate-shop:hover .i, #modal .alternate-shop:hover .g{
	stroke:#cd142b;
}
/* END SITE SWITCHER */

/* PRACTITIONER LOGIN PROMPT */
#login-prompt{
	padding-bottom:17px; padding-top:17px; color: #000; text-align:right; margin-bottom:0;
}
/* END PRACTITIONER PROMPT */


/* @media screen and (min-width: 835px){
	.main-navigation ul {
		float: left;
	}
} */

/* Sales Mode */
.now-price{color:rgb(223,1,25);}
.sale-symbol{position:absolute; bottom:-9px; right:10%; background-color:rgba(223,1,25,1); mix-blend-mode: multiply; width:60px; height:60px; border-radius: 50%; display:block; color:#fff;}
.sale-symbol span{display:block; position:absolute; top:50%; left:50%; transform:translate(-50%, -40%);}
.sale-symbol b, .sale-symbol i{display:block; width: 100%; text-align:center; font-style: normal; font-weight: normal;}
.sale-symbol b{font-size:18px;}
.sale-symbol i{font-size:13px;}
.compare-price{color:gray; text-decoration:line-through; padding-left:0.5em;}

/* Show public prices */
small[title="Public Price"]{font-size:13px; color:#999; border-bottom:1px dotted #999;}
small[title="Public Price"]::after{content:' (RRP)';}

/* Bundle / Treatment Packs */
.product-type-bundle .now-price{	
	color: #1D1D1B !important;	
}
.product-type-bundle .compare-price{	
	text-decoration: none;
	font-size: 13px;
}

h4.quick__subtitle{
	font-size: 13px;
}

.product-type-bundle small[title="Public Price"]{
	display: none;
}

.product-type-bundle .sale-symbol{
	/* background-color:#aca8fe; */
	background-color:rgba(172,175,142,1);
}

.product-purchase .sale-symbol{	
	position: absolute;
	right: 8px;
	top: -14px;	
	bottom:auto;
}

@media only screen and (min-width: 40em)  {
	.product-purchase .sale-symbol{
		top:4px;
	}	
}

.related-products{
	overflow-x: scroll ;
}

/* Hero adjustments */
img.page__featured-image{margin-top:0; border-top:none;}

/* Video */
.video {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */	
	height: 0;
	width: 100%;
	border-bottom:1px solid rgb(29,29,27);
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Handbook */
#handbook-download{
	text-align: center;
	padding-bottom:17px; padding-top:17px; color: #000; margin-bottom: 0;
	border-bottom: 1px solid rgb(29,29,27);
}

#handbook-download p{
	margin: 0;
}

#handbook-download a{
	background: url('/wp-content/themes/dermatologym/assets/images/download.png') no-repeat left center/13px 17px;
	padding-left: 20px;
}