@import url('fonts/stylesheet.css');

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.marginProperties {
    margin-left: 8rem;
    margin-right: 8rem;
}

.sectionSpacing {
    padding-top: 10rem;
    padding-bottom: 10rem;
}

.sectionSpacing-2 {
    padding-top: 15rem;
    padding-bottom: 15rem;
}

.btn:hover {
    text-decoration: none;
}

.notoLight {
    font-family: 'Source Han Sans KR', sans-serif;
    font-weight: 200;
    font-style: normal;
}

.notoNormal {
    font-family: 'Source Han Sans KR', sans-serif;
    font-weight: 300;
    font-style: normal;
}

.notoRegular {
    font-family: 'Source Han Sans KR', sans-serif;
    font-weight: 400;
    font-style: normal;
}

.notoMedium {
    font-family: 'Source Han Sans KR', sans-serif;
    font-weight: 500;
    font-style: normal;
}

.notoBold {
    font-family: 'Source Han Sans KR', sans-serif;
    font-weight: 700;
    font-style: normal;
}

.siaffRegular {
    font-family: 'SIAFF Regular';
    font-weight: normal;
    font-style: normal;
    font-display: swap;    
}

.siaffRounded {
    font-family: 'SIAFF Rounded';
    font-weight: normal;
    font-style: normal;
    font-display: swap;    
}

.siaffOblique {
    font-family: 'SIAFF Oblique';
    font-weight: normal;
    font-style: normal;
    font-display: swap;    
}

:focus-visible {
  outline: 3px solid #FF0000;
  outline-offset: 4px;
  border-radius: 4px;
}

::selection {
    background: #e22626;
    color: white;
}

/* Base styles */
body {
    width: auto;
    font-family: 'Source Han Sans KR', sans-serif;
    font-weight: 400;
    font-size: 1rem;
    color: black;
    background-color: #ffffff;
    overflow-x: hidden;

    -webkit-font-smoothing: none; /* For WebKit browsers (Chrome, Safari) */
    -moz-osx-font-smoothing: grayscale; /* For Firefox on macOS */

   zoom: 80%;
}

/* Reset some default styles */
body, h1, h2, h3, h4, h5, p, ul, ol, figure {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

blockquote, em {
  margin: 0;
  padding: 0;
  font-style: normal; /* removes italic */
  border: none;       /* removes any default border */
  background: none;   /* removes any default background */
}

::-webkit-scrollbar {
 background-color: #000000;
 width: 12px;
}

::-webkit-scrollbar-thumb {
 background-color: #6a6d73;
 border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
 background-color: #4a4c51;
}

@media (max-width: 1024px) {

.marginProperties {
    margin-left: 4rem;
    margin-right: 4rem;
}

.sectionSpacing {
    padding-top: 7.5rem;
    padding-bottom: 7.5rem;
}

.sectionSpacing-2 {
    padding-top: 7.5rem;
    padding-bottom: 7.5rem;
}    

}

@media (max-width: 768px) {

.marginProperties {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
}

.sectionSpacing {
    padding-top: 7.5rem;
    padding-bottom: 7.5rem;
}

.sectionSpacing-2 {
    padding-top: 10rem;
    padding-bottom: 10rem;
}    

}

@media (max-width: 426px) {

.marginProperties {
    margin-left: .5rem;
    margin-right: .5rem;
}

.sectionSpacing {
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.sectionSpacing-2 {
    padding-top: 8rem;
    padding-bottom: 8rem;
}    

}