﻿@charset "utf-8";

body {font-family: 'Roboto', sans-serif; margin: 0px; padding: 0px; font-size: 16px; font-weight: 300; line-height: 20px; color: black; background: white; text-align: justify; overflow-x: hidden;}
@media (min-width: 550px) {body {font-size: 18px; line-height: 24px;}}
@media (min-width: 990px) {body {font-size: 1.5vw; line-height: 1.7vw;}}
#bgsm {width: 92%; height: auto; padding: 4%; transform-style: preserve-3d; perspective: 50vw; transition: 0.3s;}
@media (min-width: 550px) {#bgsm {width: 94%; padding: 3%; transition: 0.3s;}}

body1 {font-family: 'Roboto', sans-serif; margin: 0px; padding: 0px; font-size: 16px; font-weight: 300; line-height: 20px; color: black; background: white; text-align: justify; overflow-y: hidden;}
@media (min-width: 550px) {body1 {font-size: 18px; line-height: 24px; overflow-y: hidden;}}
@media (min-width: 990px) {body1 {font-size: 1.5vw; line-height: 1.7vw; overflow-y: hidden;}}

#top {position: fixed; top: 0px; left: 0px; width: 100%; height: 50px; color: #df0000; text-align: center;}
@media (min-width: 990px) {#top {top: -53px; height: 100px; text-shadow: #775555 0px 5px 10px; transition: 1s;}}
#top:hover {top: 0px; transition: 0.5s;}

.menu {width: 33.3%; text-align: center; color: #eee; text-shadow: #c55 0px -1px 3px;}
.menu:hover {color: #fff; text-shadow: #fff 0px 0px 7px;}

uncle {display: none;} @media (min-width: 990px) {uncle {display: block;}}
a {text-decoration: none; color: #cc0000; font-weight: 400; transition: 0.3s;} a:hover {color: #df0000; text-decoration: underline;}
b {font-weight: 400;}
i {font-weight: 400; font-style: italic;}
o {font-style: oblique;}

.anons {width: 100%; height: 50vw; object-fit: cover;}
@media (min-width: 990px) {.anons {height: 30vw;}}
img {width: 100%; height: auto;}

h1 {font-size: 8vw; font-weight: 400; line-height: 7vw; margin-top: 0px; text-align: left; color: #df0000; text-shadow: #770000 1px 1px 0px; transition: 0.3s;}
@media (min-width: 550px) {h1 {font-size: 7vw; font-weight: 300; line-height: 7vw; transition: 0.3s;}}
@media (min-width: 990px) {h1 {font-size: 4vw; line-height: 4vw;}}

h2 {font-size: 6vw; font-weight: 400; line-height: 6vw; margin-top: 0px; text-align: left; color: #df0000; text-shadow: #770000 1px 1px 0px; transition: 0.3s;}
@media (min-width: 550px) {h2 {font-size: 5vw; font-weight: 300; line-height: 5vw; transition: 0.3s;}}
@media (min-width: 990px) {h2 {font-size: 2.7vw; line-height: 3vw;}}

h3 {font-size: 5vw; font-weight: 400; line-height: 5vw; margin-top: 0px; text-align: left; color: #df0000; text-shadow: #770000 0px 1px 0px; transition: 0.3s;}
@media (min-width: 550px) {h3 {font-size: 4vw; font-weight: 300; line-height: 4vw; transition: 0.3s;}}
@media (min-width: 990px) {h3 {font-size: 2.3vw; line-height: 3vw;}}

blockquote {margin: 0px;} red {color: #df0000;} orange {color: orange;} yellow {color: yellow;} green {color: green;} blue {color: blue;} violet {color: violet;} white {color: white;}

#co1 {width: 100%; height: auto; margin: 0% 0% 3% 0%; padding: 0px;}
@media (min-width: 990px) {#co1 {width: 57%; margin: 0% 3% 3% 0%; float: left;}}

#co2 {width: 100%; height: auto; margin: 0% 0% 3% 0%; padding: 0px;}
@media (min-width: 990px) {#co2 {width: 40%; float: left;}}

#co3 {width: 100%; height: auto; margin: 0% 0% 3% 0%; padding: 0px;}
@media (min-width: 990px) {#co3 {width: 60%; margin: auto;}}

footer {width: 94%; height: auto; padding: 3%; text-align: center; color: white; font-size: 0.8em; font-weight: 400;}