html, body { margin:0; padding:0; }
/* Colors
---------------
- cyan-bg: #a8e6fe
- cyan-txt: #c6efff
- drk blue/purple: #283b54
- lt blue/purple: #8197ad
- lime green: #d5ffc8
*/
body { color:#000; font-family:Helvetica Neue, Helvetica, Arial, sans-serif; font-size:100%; background:#a8e6fe url(images/bg-body.png) repeat-x 50% 0; padding-bottom:40px; }
/* Anchor
--------------- */
a { color:#d5ffc8; outline:none; text-decoration: none; }
a:hover { color:#c6efff; text-decoration: underline; }
/* Form
--------------- */
form { margin:0; padding:0; }
input, select, textarea { font-family: inherit; font-size:inherit; }
input.btn { background:#283b54; border:1px solid #c6efff; color:#c6efff; padding:2px; font-weight:normal; line-height:normal; width: 150px; }
input.btn:hover { cursor:pointer; color:#d5ffc8; }
/* Misc
--------------- */
.clear { clear:both; float:none; }
img { border:0; }
img.globe { position: relative; z-index:33; margin-bottom:-158px; }
.error-text { color:#d5ffc8; font-style:italic; font-weight:bold; }
div.hr { background:url(images/wave-sm.png) no-repeat 50% 50%; height:22px; padding:20px 0; clear:both; float:none; }
/* Text
--------------- */
h1 {
color:#c6efff; font-size:180%; font-weight:normal;
}
/* Navigation
--------------- */
ul.navigation {
list-style:none; margin:0; padding:0;
}
/* Structure
--------------- */
#container { background:url(images/bg-container-shadow.png) no-repeat 0 0; width:952px; /* 1012px */ padding:0 30px; margin:0 auto; /* temp min-height:840px; */ }
#utility { color:#fff; font-size:12px; background:#8197ad url(images/bg-utility.png) repeat-x 0 0; width:auto; height:32px; text-align:right; }
#utility ul { margin:0; padding:0; list-style-type:none; display:block; width:auto; height:32px; float:right; }
#utility ul li { float:left; height:32px; display:block; padding:7px 25px 0 25px; }
#utility ul li.divider { background:url(images/nav-utility-divider.png) no-repeat 0 0; }
#utility ul li.input { padding:4px 25px 0 25px; }
#utility a { color:#fff; text-decoration:none; }
#utility a:hover { color:#d5ffc8; text-decoration:none; }
#utility a.active { color:#d5ffc8; text-decoration:none; }
#utility a:hover { color:#fff; text-decoration:none; }
#utility input { color:#666; font-size:11px; padding:2px; border:solid #283b54 1px; height:14px; font-size:inherit; }
#utility input.btn { color:#fff; font-family:Arial, Helvetica, sans-serif; font-size:11px; text-align:left; padding:0 0 0 5px; width:54px; height:20px; border:0; background:#283b54 url(images/btn-sign-up.png) no-repeat right; }
#utility input.btn:hover { color:#d5ffc8; cursor:pointer; }
#content-wrap {
background:#8197ad url(images/bg-content.png) repeat-x 0 0; width:952px; border-bottom:5px #283b54 solid; padding-bottom:20px;
}
#header {
width:auto;
min-height:220px; background:url(images/wave.png) no-repeat 0 0;
}
#header h1.logo { position:absolute; padding:0; margin:15px 0 0 80px; background: url(images/F5-logo.png); width:142px; height:145px; }
#header h1.logo a { display:block; width:142px; height:145px; }
#header h1.logo a span { margin-left:-10000px; /* display:none; visibility:hidden; */ }
#header ul.navigation {
float:right; width:230px; text-align:right;
}
#header ul.navigation li.divider {
background:url(images/nav-main-divider.png) no-repeat 100% 100%; padding-bottom:2px;
}
#header ul.navigation li a { color:#fff; display:block; width:200px; padding:10px 15px; text-decoration:none; }
#header ul.navigation li a.active { color:#d5ffc8; background:url(images/nav-main-active.png) repeat-y 100% 100%; }
#header ul.navigation li a:hover { color:#d5ffc8; background:url(images/nav-main-hover.png) repeat-y 100% 100%; }
#headline { margin:0 12px 12px 12px; background:url(images/headline-bottom.png) no-repeat 0 100%; width:928px; padding-bottom:7px; }
/*
Notes: adjust column heights to adjust for the floating image (i.e. globe)
*/
#headline ol.headline { background:url(images/headline-top.png) no-repeat 100% 0; list-style:none; padding:7px 0 0 0; margin:0; }
#headline ol.headline li { background:#fff; text-align:right; display:block; }
#headline ol.headline li.col-left { height:140px; width:425px; float:left; }
#headline ol.headline li.col-right { height:140px; width:483px; /* 503 */ padding:0 20px 0 0; float:right; color:#999; font-size:78%; }
#headline ol.headline li.col-right h3 { color:#283b54; padding:10px 0 0 0; margin:0; font-size:175%; font-style:normal; }
#headline ol.headline li.col-right p { margin:0 50px 0 0; padding-top:15px; }
#headline ol.headline li.col-right p.findoutmore { background:url(images/headline-arrow-right.png) no-repeat 100% 50%; padding:20px 50px 20px 0; }
#headline ol.headline li.col-right p.findoutmore a { color:#8abf25; font-weight:bold; }
#headline ol.headline li.col-right p.findoutmore a:hover { color:#283b54; }
#content { padding:10px 20px; font-size:90%; color:#fff; }
#content ul.layout-two-column { list-style:none; margin:0; padding:0; }
#content ul.layout-two-column li.col-left { width:635px; padding:0 8px 0 0; float:left; }
#content ul.layout-two-column li.col-right { width:235px; padding:0 0 0 8px; float:left; }
/* Blog Specific
---------------------------- */
h2.pagetitle { color:#c6efff; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; }
div.post h2 a { color:#c6efff; text-decoration:none; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; }
div.post h2 a:hover { color:#d5ffc8; }
div.post h2 { color:#c6efff; margin-bottom:0; padding-bottom:0; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; text-transform: capitalize; }
div.post small { }
div.post h3 a { color:#c6efff; text-decoration:none; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; }
div.post h3 a:hover { color:#d5ffc8; }
div.post h3 { color:#c6efff; margin-bottom:0; padding-bottom:0; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-weight:normal; font-size:130%; }
p.postmetadata { border-top:solid 1px #acc9e5; /* border-bottom:solid 1px #acc9e5; */ font-size:85%; padding:5px 15px; margin:5px 0 15px 0; }
#sidebar { font-size:90%; }
#sidebar a { color:#d5ffc8; }
#sidebar a:hover { color:#a8e6fe; }
#sidebar ul li.widget { list-style:none; }
#sidebar h2.widgettitle { color:#c6efff; margin-bottom:0; padding-bottom:0; font-size:120%; font-family: Helvetica Neue, Helvetica, Arial, sans-serif;; font-weight:normal; }
#sidebar ul li.widget ul { margin-left:14px; padding-left:14px; /*list-style-type:circle;*/ }
#contentblog div.navigation { font-size:88%; }
#contentblog div.entry { background: url(images/pg-bg.png) repeat; padding: 15px; border: 1px solid #a2b4c5; margin: 15px 0 10px 0; }
#sidebar .amazon-app { margin:25px 0 0 auto;width:225px; }
/* Colors
---------------
- cyan-bg: #a8e6fe
- cyan-txt: #c6efff
- drk blue/purple: #283b54
- lt blue/purple: #8197ad
- lime green: #d5ffc8
*/
/* Paper Background */
div.paper-top {
background: url(images/pg-top.png) no-repeat;
width: 635px;
height: 20px;
}
div.paper {
background-color: #496077;
width: 570px;
padding: 15px 25px;
margin: 0 0 15px 0;
border: 1px solid #a2b4c5;
}
div.paper-bottom {
background: url(images/pg-bottom.png) no-repeat;
width: 635px;
height: 20px;
margin-bottom: 25px;
}
div.entry p {
line-height: 20px;
}
div.pin {
width: 72px;
height: 96px;
position: absolute;
margin: -30px 0 0 550px;
background-image: url(images/pin.png);
}
div.pebble {
width: 100px;
height: 86px;
position: absolute;
margin: -30px 0 0 550px;
background-image: url(images/riverpebble.png);
}
div.pclip {
width: 126px;
height: 151px;
position: absolute;
margin: -30px 0 0 550px;
background-image: url(images/pclip.png);
}
/* Floating Share Bar */
#simplysocialcon { position: relative; }
#simplysocialbox { left: 85px; position: absolute; width:90px; text-align: center; }
#simplysocial {position: absolute; top: 80px; background-color:#b1c0d0; width:78px; margin-top:0; margin-left: -184px;border-left:1px solid #5a7c9f; border-right:none; border-top:1px solid #5a7c9f; border-bottom:1px solid #5a7c9f; -moz-border-radius-topleft: 5px; -khtml-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -khtml-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; padding: 4px 0; }
#simplysocial.fixed { position: fixed; top:20px;}
#simplysocial .smedia {margin:7px}
div.spacer {/*background-color:#f3f3f3;*/ height:1px; width:68px; margin:5px auto;}
div.bottom {height:1px; width:35px; margin:15px auto;}