* {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
html,body {margin: 0; padding: 0;}
body {font-family: Tahoma, sans-serif; background: #fffcfd url(decoration/worldly.jpg);}
div,td {font-size: 15px; color: #372415;}
a:link, a:visited {color: #333; text-decoration: underline;}
a:hover {color: #000;}
h1 {padding: 2px 0; font: normal 20px "Verdana"; color: #a52c55; margin: 0; text-transform: uppercase;}
#loading-layer {display: none; width: 180px; height: 40px; background: #fff; text-align: center; border: 1px solid #eeeeef;}
.worldly {max-width: 1200px; min-width: 1080px; margin: 0 auto; background: #fff; box-shadow: 0 0 20px rgba(165,44,85,0.55);}
.trustingly {height: 260px; background: url(decoration/swan.jpg) no-repeat top right;}
.singer {position: relative; background: #fff;}
.flyer {width: 320px; position: absolute; top: 0; left: 0;}
.flier {width: 160px; float: left; padding: 10px 0 0 4px;}
.songwriter {padding: 10px 8px; text-align: justify; line-height: 17px; margin: 0 0 0 320px;}
.songster {height: 96px; background: url(decoration/songster.jpg);}
#warbler {float: left; padding: 40px 0 0 15px;}
#ros {float: right; width: 94px; height: 94px; margin: 0 15px 0 0; opacity: .6; background: url(decoration/ros.png) no-repeat;}
.manner {font-weight: bold; text-shadow: 1px 1px #f4f3df; padding: 3px 0 3px 18px; margin: 12px 0 5px 0; background: rgba(0,0,0,0.1);}
#ratline {font: bold 15px "Tahoma"; padding: 0 0 7px 0; background-color: #fff2f6; background: linear-gradient(to bottom, #ffd9e4, #fff); border: 1px solid #ffa3be; border-radius: 10px; margin-bottom: 5px;}
#ratline1 {font: bold 15px "Tahoma"; padding: 0 0 7px 0; background-color: #f8ffe8; background: linear-gradient(to bottom, #efffc8, #fff); border: 1px solid #c5e072; border-radius: 10px; margin-bottom: 5px;}
#ratline a, #ratline1 a {text-decoration: none; display: block; padding: 1px 0 1px 18px;}
#ratline a:link, #ratline a:visited {color: #821c3a;}
#ratline a:hover {color: #a83657;}
#ratline1 a:link, #ratline1 a:visited {color: #5a6b15;}
#ratline1 a:hover {color: #6e821c;}
#caper {margin: 10px 0; display: table; font-size: 16px; font-weight: bold;}
#caper span, #caper a, #caper .invent {display: inline-block; margin: 0 6px 6px 0; padding: 4px 8px; line-height: 20px;}
#caper span {background: #91212e; color: #fff; border: 1px solid #631019;}
#caper a {border: 1px solid #d7e8c2;}
#caper .invent {padding: 8px 0 0 0; font-weight: normal;}
#song {font-size: 16px; border: 1px solid #d7e8c2; padding: 5px 7px; margin: 0 0 11px 0; clear: both;}
.catch {position: relative; padding: 12px 0; clear: both; text-align: center;}
.grasp {width:728px; height:90px;}
.skin {width:336px; height:280px;}
.letter {display: inline-block; margin: 0 auto;}
@media screen and (max-width: 640px) {
.worldly {width: 100%; max-width: none; min-width: 0; box-shadow: none;}
.trustingly {height: 120px; background: none; position: relative; top: -35px;}
.great {position: relative; left: -22px;}
.great img {width: 260px; height: auto;}
.singer {top: -27px;}
.flyer {position: relative; top: auto; right: auto; width: 240px; margin: 0 auto; letter-spacing: -1px;}
.flier {width: 120px; float: left; padding: 0 2px;}
.manner {padding: 3px 0 3px 2px;}
#ratline a, #ratline1 a {padding: 1px 0 1px 4px; margin-top:3px; margin-bottom:3px;}
.songwriter {padding: 17px 3px 7px 5px; text-align: left; margin: 0;}
#caper span, #caper a, #caper .invent {margin-right:9px;}
#warbler {float: none; padding: 0; text-align: center;}
#ros {visibility: hidden; display: none;}
.grasp {width:234px; height:60px;}
.skin {width:200px; height:200px;}
.gra {visibility: hidden; display: none;}
}