* {
padding : 0;
margin : 0;
}
html {
background : url(/ffhg.jpg) center center no-repeat fixed;
font-size : 100%;
background-size : cover;
scroll-behavior : smooth;
}
body {
text-align : center;
}
.container {
background : #EFEFEF;
box-shadow : 0 0 40px #000000;
border-bottom-left-radius : 30px;
border-bottom-right-radius : 30px;
border-top-left-radius : 30px;
border-top-right-radius : 30px;
margin : 0 auto;
padding : 0.6rem;
max-width : 600px;
}
.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: white;
   color: black;
   text-align: center;
}
p {
font : 1.1rem/1.2 Verdana, Georgia, Sans Serif;
margin : 0 0 30px 0;
text-indent : 0;
text-align : justify;
}

pcenter {
font : 1.1rem/1.2 Verdana, Georgia, Sans Serif;
margin : 0 0 30px 0;
text-indent : 0;
text-align : center;
}

psmall {
text-align : center;
}
h2 {
font : 2.2rem/1.5 Verdana, Georgia, Serif;
margin : 0 0 0 0;
text-indent : 0;
text-align : center;
}

h3 {
font : 1.8rem/1.5 Verdana, Georgia, Serif;
margin : 0 0 0 0;
text-indent : 0;
text-align : center;
}

h4 {
font : 1.2rem/1.3 Verdana, Georgia, Serif;
margin : 0 0 0 0;
text-indent : 0;
text-align : center;
}

h6 {
font : 1.1rem Verdana, Georgia, Sans Serif;
margin : 0 0 30px 0;
text-indent : 0;
font-weight : normal;
text-align : center;
}


hr{

border: 0;
width: 100%;
height: 3px;
background-color: grey;
}


.container * {
padding : 0.1rem;
}
a:link, a:visited, a:active, a:hover {
text-decoration : none;
font-size : 1.2rem;
font-weight : normal;
color : #000000;
}
a:active, a:hover {
color : #333335;
text-decoration : underline;
}
a.text:link, a.text:visited {
font-size : 1.1rem;
text-decoration : underline;
font-weight : normal;
color : #000000;
}
a.text:active, a.text:hover {
color : #333335;
text-decoration : none;
}

a.headline:link, a.headline:visited {
text-decoration : underline;
}
a.headline:active, a.headline:hover {
text-decoration : none;
}


a.commend:link, a.commend:visited {
font-size : 0.8rem;
text-decoration : underline;
font-weight : normal;
color : #000000;
}
a.commend:active, a.commend:hover {
color : #333335;
text-decoration : none;
}




a.story:link, a.story:visited {
font-size : 1.0rem;
text-decoration : none;
text-align : center;
font-weight : normal;
color : #000000;
}
a.story:active, a.story:hover {
color : #333335;
text-decoration : underline;
}




a.nav:link, a.nav:visited {
font : 1.2rem Verdana, Georgia, Sans Serif;
text-decoration : none;
font-weight : normal;
color : #000000;
}
a.nav:active, a.nav:hover {
color : #333335;
text-decoration : none;
}
.flex {
display : flex;
justify-content : center;
align-items : center;
}
img.round {
margin : 0 5px 5px 0;
box-shadow : 0 0 20px black;
border-bottom-left-radius : 30px;
border-bottom-right-radius : 30px;
border-top-left-radius : 30px;
border-top-right-radius : 30px;
transition: transform 0.8s;
-moz-transition: transform 0.8s;
-webkit-transition: transform 0.8s;
-o-transition: transform 0.8s;
-ms-transition: transform 0.8s;
}

img.round:hover {
cursor: zoom-in;
cursor: -moz-zoom-in;
cursor: -webkit-zoom-in;
transform: scale(1.4, 1.4);
-moz-transform: scale(1.2, 1.2);
-webkit-transform: scale(1.4, 1.4);
-o-transform: scale(1.4, 1.4);
-ms-transform: scale(1.4,1.4);
 }


video {
margin : 0 5px 5px 0;
box-shadow : 0 0 20px black;
border-bottom-left-radius : 30px;
border-bottom-right-radius : 30px;
border-top-left-radius : 30px;
border-top-right-radius : 30px;
}


nav {
box-sizing : border-box;
float : left;
width : 100%;
font-size : 1.6rem;
}
nav ul {
margin : 0;
padding : 0;
}
nav a {
display : block;
color : #fff;
text-decoration : none;
}
nav ul li {
position : relative;
float : left;
list-style : none;
}
nav ul li a {
padding : 10px;
}
nav ul ul {
position : absolute;
top : -9999px;
left : -9999px;
background : #FFFFFF;
box-shadow : 0 0 20px black;
border-bottom-left-radius : 30px;
border-bottom-right-radius : 30px;
border-top-left-radius : 30px;
border-top-right-radius : 30px;
}
nav ul ul li {
float : none;
width : 300px;
}
nav ul ul li a {
padding : 10px 20px;
}
nav ul li:hover > ul {
top : 100%;
left : 0;
}
nav ul ul li:hover > ul {
top : 0;
left : 200px;
}
nav ul li.submenu > a:after {
position : relative;
float : right;
content : '';
margin-left : 10px;
margin-top : 5px;
}
nav ul ul li.submenu a:after {
margin-left : auto;
margin-right : -10px;
border-left : 5px solid #fff;
border-right : 5px solid transparent;
border-top : 5px solid transparent;
border-bottom : 5px solid transparent;
}
nav ul ul li:last-child {
border-bottom : none;
}
.header {
background : #808080;
}
.nav-main {
background : #808080;
text-align : center;
}
.main {
background : #808080;
}
.footer {
background : #808080;
color : black;
font-size : 1.20em;
font-size : 1.20rem;
text-align : center;
}
@media screen and (min-width: 800px) {
body {
margin : 0.8rem;
}
.content {
display : flex;
}
}