body {
background:;
}
#canvas{
 height:100%;
 width:100%;
 position:absolute;
 left:0;
 top:0;
 z-index:-1;
 opacity:;
 background:red;
 }
#container{

height:;
width:100%;
margin:0 auto;
border:;
}
.swing {
animation: swing ease-in-out 1s infinite alternate;
transform-origin: center -20px;
box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
}
#panner{
height:160px;
width:100%;
border-radius:8px;
display:block;
margin:0 auto;
}
.swing{
height:160px;
width:90%;
border: 5px solid orange;
margin:0 auto;
border-radius:8px;
}
 
@keyframes swing {
    0% { transform: rotate(2deg); }
    100% { transform: rotate(-2deg); }
}


#menu-box{
position:relative;
height:280px;
width:88%;
border:;
display:flex;
justify-content:center;
align-items:center;
margin:0 auto;
margin-top:12px;;
}
.selector {
position: absolute;
width: 100px;
height: 100px;
background:;
}

.selector,
.selector button {
font-family:serif;
font-weight: bold;
color: #333;
     
}
.href-link{

text-decoration:none;
color:blue;
}
.selector button {
position: relative;
width: 100%;
height: 100%;
background: yellow;
border-radius: 50%;
border: none;
text-decoration:none;
color: blue;
font-size: 15px;
cursor: pointer;
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1);
transition: all .1s;
}

.selector button:hover { background: pink; }

.selector button:focus { outline: none; }

.selector ul {
position: absolute;
list-style: none;
padding: 0;
margin: 0;
top: -12px;
right: -12px;
bottom: -12px;
left: -12px;
}

.selector li {
position: absolute;
width: 0;
height: 100%;
margin: 0 50%;
-webkit-transform: rotate(-360deg);
transition: all 0.8s ease-in-out;
}

.selector li input {
 display: none; 
 }

.selector li input + label {
position: absolute;
bottom: 100%;
width: 0;
height: 0;
background: #fff;
border-radius: 50%;
text-align: center;
font-size: .5px;
overflow: hidden;
cursor: pointer;
box-shadow: none;
transition: all 0.8s ease-in-out, color 0.1s, background 0.1s;
}

.selector li input + label:hover { background: #f0f0f0; }

.selector li input:checked + label {
background: #5cb85c;
color: white;
}

.selector li input:checked + label:hover { background: #449d44; }

.selector.open li input + label {
width: 70px;
height: 70px;
line-height: 70px;
margin-left: -40px;
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1);
font-size: 12px;
font-weight:bold;
font-family:serif;
text-align:center;
background:yellow;
color:blue;
}
#countdown-box{
height:80px;
width:85%;
background:;
border-radius:8px;

}
.countdown {
  text-align: center;
  font-size: 20px;
  margin-top: 0px;
  text-transform:uppercas;
  font-weight:bold;
  font-family:serif;
  color:white;
  margin-top:10px;
}
