* { transition:1s;}
body {/*background-color:lime;*/ margin:0;}
div.container {width:500px; height:100%; position:absolute; left:50%; transform:translateX(-50%); padding:60px 0;}
div.container div.chassis {border:3px solid #555; border-radius:36px; /*border-width:0 4px 0;*/}
div.container div.device {background-color:#FFF; border:24px solid #000; border-radius:32px; border-width:84px 20px; cursor:pointer; width:100%; position:relative; /*transform-origin:0 0;*/ box-sizing:border-box; /*overflow:hidden;*/}

div.container div.device:before, 
div.container div.device:after {content:''; background-color:#444; position:absolute; left:50%; transition:1s;}
div.container div.device:before {top:-42px; transform:translate(-50%,-50%); width:9px; height:9px; border-radius:50%;}
div.container div.device:after {bottom:-48px; transform:translate(-50%,50%); width:40px; height:40px; border-radius:50%; border:2px solid #333; /*box-sizing:border-box;*/}

div.container div.device div.bezelBox {overflow:hidden; border:2px solid #000; background-color:#FFF;}
div.container div.device div.bezel {width:100%; padding-top:133.3333%; /*position:relative;*/ box-sizing:content-box; border:2px solid #000; border-width:0px; transition:1s;}
div.container div.device div.screen {width:100%; height:100%; /*position:absolute; top:0; right:0; bottom:0; left:0;*/ box-sizing:border-box; border-radius:3px; background-color:#FFF; overflow:auto; -webkit-overflow-scrolling:touch; opacity:.5;}
div.container div.device div.screen iframe.content {border:0; width:100%; height:100%; position:absolute; top:0; right:0; bottom:0; left:0; overflow:auto;}

/* Light Theme */
div.container.light div.chassis {border-color:#C0C0C0;}
div.container.light div.device {background-color:#EFEFEF; border-color:#EFEFEF;}
div.container.light div.device:after {background-color:#E4E4E4; border-color:#DEDEDE;}

/* Rotated Theme */
div.container.rotated div.chassis {transform:rotate(-90deg);}
div.container.rotated div.device div.bezel {width:133.3333%; transform:rotate(90deg);}
div.container.rotated div.device div.screen {height:75%; top:152px;}

div.container div.device div.bezel {transition:.5s; transition-delay:.5s;}

#rotateBtn {position:fixed; top:24px; right:24px;}