/* 20230224201055 - v2 */
.gui,
.gui-block-linklist li a {
  color: #666666;
}

.gui-page-title,
.gui a.gui-bold,
.gui-block-subtitle,
.gui-table thead tr th,
.gui ul.gui-products li .gui-products-title a,
.gui-form label,
.gui-block-title.gui-dark strong,
.gui-block-title.gui-dark strong a,
.gui-content-subtitle {
  color: #000000;
}

.gui-block-inner strong {
  color: #848484;
}

.gui a {
  color: #0a8de9;
}

.gui-input.gui-focus,
.gui-text.gui-focus,
.gui-select.gui-focus {
  border-color: #0a8de9;
  box-shadow: 0 0 2px #0a8de9;
}

.gui-select.gui-focus .gui-handle {
  border-color: #0a8de9;
}

.gui-block,
.gui-block-title,
.gui-buttons.gui-border,
.gui-block-inner,
.gui-image {
  border-color: #8d8d8d;
}

.gui-block-title {
  color: #333333;
  background-color: #ffffff;
}

.gui-content-title {
  color: #333333;
}

.gui-form .gui-field .gui-description span {
  color: #666666;
}

.gui-block-inner {
  background-color: #f4f4f4;
}

.gui-block-option {
  border-color: #ededed;
  background-color: #f9f9f9;
}

.gui-block-option-block {
  border-color: #ededed;
}

.gui-block-title strong {
  color: #333333;
}

.gui-line,
.gui-cart-sum .gui-line {
  background-color: #cbcbcb;
}

.gui ul.gui-products li {
  border-color: #dcdcdc;
}

.gui-block-subcontent,
.gui-content-subtitle {
  border-color: #dcdcdc;
}

.gui-faq,
.gui-login,
.gui-password,
.gui-register,
.gui-review,
.gui-sitemap,
.gui-block-linklist li,
.gui-table {
  border-color: #dcdcdc;
}

.gui-block-content .gui-table {
  border-color: #ededed;
}

.gui-table thead tr th {
  border-color: #cbcbcb;
  background-color: #f9f9f9;
}

.gui-table tbody tr td {
  border-color: #ededed;
}

.gui a.gui-button-large,
.gui a.gui-button-small {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large.gui-button-action,
.gui a.gui-button-small.gui-button-action {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large:active,
.gui a.gui-button-small:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui a.gui-button-large.gui-button-action:active,
.gui a.gui-button-small.gui-button-action:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui-input,
.gui-text,
.gui-select,
.gui-number {
  border-color: #8d8d8d;
  background-color: #ffffff;
}

.gui-select .gui-handle,
.gui-number .gui-handle {
  border-color: #8d8d8d;
}

.gui-number .gui-handle a {
  background-color: #ffffff;
}

.gui-input input,
.gui-number input,
.gui-text textarea,
.gui-select .gui-value {
  color: #000000;
}

.gui-progressbar {
  background-color: #76c61b;
}

/* custom */
.header-wrapper, footer, footer a {display:none !important}

/* HOMEPAGE */
.hero .hero-image {background-size: cover} /* adjust main image size (e.g. {background-size: auto 100%}) */

			/* DESKTOP */
			@media only screen and (min-width: 769px) {
				.jquery-background-video-wrapper,
        .hero .hero-image {background-position: 50% 30%}
        .hero-element-3 .hero-image {background-size: auto 180%;background-position: 40% 30%}
        .hero-element-4 .hero-image {background-size: auto 180%;background-position: 60% 25%}
				.hero .hero-content img.hero-txt, .hero .hero-content img.hero-txt.desktop {width:500px} /* adjust headline size */
        .hero .hero-content.hero-content-center {bottom:80px}
        .hero .hero-content p {margin-top:-5px !important}
        .my-background-video.jquery-background-video.is-playing.is-visible {top:  60% !important}
				/* full title */
        .hero-element-3 .hero-content.hero-content-center {text-align: right;margin-right:10px}
        .hero-element-4 .hero-content.hero-content-center {text-align: left;margin-left:10px} 
			}

@media only screen and (min-width: 960px) {
.text-page img.wide {max-width:none !important;margin-left:-80px;margin-right:-80px;width:calc(100% + 160px) !important}
}
.waterlanding {margin-top: 30px}
@media only screen and (min-width: 1200px) {
.waterlanding {margin-top: -20px}
}
			/* CENTER HEADLINE OF SPLIT SCREEN */
			@media only screen and (min-width: 600px) {
			.hero-element-3 .hero-content h2,
      .hero-element-3 .hero-content p{text-align:center;position:relative;left:51%}
			.hero-element-4 .hero-content h2,
      .hero-element-4 .hero-content p{display:none}*/
			} 

			/* CENTER HEADLINE OF SPLIT SCREEN 3 IMAGES*
			@media only screen and (min-width: 600px) {
			.hero-element-2 .hero-content h2 {text-align: center;
    position: absolute;
    left: -100%;
    max-width: none !important;
    width: 300% !important;
    font-size: 46px !important;
    bottom: 70px;}
			.hero-element-1 .hero-content h2,.hero-element-3 .hero-content h2 {display:none}
			}*/

			/* TABLET */
			@media only screen and (min-width: 769px) and (max-width: 999px) {
        .hero .jquery-background-video-wrapper {min-height: 700px !important}
        .hero .hero-image {background-position: 50% 30%}
        .hero-element-3 .hero-image {background-size: auto 150%;background-position: 50% 35%}
        .hero-element-4 .hero-image {background-size: auto 150%;background-position: 50% 35%}
        .hero .hero-content p {margin-top:-5px !important}
        .hero-element-3 .hero-content.hero-content-center {text-align: right;margin-right:10px}
        .hero-element-4 .hero-content.hero-content-center {text-align: left;margin-left:10px}
			}
			@media only screen and (min-width: 600px) and (max-width: 768px) {
				.hero .hero-image {background-size: cover} /* adjust main image size */
				.jquery-background-video-wrapper,
        .hero .hero-image {background-position: 50% 0%} /* adjust main image position */
        .hero-element-3 .hero-image {background-size: auto 150%;background-position: 50% 35%}
        .hero-element-4 .hero-image {background-size: auto 150%;background-position: 50% 35%}
				.hero .hero-content img.hero-txt, .hero .hero-content img.hero-txt.mob {width:500px;} /* adjust headline size */
        .hero .hero-content.hero-content-left {-webkit-transform: translateY(-14%);transform: translateY(-14%);} /* move text to bottom */
        .hero .jquery-background-video-wrapper {min-height: 700px !important}
        .hero .hero-content p {margin-top:0px !important}
        .hero-element-3 .hero-content.hero-content-center {text-align: right;margin-right:10px}
        .hero-element-4 .hero-content.hero-content-center {text-align: left;margin-left:10px}
				}

			/* MOBILE */
			@media only screen and (max-width: 599px) {
				.hero .hero-image {background-size: cover} /* adjust main image size */
				.jquery-background-video-wrapper,
        .hero .hero-image {background-position: 50% 30%}
        .hero-element-3 .hero-image {background-size: auto 150%;background-position: 50% 30%}
        .hero-element-4 .hero-image {background-size: auto 150%;background-position: 50% 30%}
				.hero .hero-content img.hero-txt, .hero .hero-content img.hero-txt.mob {width:100%;} /* adjust headline size */
        .hero .hero-content.hero-content-left {-webkit-transform: translateY(-17%);transform: translateY(-17%);} /* move text to bottom */
        .hero .jquery-background-video-wrapper {min-height: 400px !important}
        .hero .hero-content p {margin-top:-5px !important}
        .hero .hero-content h2, .hero .hero-content p {color:#fff !important}
		}
.hero .hero-content h2 {margin: 0 auto 10px !important}

/* remove text shadow 
.hero .hero-content h2,.hero .hero-content p {text-shadow:none !important}*/

/* MOVE VIDEO POSITION ON MOBILE & TABLET 
@media only screen and (max-width: 768px) {
.jquery-background-video-wrapper {background-position: 100% 50% !important}
.jquery-background-video {left: 50% !important;transform: translate(-50%, -50%) !important;}
}*/
/* ALIGN LEFT BOTTOM TEXT */
@media only screen and (min-width: 769px) {
  .hero-content.hero-content-left-bottom {text-align:left !important}
  .jquery-background-video {transform: translate(-50%, -57%) !important;}
}
.hero-element::after {content:'';width:100%;height:100%;position:absolute;top:0;left:0;background:rgba(0,0,0,0.1)}

.page-on-a-mission-for-feelgood #trustbadge-container-98e3dadd90eb493088abdc5597a70810 {display:none !important}

/* links for sales page*/
.catlink {text-transform:uppercase;letter-spacing:2px;font-size:14px;margin:0 5px;text-decoration:none !important}
.catlink.active {font-weight:600;border-bottom: 2px dotted #fff}
.catlink:hover:not(.active) {border-bottom: 2px dotted #fff}
.salebadge {width:120px;height:120px;position:absolute;top:0;right:0;z-index:2}
.image-overlay-light.darker::after {background-color: rgba(0,0,0,0.35) !important;}

@media only screen and (max-width: 599px) {
.page-title.limitwidth {max-width:250px;margin: 0 auto}
}


			/* HOME BUTTONS COLOUR */
			/* ashrose
						.hero-content .button {background-color:#ff828b}
						.hero-content .button:hover {background-color:#3b3b3b} */
			/* green 
						.hero-content .button {background-color:#279d86}
						.hero-content .button:hover {background-color:#3b3b3b} */
			/* dark */
						.hero-content .button {background-color:#3b3b3b}
						.hero-content .button:hover {background-color:#279d86}
			/* ashrose on mouse-over 
						.hero-content .button {background-color:#3b3b3b}
						.hero-content .button:hover {background-color:#ff828b} */

/* VIDEO */
@media only screen and (min-width: 700px) {
.video-container {height: 100%;width: 70%;overflow: hidden;position: absolute;background-size:cover !important}
.video-container video {min-width: 130%;min-height: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-51%,-50%);}
}
@media only screen and (max-width: 699px) {
.video-container {height: 300px;width: 100%;overflow: hidden;position: absolute;background-size:cover !important}
.video-container video {min-width: 150%;min-height: 100%;position: absolute;top: 0;left: 50%;transform: translateX(-50%);}
  .image-box-box.video {margin-top:210px}
}

/* SUPERSAINTS ALIGN BG IMAGE RIGHT */
.page-supersaints-on-sale .collection-hero figure {background-position: 100% 50%}

/* SLIDER SUPERSAINTS */
@media only screen and (max-width: 700px) {
	#readmore .block-item .block-content p, #readmore .block-item .block-content .button {display:block}
  #readmore .block-item.left .block-content, #readmore .block-item.right .block-content {min-height:350px;justify-content:flex-start}
  .slidez.columns h2 {margin-bottom:20px}
}
@media only screen and (min-width: 701px) {
	#readmore .block-item .block-content {width:45%}
  .slidez.columns h2 {font-size:36px !important;margin-bottom:10px}
}

/* OFF CENTER MOBILE HEADER IMAGE 
@media only screen and (max-width: 599px) {
  figure.header-image-right {background-position:80% center !important}
  figure.header-image-left {background-position:20% center !important}
}*/
/* BLOGVIDEO */
@media only screen and (min-width: 700px) {
.blog-video-container {height: 450px;width: 100%;overflow: hidden;position: absolute;background-size:cover !important}
.blog-video-container video {min-width: 100%;min-height: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);object-fit: cover;}
}
@media only screen and (max-width: 699px) {
.blog-video-container {height: 300px;width: 100%;overflow: hidden;position: absolute;background-size:cover !important}
.blog-video-container video {min-width: 150%;min-height: 100%;position: absolute;top: 0;left: 50%;transform: translateX(-50%);object-fit: cover;}
}


/* LANDING ACTIVEWEAR */
h2.remIcons:before,h2.remIcons:after {display:none !important}
.spacer {display:block;height:60px}
.activewear .shopcat {min-height:400px}
.activewear h3 {font-weight:700}
.calltoaction {height: 600px;display: flex;justify-content: center;align-items: center;text-align: center;position: relative;background-size:cover !important}
.calltoaction .overlay {display:block;width:100%;height:100%;position:absolute;top:0;left:0;background:rgba(0,0,0,.1)}
.calltoaction .cta-inner {z-index:2;margin-top:-250px}
.calltoaction h3 {color:#fff}
.calltoaction .button.outline {color:#fff;border-color:#fff}
.calltoaction a.button.outline:hover {color:#fff !important;background:#3b3b3b;border-color:#3b3b3b}

@media only screen and (max-width: 599px) {
.activewear .image-box-box {margin-top:260px}
  .calltoaction .cta-inner {margin-top:-180px}
}

.overlay-40:after {content: '';background: rgba(0,0,0,0.40);display: block;position: absolute;width: 100%;height: 100%;top: 0;left: 0;}

.hideSlidez{width:100%}
.page-happy-holidays .image-overlay-light:after {background-color:rgba(0,0,0,0.50) !important}

.product-label.label-new {display:none}

/* LANDING SURVEY */
.survey.fullwidth {min-height:350px;margin-bottom:-250px}
.container-sm.survey {padding:0}

/* LANDING PERIOD PANTIES */
.button.ppred {color:#fff;background: #eb5e69}
.button.ppred:hover {color:#fff;background: #3e3e3e}
.periodpanties h2 {font-size:54px}
.periodpanties .image-box-box p {font-size:1.2em}
.periodpanties h2,.periodpanties h3 {font-weight:700}
.periodpanties .calltoaction p {color:#fff;font-size:1.5em}
.periodpanties .calltoaction .cta-inner {margin-top:0px}
.pp-txt {position:absolute;font-family:'Roboto Slab',sans-serif;font-size:18px;padding: 2px;}
.pp-txt.txt-1 {top:35%;left:8%}
.pp-txt.txt-2 {top:74%;left:36%}
.pp-txt.txt-3 {top:34%;right:6%}
.pp-txt h3,.pp-txt p {margin-bottom:0;color:#fff;}
.ppgrid {display:inline-flex;flex-direction:column;width:32%;text-align:center;}
.ppgrid p {font-size:1em !important;max-width:180px;margin: 0 auto;}
.ppgrid img {max-height:90px;width:auto}
.pp-capacity {width:100%;padding:40px 20px;text-align:center}
.pp-capacity img {width:90%;max-width:700px !important}
.pp-capacity-inner {font-family:'Roboto Slab',sans-serif;font-size: 24px;margin-top:40px}
.pp-didyouknow {width:100%;padding:40px 20px;text-align:center}
.dyk-left,.dyk-right {display:inline-block;width:25%;font-weight:600}
.dyk-left img,.dyk-right img {height:140px !important;width:auto !important}
.pp-cta {width:100%;height:400px;position:relative;background: url('https://cdn.webshopapp.com/shops/282217/files/411301185/pattern-bg.png') repeat}
.pp-cta-inner {position: absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:60%}
.pp-cta-inner h3 {background:#fdfaef;max-width:550px;margin: 0 auto 1em}
.pp-anim {width: 100%; height: 500px; border: none;}
.pp-shopnu {text-align:center;margin-top:40px}

.pplayers.desktop {width:100%;height:640px;background:#eb5e69 url('https://cdn.webshopapp.com/shops/282217/files/411290097/pp-layers.svg') 50% 20% no-repeat;background-size:70%;position:relative}
.pplayers.mobile {width:100%;height:640px;background:#eb5e69 url('https://cdn.webshopapp.com/shops/282217/files/411498762/pp-layers-mobile.svg') 50% 30% no-repeat;background-size:95%;position:relative}

@media only screen and (min-width: 700px){
  .pplayers.desktop {display:block}
	.pplayers.mobile {display:none}
}
@media only screen and (max-width: 699px){
  .pplayers.desktop {display:none}
	.pplayers.mobile {display:block}	
}

@media only screen and (min-width: 700px) and (max-width: 1024px) {
  .pplayers.desktop {height:400px}
  .pp-txt h3,.pp-txt p {font-size:80%;line-height:100%;}
	.pp-txt.txt-1 {top:34%;left:5%}
	.pp-txt.txt-2 {top:67%;left:35%}
	.pp-txt.txt-3 {top:33%;right:2%}
  .dyk-left,.dyk-right {width:45%}
  .pp-anim {height:450px}
}
@media only screen and (max-width: 699px) {
	.pp-txt h3,.pp-txt p {font-size:90%;line-height:100%;}
	.pp-txt.txt-1 {top:5%;left:unset;right:5%}
	.pp-txt.txt-2 {top:80%;left:22%}
	.pp-txt.txt-3 {top:21%;right:1%}
  .pp-capacity-inner {font-size:21px}
  .image-box-box.wetbag {margin-top:290px}
  .dyk-left,.dyk-right {display:block;width:90%}
  .pp-anim {height:650px}
  .ppgrid img {max-height:60px}
}


/* WELCOME AFFILIATES */
.halo .page-title:before {content:'';position:absolute;display:block;width:60px;height:40px;background:url("https://cdn.webshopapp.com/shops/282217/files/401807661/saint-basics-halo.svg") center no-repeat;background-size:100% auto;top:-40px;left:50%;transform:translateX(-50%);filter: invert(100%) sepia(100%) saturate(38%) hue-rotate(254deg) brightness(110%) contrast(110%);}
@media only screen and (max-width: 599px) {
  .header .colleft-inner, .header .colright-inner {display:block;width:90%;margin:auto;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
  .header.halo .colleft-inner {margin-top:40px;}
}

/* TEMP MARGIN FEATURED PRODUCTS 
.featured-products {margin-bottom:80px !important}

/* UKRAINE BADGE */
.ukrainebadge {position:absolute;top:0;right:0;width:150px;height:150px;z-index:1;background:url('https://slides.saintbasics.com/wp-content/uploads/2022/02/support-ukraine.png') center no-repeat;background-size:cover;cursor:pointer;display:block}

/* BUFF LONGREAD */
.longread.marhaban.buff {margin-bottom:80px}

.longreadlanding-left.marhaban.buff {
    text-align: left;
    background: #62afb7;
  color: #fff;}
.longreadlanding-right.marhaban.buff {
    text-align: center;
    vertical-align: middle;
    background: #62afb7;
}
.longreadlanding-left.marhaban.buff h2 {
    text-align: left;
    margin: 20px 0;
    color: #fff;
}

@media only screen and (min-width: 1000px) {
.page-geef-een-beetje-feelgood h1,.page-gib-ein-bisschen-feelgood h1,.page-schenke-ein-bisschen-feelgood h1,.page-give-a-little-feelgood h1 {font-size:60px !important}
}
@media only screen @media only screen and (min-width: 600px) and (max-width: 999px) {
.page-geef-een-beetje-feelgood h1,.page-gib-ein-bisschen-feelgood h1,.page-schenke-ein-bisschen-feelgood h1,.page-give-a-little-feelgood h1 {font-size:54px !important}
}
@media only screen and (max-width: 599px) {
.page-geef-een-beetje-feelgood h1,.page-gib-ein-bisschen-feelgood h1,.page-schenke-ein-bisschen-feelgood h1,.page-give-a-little-feelgood h1 {font-size:36px !important}
}

.playlist {}
.playlist:after {content: "\eb95";font: normal normal normal 16px/1 'Nucleo Mini';speak: none;color: #fff;margin-left:5px;position:relative;top:2px}

#checkemail input[type="email"] {background:#ffffff}

/*//////// GRID ////////*/
/* FIRST GRID */
.pack-1 .pack-item.item-1 {
background: url(https://cdn.webshopapp.com/shops/282217/files/318734231/1500x4000x3/saint-basics-cadeaubon.jpg);
}
.pack-1 .pack-item.item-2 {
background: url(https://cdn.webshopapp.com/shops/282217/files/419058738/256x256x1/product-francis-grey-melange.jpg);
}
.pack-1 .pack-item.item-3 {
background: url(https://cdn.webshopapp.com/shops/282217/files/406930010/1500x4000x3/saint-basics-st-pascal-zwart.jpg);
}
.pack-1 .pack-item.item-4 {
background: url(https://cdn.webshopapp.com/shops/282217/files/353465685/1500x4000x3/saint-basics-st-luke-zwart.jpg);
}
.pack-1 .pack-item.item-5 {
background: url(https://cdn.webshopapp.com/shops/282217/files/312543173/1500x4000x3/saint-basics-st-lisa-wit.jpg);
}
.pack-1 .pack-item.item-6 {
background:url(https://cdn.webshopapp.com/shops/282217/files/406524113/1500x4000x3/saint-basics-st-bidon.jpg);
}
.pack-1 .pack-item.item-7 {
background: url(https://cdn.webshopapp.com/shops/282217/files/417689228/st-gabriel-grey-melange.jpg);
}
.pack-1 .pack-item.item-8 {
background: url(https://cdn.webshopapp.com/shops/282217/files/312185253/1500x4000x3/saint-basics-st-aeris-anthracite.jpg);
}
.pack-1 .pack-item.item-9 {
background: url(https://cdn.webshopapp.com/shops/282217/files/405930757/1500x4000x3/saint-basics-st-christof.jpg);
}
.pack-1 .pack-item.item-10 {
background: url(https://cdn.webshopapp.com/shops/282217/files/417688751/st-lucia-grey-melange.jpg);
}
.pack-1 .pack-item.item-11 {
background: url(https://cdn.webshopapp.com/shops/282217/files/353470525/1500x4000x3/saint-basics-st-charlie-zwart.jpg);
}
.pack-1 .pack-item.item-12 {
background: url(https://cdn.webshopapp.com/shops/282217/files/369333020/1500x4000x3/saint-basics-st-rosa-zwart.jpg);
background-position: 60% 50% !important;
}
.pack-1 .pack-item.item-13 {
background:url(https://cdn.webshopapp.com/shops/282217/files/295666860/1500x4000x3/saint-basics-st-elsa-zwart.jpg);
}
.pack-1 .pack-item.item-14 {
background: url(https://cdn.webshopapp.com/shops/282217/files/414423532/1500x4000x3/saint-basics-st-sofia-zwart.jpg);
}
.pack-1 .pack-item.item-15 {
background: url(https://cdn.webshopapp.com/shops/282217/files/411514218/1500x4000x3/saint-basics-2-pack-st-beatrice-zwart.jpg);
}
.pack-1 .pack-item.item-16 {
background: url(https://cdn.webshopapp.com/shops/282217/files/292486263/1500x4000x3/saint-basics-st-silke-wit.jpg);
}
.pack-1 .pack-item.item-17 {
background: url(https://cdn.webshopapp.com/shops/282217/files/293033133/1500x4000x3/saint-basics-st-aeris-grey-melange.jpg);
}
.pack-1 .pack-item.item-18 {
background: url(https://cdn.webshopapp.com/shops/282217/files/417689230/st-lara-grey-melange.jpg);
}
.pack-1 .pack-item.item-19 {
background: url(https://cdn.webshopapp.com/shops/282217/files/353470097/1500x4000x3/saint-basics-st-paula-zwart.jpg);
}

/* SECOND GRID */
.pack-2 .pack-item.item-1 {
background: url(https://cdn.webshopapp.com/shops/282217/files/414423241/1500x4000x3/saint-basics-st-sofia-faded-denim.jpg);
}
.pack-2 .pack-item.item-2 {
background: url(https://cdn.webshopapp.com/shops/282217/files/292486248/1500x4000x3/saint-basics-st-silke-blue-moon.jpg);
}
.pack-2 .pack-item.item-3 {
background: url(https://cdn.webshopapp.com/shops/282217/files/406027723/1500x4000x3/saint-basics-st-estella-stormy-sea.jpg);
}
.pack-2 .pack-item.item-4 {
background: url(https://cdn.webshopapp.com/shops/282217/files/419058740/1500x4000x3/saint-basics-st-francis-navy.jpg);
}
.pack-2 .pack-item.item-5 {

}
.pack-2 .pack-item.item-6 {
background: url(https://cdn.webshopapp.com/shops/282217/files/292481184/1500x4000x3/saint-basics-st-emily-forest-diamonds.jpg);
}
.pack-2 .pack-item.item-7 {
background: url(https://cdn.webshopapp.com/shops/282217/files/375013646/1500x4000x3/saint-basics-st-anthony-blue-moon.jpg);
}
.pack-2 .pack-item.item-8 {
background: url(https://cdn.webshopapp.com/shops/282217/files/380658212/1500x4000x3/saint-basics-st-anthony-olive.jpg);
}
.pack-2 .pack-item.item-9 {
background: url(https://cdn.webshopapp.com/shops/282217/files/353465717/1500x4000x3/saint-basics-st-luke-blue-moon.jpg);
}
.pack-2 .pack-item.item-10 {
background: url(https://cdn.webshopapp.com/shops/282217/files/377217964/1500x4000x3/saint-basics-st-remy-faded-denim.jpg);
}
.pack-2 .pack-item.item-11 {

}
.pack-2 .pack-item.item-12 {
background:url(https://cdn.webshopapp.com/shops/282217/files/405969108/1500x4000x3/saint-basics-st-monica-sargasso-sea.jpg);
}
.pack-2 .pack-item.item-13 {
background:url(https://cdn.webshopapp.com/shops/282217/files/417275558/1500x4000x3/saint-basics-st-noa-2-pack.jpg);
}
.pack-2 .pack-item.item-14 {
background: url(https://cdn.webshopapp.com/shops/282217/files/292121574/1500x4000x3/saint-basics-active-set-hipster-blue-moon.jpg);
}
.pack-2 .pack-item.item-15 {
background: url(https://cdn.webshopapp.com/shops/282217/files/380844505/1500x4000x3/saint-basics-st-eva-faded-denim.jpg);
}
.pack-2 .pack-item.item-16 {
background: url(https://cdn.webshopapp.com/shops/282217/files/406930058/1500x4000x3/saint-basics-st-pascal-faded-denim.jpg);
}
.pack-2 .pack-item.item-17 {
background: url(https://cdn.webshopapp.com/shops/282217/files/372551046/1500x4000x3/saint-basics-st-luke-teal.jpg);
}
.pack-2 .pack-item.item-18 {
background: url(https://cdn.webshopapp.com/shops/282217/files/417980342/1500x4000x3/saint-basics-st-lisa-teal.jpg);
}
.pack-2 .pack-item.item-19 {

}
.pack-2 .pack-item.item-20 {
background: url(https://cdn.webshopapp.com/shops/282217/files/380846128/1500x4000x3/saint-basics-st-elsa-blue-moon.jpg);
}
.pack-2 .pack-item.item-21 {
background:url(https://cdn.webshopapp.com/shops/282217/files/419058733/1500x4000x3/saint-basics-st-francis-blue-striped.jpg);
}
.pack-2 .pack-item.item-22 {
background: url(https://cdn.webshopapp.com/shops/282217/files/369602473/1500x4000x3/saint-basics-st-luke-forest-diamonds.jpg);
}
.pack-2 .pack-item.item-23 {
background: url(https://cdn.webshopapp.com/shops/282217/files/375010235/1500x4000x3/saint-basics-st-patrick-olive.jpg);
}

.pack-3 .pack-item.item-1 {
background: url(https://cdn.webshopapp.com/shops/282217/files/414020040/1500x4000x3/saint-basics-st-paula-carmine.jpg);
}
.pack-3 .pack-item.item-2 {
background: url(https://cdn.webshopapp.com/shops/282217/files/292124532/1500x4000x3/saint-basics-st-lucia-rose-diamonds.jpg);
}
.pack-3 .pack-item.item-3 {
background: url(https://cdn.webshopapp.com/shops/282217/files/405967682/1500x4000x3/saint-basics-st-estella-dusty-rose.jpg);
background-position: 35% 50% !important;
}
.pack-3 .pack-item.item-4 {
background: url(https://cdn.webshopapp.com/shops/282217/files/353465685/1500x4000x3/saint-basics-st-luke-zwart.jpg);
}
.pack-3 .pack-item.item-5 {
background: url(https://cdn.webshopapp.com/shops/282217/files/414422969/1500x4000x3/saint-basics-st-sofia-sea-fog.jpg);
}
.pack-3 .pack-item.item-6 {
background:url(https://cdn.webshopapp.com/shops/282217/files/406524113/1500x4000x3/saint-basics-st-bidon.jpg);
}
.pack-3 .pack-item.item-7 {
background: url(https://cdn.webshopapp.com/shops/282217/files/369602445/1500x4000x3/saint-basics-st-luke-burgundy.jpg);
}
.pack-3 .pack-item.item-8 {
background: url(https://cdn.webshopapp.com/shops/282217/files/369620594/1500x4000x3/saint-basics-st-patrick-burgundy.jpg);
}
.pack-3 .pack-item.item-9 {
background: url(https://cdn.webshopapp.com/shops/282217/files/378057099/1500x4000x3/saint-basics-st-silke-sea-fog.jpg);
}
.pack-3 .pack-item.item-10 {
background: url(https://cdn.webshopapp.com/shops/282217/files/374985585/1500x4000x3/saint-basics-st-patrick-jaffa.jpg);
}
.pack-3 .pack-item.item-11 {
background: url(https://cdn.webshopapp.com/shops/282217/files/380844460/1500x4000x3/saint-basics-st-eva-sea-fog.jpg);
}
.pack-3 .pack-item.item-12 {
background: url(https://cdn.webshopapp.com/shops/282217/files/292125444/1500x4000x3/saint-basics-st-isabel-red-melange.jpg);
background-position: 45% 50% !important;
}
.pack-3 .pack-item.item-13 {
background:url(https://cdn.webshopapp.com/shops/282217/files/295666860/1500x4000x3/saint-basics-st-elsa-zwart.jpg);
}
.pack-3 .pack-item.item-14 {
background: url(https://cdn.webshopapp.com/shops/282217/files/380658219/1500x4000x3/saint-basics-st-anthony-burgundy.jpg);
}
.pack-3 .pack-item.item-15 {
background: url(https://cdn.webshopapp.com/shops/282217/files/414421998/1500x4000x3/saint-basics-st-isabel-sea-fog.jpg);
}
.pack-3 .pack-item.item-16 {
background: url(https://cdn.webshopapp.com/shops/282217/files/406957611/1500x4000x3/saint-basics-st-tessa-dusty-rose.jpg);
}
.pack-3 .pack-item.item-17 {
background: url(https://cdn.webshopapp.com/shops/282217/files/403012023/1500x4000x3/saint-basics-st-buff-living-coral-jaffa.jpg);
}
.pack-3 .pack-item.item-18 {
background: url(https://cdn.webshopapp.com/shops/282217/files/380657591/1500x4000x3/saint-basics-st-luke-scarlet.jpg);
}
.pack-3 .pack-item.item-19 {
background: url(https://cdn.webshopapp.com/shops/282217/files/378057155/1500x4000x3/saint-basics-st-charlie-carmine.jpg);
}

/* grid general settings */

.pack {width:100%;max-width:1180px;margin:0 auto}
.pack-item { width: calc(16.666% - 6px);height:172px;background-size:cover !important;background-repeat:no-repeat !important;background-position:center !important; overflow: hidden}
.double-width { width: calc(33.333% - 6px)}
.double-height {height:350px }
.pack-item .pack-content {
	position: absolute;
    display: flex;
    top: 100%;
    width: 100%;
    height: 100%;
	padding: 0 3px;
    align-items: center;
    justify-content: center;
	text-align:center;
    flex-direction: column;
    background: rgba(0,102,98,0.3);
	color: #fff;
	text-decoration: none !important;
	-webkit-transition:all 0.8s ease;
       -moz-transition:all 0.8s ease;
        -ms-transition:all 0.8s ease;
         -o-transition:all 1s ease;
            transition:all 0.8s ease;}
.pack-2 .pack-item .pack-content {background: rgba(0,102,98,0.6);}
.pack-item:hover .pack-content {top:0}
.pack-heading {font-family:'Roboto Slab',Roboto,sans-serif;font-size:1.2em;font-weight:700}
.pack-text {font-family:Roboto,sans-serif;}

.pack-item .label-sale {position: absolute;
    background: #414141;
    right: 0;
    top: 0;
  	padding: 2px 5px;
    font-weight: 600;
  	font-size:0.8em;
    color: #fff;
  	z-index: 1;}

@media only screen and (min-width: 600px) and (max-width: 768px) {
.pack-item { width: calc(25% - 6px);height:172px;}
.double-width { width: calc(50% - 6px)}
.double-height {height:350px }
.pack-item .pack-content {top:unset;align-items: start;justify-content: flex-end;text-align:left;line-height:0.9em;padding:0 3px 3px 3px;background:transparent !important}
.pack-item .pack-content:after {content:'';position: absolute;display:block;width:100%;height:35px;background: #fff;bottom: 0;margin-left:-3px}
.pack-item:hover .pack-content {top:unset}
.pack-heading {font-size:0.8em;color:#414141;z-index:1;margin-left:-3px}
.pack-text {font-size:0.8em;color:#414141;z-index:1;margin-left:-3px}
}
@media only screen and (max-width: 599px) {
.pack-item { width: calc(50% - 6px);height:172px;}
.double-width { width: calc(100% - 6px)}
.double-height {height:350px;}
.pack-item .pack-content {top:unset;align-items: start;justify-content: flex-end;text-align:left;line-height:0.9em;padding:0 3px 3px 3px;background:transparent !important}
.pack-item .pack-content:after {content:'';position: absolute;display:block;width:100%;height:35px;background: #fff;bottom: 0;margin-left:-3px}
.pack-item:hover .pack-content {top:unset}
.pack-heading {font-size:0.8em;color:#414141;z-index:1;margin-left:-3px}
.pack-text {font-size:0.8em;color:#414141;z-index:1;margin-left:-3px}
}
