#w { display: block; max-width: 99%; min-width: 300px; margin: 0 auto; padding: 2px 3px; } #w-title { width:48%; float:left; text-align:left; font-weight:bold; font-size:22px; padding:20px 8px; } #w-more { width:48%; float:left; text-align:right; font-size:17px; padding:20px 8px; } .crsl-items { display: block; margin-top:20px; } .crsl-title { font-size: 18px; font-weight:bold; text-align: center; width: 100%; margin-bottom:10px; height: 40px; } .crsl-comment { height: 135px; } .crsl-item { background: #FBFBFB; color: #777777; border: 1px solid #cdcdcd; padding: 14px; font-family: "Open Sans",sans-serif; } .crsl-item .crsl-thumbnail { display: block; position: relative; margin-bottom: 10px; } .crsl-item .crsl-thumbnail img { display: block; width:140px; margin:auto; } .crsl-item .crsl-thumbnail:hover img { opacity: 0.8; } .crsl-item h3 { font-size: 1.95em; line-height: 1.25em; margin-bottom: 12px; } .crsl-item h3 a { text-decoration: none; color: #333; } .crsl-item h3 a:hover { text-decoration: underline; } .crsl-item .crsl-date { display: block; position: absolute; bottom: 0; right: 0; padding: 6px; } .crsl-item .crsl-name { display: block; position: absolute; bottom: 0; left: 0; padding: 6px; font-weight:bold; } .crsl-item p { font-size: 1.2em; line-height: 1.55em; margin-bottom: 5px; } #crsl-nav { margin:20px auto; } .slidernav { display: block; text-align: center; margin-bottom: 5px; } .slidernav a { display: inline-block; padding: 5px 8px; margin-right: 8px; font-size: 1.4em; background: #fff; color: #666; text-decoration: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 2px 2px 0px rgba(0,0,0,0.2); -moz-box-shadow: 2px 2px 0px rgba(0,0,0,0.2); box-shadow: 2px 2px 0px rgba(0,0,0,0.2); } .slidernav a:active { -webkit-box-shadow: 1px 1px 0 rgba(0,0,0,0.2); -moz-box-shadow: 1px 1px 0 rgba(0,0,0,0.2); box-shadow: 1px 1px 0 rgba(0,0,0,0.2); } @media screen and (max-width: 660px) { h1 { font-size: 2.4em; line-height: 1.2em; } .crsl-item h3 { font-size: 1.65em; } }