* {
  box-sizing: border-box;
}

html,body {
    height: 100%;
    min-height: 100%;
    margin: 0;
}


body {
	color: white;
  align-items:center;
  justify-content:center;
  background-image:url("bg-1.jpg");
  background-size:auto;
background-repeat: repeat;
}
a{
	color: white;
	text-decoration: none;
}


#panelbottom {
	padding: 4px;
 background: #000000;
 color: white;
}


#panel_select {
    
	text-align: center;
    
    
}

#panel_pay {
    
    margin-top: 42px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
    padding: 4px;
    background-color: #968452;
    color: yellow;
    font-size: 200%;
    font: bolder Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif" ;
}


.paneltop {
    float: left;
    margin: 0;
    width: 100%;
    padding: 17px;
	text-align: center;
}



.prod {
    float: left;
    width: 50%;
    padding: 7px;
    
}


.prod a:hover img, .prod a:focus img {
        filter:invert();
    }
  




.link {
    float: left;
    width: 100%;
    height: 100%;
    text-align: center;
    font-size: 200%;
    font-weight: bold;
    margin-top: 7px;
    margin-bottom: 17px;
    

}

.link a {
    display: block;
    background-color: #265B0D;
    color: #FFFFFF;
    padding: 20px;
    border-radius: 7px;
}

.link a:hover, .link a:focus {
    background-color: #FFFFFF;
    color: #000000;
}


.close {
    float: left;
    width: 100%;
    height: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 200%;
    margin-bottom: 7px;
}
.close a {
    display: block;
    color: #FFFFFF;
    background-color: #666666;
    padding: 20px;
    border-radius: 7px;
}

.close a:hover {
    background-color: #FFFFFF;
    color: #000000;
}

.btn:hover,
.btn:focus {
  background-color: #968452;
  color: white;
}

.cover { 
    
    margin-top: 36px;
    margin-bottom: 7px;
}
@media only screen and (max-width: 800px) {
  /* For mobile phones: */
  .link, .close, .boxbas, .prod {
    width: 100%;
  }
    
}