@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Gothic+A1:wght@400;900&family=Libre+Caslon+Text&display=swap');
html {	
	font-family: 'Gothic A1', sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.4em;
	letter-spacing: 0px;
	overflow-wrap: break-word;
	text-align: left;
	margin:0;
	padding:0;
	width:100%;
	min-height:100vh;
	scroll-behavior: smooth;
}
body {	
	font-family: 'Gothic A1', sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.4em;
	letter-spacing: 0px;
	overflow-wrap: break-word;
	text-align: left;
	margin:0;
	padding:0;
	width:100%;
	min-height:100vh;
	position:relative;
	overflow-x:hidden;
}
/* Text */
p {
	font-family: 'Gothic A1', sans-serif;
	font-size: 24px;
	font-weight: 100;
	line-height: 1.4em;
	margin: 0;
	padding: 15px;
	letter-spacing: 0px;
	overflow-wrap: break-word;
}
h1{
	font-family: 'Libre Caslon Text', serif;
	font-size: 48px;
	font-weight: 400;
	line-height: 1.4em;	
	letter-spacing: 0px;
	margin: 0;
	padding: 15px;
	letter-spacing: 0px;
	overflow-wrap: break-word;
}
h2{
	font-family: 'Libre Caslon Text', serif;
	font-size: 36px;
	font-weight: 400;
	line-height: 1.4em;	
	letter-spacing: 0px;
	margin: 0;
	padding: 15px;
	letter-spacing: 0px;
	overflow-wrap: break-word;
}
h3{
	font-family: 'Libre Caslon Text', serif;
	font-size: 31px;
	font-weight: 400;
	line-height: 1.4em;	
	letter-spacing: 0px;
	margin: 0;
	padding: 15px;
	letter-spacing: 0px;
	overflow-wrap: break-word;
}
h4{
	font-family: 'Gothic A1', sans-serif;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.4em;	
	letter-spacing: 0px;
	margin: 0;
	padding: 15px;
	letter-spacing: 0px;
	overflow-wrap: break-word;
}
h5{
	font-family: 'Gothic A1', sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.4em;	
	letter-spacing: 0px;
	margin: 0;
	padding: 15px;
	letter-spacing: 0px;
	overflow-wrap: break-word;
}
h6{
	font-family: 'Gothic A1', sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.4em;	
	letter-spacing: 0px;
	margin: 0;
	padding: 15px;
	letter-spacing: 0px;
	overflow-wrap: break-word;
}
a{
	text-decoration:none;
	color: inherit;
	outline: none;
	transition:1s;
	cursor:pointer;
}
a:hover{
	opacity:.7;
}
ul{
	list-style:none;
	margin: 0;
	padding: 15px;
	outline:none;
}
ol{
	margin: 0;
  	padding: 15px 15px 15px 30px;
}
li{
	margin:0;
	padding-bottom:3px;
}
b{
	font-weight:800;
}
@media screen and (max-width: 1000px) {
	h1{font-size: 40px;}h2{font-size: 31px;}h3{font-size: 26px;}h4{font-size: 23px; font-weight:500;}h5{font-size: 21px; font-weight:500;}h6{font-size: 18px; font-weight:500;}
}
@media screen and (max-width: 480px) {
	html,body{font-size:16px;}h1{font-size: 36px;}p{font-size:16px;}
}
/* Structure */
.flexer {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  align-items: flex-start;
  align-content: flex-start;
  gap: 10px 10px;
  margin:0 20px;
}
.flex-12{
	flex: 7 100%;
}
.flex-11{
	flex: 6 91%;
}
.flex-10{
	flex: 6 82%;
}
.flex-9{
	flex: 5 75%;
}
.flex-8{
	flex: 5 65%;
}
.flex-7{
	flex: 4 57%;
}
.flex-6{
	flex: 4 48%;
}
.flex-5{
	flex: 3 40%;
}
.flex-4{
	flex: 3 33%;
}
.flex-3{
	flex: 2 24%;
}
.flex-2{
	flex: 1 15%;
}
.flex-1{
	flex: 1 8%;
}
@media screen and (max-width: 1000px){
	.flex-10,.flex-9,.flex-8,.flex-7,.flex-6{flex: 3 100%;}
	.flex-5,.flex-4,.flex-3{flex: 2 48%;}
	.flex-2,.flex-1{flex: 1 23%;}
}
@media screen and (max-width: 500px){
	.flex-5,.flex-4,.flex-3{flex: 3 100%;}
	.flex-2,.flex-1{flex: 2 48%;}
	.flexer {margin:0;}
}
/* Slider*/
.flex-slider-container{
	width:100%;
	display: flex;
	position: relative;
	transition:.5s;
}
.flex-slider{
}
.slider-slide{
	display:inline-block;
	margin:0;
	font-size:16px;
	text-align:center;
	font-weight:600;
	width: 100%;
	flex-shrink: 0;
}
.flex-slider-window{
  width: 100%;
  display: block;
  min-height: 200px;
  margin-bottom: 12px;  
  overflow-x: hidden;
  position: relative;  
}
#flex-slider-pages{
  text-align: center;
  display: block;
  padding: 0;
  margin: 0;
}
#flex-slider-pages span{
	background:rgba(153,153,153,1);
	width:10px;
	height:10px;
	margin:0 3px;
	display: inline-block;
	border-radius:10px;
	border:1px solid #ffffff;
	-webkit-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.2);
}
#flex-slider-pages a{
	margin:0;
	padding:0;
}
#flex-slider-pages a.active span{	
	background:rgba(255,102,0,1);
}

/* Carousel */
.flex-carousel{
	min-height:50px;
	width:100%;
	margin: 10px 0;
	padding: 0;
	position:relative;
}
.flex-window{
  display: block;
  margin: 0 30px;
  overflow-x: hidden;
  z-index: 2;
  position: relative;  
}
.flex-carousel-container{
	width:100%;
	display: flex;
	position: relative;
	transition:.5s;
}
.carousel-item{
	display:inline-block;
	margin:0;
	background:#fff;
	font-size:16px;
	text-align:center;
	font-weight:600;
	width: 33.3%;
	flex-shrink: 0;	
}
#flex-move-left{
	cursor:pointer;
}
#flex-move-right{
	right:10px;
	cursor:pointer;
	border-bottom: 2px solid;
	border-left: 2px solid;
	transform: rotate(-135deg);
}
.arrows{
   width: 28px;
   height: 28px;
   border-color: #000;
   position: absolute;
   top: 50%;
   margin-top: -31px;
}
.prev{
   border-bottom: 2px solid;
   border-left: 2px solid;
   transform: rotate(45deg);
   left: 10px;
}
@media screen and (max-width: 899px){
.carousel-item{
	width: 50%;	
}
}
/* Menus */
nav ul{
	padding: 0;
	z-index: 2;
	position: relative;
	margin: 30px 30px 10px 10px;
	font-size:17px;
}
nav ul li{
	display: inline-block;
  	margin: 0 5px;
  	padding: 0;
	position:relative;
}
nav ul li::after{
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #000;
    transition: width .3s;
}
nav ul li:hover::after{
    width: 100%;
}
nav ul li ul{
	margin:0;
	float:none;
	display:none;
	position:absolute;
	padding-top:5px;
	background:rgba(255,255,255,.95);
	font-size:17px;
}
nav ul li:hover ul{
	display:block;
	text-align:left;
}
nav ul li ul li{
	display:block;
}
#hamburger{
	display:none;
}
.visuallyHidden {
    position: absolute; 
    overflow: hidden; 
    clip: rect(0 0 0 0); 
    height: 1px; 
	width: 1px; 
    margin: -1px; 
	padding: 0; 
	border: 0; 
}
.hamburger {
    margin: 10px;
    width: 30px;
    height: 30px;
    position: relative;
	cursor:pointer;
}
.hamburger .bar {
    padding: 0;
    width: 30px;
    height: 4px;
    background-color: #000;
    display: block;
    border-radius: 4px;
    transition: all 0.4s ease-in-out;
    position: absolute; 
}
.bar1 {
    top: 0;
}
.bar2,
.bar3 {
    top: 13.5px;
}
.bar3 {
    right: 0;
}
.bar4 {
    bottom: 0;
}
.hamburger4 .bar4 {
    top: 13.5px;
}
.hamburger4 .bar5 {
    bottom: 0px;
}
.hamburger4 .bar {
    transition: all 0.4s ease-in-out, transform 0.4s ease-in-out 0.4s;
}
.hamburger4 .bar2 {
    width: 1px;
    transform: rotate(90deg);
    left: 13.5px;
}
.hamburger4 .bar3 {
    width: 1px;
    left: 13.5px;    
}
.checkbox4:checked + label > .hamburger4 > .bar1{
    top: 13.5px;
    background-color: transparent;
}
.checkbox4:checked + label > .hamburger4 > .bar2{
    left: 0px;
    width: 30px;
    transform: rotate(45deg);
}
.checkbox4:checked + label > .hamburger4 > .bar3{
    left: 0;
    width: 30px;
    transform: rotate(-45deg);
}
.checkbox4:checked + label > .hamburger4 > .bar4{
    background-color: transparent;
}
.checkbox4:checked + label > .hamburger4 > .bar5{
    bottom: 13.5px;
    background-color: transparent; 
}
@media screen and (max-width: 800px) {
	#hamburger{display: block;position:absolute;z-index: 999999;background: rgba(255,255,255,.4);top:0;}
	#hamburger + nav li, #hamburger + nav ul {display:block; position:relative;}
	#hamburger + nav ul li ul {margin-left:15px;}
	nav ul li::after{background:rgba(0,0,0,0);}
	#navMen {position:absolute;width:0;padding-top:70px;transition: width .3s;overflow:hidden;}
	#navMen.opened {width:300px;}
	#page-canvas {transition:.3s;margin:0;padding:0;position:relative;width:100%;}
	#page-canvas.opened {position:absolute; transform: translate(330px, 60px);}
}
/* Basics */
#scrollToTopBtn {
	position:fixed;
	z-index:9999;
	bottom:-100px;
	right:-100px;
	background:rgba(0,0,0,.06);
	padding: 25px 6px;
	border-radius: 30px;
	transition:.3s;
}
#scrollToTopBtn.scrollup {
	bottom:20px;
	right:20px;
}
#scrollToTopBtn:hover {
	background:rgba(0,0,0,1);
	opacity:1;
}
#scrollToTopBtn span{
	width: 20px;
	margin: 0;
	display: inline-block;
	height: 2px;
	background: #fff;
	transform: rotate(-45deg);
	position: relative;
	right: -3px;
	top: -2px;
}
#scrollToTopBtn span + span{
	transform: rotate(45deg);
	right:0;
	left: -3px;	
}
footer{
	position:sticky;
	bottom:0;
	margin:0;
	width:100%;
}
img {
	margin:0 auto;
	display:block;
	height: auto;
	width:100%;
}
.normal-text {
	font-size:20px;
}
video,
iframe {
  width: 100% !important;
  height: auto !important;
}
.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
.p3{
	padding:30px;
	height:1px;
	width:100%;
}
.p4{
	padding:40px;
	height:1px;
	width:100%;
}
.p5{
	padding:50px;
	height:1px;
	width:100%;
}
.p6{
	padding:60px;
	height:1px;
	width:100%;
}
.p7{
	padding:70px;
	height:1px;
	width:100%;
}