/*** GENERAL ***/ body { color: #222222; font: 20px/1.3em Palatino,Georgia,serif; background-color: #F1F1F1; margin: 10px; } a, a:hover, a:visited { color: #000; } header { text-align: center; } #main ul#links { padding: 0; list-style-type: none; text-align: center; } #main ul#links li { display: inline; } #main ul#links li a.current { -webkit-border-radius: 2px; border-radius: 2px; background-color: #040707; color: #F1F1F1; } #main, #article { margin: 0 auto; } #links a, .backhome a{ text-decoration: none; padding: 5px 10px; } #links a:hover, .backhome a:hover{ -webkit-border-radius: 2px; border-radius: 2px; background-color: #040707; color: #F1F1F1; } #content { width: 800px; margin: 0 auto; } footer { text-align: right; } /*** ***/ /*** LINKS DISPLAY ***/ #main a.tool { text-decoration: none; cursor: pointer; } input[type=submit].delete { background : url('../img/remove.png') no-repeat center center; width : 16px; height :16px; border : none; color : transparent; cursor: pointer; font-size : 0; } #main #content { margin-top: 20px; } #main .entrie { color: rgb(46, 46, 46); position:relative; background-color: #ffffff; padding: 15px; min-height: 8em; -webkit-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 0px 0px 6px -1px #000; box-shadow: 0px 0px 6px -1px #000; width: 30%; margin: 10px; float: left; } #main .entrie h2 { width: 95%; } #main .entrie h2 a { text-decoration: none; } #main .entrie h2 a:hover { color: #F5BE00; } .tools { position: absolute; top: 20px; right: 20px; width: 30px; text-align: right; } .tools ul { padding: 0; margin: 0; list-style-type: none; } .tools ul li { line-height: 20px; } .tools a.tool { cursor: pointer; } #article .tools { position: relative; display: inline; top: 0px; right: 0px; width: 100%; text-align: left; } #article.tools ul li{ display: inline; } #main .entrie .tools a.tool span, #article .tools a.tool span { display: inline-block; width: 16px; height: 16px; } a.fav span { background: url('../img/star-on.png') no-repeat; } a.fav span:hover { background: url('../img/star-off.png') no-repeat; } a.fav-off span { background: url('../img/star-off.png') no-repeat; } a.fav-off span:hover { background: url('../img/star-on.png') no-repeat; } a.archive span { background: url('../img/checkmark-on.png') no-repeat; } a.archive span:hover { background: url('../img/checkmark-off.png') no-repeat; } a.archive-off span { background: url('../img/checkmark-off.png') no-repeat; } a.archive-off span:hover { background: url('../img/checkmark-on.png') no-repeat; } /*** ***/ /*** ARTICLE PAGE ***/ body.article { color: #222222; font: 20px/1.3em Palatino,Georgia,serif; background-color: #F1F1F1; } #article header { text-align: left; border-bottom: 1px solid #222222; } #article header a { text-decoration: none; } #article article { border-bottom: 1px solid #222222; } .vieworiginal a { color: #888888; text-decoration: none; } .backhome { display: inline; } /*** ***/ #main { max-width: 60em; /* 960 px */ margin: 0 auto; } #content { width: 103.125%; /* 990px */ overflow: hidden; margin-left: -1.562%; /* 15px */ margin-bottom: -1.875em; /* 30px */ } .entrie { width: 30.303%; /* 300px */ float: left; margin: 0 1.515% 1.875em; /* 15px 30px */ } @media only screen and ( max-width: 40em ) /* 640px */ { .entrie { width: 46.876%; /* 305px */ margin-bottom: 0.938em; /* 15px */ } } @media only screen and ( max-width: 20em ) /* 640px */ { #content { width: 100%; margin-left: 0; } .entrie { width: 100%; margin-left: 0; margin-right: 0; } }