
* {
  padding: 0px; margin:0px;
  box-sizing:border-box;
	}

html, body{
scroll-behavior: smooth;
}

  body {
    font-size: 1.0em; font-family: Arial, Helvetica, sans-serif;
    background-color: rgb(180, 209, 230);
    max-width: 60em; margin: auto;
}




/*  #kathedralenstart{ 
background: url('homekathedralen.svg') no-repeat;
width: 100%;
background-size: cover;
background-color: rgb(180, 209, 230);
}
*/

	

img {
  max-width: 100%;
  height: auto;
}


.zentr {
    font-size: 1.0em; font-weight: lighter; font-family: Arial, Helvetica, sans-serif;
    margin: 0px auto; max-width: 60em;
}


/***************************************************************/
#logo { margin: 0.5em 0em 0.5em .7em;
font-size: 1.2em; font-weight: bold; color: white;
text-shadow: black -2px 3px 4px;
}

h1 { font-size: 2em; font-weight: normal; text-align: center}
h2 { font-weight: normal; font-size: 1.5em; text-align: center;
margin-bottom: .5em;}
h3 { font-size: 1.2em; text-align: left;
margin-bottom: .5em;}

h4 { font-size: 1.0em; font-weight: normal; text-align: center;
margin: 0 .5em 1.0em .5em;}

a { display: block; /* macht bildchen bei hover button-füllend */
 color: white; text-decoration: none}

p { margin: 0em 0em 1.0em 0;}

ul {
  list-style-type:square;
  /* list-style-position: outside = regel; inside=nur 1. Zeile eingerückt */
}

li{
  margin: .6em 1em;
}

.haupt{ /* Zurück-button auf Unterseiten */
  text-align: center;
  max-width: 100%;
  font-size: 1.1em;
  margin: 10px 0px;
	padding: 10px 3px;
  background: blue;
              }

 /*************nach oben knopf *********************/

                .totop {
                  font-size: 2.2em;
                   position: fixed;
                   bottom: 30px;
                   right: 15px;
                   transition: background-color .3s;
                   z-index: 1000;

                 }

                 .totop a {
                   padding: 0 .2em;
                   color: yellow;
                   border-left: 1px solid white;
                   border-right: 1px solid white;
                 }

                .totop a:hover {
                  color: red;
                }

                .totop a:active {
                  color: red;
                }
                .totop a:focus{
                  color: gray;
                }

  /****************************/

#info { /* info Button */
text-align: center;  line-height: 80px;
font-size: 1.0em; font-family: Arial, Helvetica, sans-serif;
width:120px; height:80px;
margin: 15px 5px;
border-radius: 2px;
background: rgb(100,100,100);
background: rgba(100,100,100,0.5);
/* box-shadow:-4px 4px 8px #333333, inset -1px 0px 1px white; */
}
#info a:hover{
  color: red;
  background-color: blue;
}

.buttkath{ text-align: center; line-height:80px;
  font-size: 1.0em; font-family: Arial, Helvetica, sans-serif;
  width:120px; height:80px;
  margin: 15px 5px;
  border-radius: 2px;
  background: rgb(0, 160, 250);
  background: rgba(0, 160, 250, 0.6);
}
.buttkath a:hover  {
  color: red;
  background-color: blue;
}

.kasten {
  background-color: rgb(240,240,240);
  margin: 1.5em 0;
  padding: 1em 3em ; /* ob unt - re li */
  box-shadow: -2px 5px 9px gray; /* links, unten, verlauf */
}


table, th, td {
  padding: .4em .7em;
  border-collapse: collapse;
}
