.mainInfoPanel .header{
    float:left;
    width:100%;
    font-size:22pt;
    font-family: OpenSans,arial;
    padding-bottom:10px;
}
.mainInfoPanel .caption{
    float:left;
    width:100%;
    font-size:11pt;
    font-family: Helvetica,arial;
    color:#666;
}

.demoPanel .header{
    float:left;
    width:100%;
    font-size:12pt;
    font-family: OpenSans,arial;
    padding-bottom:10px;
}

.indexFeatures .header{
    float:left;
    width:100%;
    font-size:15pt;
    font-family: arial;
    /*font-weight: bold;*/
    color:#666;
    color: #216496;
    color:#555;
    margin-top:10px;
}
.indexFeatures .caption{
    float:left;
    width:100%;
    font-size:11pt;
    font-family: arial;
    color:#666;
    padding-bottom:10px;
}

.pageDot{
    float:left;
    width:13px;
    height:13px;
    background-color: #DDD;

    border-radius: 10px;
}
.pageDot.selected{
    background-color: #8AACB9;
}
.power-on{
    background-color:#cae689;
    color:rgba(255,255,255,.9)
}
.resume-power-on{
    background-color:#bcd1ed;
    color:rgba(255,255,255,.9)
}
.power-off{
    background-color:inherit;
    color:rgba(180,180,180,.9)
}

.left-panel{
    min-width:290px;
}
.right-panel{
    width:66.664%;
}
.full-view{
    display:block;
}
.info-block{
    min-width:290px;
    padding-top:30px;
}
.small-view{
    display:none;
}
.tvButton{
    cursor: pointer;
    border-radius: 20px; height:20px; width:20px;
    border:1px solid rgb(200,200,200);
}
.tvPanel{
    border-radius: 3px; 
    border:1px solid rgba(50,50,50,.2);
    background-color: rgba(150,150,150,.1);
}
.tvScreen{
    box-shadow: inset 0px 0px 1px rgba(50,50,50,.3);
    border-radius: 3px; 
    border:1px solid rgb(200,200,200); 
    height:100%; 
    background-color: #b2b2b2;
}
@media screen and (max-width: 925px) {
    .full-view{
	display:none;
    }
    .left-panel{
	padding:30px;
    }
    .indexFeatures{
	padding-left:30px;
	padding-right:30px;
    }
    .right-panel{
	width:100%;
    }
    .small-view{
	display:block;
    }
}

.shake{
    /* Start the shake animation and make the animation last for 0.5 seconds */
    animation: shake 0.5s;

    /* When the animation is finished, start again */
    animation-iteration-count: infinite;
}
@keyframes shake {
    0% {
	transform: translate(1px, 1px) rotate(0deg);
    }
    10% {
	transform: translate(-1px, -2px) rotate(-1deg);
    }
    20% {
	transform: translate(-3px, 0px) rotate(1deg);
    }
    30% {
	transform: translate(3px, 2px) rotate(0deg);
    }
    40% {
	transform: translate(1px, -1px) rotate(1deg);
    }
    50% {
	transform: translate(-1px, 2px) rotate(-1deg);
    }
    60% {
	transform: translate(-3px, 1px) rotate(0deg);
    }
    70% {
	transform: translate(3px, 1px) rotate(-1deg);
    }
    80% {
	transform: translate(-1px, -1px) rotate(1deg);
    }
    90% {
	transform: translate(1px, 2px) rotate(0deg);
    }
    100% {
	transform: translate(1px, -2px) rotate(-1deg);
    }
}