@import url('https://fonts.googleapis.com/css2?family=Roboto&family=Rozha+One&family=Scheherazade+New:wght@400;700&family=Staatliches&family=Work+Sans:wght@700&display=swap');
/* @import "./fontawesome/scss/fontawesome.scss";
@import "./fontawesome/scss/solid.scss";
@import "./fontawesome/scss/brands.scss"; */


/* ========================| BODY |========================*/



html {
    overflow-x: hidden;
    scroll-behavior: auto!important;
}

@media only screen and (max-width: 768px)  {
html {

    scroll-behavior: smooth!important;
}
}






html,
body {
    margin: 0;
    padding: 0;

}

body {
    overflow: hidden;
    width: 100%;
}

.smooth-scroll-wrapper {
    position: fixed;
    z-index: 2;
    top: 0;
    left: 0;
    right: 0;
    overflow: hidden;
}




/* html, head, body {
	max-width: 1440px!important;
	height: 100%;
	margin: 0 auto;
	scroll-behavior: smooth;
} */

.bodycon {
	animation:transitionIn 2s;
	/* padding-bottom: 140px; */
}
.bodycon2 {
	animation: gallery 3.5s;
	/* padding-bottom: 140px; */
}

@keyframes transitionIn {
	from{

		opacity:0;
	}

	to{
		opacity:1;
	}
}

@keyframes gallery {
	from{

		opacity:0;

	}

	to{
		opacity:1;

	}
}

@keyframes transitionOut {
	from{

		opacity:1;
	}

	to{
		opacity:0;
	}
}

@keyframes textHover {
	from{

		color:#fff;
	}

	to{
		color:#fed330;
	}
}

@keyframes textHoverout {
	from{

		color:#fed330;
	}

	to{
		color:#fff;
	}
}

.content {
	/* max-width: 1400px; */
	margin: 35px;
	margin-top:35px;
}

.navcontainer {
	max-width: 1440px;
}

.pagecontainer {
	/*padding-bottom: 150px;*/
}

@media only screen and (max-width: 1000px)  {
	.content {
		max-width: 100vw;
		margin: 0px;
		overflow-x: hidden;
		height: 100vh;
		overflow-y: scroll;
	}
}

body {
	font-family: 'Scheherazade New', serif;
	/* margin-top: 150px; */
	overflow-x: hidden;
	font-size: 15px;
}

@media only screen and (max-width: 1000px)  {
    body {
    margin-top: unset;
}}

p {
	padding-right: 10px;
	padding-left: 10px;
	padding-top:0px;
	padding-bottom:0px;
     font-family: 'Rozha One', serif;
     font-size: 1em;
     color: black;
}

/* img {
	padding: 10px;
} */

a {
	color: black;
	text-decoration: none;
}

/* a:hover {
	text-decoration: none;
	color: #fed330;
} */

a:hover {

  transition: color ease .5s;
  color: #0eff0a;

}

@media only screen and (max-width: 768px)  {
     a:hover {

       transition: none;
       color: unset;

     }
}


.homebutton:hover {animation: homerainbow 3s infinite;
animation-timing-function: ease-in-out;}

@keyframes homerainbow  {
	0% {color: #0affff;}
	25% {color: #fd0505;}
	50% {color: #ff530a;}
	75% {color: #dd0aff;}
	100% {color: #0affff;}
}


/* h1 > a, h3 > a, p > a, small > a {transition: color ease .35s;} */

/* p a {
	color: peachpuff;
	text-decoration: none;
	font-weight: bold;
} */

ul {
     font-family: 'Montserrat', sans-serif;
     font-size: .875em;
     color:#fff;
}

h1 {
	padding: 9px;
	color: #fff;
	font-size: 2em;
}

h2 {
	font-family: 'Staatliches', cursive;
	padding: 10px;
	color: black;
     font-size: 1.5em;
}

/* a:h2 {
	padding: 10px;
	color: #fff;
     font-size: 1.5em;
} */

h3 { font-size: 1.25em;
     color: black;
	padding: 10px;
}

p a {
	/* font-family: 'Roboto', sans-serif;
	font-size: .875em;
	color: black;
	text-decoration: none;
	text-align: right; */

}

/* a:h3 {color: #fff;} */

small {font-size: 0.67em;}
small a {color: black;}
small a:hover { color: #0eff0a;}

small.subtitle{
	letter-spacing: 5px;
	color: #fff;
}

li {
	color: white;
	font-size: 15px;
}

ul {
	color: white;
	font-size: 1em;
}

@media only screen and (max-width: 768px)  {
	li {
		color: white;
		font-size: 22px;
	}

	ul {
		color: white;
		font-size: 1em;
	}
}






/* ========================| NAVBAR |========================*/

.wwwnavbar {
	position: fixed;
	top:0;
	left:0;
	right:0;
	height: 61px;
	z-index: 5;
}

.issuesbutton {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding: 23px 51px;
	position: absolute;
	width: 112px;
	height: 61px;
	right: 0px;
	top: 0px;

}

.issuesbutton a {
	position: static;
	width: 29px;
	height: 12px;
	left: 41.5px;
	top: 24.5px;
	font-family: 'Scheherazade New';
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 12px;
	/* identical to box height */
	display: flex;
	align-items: center;
	text-align: center;
	color: #000000;
	text-decoration: none;
}

.issuesbutton a:hover {color:#0eff0a}

@media only screen and (max-width: 768px)  {
     .issuesbutton a:hover {color:unset;}

     }
}



.homewrap {
	position: fixed;
	width: 100%;
	top:18px;
}

.homebutton {
	font-family: 'Work Sans', sans-serif;
	font-family: Work Sans;
	font-style: normal;
	font-weight: bold;
	font-size: 20px;
	line-height: 23px;
	/* display: flex; */
	align-items: center;
	text-align: center;
	letter-spacing: -0.02em;
	position: absolute;
	left: 0%;
	right: 0%;
	top: 29%;
	bottom: 0%;
	color: black;
}


/* .homebutton:hover { color: #0eff0a;} */





/* ========================| FRONT PAGE |========================*/

.sponsor_banner {
					  position:fixed!important;
                      left:0%;
                     bottom: 0%;
                     width: 30%
                    }

.sponsor_banner img { 
					  position:fixed!important;
                      width: 17%;
                      margin-left: 0px;
                      left: -9.5%;
                      right: 0%;

                      bottom: 0%;
                      transform: rotate(-90deg);
					  display: none;

                    }

.fpimage {text-align: center;}

.fpimage img {
	margin: 0 auto;
	margin-top: 218px;
	position: relative;
	left: 0%;
	right: 0%;
	top: 0%;
	bottom: 0%;
	width: 20%;
	height: auto;
}

.manifesto {
	text-align: center;
	padding-left: 300px;
	padding-right: 300px;
	padding-top: 30px;
	line-height: 35px;
}

.manifesto h2 {text-align: center;}
.manifesto p {text-align: center;}

@media only screen and (max-width: 1000px)  {

.sponsor_banner {
display:none!important;
                    }

.sponsor_bannermob{
  
  width: 90%; 
  display: none;


}


	.manifesto {
		text-align: center;
		padding-left: 55px;
		padding-right: 55px;
	}

	.fpimage img {
		margin: 0 auto;
		margin-top: 15vh;
		width: 25%;

	}
}

/* .manifesto p {width: 740px;} */

.footer {
	font-feature-settings: 'haln' on;
	text-align: center;
	width: 100%;
	padding-top: 0px;
	line-height: 16px;
	/* border-top: 1px dotted silver; */
}


.footer p {
margin-bottom: 0px;
}


.contact {
	font-feature-settings: 'haln' on;
	text-align: center;
	width: 100%;
	padding-top: 0px;
	line-height: 16px;
}


.contact p {
margin-bottom: 0px;
}

.issues_row {
     justify-content: center;
     -webkit-justify-content: center;
	align-items: center;
	-webkit-align-items: center;
     text-align: center;
}


.issues_col {width: 33%;}

.issues_col img {
     height: 40vh;
     width: auto;
}
@media only screen and (max-width: 765px)  {

     .issues_col {min-width: 100%;}

}

.issues {
	text-align:  center;
	margin-top: 140px;
	padding-bottom: 250px;
}

.issues img {
	width: auto;
	height: 45vh;
  border-radius: 1px;
    box-shadow: 2px 1px 4px 0px lightgrey;
}



}

.number{margin-bottom: 30px;}

#social {text-align: center;}


   /* ========================| Coming Soon |========================*/

.comingsoon {text-align: center;
	padding-top: 40vh;}

@media only screen and (max-width: 1000px)  {
	.comingsoon {padding-top: 20vh;}
}


/* ========================| Issue Home |========================*/

.issuewrapper {
	margin-top: 20vh;
	text-align: center;
}

.level img {

	height: 60vh;
	width: auto;
	z-index:-1;

}

.level:nth-child(odd) {
	position: relative;
	right: -15%;
	/* bottom: 10%; */
	margin-bottom: -5%;
	}
.level:nth-child(even) {
	position: relative;
	right: 15%;
	/* top: 10%; */
	margin-bottom: -5%;
}

@media only screen and (max-width: 768px)  {

	.level img {

		height: auto;
		width: 75vw;
	}

     .level:nth-child(odd) {

     	right: -8%;

     	}
     .level:nth-child(even) {

     	right: 8%;

     }
}


.level a {z-index: 9999;}

.img_wrapper h2, .linkwrap h2 {
		color: white;
		/* transition: .3s ease-in-out; */
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
	}
/*
	.img_wrapper:hover image {
	opacity: 0.3;
	transition: .3s ease-in-out;
	} */

	.img_wrapper a:hover h2 {
	  opacity: 1;
	}

.vid {width: 55vw;}

.linkwrap {
     display:inline-block;
     width: 45vw;
     height: auto;
 }

@media only screen and (max-width: 768px)  {
     .linkwrap, .vid {width: 70vw;}

}


/*
This works but hover is not exacly the image
.img_wrapper a img {

	height: 60vh;
	width: auto;
	z-index:-1;
	filter: brightness(100%)
}

.img_wrapper a:hover img {

	height: 60vh;
	width: auto;
	z-index:-1;
	filter: brightness(50%)
} */

.img_wrapper a  {
	transition: filter 1s ease;
	/* filter:hue-rotate(0deg) contrast(100%) brightness(100%); */
     filter: saturate(100%) brightness(100%);


}

.img_wrapper a:hover {
	/* filter: hue-rotate(-30deg) contrast(90%) brightness(95%); */
     filter: saturate(130%) brightness(90%);
     /* z-index:999; */
}

/* .fadedImg {
 z-index:9999;
 position: relative;
} */

.level img:hover {
     z-index:999;
}

.vid_wrapper  {

	height: 60vh;
	width: auto;
	margin-top:-5vh;
	margin-bottom:-5vh;

 }
@media only screen and (max-width: 768px)  {
	.vid_wrapper  {
		height: 40vh;
		width: auto;
		margin-top:-5vh;
		margin-bottom:-5vh;
	}
}
 .vid_wrapper iframe {

 	height: 100%;
 	width: 100%;

  }



.blocker { position:absolute; height:100%; width:100%; top: 0; left:0; z-index:999; pointer-events: fill; color: black;}

.blocker:hover {
	/* background-color: rgba(0,0,0,.5);  */
	transition: 1s ease;
}
.blocker:hover h2 {opacity: 1; transition: 1s ease;}

.blocker h2 {opacity: 0; transition: 1s ease;}

.linkwrap iframe { z-index: 2; }

.bottom_spacer { height: 50vh;}

/* ========================| Gallery |========================*/

.fp {
     height: 80vh;
}

.carousel-inner img {
	max-height: 70vh;
     height: auto;
	width: auto;
	max-width:100%;
 	margin: 0 auto;
}

.carousel-inner img, .carousel-inner iframe {
     top: 50%;
     position: relative;
     transform: translateY(-50%);
}
@media only screen and (max-width: 768px)  {
     .fp {
          height: 70vh;
     }
     .carousel-inner img {
     	max-height: 58vh;
}
}

.slider_wrap {
	text-align: center;
	width: 100%;
	margin: 0 auto;
}

/* #www-carousel {
	margin: 0 auto;
} */

.carousel-inner p {
	display: none;
}




.carousel-inner iframe {
     top: 100%!important;
     position: relative;
     transform: translateY(-100%);
}

@media only screen and (max-width: 768px)  {
.carousel-item img {
	height: auto;
	max-width: 100%;
	margin: 0 auto;

}

.carousel-item  {
     margin-top: 40px;
}
}

.carousel-indicators li {

	padding-left: 5px;
	padding-right: 5px;
	color: #333333;
     cursor: e-resize;
}

.active {
	font-style: bold;
	font-weight: 700;
}

.vid_wrapper_gallery  {

     width: 70%;
    max-width: 100%;
    overflow: hidden;
    height: auto;
    text-align: center;
    margin: 0 auto;
    top: 50%;
    position: relative;
    transform: translateY(-50%);
    z-index: 11;


 }

 @media only screen and (max-width: 768px)  {
.vid_wrapper_gallery  {
	width: 100%;
	}
}

 .vid_wrapper_gallery iframe {
	 z-index: 10;
 }

/* .carousel-indicators li:active {

	background-color: black;
	color: white;
	font-size: 40px!important;
	padding-left: 10px;

} */

.prev {
	display: block;
    height: 85%;
    width: 50vw;
    position: absolute;
    top: 0;
    left: -3vw;
    z-index:9;
    cursor: w-resize;
}

.next {
	display: block;
    height: 85%;
    width: 55vw;
    position: absolute;
    top: 0;
    right: -10vw;
    z-index: 9;
    cursor: e-resize;
}

@media only screen and (max-width: 768px)  {

	.next {
		display: block;
		width: 60%;
		height: 70vh;
	}

     .prev {
         display: block;
         width: 60%;
         height: 70vh;
}
}
.carousel-control-next-icon, .carousel-control-prev-icon {background-image: none;}

.indicator_wrap {
	width: 100%;
	margin: 0 auto;
	position: relative;
     padding-top: 5px;
     padding-right: 5px;
	/* padding: 12px; */

}

@media only screen and (max-width: 768px)  {
	.indicator_wrap {
		width: 95%;
	}
}

.homeindicator {
	/* transform:rotate(90deg); */
		/* bottom: 10%; */
    text-align: right;
    float: right;
    position: relative;
    margin: unset;
}

.carousel-inner p{

     display: block;
     text-align: right;
     position: absolute;
     bottom: 0;
     right: 0;

}

.car_caption {
     font-family:  'Scheherazade New', serif;
     color: #444444;
     font-weight: 400;
     font-size: 13px;
     padding-top: 15px;
     padding-bottom: 0px;
     margin-bottom: 0px;

}
.texts {
	/* text-align: right; */
	padding-top: 10px;
	padding-bottom: 30px;
	margin: 0 auto;
	width: 100%;
	padding-left: 0px;
	padding-right: 0px;
}


.contributor_text p {
	font-family:  'Scheherazade New', serif;
	/* font-size: 16px;
	line-height: 16px; */
	/* line-height: 59%; */
	color: #444444;
	text-align: left;
     font-size: 16px;
	/* padding-right: unset; */

}

@media only screen and (max-width: 575px)  {

     .contributor_text p {
		padding-right: unset;
		font-size: 20px;
		font-family:  'Scheherazade New', serif;
	}
	.contributor_text, .caption {
		padding-left: 0px;
	}
     .car_caption {
          font-size: 15px;
     }
}

.caption p {
	/* padding-left: 10px; */
	color: #333333;
	text-align: right;
	font-family: 'Rozha One', serif;
	font-size: 16px;
	/* padding-top: 10px; */
}

.caption_wrap {
	width: 150px;
	float:right;
}

@media only screen and (max-width: 575px)  {
	.caption p {
		/* padding-left: 10px; */
		color: #333333;
		text-align: left;
	}

	.caption_wrap {
		width: 150px;
		float:left;
	}
}

.caption strong {
	font-size: 16px;
	font-family: 'Rozha One', serif;
	line-height:0;
}
.esc_wrap {
	width: 100%;
	position: relative;
	margin: 0 auto;
	top:0px;
	left: 0px;
     height: 35px;
	z-index: 11;
}
.esc {
	background-color: transparent;
	font-family: 'Scheherazade New', serif;
	color: #444444;
	border: none;
	font-size: 15px;
	position: relative;
     top: 9px;
	/* width: 100%; */
	/* right: 50px;
	top:50px; */
	z-index: 12;
	/* float: right;
	right: 0;
	top:0; */
	text-align: left;
}

@media only screen and (max-width: 768px)  {

	.esc {
		/* background-color: rgba(255,255,255,.000001); */
		font-family: 'Scheherazade New', serif;
		/* color: black; */
	}
	.esc_wrap {
		top:10px;
		left: 0px;
	}
}


 /* ========================| Search |======================== */

.open-search {cursor:pointer;}

.search_fade {
     filter:blur(2px);
     transition: .7s ease;
}

.bodycon {
     transition: .7s ease;


}

.search_symbol {
 	font-size: 24px;
 	position: absolute;
 	left: 7px;
 	top: -5px;
 	-webkit-transform: rotate(-45deg);
 	-moz-transform: rotate(-45deg);
 	-o-transform: rotate(-45deg);
 	transform: rotate(-45deg) translateY(26px);
 	padding:0;
 	z-index: 2;
 	/* margin:-33px; */
 }

 .search_symbol_box {
     font-size: 24px;
     -webkit-transform: rotate(-45deg);
     -moz-transform: rotate(-45deg);
     -o-transform: rotate(-45deg);
     transform: rotate(-45deg);
     padding:0;
     z-index: 2;
     background-color: rgba(0,0,0, 0.0000001);
     border: none;
     color: whitesmoke;
     padding-left: 30px;
     width: 37%;
     position: absolute;
     top: 27%;
     left: 69%;
     font-family: 'Rozha One', serif;
     font-size: 35px;
    /* margin:-33px; */
 }

 .search_page {
      padding-top: 15%;
      text-align: center;
}

label {font-size: 40px;}

 .tnfeatured  {
      width: 100%;
      height: auto;
      /* overflow: hidden;
object-fit: cover; */
 }

 .search_symbol:hover {color:#0eff0a;}

.www_search {
     display: none;
     position: fixed;
     width: 35vw;
     height: 20vw;
     top: 50%;
     transform: translate(-50%, -50%);
     left: 50%;
     background-color: #ccccc8;
     /* opacity: .8; */
     z-index: 1029;
     opacity: .97;
     box-shadow: 0px 0px 2px grey;
     /* border-radius: 3px; */
}


.search_row {
     padding:0;
     font-family: 'Rozha One', serif;
}

.searchbox {
     top: 50%;
     transform: translateY(-50%);
     position: absolute;
     text-align: center;
}
.fade {
     position: fixed;
     height:100vw;
     width:100vw;
     right:0;
     top:0;
     left:0;
     z-index:-1;
     filter: blur(5px);
}
/* .search-submit {
     background-color: rgba(0,0,0, 0.0000001);
     border: none;
     color: whitesmoke;
     padding-left: 30px;
     width: 25%;
     position: absolute;
     top: 50%;
          left: 70%;
     TRANSFORM: TRANSLATEY(-50%);
     font-family: 'Rozha One', serif;
     font-size: 3vw;
} */

.glyphicon-search:before {
     content: "\e003";
}

.search-field {
     width: 60%;
     position: absolute;
     top: 50%;
     left: 7vw;
     height: 60px;
     TRANSFORM: TRANSLATEY(-50%);
     font-family: 'Rozha One', serif;
     border:none;
     border-radius:10px;
}

.search-reader-text {padding-left: 20px;}



@media only screen and (max-width: 575px)  {
     .www_search {


         width: 85vw;
         height: 40vw;

     }

     label {font-size: 20px;}

     .searchbox {

          text-align: center;
     }

     .search-submit {
          background-color: rgba(0,0,0, 0.0000001);
          border: none;
          color: whitesmoke;
          width: 14%;
          position: absolute;
          top: 24%;
          left: unset;
          right: 7%;
          /* TRANSFORM: TRANSLATEY(-50%); */
          font-family: 'Rozha One', serif;
          font-size: 7vw;
     }

     .search-field {
          width: 60%;
          position: absolute;
          top: 50%;
          left: 17vw;
          height: 12vh;
          max-height: 194%;
          TRANSFORM: TRANSLATEY(-50%);
          font-family: 'Rozha One', serif;
          border:none;
          border-radius:0px!important;
     }

     .search-reader-text {padding-left: 20px;}
}