@import url('https://fonts.googleapis.com/css?family=Tangerine|Amethysta');

body {
 background-color: #ffffff;
 background: url('');
 background-repeat: no-repeat;
 background-size: cover;
 background-position: center center;
 background-attachment: fixed;
 display: flex;
 justify-content: center;
 align-items: center;
 text-align: justify;
 color: #000000;
 font-family: "Amethysta", serif;
 font-size: 12px;
 margin: 0 auto;
}

.layout {
 width: 1024px;
 margin-top: 0px;
 background-color: #ffffff;
 align-content: center;
 justify-content: center;
}

.main {
 grid-area: main;
 max-width: 600px;
 align-content: center;
 justify-content: center;
 background-color: #ffffff;
 font-family: "Amethysta", serif;
 font-size: 12px;
 text-align: justify;
 color: #000000;
 font-weight: none;
 margin: -40px auto;
}

.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24
}

blockquote {
 margin-left: 50px;
 margin-right: 50px;
 padding: 10px;
 text-align: justify;
 background-color: #dee1cf;
 border-radius: 10px;
 box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

a img {
 border: none;
 border-width: 0;
 outline: none;
}

h1 {
 font-family: "Tangerine", serif;
 margin-bottom: 1px;
 line-height: 20px;
 text-align: left;
 font-size: 30px;
 font-weight: bold;
 color: #8d9351;
 text-shadow: #c0c0c0 1px 0 10px;
 letter-spacing: 0px;
}

h2 {
 font-family: "Courier New", serif;
 border-top: 1px dotted #000000;
 text-align: justify;
 text-transform: uppercase;
 font-weight: normal;
 letter-spacing: 0px;
 line-height: 10px;
 font-size: 8px;
}

:root {
  --mainColor: #ececec;
}

a, a:link {
 color: #000000;
 text-decoration: none;
 background-position-y: -0%;
 background-image: linear-gradient(white 50%, #b1b6b8 50%);
 transition: background 500ms ease;
 background-size: 2px;
 background-size: auto 175%;
}

a:hover {
 background-position-y: 100%;
}

b {
 color: #995656;
}

i {
 border-bottom: 1px #995656 solid;
}

p.error, p.success {
 font-weight: bold;
 padding: 10px;
 border: 1px solid;}

p.error {
 background: #ffc0c0;
 color: #900;}

p.success {
 background: #b3ff69;
 color: #4fa000;}
 
form {
 margin: 0 auto;
 width: 300px;
 border-radius: 5px;
 display: grid;}
 
form input, form textarea, form select {
 font-family: "Georgia", serif;
 letter-spacing: 1px;
 color: #000;
 background: none;
 padding: 6px;
 margin: 5px 0px 10px 0px;
 border: 1px solid #8d9351;
 background-color: #eeeeee;
 border-radius: 5px;
 position: center;}
 
input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
select, textarea {
 display: block;
 border-radius: 5px;
 box-sizing: border-box;
 width: 100%;
 padding: 6px;}
 
input[type="submit"],
input[type="reset"] {
 background-color: #8d9351;
 width: 100px;
 gap: 10px;
 margin: 0px auto;
 border: none;
 border-radius: 5px;
 font-weight: bold;
 font-size: 18px;
 font-family: "Courier New", Courier, monospace;
 color: white;
 margin-top: 0px;
 padding: 5px;
 text-align: center;
 cursor: pointer;}
 
input[type="submit"]:hover,
input[type="reset"]:hover {
 background-color: #995656;}