html {
	box-sizing: border-box;
	scroll-behavior: smooth;
}

*,
*:before,
*:after {
	box-sizing: inherit;
}

body {
	margin: 8px;
	background-color: black;
    /*transition: background-color .5s;*/
	font-family: 'PragmaticaBold', sans-serif;
	font-variant-ligatures: none;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
}

.svg img {
	width: 43px;
    cursor: pointer;
}

.fixed {
	position: fixed;
	height: 43px;
	top: 8px;
	left: 8px;
	z-index: 100;
}

.sticky {
	position: -webkit-sticky;
	position: sticky;
	height: 8px;
	padding-left: 8px;
}

/* --------- TYPOGRAPHY --------- */
/* Webfont: Pragmatica-Bold */
@font-face {
	font-family: 'PragmaticaBold';
	src: url('font/Pragmatica-Bold.eot'); /* IE9 Compat Modes */
	src: url('font/Pragmatica-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('font/Pragmatica-Bold.woff') format('woff'), /* Modern Browsers */
	     url('font/Pragmatica-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
	     url('font/Pragmatica-Bold.svg#Pragmatica-Bold') format('svg'); /* Legacy iOS */
	font-weight: normal;
	font-style: normal;
	text-rendering: optimizeLegibility;
}

.text {
	margin: 0px;
	padding-top: 52px;
	overflow-x: hidden;
	/* overflow-y: scroll; */
	scroll-behavior: smooth;
}

p {
	color: white;
	font-size: 3.25vw;
	line-height: 1.125em;
	letter-spacing: -.019em;
	word-spacing: -.0115em;
	text-align: left;
}

a {
	color: white;
	text-decoration: none;
	display: inline;
}

sup {
	vertical-align: baseline;
	font-size: .735vw;
	line-height: 0;
	letter-spacing: -.045em;
	word-spacing: .115em;
}

u {
	color: white;
	text-decoration: underline;
}

i {
	color: white;
	font-style: italic;
}

a::selection, p::selection, i::selection, h1::selection, u::selection, sup::selection, br::selection, u::selection, .accordion::selection {
	color: rgb(40, 40, 40);
}

a::-moz-selection, p::-moz-selection, i::-moz-selection, h1::-moz-selection, u::-moz-selection, sup::-moz-selection, br::-moz-selection, u::-moz-selection, .accordion::-moz-selection {
	color: rgb(40, 40, 40);
}

.text p::selection, .text br::selection {
	color: rgb(40, 40, 40);
}

.text p::-moz-selection, .text br::-moz-selection {
	color: rgb(40, 40, 40);
}

/* --------- SIDE NAVIGATION --------- */
#main {
    transition: 0.5s;
	-webkit-transition-timing-function: ease;
	transition-timing-function: ease;
}

#svz_side_nav {
    transition: 0.5s;
	-webkit-transition-timing-function: ease;
	transition-timing-function: ease;
	/* overflow-y: scroll; */
	scroll-behavior: smooth;
	z-index: 100;
}

.sidenav {
	position: fixed; /* absolute */
	display: none;
	width: 100%;
	height: 100%;
    top: 0;
    right: 0;
    background-color: black; /* gba(0, 0, 0, 0.8) */
    transition: 0.5s;
	-webkit-transition-timing-function: ease;
	transition-timing-function: ease;
	z-index: 100;
}

.sidenav p {
	padding-top: 24px;
	padding-left: 8px;
	padding-right: 8px;
  }

/* --------- SWIPER --------- */
.swiper-container {
    overflow: hidden;
    list-style: none;
    /* Fix of Webkit flickering */
    z-index: 1;
  }

.swiper-wrapper {
    margin: 0 auto;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
	-webkit-transition-timing-function: transform .5s ease-out;
	transition: transform .5s ease-out;
}

/* --------- RESPONSIVE --------- */
/* --------- MOBILE FIRST --------- */
.container {
	margin: 0 auto;
	max-width: 2560px;
	-webkit-transition-timing-function: transform .5s ease-out;
	transition: transform .5s ease-out;
}

.responsive-image {
	max-width: 100%;
	-webkit-transition-timing-function: transform .5s ease-out;
	transition: transform .5s ease-out;
}

.single-image {
	margin: 0 auto;
	display: block;
	width: 78%;
}

.grid {
  	display: flex;
  	flex-wrap: wrap;
  	flex-direction: row;
}

.swiper-container img {
  	display: flex;
	-webkit-transition-timing-function: transform .5s ease-out;
	transition: transform .5s ease-out;
}

/* --------- TABLET ---------
  @media screen and (min-width: 800px) {
    .grid {
      display: flex;
      flex-wrap: wrap;
      flex-direction: row;
    }
    .cell {
  	width: calc(100% / 2);
    }
  } */

/* --------- DESKTOP --------- */
@media screen and (min-width: 1080px) {
	.swiper-container {
		width: calc(100% / 2);
	}

	.sidenav {
		width: 50%;
	    padding-left: 0px;
	}

	.text {
		padding-top: 0;
	}

	p {
		color: white;
		font-size: 1.125vw; /* 3.25vw; */
		line-height: 1.125em;
		letter-spacing: .003em; /* -.019em; */
		word-spacing: -.0105em; /* -.0115em; */
		text-align: left;
	}

	.sidenav p {
		padding-top: 62px;
		padding-left: 8px;
		padding-right: 8px;
	}

	a {
		color: white;
		text-decoration: none;
		display: inline;
	}

}
