@import url(http://fonts.googleapis.com/css?family=Raleway:800);*{box-sizing:border-box}html{height:100%;background:#eee;position:relative;overflow:hidden}body{position:absolute;left:20%;top:20%;width:60%;height:60%;background:#666;margin:0;padding:100px 0 15px;border-radius:25px;cursor:default;-webkit-user-select:none}h1{position:absolute;left:0;top:0;margin:0;width:100%;text-align:center;height:65px;padding-top:15px;font-size:36px;font-family:'Raleway',sans-serif;-webkit-transform:translateZ(0);color:white;cursor:default}p{color:white;position:absolute;top:60px;left:0;font-family:sans-serif;font-size:12px;width:100%;padding:0 15px;margin:0;text-align:center}body>div{box-sizing:content-box;height:100%;position:relative}#left,#right{position:absolute;top:0;width:50%;height:100%}#left{left:0;padding:30px 40px 0 15px}#right{left:50%;padding:30px 15px 0 40px}.header{position:absolute;top:0;color:white;width:100%;padding-right:55px}#left .header{left:15px}#right .header{left:40px}h2{margin:0;background:#333;height:30px;border-top-left-radius:10px;border-top-right-radius:10px}h3{margin:0;position:absolute;right:55px;top:0}h2,h3{font-size:15px;padding:5px;font-family:'Raleway',sans-serif;-webkit-transform:translateZ(0)}textarea{width:100%;height:100%;border:0;padding:20px;border-bottom-left-radius:10px;border-bottom-right-radius:10px;font-size:14px;font-family:sans-serif;-webkit-transform:translateZ(0);margin:0;outline:0;background:#f0f0f0;resize:none}textarea:focus{background:#fff}#go,#og{border:0;outline:0;padding:0;margin:0 0 0 -40px;position:absolute;left:50%;width:80px;height:50%;background:transparent;color:#ccc;font-size:48px;font-family:sans-serif;-webkit-transform:translateZ(0);z-index:2}#go:hover,#og:hover{color:#fff;cursor:pointer}#go:active,#og:active{color:#aaa}.ud{display:none;font-size:20px;font-weight:bold}#go{top:0}#og{top:50%}@media only screen and (max-width:900px){body{left:0;width:100%}}@media only screen and (max-width:550px){body{left:0;top:0;width:100%;height:100%;border-radius:0;padding-top:120px;padding-left:15px;padding-right:15px}h1{left:0;top:0}#left,#right{position:relative;padding-left:0;padding-right:0;width:100%;height:50%;left:0}#left{padding-bottom:20px}#right{padding-top:50px}#left .header,#right .header{left:0;padding:0}#right .header{top:20px}h3{right:0}#go,#og{width:50%;height:40px;margin:-20px 0 0 0;top:50%}#go{left:0}#og{left:50%}.lr{display:none}.ud{display:block}}@media only screen and (max-width:550px) and (max-height:400px){body{padding-top:15px}h1,p{display:none}}@media only screen and (max-height:400px) and (min-width:551px){body{height:100%;top:0}}@media only screen and (max-height:250px) and (min-width:551px){body{padding-top:15px}h1,p{display:none}}@media only screen and (max-height:150px) and (min-width:551px){.header{display:none}#left,#right{padding-top:0}textarea{border-radius:10px}#go,#og{font-size:36px}}@media only screen and (max-height:50px) and (min-width:551px){body{height:115px;top:50%;margin-top:-58px}body>div{display:none}}