/* css reset */ body, h1 { margin: 0; padding: 0; } /**************/ body { background: #f8f8f8; background-image: url(../img/bg.png); color: #444; font-family: helvetica, freesans, clean, sans-serif; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; } a { color: #257DCF; } a:hover { color: white; background: #257DCF; } a, a:hover { text-decoration: none } h1, h2, h3 { font-family: 'Lato', sans-serif; font-weight: normal; color: #444; } .logobox { /* background: rgba(90, 114, 125, .1); */ font-family: 'Lato', sans-serif; margin: 0; padding: 10px; padding-top: 0; } .logobox h1 { padding-top:20px; padding-bottom:20px; line-height: 50px; font-weight: bold; text-shadow: rgb(255, 255, 255) 0 1px 0; font-size:400%; } .logobox a,.logobox2 a { color: #444; text-decoration: none; } .logobox a:hover { color: black; background: rgba(128, 128, 128, .2); } #fortunespre { text-align: right; font-family: 'Architects Daughter', cursive; font-size: 16px; color: #666; } #footer { margin-top: 50px; padding-bottom: 20px; color: #888; text-align: center; clear: both; padding-top: 5px; padding-bottom: 5px; font-size: 10px; border-top: 1px solid #bbb; background: rgba(90, 114, 125, .1); } #botonaco { border-top: 1px solid #fffbeb; background: #c47200; background: -webkit-gradient(linear, left top, left bottom, from(#ffd659), to(#c47200)); background: -webkit-linear-gradient(top, #ffd659, #c47200); background: -moz-linear-gradient(top, #ffd659, #c47200); background: -ms-linear-gradient(top, #ffd659, #c47200); background: -o-linear-gradient(top, #ffd659, #c47200); border-radius: 5px; box-shadow: rgba(0,0,0,1) 0 1px 0; color: #333; font-size: 14px; text-decoration: none; vertical-align: middle; text-align: center; margin-top: 10px; margin-bottom: 20px; height: 35px; padding-top: 20px; cursor: default; } #botonaco:hover { border-top-color: #f27500; background: #f27500; color: #333; } #botonaco:active { border-top-color: #d69d53; } #mlform { padding-top: 10px; text-align: center; border-radius: 5px; background: rgba(90, 114, 125, .1); } #mlform p { font-size: 11px; margin: 0; padding: 0; padding-bottom: 3px; } #mlform input#mail { font-size:150%; height:2em; width:90%; border: 1px solid #257DCF; } #mlform input#mailsubmit { font-size:150%; height:2em; margin-bottom:10px; } .inputlight { color: #888; } .inputstrong { color: #333; } #mlform p a { color: #666; } #photostream h1, #photostream a, #photostream img, #photostream a:hover { margin: 0; padding: 0; } #photostream { width: 210px; float: right; margin-right: 10px; } #photostream h1 { font-family: 'Lato', sans-serif; font-weight: normal; font-size: 16px; border-bottom: 1px solid #ccc; margin-bottom: 2px; text-shadow: rgb(255, 255, 255) 0 1px 0; color: #666; } #photostream a, #photostream a:hover{ border: 0; text-decoration: none; } #photostream a:hover { background: transparent; } #photostream img { margin:0; padding:0; border:0; } #myCarousel .item a, #myCarousel .item a:visited { color:#fff; text-decoration:underline; } #myCarousel .item a:hover { color:black; background:#fff; } #story { background-color: rgba(90, 114, 125, .1);; border-top: 1px solid #bbb; border-bottom: 1px solid #bbb; margin-bottom: 50px; padding-top:10px; } #story .date { text-align:right; color:#444; font-size:50%; } #mainstory { font-size:130%; background: #257DCF; background-image: url(../img/bg.png); color:#eee; font-weight:lighter; line-height:1.4; padding-top:1em; } #mainstory h1 { font-weight:bolder; text-shadow: rgba(0, 0, 0, 0.6) 0px 1px 2px; color:#F5DB51; } #mainstory .date { text-align:right; font-size:50%; color:#ddd; } #mainstory a { color:#F5DB51; } #mainstory strong { color:#F5DB51; font-weight:normal; } #mainstory ul li { line-height:1.4; } #maincontainer ul { margin-left: 0; } #maincontainer li { list-style: none; height: 30px; margin-left:20px; } #maincontainer li i { padding-right:.5em; } /* Large desktop */ @media (min-width: 1200px) { #comictext { font-size:30px; } #mainstory { padding-top:8%; padding-bottom:8%; margin-bottom:1%; } } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 979px) { #comictext { font-size:20px; } #mainstory { padding-top:8%; padding-bottom:8%; margin-bottom:1%; } } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { #comictext { font-size:25px; } #mainstory { padding-top:8%; padding-bottom:8%; margin-bottom:1%; } } /* Landscape phones and down */ @media (max-width: 480px) { #comictext { font-size:15px; } }