/* --- Buttons --- */
       button, .button, .to-top {
       display: inline-block;
       min-width: 250px;
       padding: 10px;
       margin-bottom: 10%;
       border-radius:10px;
	   -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
       text-align:center;
	   font-size:20px;
	   font-weight:bold;
	   cursor: pointer;
	   transition: opacity 1s;
	   color: var(--main-color);
	   background: var(--second-color);
	   border: var(--second-color);
	   box-shadow: 0 0 2px rgb(215,215,215);
	   -webkit-box-shadow: 0 0 2px rgb(215,215,215);
	   -moz-box-shadow: 0 0 2px rgb(215,215,215);
       }

       button:hover, .button:hover {
       opacity: 0.75;
       box-shadow: 0 0 10px rgb(215,215,215);
	   -webkit-box-shadow: 0 0 10px rgb(215,215,215);
	   -moz-box-shadow: 0 0 10px rgb(215,215,215);
	   text-decoration: none;
       }

       /* --- Fixed Button --- */

       #fixed-button {
       /*
       visibility: hidden;
       transform: translate(60px, 60px);
       */

       transition: visibility 2s, width 2s, height 2s, transform 1.5s;
       opacity: 0.65;
       color: black;
       position: fixed;
       bottom: 30px;
       right: 30px;
	   z-index: 1;
	   color: white;
	   background: var(--second-color);
	   padding-top: 10px;
	   transition: all 0.5s;
       }
       #fixed-button:hover {
       opacity: 1;
       text-decoration: none;
       box-shadow: 0 0 5px rgb(215,215,215);
	   -webkit-box-shadow: 0 0 5px rgb(215,215,215);
	   -moz-box-shadow: 0 0 5px rgb(215,215,215);
       }
       #fixed-button:after {
       content: "\f0de";
       font-size: 32px;
       font-family: FontAwesome;
       font-weight: normal;
       font-style: normal;
       text-align: center;
       margin: 0;
       padding: 0;
       text-decoration:none;
       }

       /* --- Cards --- */
       .card-container {
       width: 100%;
       height: 100%;
       display: grid;
       grid-template-columns: 33% 33% 33%;
       }

       .card {
       display: block;
       width: auto;
       height: auto;
       text-align: center;
       float: left;
	   min-height:150px;
	   margin: 1%;
       padding: 10px;
	   border: 1px solid gray;
       border-radius: 15px;
       -webkit-border-radius: 15px;
       -moz-border-radius: 15px;
       background:rgb(255,255,255);
	   transition: transform 3s;
	   }

       .card:hover {
       box-shadow: 0px 3px 8px 2px rgb(215,215,215);
       -webkit-box-shadow: 0px 3px 8px 2px rgb(215,215,215);
       }

       .card .div {
       background: white;
       color: black;
       border: none;
       display: block;
       width: 100%;
       height: auto;
       margin: 0;
       padding: 2px;
       text-align: center;
       }

       .card .picture_container {
       height: 220px;
       overflow: hidden;
       }

       .card .description {
       min-height: 150px;
       }

       /* --- Search Bar --- */

       .search-box {
       padding: 10px;
       padding-top: 7px;
       border: 1px solid #ddd;
       border-radius: 10px;
	   -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
       border-color: rgb(215,215,215);
       height: 50px;
       }

       .search-box:hover {
       box-shadow: 0 0 5px rgb(215,215,215);
	   -webkit-box-shadow: 0 0 5px rgb(215,215,215);
	   -moz-box-shadow: 0 0 5px rgb(215,215,215);
       }

       .input {
       font-size: 16px;
       float: left;
       border: none;
       outline: none;
       margin-top: 4px;
       width: 200px;
       transition: all 0.5s;
       background: none;
       }
       /*.search-box #myInput:active {
       outline: none;
       box-shadow: 0 0 5px rgb(215,215,215);
	   -webkit-box-shadow: 0 0 5px rgb(215,215,215);
	   -moz-box-shadow: 0 0 5px rgb(215,215,215);
       }*/


       .search-box:hover > .input {
       width: 200px;
       }



       .round-button {
       background: var(--main-color);
       min-width: 0;
       width: 35px;
       height: 35px;
       border-radius:50%;
	   -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
       display: flex;
       justify-content: center;
       align-items: center;
       float: right;
       outline: none;
       padding: 0;
       margin-bottom: 4px;
       transition: all 0.5s;
       }
       .round-button:hover {
       text-decoration: none;
       opacity: 0.75;
       box-shadow: none;
       -webkit-box-shadow: none;
       -moz-box-shadow: none;
       }
       .round-button i {
       font-size: 11px;
       color: white;
       }