h3 + div
{
 display: table-cell;
 padding-right: 1.5em !important;
 vertical-align: top;
 border-top-right-radius: 0px !important;
}
h3 + div + div
{
 display: table-cell;
 vertical-align: top;
 border-top-right-radius: 0.5em;
}
@media(max-width: 660px)
{
 h3 + div
 {
  display: block;
  border-top-right-radius: 0.5em !important;
  margin-bottom: 1em;
 }
 h3 + div + div
 {
  display: block;
  text-align: center;
  border-top-right-radius: 0px;
 }
}
.slideBox
{
 height: 200px;
 width: 320px;
 display: inline-block;
 text-align: right;
 overflow: hidden;
 font-size: 16px;
}
.slideBox > span
{
 display: none;
}
.imgBox
{
 width: 1600px;
 height: 200px;
 clear: both;
 position: relative;
 transition: left 2s;
 animation: 30s autoslide infinite; 
}
@keyframes autoslide
{
 0% { left: 0%; }
 20% { left: 0%; }
 25% { left: -100%; }
 45% { left: -100%; }
 50% { left: -200%; }
 70% { left: -200%; }
 75% { left: -300%; }
 95% { left: -300%; }
 100% { left: -400%; }
}
.imgBox img
{
 width: 320px;
 height: 200px;
}
.slideImg
{
 float: left;
 margin: 0px;
 padding: 0px;
 position: relative;
}
#ssImg1:target ~ .imgBox
{
 left: 0px;
 animation: none;
}
#ssImg2:target ~ .imgBox
{
 left: -100%;
 animation: none;
}
#ssImg3:target ~ .imgBox
{
 left: -200%;
 animation: none;
}
#ssImg4:target ~ .imgBox
{
 left: -300%;
 animation: none;
}
#cmdImg1
{
 animation: 30s autobutton1 infinite; 
}
@keyframes autobutton1
{
 0% { background-color: #0060DD; }
 20% { background-color: #0060DD; }
 25% { background-color: #222222; }
 95% { background-color: #222222; }
 100% { background-color: #0060DD; }
}
#cmdImg2
{
 animation: 30s autobutton2 infinite; 
}
@keyframes autobutton2
{
 0% { background-color: #222222; }
 20% { background-color: #222222; }
 25% { background-color: #0060DD; }
 45% { background-color: #0060DD; }
 50% { background-color: #222222; }
 100% { background-color: #222222; }
}
#cmdImg3
{
 animation: 30s autobutton3 infinite; 
}
@keyframes autobutton3
{
 0% { background-color: #222222; }
 45% { background-color: #222222; }
 50% { background-color: #0060DD; }
 70% { background-color: #0060DD; }
 75% { background-color: #222222; }
 100% { background-color: #222222; }
}
#cmdImg4
{
 animation: 30s autobutton4 infinite; 
}
@keyframes autobutton4
{
 0% { background-color: #202020; }
 70% { background-color: #202020; }
 75% { background-color: #0060DD; }
 95% { background-color: #0060DD; }
 100% { background-color: #202020; }
}
.slideBox > span:target ~ .cmdBox .cmdSlide
{
 animation: none !important;
}
#ssImg1:target ~ .cmdBox #cmdImg1
{
 background-color: #0060DD;
}
#ssImg2:target ~ .cmdBox #cmdImg2
{
 background-color: #0060DD;
}
#ssImg3:target ~ .cmdBox #cmdImg3
{
 background-color: #0060DD;
}
#ssImg4:target ~ .cmdBox #cmdImg4
{
 background-color: #0060DD;
}
.cmdBox
{
 position: relative;
 top: -20px;
 right: 0px;
 display: inline-block;
 padding: 0px 5px;
 background-color: rgba(255, 255, 255, 0.4);
 border-radius: 6px;
 cursor: default;
}
.cmdSlide
{
 display: inline-block;
 height: 8px;
 width: 8px;
 border-radius: 4px;
 background-color: #000000;
 border: 1px solid #000000;
 outline: none;
}
.cmdSlide:hover, .cmdSlide:focus
{
 background-color: #0080FF !important;
}
.cmdSlideAnim
{
 text-shadow: 2px 0px 0px #000000, -1px -2px 0px #000000, -1px 2px 0px #000000;
 display: inline-block;
 height: 10px;
 width: 10px;
 font-size: 10.5pt;
 text-decoration: none;
 color: #00D000;
 outline: none;
 margin-right: 0.5em;
}
.slideBox > span:target ~ .cmdBox .cmdSlideAnim
{
 color: #007000;
}
.cmdSlideAnim:hover, .cmdSlideAnim:focus
{
 color: #FFFFFF !important;
 text-decoration: none;
}