/*!
Theme Name: basics
Theme URI: http://underscores.me/
Author: Pritpal Ajimal
Author URI: http://kikuchi-online.com
Description: A basic theme that needs to remain minimal and lean
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: basics
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

basics is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

/*
* Basics — Artlyst
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
*/


/* Basic Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */

:root {
	--c-background--main: 						rgba(234, 234, 234,1);
	
	--c-text: 												rgba(10, 10, 10,1);
	--c-headings: 										#aaa;
	
	--c-links-main: 									rgba(255, 255, 255, 0);
	--c-links-main__underline: 				rgba(255, 255, 255, 0);
	--c-links-main--hover: 			  		rgba(38, 27, 75, 0.2);
	--c-links-nav__site: 				  		rgba(255, 255, 255, 0);
	--c-links-nav__site--hover: 			rgba(38, 27, 75, 0.2);
	
	--c-site-header__background: 			rgba(255, 255, 255,1);
	--c-site-footer__background: 			rgba(255, 255, 255, 0);
	--c-site-newsletter__background:	rgba(255, 255, 255, 0);

	--c-background--bg1: 							rgba(20, 20, 20,0.1);
	--c-background--article:					rgba(255, 255, 255,0.6);
	--c-background--article__hover:		rgba(189, 114, 24,0.1);
	--c-background--ad: 							rgba(255, 255, 255, 0);

	--content-width-1:            		90%;
	--content-width-2:            		1200px;
	--text-width-1: 									70%;

	--gap: 														1vmax;
	--margin-figure: 									10vmax;

	--font-main: 											'Inter Tight', serif;
	--font-heading:               		'Syne', serif;
}

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

html {
  font-family: var(--font-main);
  font-size: 100%;
  background: var(--c-background--main);
  color: var(--c-text);
  line-height: 1.3;
  font-weight: 400;
  text-rendering: optimizeLegibility;
  -webkit-font-kerning: normal;
  font-kerning: normal;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
       text-size-adjust: 100%; }   

body {
	margin:0;
	padding:0;
	}




/*------------------------------------*\
  #WRAPPER
\*------------------------------------*/

.wrapper {
  margin: 0 auto;
  max-width: var(--content-width-1);
  padding-left: 2rem;
  padding-right: 2rem;
  width: 100%;    
}

.wrapper-section {
	padding-top:  0.5rem;
	padding-bottom:  2rem;
}

.wrapper-section__bg-1 {

}

.wrapper__footer {
	display:  flex;
	flex-direction: row;
}


.article-wrapper {
	/*background-color: var(--c-background--article);*/
}

@media all and (max-width: 40em) {
	.wrapper {
		max-width: 100%
	}
}
/*------------------------------------*\
  #PAGE
\*------------------------------------*/

.page {}






/*------------------------------------*\
  #PAGE-HEADER
\*------------------------------------*/

.page-head {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  padding-left:  1vw;
  padding-right:  1vw;
  background-color: var(--c-site-header__background);
  width: 100%;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

.page-head-elements {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
}

.site-branding {
  display: flex;
  align-items: flex-start;
  padding-top: 0;

}

.site-branding__logo {
  height: 50px;
  padding-top: 0.5rem;
  padding-bottom: 0.3rem;
}

@media all and (max-width: 40em) {
	.site-branding__logo {
	  height: 2rem;
	}
}

.site-branding a {
	border: 0;
}

.site-branding__logo:hover,
.site-branding__logo:focus {
  filter: invert(100%) sepia(3%) saturate(11%) hue-rotate(34deg) brightness(97%) contrast(104%);
}

.site-branding__title {
  display:none;
}

.site-branding__description { 
  display: none; 
}

.menu-site-nav__container {
  width: 100%;
}

.site-nav {
  display: flex;
  grid-gap: 2vw;
  list-style-type: none;
  padding: 0;
  text-align: left;
  font-weight: 700;
 }

 .site-nav a,
 .site-search a {
  text-decoration: none;
  border-bottom: none;
}

.site-nav a:hover {
  
}

.site-nav__container {
	
}

.site-nav__main {
   font-weight: 700;

}

@media all and (max-width: 40em) {
	.site-nav__container {
		flex-direction: column;
		margin-top: -0.5rem;
	}

	.site-nav__main {
		flex-direction: column;
		text-align: center;
	}

	.site-nav__socials {
		justify-content: center;
		column-gap: 6vw;
		margin-top: -0.5rem;
	}

	.site-nav__socials li {
		padding-left: 2vw;
		padding-right: 2vw;
	}

	.sub-menu {
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
	}
}

.menu-site-nav__socials-insta-container {
    align-items: center;
    display: flex;
}

.site-nav__socials {
  grid-template-columns: repeat(3, 1fr);
}

.site-nav__toggle {
  display: none;
  align-self: center;
}

.site-search {


}

.site-nav .sub-menu {
	list-style-type: none;
	padding: 0;
	font-size: 0.9rem;
}

.sub-menu li {
	grid-gap: 2vw;
	font-weight: 400;

}


.site-nav__container {
    flex-direction: row;
    display: flex;
    justify-content: space-around;

  }

  .site-nav__container.is-visible {
    display: flex;
  }

/*
  .site-nav {
    flex-direction: column;

  }

  .menu-site-nav__main-container {
    display: flex;
    justify-content: center;
  }

  .site-nav__main {
    grid-template-columns: unset;
    grid-template-rows: repeat(6, 1fr);
    text-align: center;
  }
*/

  .site-nav__socials {
    flex-direction: row;
  }

  .site-nav__toggle {
    display: block;
  }
  

  .site-nav__toggle {
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    cursor: pointer;
    text-decoration: none;
    position: absolute;
    right: 4rem;
    display: none;
  }

  .site-search {

  }

.site-search__overlay{
	display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom:0 ;
  left: 0;
  overflow: auto;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.8);
  border: #a0a0a0 solid 1px;
  margin: 0;
  justify-content: center;
}

.site-search__overlay-content {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100vw;
}

.search-form {
	display: flex;
	flex-direction: column;
}


.search-field {
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #fff;
    padding-bottom: 0.5rem;
    color: white;
    font-size: 3rem;
    text-align: center;
    margin-bottom: 2rem;
}

.search-submit {
	background-color: var(--color-1);
	color: white;
	border: 1px solid white;
	padding: 1rem;
	font-size: 1rem;
	font-weight: 700;
	border-radius: 1.3rem;
	text-align: center;
	width: 50%;
	align-self: center;
}

.site-search__close {
	font-size: 5vh;
	color: var(--color-1);
	font-weight: 700;
	position: absolute;
	top: 3rem;
	right: 3rem;
}

.icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-size: cover;
  }

.icon:hover,
.icon:focus {
  filter: invert(100%) sepia(3%) saturate(11%) hue-rotate(34deg) brightness(97%) contrast(104%);
}

.icon--body {
  display: inline-block;
  width: 15px;
  height: 15px;
  background-size: cover;
  filter: invert(100%) sepia(3%) saturate(11%) hue-rotate(34deg) brightness(97%) contrast(104%);
}

.icon__search {
  background-image: url(https://fadmagazine.com/wp-content/uploads/icon-search.svg);
  margin-left: 1rem;
}

.icon__close {
  background-image: url(https://fadmagazine.com/wp-content/uploads/icon-close.svg);
  width: 30px;
  height: 30px;
}
.widget-area {
  display: none;
}

@media all and (max-width: 40em) {
	.site-nav__toggle {
		top: 0.5rem;
	}
	.site-search {
		top: -0.2rem;
	}
	}



/*------------------------------------*\
  #PAGE-FOOTER
\*------------------------------------*/	


.site-info ul {
    list-style-type: none;
    display: flex;
    justify-content: space-between;
    padding: 0;
    margin-bottom: 2rem;

}

@media all and (max-width: 40em) {
	.site-info ul {
		flex-direction: column;
	}
	
	}


/* Basic Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */


h1, h2, h3, h4, h5, h6 {
	font-weight: 800;
	color: black;
	font-family: var(--font-heading);
	overflow-wrap: break-word;
}	

@media all and (max-width: 40em) {
	h1, h2, h3, h4, h5, h6 {
			hyphens: auto;
	}
}

h1 {
	text-transform: none;
	font-size: 3rem;
}

.archive-description {
	text-align: center;
	margin-bottom: 5vh;
	font-weight: 800;
}

a {
	color: var(--c-text);
	text-decoration: none;
	border-bottom: 3px solid var(--c-links-main);
	
}

a:hover {
	background-color: var(--c-links-main--hover);
}

hr {border-top: 1px solid #eee;}

/*a:visited {
	color: var(--color-2);;
}


a:focus,
a:active {
	text-decoration: none;
	color: var(--color-2);

}*/

.figure {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: var(--margin-figure);
	margin-bottom: var(--margin-figure);
	padding: 1rem;
	background-color: white;
}

.figure__img {
	height: auto;
	width: auto;
	object-fit: none;
	margin-bottom: 2rem;

}

.figure__cite {
	font-size: 0.8rem;
	font-style: italic;
	padding-bottom: 1rem;
}

.wp-block-image {
    margin-bottom: 10vh;
    margin-top: 10vh;
}

.wp-block-image figcaption {
    margin-top: .5em;
    margin-bottom: 1em;
    font-size: 0.8rem;
    font-style: italic;
}

.wp-block-quote cite {
	font-size: 1rem;
	font-style: italic;
}

/*article img {
	width: 100%;
	max-width: 100%;
	height: auto;
	margin-bottom: 2rem;
}*/

.page-header h2 {
	font-size: 3rem;
}

.article {}
/* site main content */

aside { display: none; }


/*.home-page-header {
	grid-column: 1 /-1;
}*/


.entry-header {

}

.entry-info {

}

.entry-title {
	/*font-size: 2rem;*/

}
/*
.post-thumbnail {
	background-color: rgba(200,200,200,0.1);
	margin-bottom: 2rem;
	padding: 0.5rem 0 .1rem 0;
}
.post-thumbnail img {
	margin: 0;
	padding: 0;
}


.wp-post-image {
	height: 50vh;
	width: 100%;
	max-width: 100%;
	object-fit: contain;
	object-position: center center;
}
*/
.entry-meta {
	font-style: italic; 
	text-align: left; 
	margin-bottom: var(--gap);
	width: 100%;
	margin-top: 2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #999;
}


.entry-content, .listing-content {
	margin-bottom: 4rem;
	display: flex;
	flex-direction: column;
}

.article-listing {
	display: grid;
	grid-template-columns: repeat(auto-fit,minmax(200px,1fr));
	grid-gap: var(--gap);
	grid-auto-flow: dense;
	margin-top: 1vmax;
	margin-bottom: 5vmax;
	overflow-wrap: break-word;
	padding-top: 1rem;
	padding-bottom: 1rem;
}

.article-listing__3 {
	grid-template-columns: repeat(3, minmax(150px, 1fr));
}

.article-listing__5 {
	grid-template-columns: repeat(5, minmax(150px, 1fr));
}

.article-listing h2 {
	font-size: 1.2rem;
}

.article__listing--date,
.article__listing--venue {
	font-size: 0.9rem;
	font-style: italic;
}

.article__span-2 {
	grid-column: span 2;
}
.articles-small {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: var(--gap);
}

.articles-small article {
	margin-bottom: 1vmax;
/*	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 1vmax;*/
	padding-bottom: 1vmax;
}

.article-listing article:hover {
	/*background-color: var(--c-background--article__hover);*/
}

.article__img {
	height: 20vmax;
	object-fit: cover;
	object-position: center;
	margin-bottom: 2rem;
	width: 100%;
	max-width: 100%;
}

.article__list-img img {
	height: 20vmax;
	object-fit: cover;
	object-position: center;
	margin-bottom: ;
}

 .article__text {
 		padding: 0rem;
 		margin-top: -2rem;
 }


.article__img-big { height: 90vh; width: 100%; margin-bottom: 0; margin-top:0; }

.article__single {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.article__single blockquote {
	font-weight: 300;
	font-size: 2rem;
	font-style: italic;
	font-family: var(--font-heading);
}

.article__single h1 {
	align-self: flex-start;
  padding-top: 2rem;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  width: 100%;
}

.article__single p {
	width: 50rem;
}

.article__lead {
	font-size: 2rem;
	font-style: italic;
	font-weight: 600;
}

.entry-content h2, 
.entry-content h3, 
.entry-content h4, 
.entry-content h5, 
.entry-content h6 { 
		width: 50rem;
    
}

.archive-description {display:none;}

.entry-content p, .entry--para {
/*		width: 60vw;*/
    
}

.category__info { font-size: 0.9rem; font-style: italic; }

.post-categories {
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    list-style-type: none;
    margin: 0;
    padding: 0;
    width:  50rem;
}

.post-categories__content {
	
}

.post-categories li {
  font-size: 0.9rem;
  font-style:  italic;
  margin-right: 1rem;
}

.post-categories li:hover {
	background-color: var(--color-7);
}


.event-details {
	list-style-type: none;
	margin:  0;
	padding:  0;
	width: 60vw;

}


@media all and (max-width: 40em) {
	.wrapper {
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}
	.article-listing {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		grid-gap: 10px;
	}

	.article__single h1 { font-size: 2rem }
	.article__single p { width: 100%; }
	.article__single blockquote { font-size: 1.5rem; }
	.article-listing h2 { font-size: 1rem; }
}

/*

@media all and (max-width: 40rem) {
	
	.entry-content {
		grid-template-columns: 1fr;
	}
	
	.entry-content > * {
		grid-column: 1 / -2;
	}

	blockquote {
		grid-column: 1 / -1 !important;
	}

}*/


.content-grid {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	grid-gap: 1rem;
	margin: 2rem 0;
	padding: 0;
}

.content-grid__3 {
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 3rem;
}

.content-grid__2 {
	grid-template-columns: 1fr 1fr;
}

.content-grid__2 .category-blog {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem;
}

.content-grid img {
	height: 20vh;
    object-fit: cover;
    object-position: center;
    max-width: 100%;
    width: 100%;
    height: auto;
}

.category-blog img {
	height: 15vh;
}

.content-grid h2 {
	width: 100%;
	font-size: 1rem;
}

.content-grid--center {
	text-align: center;
}

@media all and (max-width: 40em) {
	.content-grid {
		grid-template-columns: 1fr 1fr;
	}

	.content-grid__3,
	.content-grid__2 {
		grid-template-columns: 1fr;
	}

	.category-blog img {
	height: 28vh;
	}	
	h1 { font-size: 4rem; }
	.article__img-big { height: 100vh;}

	.entry-content h2, 
.entry-content h3, 
.entry-content h4, 
.entry-content h5, 
.entry-content h6 { 
		width: 100%;
    }
  .post-categories { width:100%;}  
}

.site-footer {
	
	padding: 10vh 0;
}

.menu-footer-nav-container ul {
	margin-left: 0;
	padding-left: 0;
}

.menu-footer-nav-container li {
	margin-left: 0;
	padding-right: 0;
	list-style-type: none;
}
.site-info {
	font-size: 0.8rem;
}

.site-main {
	display: flex;
	flex-direction: column;
}

.mailchimp {
	background-color: #eee;
    display: flex;
    padding: 3rem;
    justify-content: center;
    align-items: center;
}

.submit-your-work {
	background-color: var(--color-5);
	display: none;
	align-items: center;
	justify-content: center;
	padding: 10vmax 0;
	text-align: center;
}

.submit-your-work a, .join-news { font-size: 3rem; font-weight: 300;}

.newsletter {
	background-color: var(--c-links-main);
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	padding: 5vmax 0;
	text-align: center;
}

.newsletter form {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.newsletter input {
	color: white;
	background-color: transparent;
	border: 1px solid white;
	padding: 1rem;
	margin-right: 1rem;
}

input {
	-webkit-appearance: none;
	-moz-appearance: none;
}

.indicates-required {
	font-size: 0.8rem;
	margin-bottom: 2rem;
}

.post-author {
	border: 1px solid var(--color-3);
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 50%;
	margin: 0 auto;
	padding: 2rem;
	margin-bottom: 4rem;
	text-align: center;
}

.post-author img {
	height:10vw;
	width: auto;
	object-fit: cover;
	object-position: center;
}

@media all and (max-width: 40em) {
	.post-author {
		width: 80%;
	}
}

.advert {
	background-color: var(--c-background--ad);
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 2vmax;
	padding-bottom: 3vmax;
	overflow: hidden;
}

.advert__header {
	background-color: black;
}

.advert__in-section img {
	max-width: 100%;
	width: 100%;
	height: auto;
	margin: 1vmax 0;
	padding: 6vmax 2vmax;
}

.advert__in-section { 
	display: grid; 
	grid-column: 1 / -1;
}

.advert__in-section-3 { 
	grid-column: span 3;
}

.advert a { border-bottom: none; }
.advert a:hover { background-color: none;}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.wp-caption-text {
	font-size: 0.8rem;
	margin-top: 0.5rem;
}

figure.alignleft,
figure.alignleft .wp-caption-text,
figure.alignright,
figure.alignright .wp-caption-text,
figure.aligncenter,
figure.aligncenter .wp-caption-text,
figure.aligncnone .wp-caption-text,
.alignleft,
.alignright,
.aligncenter,
.alignnone {
	margin-top: 1rem;

}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
	font-size: 0.7rem;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	/* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

.misha_loadmore {
	font-size: 2rem;
	font-family: var(--font-heading);
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	grid-column: 1 / -1;
	margin: 3rem 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	grid-gap: 0.5rem;
}

.gallery-item {
	padding: 0;
	margin: 0;
}

/*--------------------------------------------------------------
## Responsive Video
--------------------------------------------------------------*/

/*
.responsive-video {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	margin: 3rem 0;
}
.responsive-video iframe,  
.responsive-video object,  
.responsive-video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}*/

.responsive-video {
	  position: relative;
  overflow: hidden;
  width: 100%;
  margin-bottom: 10vh;
}

.responsive-video::after {
  display: block;
  content: "";
  padding-top: 56.25%;
}

.responsive-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
}