


/* = = = = = = = = = = = = = = = = = datei menue.css = = = = = = = = = = = = = = = = = = = = = = = = = */



/* ############################################################ */
/* diese datei enthält das hauptmenü - hier sind es die buttons */
/* ############################################################ */


.btn ul {width:30rem;
padding:0;
margin:0 auto;
}

.btn  li {list-style-type : none;
padding:0 .3rem ;
margin:0;
border:0;
}

.btn a {display:table-cell;
width:26rem;
background:dodgerblue;
background-image:linear-gradient(to top,rgba(0, 0, 0, 0.3) 50%,rgba(0, 0, 0, 0.1) 50%);
color:#fff;
box-shadow: 0px 0px  2px #fff ;
padding:.5rem 0rem;
text-decoration:none;
}

.btn  a:hover {
color: #fff;
background:dodgerblue;
}

.btn li:before {display:table-cell;box-shadow: 0px 0px  2px #fff ;
font-size:2rem;
width:4rem;
padding:.5rem 0rem;
text-align:center;
font-family:'Font Awesome 5 Free';/* - 'Font Awesome 5 Free' for Regular and Solid symbols;
                                     - 'Font Awesome 5 Brand' for Brands symbols. */
font-weight:900; /* - 400 for Regular and Brands symbols;
                    - 900 for Solid symbols. */
content:"\f005";
color:#fff;
background:dodgerblue;
text-shadow:0 0 1px black;
}

.btn li:hover:nth-child(n):before {
ANIMATION:pop-up .4s linear;
background:#FFFFFF;
color:dodgerblue;
text-shadow:none;
content:"\f105";
}


.btn li:nth-child(1):before {
content:"\f7ce";
}

.btn li:nth-child(2):before {
content:"\f7d0";
}

.btn li:nth-child(3):before {
content:"\f2dc";
}

.btn li:nth-child(4):before {
content:"\f7ad";
}

.btn li:nth-child(5):before {
content:"\f7b5";
}

.btn li:nth-child(6):before {
content:"\f7d2";
}


/* ############################################################ */
/* M E D I A   Q U E R I E S - RESPONSIVE-BILDSCHIRMABFRAGEN */
/* ############################################################ */


/* ==================================== ab 1024 pixel ================================== */

@media (min-width: 1024px) {

.btn ul {width:80rem; }
.btn li {display:inline-block; }

}