@font-face {
    font-family: 'Basiic pixel';
    src: url('/css/fonts/basiic-font.ttf') format('truetype');
}
@font-face {
  font-family: 'Darumadrop One';
  font-style: NORMAL;
  src: url('/css/fonts/Darumadrop_One/DarumadropOne-Regular.ttf') format('truetype');
}
@font-face {
  font-family: 'Gaegu';
  font-style: normal;
  font-weight: REGULAR;
  src: url('/css/fonts/Gaegu/Gaegu-Regular.ttf') format('truetype');
  
}
/*--------------------------------------------- GENERAL FROR ALL  ---------------------------------------------*/
h1{ 
    font-family: 'Gaegu'; 
    font-size: 48px;
    margin-bottom: 0px;
    margin-top: 0px;
}
h2 {
    font-family: "Darumadrop One"
}
h3{ 
    font-family: 'Gaegu';
    font-size: 1.75rem;
}
p{ 
    font-family: 'Basiic pixel';
    font-size: 1.25rem;
}

body {
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
}
main {
    margin-top: 0px;
}
/*-------------------- BUTTON NO STYLING  --------------------*/
button, input[type="submit"], input[type="reset"] {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer; /* maybe style later w custom hehe*/
	outline: inherit;
}
/*-------------------- BUTTON STYLING  --------------------*/
button.close-button {
    grid-area: search;
    display: flex;
    height: 48px;
    width: 48px;
    margin-top: 16px;
    margin-left: 16px;
    aspect-ratio: 1/1;
    overflow: hidden;
}
button.close-button img{
    width:100%;
    height:100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}
button.close-button img:hover {
    transform: scale(1.10);
}
/*--------------------------------- BACKGROUND IMAGES  ---------------------------------*/
.page-Not-Found { 
    background-image: url("/images/pics/404-background.jpg");  /* ../ is to out of one directory into another *add dash for absolute path, start at root directory*/
    background-repeat: no-repeat;
    background-color:#383032; /* need to change this color*/
    background-position: center;
    background-attachment: fixed;
    background-size: cover; 
    margin: 0px;
}
.page-contactForm {
    background-image: url("/images/pics/contactForm-background.webp");  /* ../ is to out of one directory into another *add dash for absolute path, start at root directory*/
    background-repeat: no-repeat;
    background-color:#383032; /* need to change this color*/
    background-position: center;
    background-attachment: fixed;
    background-size: cover; 
    margin: 0px;
}
/*---------------------- Contact Form page but not iframes -------------------------*/
.page-contactForm div.form-intro-wrapper{
    margin-left: 18%;
    margin-right: 18%;
}
.page-contactForm h3{
    color: #cf2a76;
    font-family: Darumadrop One;
    font-size: 3.2rem;

    margin-top: 4%;
    margin-left: 18%;
    margin-bottom: 1rem;
}
.page-contactForm p{
    color: #ac446d;
}