X-Git-Url: https://source.tree.se/git?p=treecutter.git;a=blobdiff_plain;f=style%2Ffreggies%2Fcss%2Fstyles.css;fp=style%2Ffreggies%2Fcss%2Fstyles.css;h=34eb8d82e0391dc89399714617d9dfc81deb07af;hp=0000000000000000000000000000000000000000;hb=9149a28b48cb3568c1c5a00bf1ab3e2256dcc9f9;hpb=a3334b05017e85d3f4fc33ab0109ff4d5ec4b4d8 diff --git a/style/freggies/css/styles.css b/style/freggies/css/styles.css new file mode 100644 index 0000000..34eb8d8 --- /dev/null +++ b/style/freggies/css/styles.css @@ -0,0 +1,317 @@ +/* Created by http://freehtml5templates.com */ +/* reset */ +* { +margin: 0; +padding: 0; +} + +/* render html5 elements as block */ +header, footer, section, aside, nav, article { +display: block; +} + +body { +line-height: 1; +background: #eee; +font-family: Verdana, Arial, Helvetica, sans-serif; +color: #000; +font-size: 14px; +line-height: 18px; +} + +/* layout */ + +#wrapper { +width: 940px; +margin: 0 auto; +margin-top: 5px; +margin-bottom: 5px; +-webkit-box-shadow: 3px 3px 7px #777; +-moz-box-shadow: 3px 3px 7px #777; +border-left: 1px #777 solid; +} + +nav { +width: 940px; +height: 50px; +margin: 0 auto; +background: #110E0F; +} + +header { +width: 940px; +height: 200px; +margin: 0 auto; +background: #fff url(images/headerimg.jpg) no-repeat left top; +} + +#main { +width: 940px; +margin: 0 auto; +padding-top: 30px; +background: #FFF; +overflow: hidden; +} + +#content { +float: left; +width: 640px; +margin-left: 30px; +padding-right: 20px; +border-right: 1px #ddd solid; +} + +#sidebar { +float: right; +padding-left: 20px; +width: 220px; +} + +footer { +width: 940px; +margin: 0 auto; +clear: both; +} + +/* basics */ + +h1,h2,h3,h4,h5,h6 { +font-weight: bold; +clear: both; +color: #808080; +} + +a:link, a:visited { +color:#597b00; +} + +a:hover, a:active { +color: #333; +} + +hr { +background-color: #E7E7E7; +border: 0; +height: 1px; +margin-bottom: 18px; +clear: both; +} + +p { +margin-bottom: 18px; +} + +li { +padding-left: 5px; +} + +/* nav */ + +nav .menu { +font-size: 16px; +font-weight: bold; +} + +nav .menu ul { +margin: 0; +padding: 17px 0 0 20px; +list-style: none; +line-height: normal; +} + +nav .menu li { +display: block; +float: left; +} + +nav .menu a { +display: block; +float: left; +margin-right: 5px; +padding: 0px 15px; +text-decoration: none; +color: #FFF; +} + +nav .menu a:hover { +border-top: #FFF 1px solid; +border-bottom: #FFF 1px solid; +} + +/** HEADER */ + +header h1, #header h2 { +margin: 0; +padding: 0 0 0 30px; +line-height: normal; +} + +header h1 { +float: left; +padding-top: 20px; +font-size: 48px; +} + +header h1 a:link, header h1 a:visited { +text-decoration: none; +color: #FFF; +} + +header h1 a:hover { +color: #ddd; +} + +header h2 { +padding: 20px 0 0 30px; +font-style: italic; +font-size: 14px; +color: #FFFFFF; +} + +/** ARTICLES **/ +article img { +border: none; +-webkit-box-shadow: 3px 3px 7px #777; +-moz-box-shadow: 3px 3px 7px #777; +} + +#content p, ul, ol, hr { +margin-bottom: 24px; +} + +#content ul ul, ol ol, ul ol, ol ul { +margin-bottom: 0; +} + +#content h1, h2, h3, h4, h5, h6 { +color: #808080; +margin: 0 0 20px 0; +line-height: 1.5em; +} + +#content h2, h2, h3 { +text-shadow: 0px 2px 3px #ddd; +} + +.alignleft, img.alignleft { +display: inline; +float: left; +margin-right: 24px; +margin-top: 4px; +} + +.alignright, img.alignright { +display: inline; +float: right; +margin-left: 24px; +margin-top: 4px; +} + +.aligncenter, img.aligncenter { +clear: both; +display: block; +margin-left: auto; +margin-right: auto; +} + +img.alignleft, img.alignright, img.aligncenter { +margin-bottom: 12px; +} + +/* sidebar and footer widget blocks */ + +aside h3 { +font-size: 18px; +text-shadow: 0px 2px 3px #ddd; +} + +aside ul { +list-style: none; +margin-bottom: 20px; +margin-top: -15px; +} + +aside li a { +text-decoration: none; +} + +#sidebar li a:hover { +border-top: #333 1px solid; +border-bottom: #333 1px solid; +} + +#footer-area { +background: #597b00; +color: #FFF; +font-size: 90%; +padding: 18px 0; +overflow: hidden; +} + +.footer-segment { +float: left; +margin-right: 20px; +margin-left: 20px; +width: 190px; +} + +footer aside h4 { +color: #FFF; +font-size: 16px; +line-height: 1.5em; +} + +footer a:link, footer a:visited { +color: #FFF; +} + +footer a:hover { +text-decoration: underline; +} + +.footerbottom { +width: 940px; +background: #000; +} + +.footerbottom p { +color: #fff; +font-size: 10px; +text-align: right; +padding-right: 20px; +} + +/* inline blocks of images and captions */ + +.benefits { + display: inline-block; + vertical-align: top; + width: 120px; + text-align: center; + background: #ddd; + border: 6px solid #808080; +/* curved border radius */ + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + margin: 2.3em; + padding: .2em; +} + +.benefits .thumbnail { + width: 64px; + border: none; +} + +.benefits .caption { + display: block; +} + +.benefitsheading { +display: block; +color: #597b00; +font-size: 16px; +font-style: italic; +border-bottom: 1px #333 dotted; +} + +