body { background: #004756; } /* Gridster styles */ .demo { margin: 3em 0; padding: 7.5em 0 5.5em; background: #004756; } .demo:hover .gridster { opacity: 1; } .gridster, .content, .gridster2 { /* width: 940px; margin: 0 auto; */ opacity: .8; -webkit-transition: opacity .6s; -moz-transition: opacity .6s; -o-transition: opacity .6s; -ms-transition: opacity .6s; transition: opacity .6s; } .content { color: white; } .gridster .gs-w, .gridster2 .gs-w { background: #FFFFFF; cursor: pointer; -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.3); box-shadow: 0 0 5px rgba(0,0,0,0.3); } .gridster .player, .gridster2 .player { -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.3); box-shadow: 3px 3px 5px rgba(0,0,0,0.3); } .gridster .gs-w.try, .gridster2 .gs-w.try { background-image: url(../img/sprite.png); background-repeat: no-repeat; background-position: 37px -169px; } .gridster .preview-holder, .gridster2 .preview-holder { border: none!important; border-radius: 0!important; background: rgba(255,255,255,.2)!important; } li { list-style: none; font-weight: bold } .gridster-box { position: relative; width: 100%; height: 100%; }