
h1{
    text-align: center;
    padding-bottom: 20px;
}

#cam{
    margin-top:20px;
}


.controls a, .discs a{
    margin: 5px;
    cursor: pointer;
    display: inline-block;
    background: white;
    color: black;
    padding: 5px 5px;
}
#holder #colorDisc{
    margin: 10px;
}

div.inputclass{
    margin-top: 10px;
    margin-bottom: 10px;
}

#colorDisc{
    display: inline-block;
    -webkit-transition-property: -webkit-transform;
    -webkit-animation-duration: 1s;
    -moz-transition-property: -moz-transform;
}
#colorDisc.active {
    -webkit-animation-name: rotate; 
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;

    -moz-animation-name: rotate; 
    -moz-animation-duration: 1s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
}
#colorDisc.paused{
    -webkit-animation-play-state:paused;
    -moz-animation-play-state:paused;
    -o-animation-play-state:paused; 
    animation-play-state:paused;
}
@-webkit-keyframes rotate {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes rotate {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

.introjs-helperNumberLayer{
    width:25px !important;
    height:25px !important;
}
  
