@font-face { font-family:'Avenir Next DemiBold';src:url(http://jaimerative.art/fonts/AvenirNext-DemiBold.woff2) format('woff2'),url(fonts/AvenirNext-DemiBold.woff) format('woff');font-weight:400;font-style:normal;font-display:swap;}
@font-face { font-family:Alice;src:url(http://jaimerative.art/fonts/Alice-Regular.woff2) format('woff2'),url(fonts/Alice-Regular.woff) format('woff');font-weight:400;font-style:normal;font-display:swap;}

html {-webkit-text-size-adjust:100%;} 

#jpreLoader {width:700px!important;height:94px!important;background-color:transparent;border-radius:0!important;box-shadow:none!important;background-image:url("");background-repeat:no-repeat;background-position:left center;background-size:700px;}

body {background-color:#000;font-family:'Avenir Next',sans-serif;}

a {color:#fff;transition:.6s ease;text-decoration:none;cursor:pointer;}

.arrowdown {position:absolute;color:#fff;cursor:pointer;height:48px;width:48px;z-index:3000;top:50%;right:34px;border:none;margin-top:-27px;background-image:url(http://jaimerative.art/img/arrow_forward.svg);background-position:center center;opacity:0;visibility:hidden;}

.arrowright {
  display: inline-block;
  background-image: url("http://jaimerative.art/img/arrow_forward.svg");
  height: 16px;
  width: 16px;
  vertical-align: bottom;
}

.arrowleft {
  display: inline-block;
  background-image: url("http://jaimerative.art/img/arrow_back.svg");
  height: 16px;
  width: 16px;
}

.bottom-link {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  padding: 12px 24px;
  justify-content: space-between;
  align-items: center;
  background-color: #020202;
}

.link-item {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.link-item:first-child {
  margin-right: auto;
}

#teachingstyle {background-image:url(http://jaimerative.art/img/background.jpg);width:100%;height:100%;position:relative;top:0;background-size:cover;background-position:center top;padding-top:0;background-attachment:fixed;overflow:hidden;}


#teachingstyle a {color:#fff;}
#teachingstyle a:hover { color: rgba(255,255,255,0.4);}

#teachingstyle span {font-family:Alice,serif;font-size:100px;transition:2s ease;opacity:0;height:0;display:block;overflow:hidden;text-align:center;margin-bottom:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}

.fp-viewing-teaching #teachingstyle span {  opacity: 1;  height: 118px;}

#teachingstyle .wrr { text-align:center ;}

.fp-viewing-portfolio ul li a span {background-color:#ff004d;}
.fp-viewing-portfolio .hamburger__icon,.fp-viewing-portfolio .hamburger__icon:after,.fp-viewing-portfolio .hamburger__icon:before {background-color:#ff004d;}

.hamburger__icon,.hamburger__icon:after,.hamburger__icon:before {transition:.6s ease;}

 .mobile-only {
      display: none;
    }

.content-container {
	position: relative;
	display: flex;
  	justify-content: center;
  	align-items: center;
  	margin: 0;
  	padding: 0 10%;
  	box-sizing: border-box;
  	min-width: 834px;
}

#aboutstyle .description {flex:1;max-width:70%;color:#fff;font-family:'Avenir Next';text-align:left;font-size:16px;line-height:24px;transform:translateX(60px);transition:transform 1.4s ease;}

#aboutstyle .image-container {
	position: relative;
	max-width: 30%;
	min-width: 448px;
	height: auto;
	margin-right: 48px;
	border-radius: 200px;
	overflow: hidden;
}

#aboutstyle .image-container img {
  width: 100%;
  height: auto;
  display: block;
}

#aboutstyle h1 {position:absolute;bottom:0;left:12%;box-sizing:border-box;width:50%;max-width:600px;font-family:Alice;font-size:56px;line-height:60px;color:#ebe9ed;text-align:left;transform:translateX(30px);transition:transform 1.4s ease;}

.fp-viewing-about #aboutstyle .description, 
.fp-viewing-about #aboutstyle h1 {
	transform: translateX(0);
}

.poimg { 
	overflow: hidden; 
	width: 100%; 
	flex: 1;
}

.poimg2 { 
	overflow: hidden; 
	width: 100%; 
	flex: 1;
	position: relative;
}

.details-container {
  position: absolute;
  z-index: 1000;
  top: 100px;
  left: 64px;
  max-width: 500px;
}

.secondary-container {
	position: absolute;
  z-index: 1000;
  top: 100px;
  left: 64px;
  max-width: 500px;
}

.details {font-family:Alice,serif;padding-left:20px;padding-top:50px;padding-bottom:16px;font-size:64px;line-height:1.2;color:#fff;}

h1 {font-family:Alice,serif;font-size:32px;line-height:1.2;color:#fff;}

.subdetails {position:absolute;font-family:"Avenir Next",sans-serif;text-align:left;padding-left:20px;font-size:16px;line-height:1;color:#fff;}

.subdetails span {color:#fff;opacity:0.5;padding-left:8px;padding-right:8px}

.wrr  {
  display: inline-block ;
	text-align:left ;
	list-style: none;
	padding: 0 !important;
	margin-top: -2px;
	max-width: 550px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 4px;
 }

 .mainnav {
 	margin-top: 12px;
 	margin-bottom: 12px; 
 	}

.mainnav a {font-family:Alice,serif;font-size:32px;color:#fff;padding:0;line-height:1;transition:color .2s ease;}

.mainnav a {font-family:Alice,serif;font-size:32px;color:#fff;padding:0;line-height:1;transition:color .2s ease;}

/*#menu li.active a, #menu li.active {
color: #680AFF;
}
*/

.wrr a {font-family:'Avenir Next',sans-serif;font-size:16px;line-height:1;color:#d9c2ff;padding:0 16px 0 0;display:inline-block;transition:color .6s ease;}

.wrr a:hover {color:#ebe9ed;}

.wrr li {  display: inline;  }

.wrr li.active a, {
color: #680AFF;
}

#labstyle {background-image:url(img/background.jpg);width:100%;height:100%;position:relative;top:0;background-size:cover;background-position:center top;padding-top:0;background-attachment:fixed;overflow:hidden;}

#labstyle .details {
  transition: 1.4s ease;
  margin-left: 80px;
}

#labstyle .details {
  margin-left: 0;
}

.container {
    max-width: 63rem;
    margin: 2rem auto;
    padding: 0 2rem;
    position: relative;
    display: flex;
    justify-content: center;
  	align-items: center;
  	scroll-behavior: smooth;
}

.visually-hidden {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
}

.gallery {display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));grid-template-rows:22rem;grid-gap:1.4rem;margin:-1rem -1rem;overscroll-behavior:contain;}

.gallery-item {
  position: relative;
  color: #fff;
  cursor: pointer;
  overflow: hidden;
  width: 100%;
}

.gallery-item video {position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s ease;}

.gallery-item:focus video,.gallery-item:hover video {opacity:1;}

.gallery-item-info {
  display: none;
  pointer-events: none;
}

.gallery-item:focus .gallery-item-info,.gallery-item:hover .gallery-item-info {display:flex;justify-content:center;align-items:center;position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.3);}

.gallery-item-info li {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 24px;
  display: inline-block;
}

.gallery-item-likes {
    margin-right: 2.2rem;
}

.gallery-item-type {position:absolute;top:1rem;right:1rem;font-size:2.5rem;text-shadow:.2rem .2rem .2rem rgba(0,0,0,0.1);}

.gallery-image {
    width: 100%;
    height: 100%;
    object-fit: cover;

}

.container,.gallery,.gallery-item {touch-action:manipulation;}

 @media screen and (max-width:834px) {
	.gallery {grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));grid-template-rows:repeat(3,17rem);}
	} 

 @media screen and (max-width:580px) {
	.gallery {grid-template-columns:repeat(auto-fit,minmax(32rem,1fr));grid-template-rows:repeat(6,32rem);}
	.container {margin-top:180px;}
	} 

 @media screen and (max-width:500px) {
 	.gallery {grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));grid-template-rows:repeat(6,20rem);}
	} 


#aboutstyle {background-image:url(img/background.jpg);width:100%;height:100%;position:relative;top:0;background-size:cover;background-position:center top;padding-top:0;background-attachment:fixed;overflow:hidden;}

 @keyframes scroll {
 	0% {opacity:0;}
 	10% {transform:translateY(0);opacity:1;}
 	100% {transform:translateY(15px);opacity:0;}
 }