/*
 Theme Name:   BlankSlate Child
 Theme URI:    https://opencollective.com/blankslate
 Description:  Custom child theme for BlankSlate.
 Author:       Chi
 Template:     blankslate
 Version:      1.0.0
 Text Domain:  blankslate-child
*/

/* Add your custom CSS below this line */
@import url('https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800');
@import url('https://solrainha.github.io/honeybee/honeybee.css');
@font-face {
  font-family: 'Tormenta';
  src: url('./fonts/guerraArtoniana/Tormenta.ttf') format('truetype'); 
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SourceHanSerif';
  src: url('./fonts/dpWiki/SourceHanSerif_ja.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

* {scrollbar-width: none !important; -ms-overflow-style: none !important;}
*::-webkit-scrollbar, .header, header, footer {display: none !important;}

:root {
	--h1Size: 3.05rem;
	--h2Size: 2.441rem;
	--h3Size: 1.953rem;
	--h4Size: 1.563rem;
	--h5Size: 1.25rem;
	--h6Size: 1rem;
	--pSize: 0.8rem;

	font-size: 1rem;
}

body {
	background-color: rgb(55, 55, 55, 1);
	color: rgb(255, 255, 255, 1);
	line-height: 1.5;
}

body, main, article {min-height: 100vh !important}

em {
	font-style: italic
}
strong {
	font-weight: bold;
}
figcaption {
	font-size: 0.9rem;
    color: white !important;
}

h1, h2, h3, h4, h5, h6 {
	margin-top: 0.5rem !important;
	margin-bottom: 0.5rem !important;
}
h1 {font-size: var(--h1Size);}
h2 {font-size: var(--h2Size);}
h3 {font-size: var(--h3Size);}
h4 {font-size: var(--h4Size);}
h5 {font-size: var(--h5Size);}
h6 {font-size: var(--h6Size);}

.overlay {
	width: 100%;
    height: 100%;
    background: rgb(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
	user-select: none;
	pointer-events: none;
}

@media screen and (max-width: 960px) {
  .flex-row, 
  .flex-container {
    flex-direction: column;
    align-items: center;
  }
  .grid-row,
  .grid-container {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .column,
  .col,
  .half-width,
  .third-width {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
  }
  img, 
  video, 
  iframe {
    max-width: 100%;
    height: auto;
  }
  .container,
  section,
  main {
    padding-left: 1rem;
    padding-right: 1rem;
    overflow-x: hidden;
  }
  
  .hide-on-mobile {display: none;}
  .show-on-mobile {display: block;}
}