html, body {
background: url(../images/bg.gif) repeat-x;
background-color: #d1d1d9;
margin: 0;
padding: 0;
text-align: left;
z-index: 0;
overflow-x: hidden;
}
/* Common Functions ================ */
.clear { clear: both; }
.trans { border: 0; }
.image-left { display: block; clear: left; float: left; }
.image-right { display: block; clear: right; float: right; }
/* Wrappers ======================== */
#wrapper {
display: block;
position: relative;
top: 0;
left: 50%;
margin-left: -475px;
width: 950px;
}
/* Header ------------------------------------------------- */
#header {
display: block;
width: 950px;
height: 149px;
}
a#logo {
display: block;
float: left;
width: 300px;
height: 90px;
background: url(../images/logo.gif) no-repeat;
margin-bottom: 8px;
text-indent: -9999px;
background-position: 0px 0px;
overflow: hidden;
}
a#logo:hover {
background-position: 0px -90px;
}
#checkout {
width: 336px;
height: 42px;
background: url(../images/checkout.gif) no-repeat;
float: right;
padding-left: 44px;
padding-top: 15px;
}
#nav {
display: block;
clear: both;
width: 950px;
height: 51px;
background: url(../images/nav.gif) no-repeat;
position: relative;
z-index: 100;
}
.nav-home {
background: url(../images/nav-home.gif) no-repeat !important;
}
a.nav-1, a.nav-2 {
display: block;
float: left;
font-size: 11px;
font-family: arial,sans-serif;
font-weight: bold;
text-decoration: none;
padding-left: 20px !important;
padding-right: 20px !important;
width: auto;
height: 31px;
background: url(../images/nav-bar.gif) no-repeat;
background-position: 100% 0%;
padding-top: 10px !important;
margin-top: 9px;
}
a.nav-2 {
padding-right: 33px !important;
background: url(../images/nav-expand.gif) no-repeat;
background-position: 100% 0%;
}
a.nav-1:hover, a.nav-2:hover {
color: #6a97d4 !important;
}
form#search {
width: 160px;
height: 30px;
display: block;
float: left;
}
form#search input.submit {
display: block;
float: left;
width: 30px;
height: 30px;
background: url(../images/submit.gif) no-repeat;
border: 0px;
}
form#search input.submit:hover {
background-position: 0px -30px;
cursor: pointer;
}
form#search input.text {
display: block;
float: left;
width: 107px;
padding-bottom: 8px;
background: url(../images/input.gif) no-repeat;
border: 0;
font-size: 11px;
font-family: arial,sans-serif;
padding-right: 20px;
padding-top: 8px;
padding-left: 3px;
}
a.checkout {
display: inline-block;
margin-left: 6px !important;;
width: 115px;
outline: 0;
background: url(../images/view-cart.gif) no-repeat;
height: 32px;
margin-top: 0px;
overflow: hidden;
text-indent: -9999px;
float: left;
}
a.checkout:hover {
background-position: 0px -32px;
}
/* Mid Header - Homepage */
#mid-home {
height: 240px;
width: 932px;
background: url(../images/mid-home-bg.gif) no-repeat;
padding-top: 18px;
padding-left: 18px;
}
#mid-home #frame {
width: 888px;
height: 211px;
background: url(../images/home-frame.gif) no-repeat;
padding: 10px 17px 20px 15px;
overflow: hidden;
}
#frame #slide {
width: 888px;
height: 211px;
position: relative;
margin-top: 10px;
margin-left: 15px;
}
#frame .erca { background: url(../images/slide-erca.gif) no-repeat; }
#frame .climbing { background: url(../images/slide-climbing.gif) no-repeat; }
#frame .scrambling { background: url(../images/slide-scrambling.gif) no-repeat; }
#frame .caving { background: url(../images/slide-caving.gif) no-repeat; }
#frame .walking { background: url(../images/slide-walking.gif) no-repeat; }
#frame .climbing-wall-award { background: url(../images/slide-cwa.gif) no-repeat; }
#frame .view-adventure, #frame .view-courses, #frame .view-courses-alt {
display: block;
width: 143px;
height: 21px;
background: url(../images/view-adventure.gif) no-repeat;
text-indent: -9999px;
position: relative;
top: 147px;
left: 102px;
overflow: hidden;
}
#frame .view-courses {
width: 120px;
height: 20px;
background: url(../images/view-erca.gif) no-repeat;
left: 174px;
}
#frame .view-courses-alt {
width: 120px;
height: 20px;
background: url(../images/view-erca.gif) no-repeat;
left: 124px;
}
#frame .view-adventure:hover, #frame .view-courses:hover {
top: 148px;
}
#frame .view-video {
display: block;
width: 227px;
height: 32px;
background: url(../images/view-video.gif) no-repeat;
position: relative;
left: 616px;
top: 93px;
font-size: 12px;
color: #717171;
text-shadow: 0px 1px #fff;
padding-top: 41px;
padding-left: 21px;
}
#frame .view-video:hover {
text-decoration: none;
}
/* Mid Header ------------------------------------- */
#mid {
display: block;
width: 950px;
height: 280px;
background: url(../images/mid-bg.gif) no-repeat;
}
#mid a {
color: #dcebfe;
}
#mid a:hover {
color: #b7d5fb;
}
#backpack {
position: absolute;
z-index: 5;
left: 435px;;
top: 187px;
width: 359px;
height: 253px;
background: url(../images/backpack.png) no-repeat;
}
#shuffle {
position: absolute;
z-index: 3;
left: 580px;
top: 149px;
overflow: hidden !important;
width: 358px;
height: 223px;
}
#shuffle img {
width: 358px !important;
height: 223px !important;
}
#mid-1, #mid-2 {
position: absolute;
left: 72px;
top: 287px;
width: 150px;
height: 55px;
font-family: arial,sans-serif;
font-size: 11px;
color: #fff;
line-height: 19px;
}
#mid-2 {
left: 295px;
width: 180px;
}
/* Contact Page --------------------------------- */
.contactform-left, .contactform-right {
display: block;
float: left;
width: 305px;
}
.product-services {
width: auto !important;
}
.contactform-right {
padding-left: 14px !important;
border-left: 1px solid #bcbcc4;
margin-left: 10px;
}
.contactform-right p {
padding-bottom: 10px;
margin-bottom: 15px;
}
.contactform-left {
padding-right: 4px;
padding-left: 6px;
}
.contactform-left p {
display: block;
clear: both;
padding-bottom: 20px !important;
}
.contactform-left label {
-moz-border-radius-bottomleft: 4px;
-moz-border-radius-topleft: 4px;
background-color: #38383E;
color: #fff;
display: inline-block;
float: left;
font-size: 11px;
height: 18px;
margin-right: 2px;
padding: 5px 3px 3px 7px;
width: 93px;
}
.contactform-left input.text, .contactform-left textarea {
display: inline-block;
float: left;
width: 183px;
background: url(../images/checkout-input.gif) repeat-x;
background-position: 0% 100%;
background-color: #fff;
border: 1px solid #b8b8c2;
padding: 5px;
margin: 0;
margin-bottom: 2px;
color: #2b2b2b;
font-size: 11px;
}
.product-services input.text, .product-services textarea { width: 480px !important; }
.product-services label { margin-right: 8px; }
.product-services textarea { height: 150px; }
.product-services .contact-mailing, .product-services button { margin-left: 105px; }
.contactform-left textarea {
height: 80px;
}
span.contact-mailing {
display: inline-block;
float: left;
padding-top: 8px !important;
font-size: 11px;
color: #201f24;
padding-left: 6px;
}
.contactform-left button {
display: block;
clear: both;
cursor: pointer;
position: relative;
top: 8px;
left: -3px;
border: 0;
padding: 0;
background: none !important;
}
.contactform-right h4, .contactform-left h4 {
font-size: 18px;
color: #201f24;
display: block;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px solid #bcbcc4;
letter-spacing: -1px;
font-family: lucida sans,arial,sans-serif;
}
.contactform-right h4.free {
border-bottom: 0px !important;
}
.contactform-right .underline {
display: block;
height: 0px !important;
border-bottom: 1px solid #bcbcc4;
margin-top: -5px;
margin-bottom: 15px;
}
.contactform-right h5 {
font-size: 24px;
color: #2c578f;
font-family: lucida sans,arial,sans-serif;
margin-bottom: 4px;
display: block;
letter-spacing: -1px;
}
.contactform-right p, .contactform-left p {
font-size: 12px;
color: #2f2f2f;
margin-bottom: 15px !important;
line-height: 18px;
}
.contactform-left em {
color: #df4242;
font-style: normal;
}
/* Home Page ------------------------------------ */
#adventure-grid .adventure {
width: 265px;
height: 130px;
background: url(../images/adventure-grid.gif) no-repeat;
float: left;
position: relative;
padding: 14px 16px 14px 14px;
overflow: hidden;
text-align: right;
margin-right: 15px;
margin-bottom: 15px;
}
.adventure-last {
margin-right: 0px !important;
}
#adventure-grid .adventure img {
width: 265px;
height: 130px;
border: 0;
position: relative;
}
#adventure-grid .adventure a {
display: inline-block;
position: relative;
top: -30px;
right: 12px;
font-size: 11px;
color: #fff;
text-decoration: underline;
}
#adventure-grid .adventure a:hover {
color: #fff;
text-decoration: none;
}
/* Content -------------------------------------- */
#content {
display: block;
width: 950px;
height: auto;
}
#copy {
display: block;
float: left;
width: 674px;
padding-top: 20px;
background: url(../images/copy.gif) no-repeat;
padding-bottom: 25px !important;
}
.copy-home {
background: none !important;
}
/* Templates -------------------------------------------- */
.page-intro, #default {
display: block;
margin-left: 15px;
border-bottom: 1px solid #e2e2e9;
width: 629px;
}
.default-home {
margin-left: 25px !important;
width: 610px !important;
padding: 0px 10px 0px 0px !important;
}
#default {
border-bottom: 0;
}
.page-intro h1, #default h1 {
display: block;
font-size: 21px;
clear: both;
font-family: lucida sans,arial,sans-serif;
color: #46444f;
letter-spacing: -2px;
padding-bottom: 10px;
margin-bottom: 15px;
border-bottom: 1px solid #e2e2e9;
}
.page-intro p, #default p {
line-height: 20px;
display: block;
color: #595959;
font-size: 12px;
font-family: arial,sans-serif;
text-align: justify;
margin-bottom: 15px;
}
#default p {
padding-left: 5px;
padding-right: 5px;
}
#default blockquote {
display: block;
clear: right;
width: 250px;
text-align: justify;
float: right;
padding-left: 15px;
margin-left: 15px;
border-left: 8px solid #9aa3b9;
color: #4b5365;
line-height: 20px;
font-size: 12px;
font-style: oblique;
margin-bottom: 10px;
}
#default ul {
display: block;
padding-left: 50px;
margin-bottom: 15px;
padding-right: 50px;
border-top: 1px dotted #b5b5bc;
border-bottom: 1px dotted #b5b5bc;
padding-top: 20px;
padding-bottom: 5px;
}
#default li {
margin-bottom: 15px;
font-size: 12px;
color: #454444;
background: url(../images/bullet.gif) no-repeat;
padding-left: 17px;
background-position: 0px 3px;
line-height: 18px;
text-align: justify;
}
#default li em {
font-style: oblique;
}
#default li strong {
font-weight: bold;
color: #264979;
}
#default a {
color: #3b6297;
font-weight: bold;
text-decoration: none;
}
#default a:hover {
color: #2f4d77;
}
.level {
display: block;
clear: both;
border-top: 1px solid #c6c6ce;
border-bottom: 1px solid #e2e2e9;
padding-top: 20px;
width: 629px;
margin-left: 15px;
}
.level p {
display: block;
width: 629px;
font-size: 12px;
line-height: 21px;
color: #262626;
margin-bottom: 15px;
text-align: justify;
}
.level p img {
display: block;
clear: left;
padding: 5px;
margin-right: 15px;
background-color: #dfdfe7;
border: 1px solid #ccccd3;
float: left;
padding: 10px 10px 20px 10px;
border: 1px solid #BFBFBF;
background-color: white;
-webkit-box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
-moz-box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
-webkit-transform: rotate(-1deg);
-moz-transform: rotate(-1deg);
transform: rotate(-1deg);
}
.level h1, #default h2 {
display: block;
width: 612px;
height: 41px;
background: url(../images/h2.png) no-repeat;
padding-top: 11px;
padding-left: 17px;
color: #fff;
font-size: 16px;
text-transform: uppercase;
letter-spacing: 2px;
font-family: lucida sans,arial,sans-serif;
font-variant: small-caps;
margin-bottom: 15px !important;
}
#default h2 {
width: 612px;
background: url(../images/h2.png) no-repeat;
margin-left: 0;
margin-bottom: 5px !important;
}
.level h1 strong {
color: #8fb5ea;
font-weight: bold;
}
/* Tables --------------------------------- */
table.band, table.dl {
width: 629px;
padding: 0;
border: 0;
margin-bottom: 20px;
}
table.dl td, table.dl th{
padding: 6px;
}
table.dl th.icon, table.band th.icon {
-moz-border-radius-topleft: 5px;
border-radius-topleft: 5px;
width: 45px;
text-indent: 4px;
}
table.dl th.alt {
background-color: #212121 !important;
font-weight: normal !important;
text-transform: capitalize !important;
letter-spacing: 0 !important;
}
table.dl th.download, table.band th.download {
-moz-border-radius-topright: 5px;
border-radius-topright: 5px;
}
table.dl th, table.band th.download, table.band th.icon {
text-align: center;
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
color: #fff;
background-color: #40404a;
border-bottom: 1px solid #383842;
text-shadow: 1px 1px #1e1e23;
}
table.band th.alt {
text-align: left;
}
table.dl td.filename, table.dl td.feature {
background-color: #dedee5;
border-bottom: 1px dotted #c6c6ce;
font-size: 13px;
padding-left: 9px;
}
table.band td.feature {
font-size: 12px;
color: #2f2c37;
font-weight: bold;
width: 150px;
padding: 10px;
padding-left: 25px;
text-align: left;
border-right: 1px dotted #b3b3bb;
border-bottom: 1px solid #b3b3bb;
background: url(../images/bullet.gif) no-repeat;
background-position: 9px 12px;
background-color: #dedee5;
vertical-align: top;
}
table.band td.info {
background-color: #eeeef5;
border-bottom: 1px solid #cfcfd7;
text-align: justify;
font-size: 12px;
color: #252525;
line-height: 19px;
padding-left: 8px;
vertical-align: top;
padding: 10px;
}
table.dl td.icon {
background-color: #fff;
vertical-align: center;
text-align: center;
border-bottom: 1px solid #b4b4bc;
vertical-align: center;
text-align: center;
}
table.dl td.icon img {
width: 31px;
height: 31px;
border: 0;
margin-left: -1px !important;
}
table.dl td.file-desc {
border-bottom: 1px solid #b4b4bc;
background-color: #e8e8ee;
color: #54545c;
font-size: 11px;
padding-left: 9px;
}
table.dl td.filename a {
font-weight: bold;
text-decoration: none;
color: #2f5487;
}
table.dl td.download {
width: 197px;
background-color: #f3f3f8;
vertical-align: center;
text-align: center;
border-bottom: 1px solid #b4b4bc;
}
table.dl td.download img {
width: 197px;
height: 54px;
border: 0;
}
table.band td, table.band th {
padding: 6px;
}
table.band th.type {
text-align: center;
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
color: #fff;
-moz-border-radius-topleft: 5px;
border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-radius-topright: 5px;
background-color: #40404a;
border-bottom: 1px solid #383842;
text-shadow: 1px 1px #1e1e23;
}
table.band th.break {
height: 2px !important;
font-size: 0px;
padding: 0px !important;
}
table.band td.col-name {
background: url(../images/info.gif) no-repeat;
font-size: 11px;
color: #393744;
font-weight: bold;
width: 124px;
padding-left: 32px;
padding-top: 8px;
border-bottom: 1px solid #e5e5eb;
border-right: 4px solid #e5e5eb;
vertical-align: top;
background-position: 8px 7px;
text-align: left !important;
}
table.band td.col-info {
background-color: #dcdce4;
border-bottom: 1px solid #e5e5eb;
font-size: 11px;
font-family: tahoma,arial,sans-serif;
line-height: 21px;
color: #484848;
padding-left: 18px;
padding-right: 18px;
vertical-align: top;
text-align: justify;
}
table.band td.col-info p {
font-size: 11px !important;
font-family: tahoma,arial,sans-serif !important;
line-height: 21px !important;
text-align: justify !important;
margin-bottom: 0px !important;
color: #484848 !important;
padding: 0px !important;
}
table.band td.col-info a {
color: #415097;
text-decoration: none;
font-weight: bold;
}
table.band td.col-info a:hover {
color: #5c6fcd !important;
}
/* Sidebar & Menu ---------------------------------------- */
#sidebar {
display: block;
float: left;
width: 257px;
background: url(../images/sidebar.gif) no-repeat;
padding-top: 10px;
}
.sidebar-home {
background: none !important;
}
#sidebar h1 {
display: block;
height: 34px !important;
text-align: left;
background: url(../images/h1-alt.gif) no-repeat;
padding-top: 11px;
padding-left: 13px;
margin-bottom: 0px !important;
padding-bottom: 0px !important;
color: #fff;
font-family: lucida sans,arial,sans-serif;
font-size: 13px;
text-transform: uppercase;
}
#sidebar ul {
display: block;
background-color: #b9b9c1;
}
#sidebar ul li {
display: block;
height: 33px;
background: url(../images/sidebar-li.png) no-repeat;
}
#sidebar ul li:hover {
background-position: 0px -33px;
}
#sidebar ul li.last {
display: block;
height: 1px !important;
overflow: hidden;
border-bottom: 16px solid #d1d1d9;
}
#sidebar ul li.last:hover {
background-position: 0% 0% !important;
}
#sidebar ul li a {
display: block;
padding-left: 28px;
padding-top: 5px;
font-family: arial,sans-serif;
font-size: 11px;
font-weight: bold;
text-decoration: none;
color: #213f68;
}
#sidebar ul li a:hover {
color: #4771aa;
}
#sidebar div.mailing {
display: block;
margin-bottom: 18px;
height: 130px !important;
background-color: #b9b9c1;
padding-top: 5px;
}
#sidebar div.mailing input.text {
display: block;
height: 21px;
background: url(../images/mailing-input.gif) no-repeat;
border: 0;
font-size: 12px;
color: #5a5a63;
width: 214px;
padding-left: 23px;
padding-right: 20px;
padding-bottom: 11px;
padding-top: 11px;
clear: both;
}
#sidebar div.mailing form {
margin-top: -5px !important;
}
#sidebar div.mailing input.submit {
display: block;
width: 78px;
height: 29px;
background: url(../images/mailing-submit.gif) no-repeat;
border: 0;
cursor: pointer;
float: right;
clear: right;
margin-right: 8px;
margin-top: 3px !important
}
#sidebar div.mailing input.submit:focus {
position: relative;
left: 1px;
top: 1px;
}
#sidebar div.mailing p {
display: block;
width: 155px;
font-size: 11px;
color: #65656e;
float: left;
margin-left: 10px;
padding-left: 2px;
padding-top: 3px !important;
text-shadow: 1px 1px 0 #d1d1db;
}
/* Social Networks Footer ------------------------------------- */
#networks-container {
display: block;
clear: both;
height: 160px;
background: url(../images/sub-footer-bg.gif) repeat-x;
}
#networks {
display: block;
position: relative;
left: 50%;
margin-left: -475px;
width: 950px;
height: 160px;
}
#networks-1 {
display: block;
float: left;
width: 220px;
background: url(../images/networks-1.gif) no-repeat;
height: 145px;
padding-left: 30px;
padding-top: 15px;
}
#networks-1 ul {
display: block;
width: 194px;
}
#networks-1 ul li {
display: block;
width: 194px;
height: 34px;
background: url(../images/networks-1-li.gif) no-repeat;
}
#networks-1 ul li.last {
background: none;
}
#networks-1 ul li a {
font-family: tahoma,arial,sans-serif;
text-decoration: none;
color: #6895d3;
font-size: 11px;
}
#networks-1 ul li a:hover {
color: #fff;
}
#networks-1 ul li a img {
margin-top: 6px !important;
margin-right: 11px !important;
position: relative;
top: 3px;
width: 16px;
height: 16px;
border: 0px;
}
#networks-2 {
display: block;
width: 276px;
height: 105px;
float: left;
padding-left: 18px;
padding-right: 29px;
font-size: 11px;
font-family: tahoma,arial,sans-serif;
color: #73717e;
background: url(../images/twitterbg.gif) no-repeat;
padding-top: 55px;
}
#networks-2 p {
line-height: 18px;
height: 65px;
}
#networks-2 p a {
color: #6895d3;
}
#networks-2 span a {
color: #6895d3;
font-weight: bold;
text-decoration: none;
}
#networks-2 span a:hover, #networks-2 p a:hover {
color: #fff;
}
#networks-3 {
display: block;
float: left;
width: 358px;
height: 160px;
background: url(../images/networks-3.gif) no-repeat;
padding-left: 19px;
}
#networks-3 p.logos {
display: block;
padding-top: 54px;
margin-bottom: 10px;
}
#networks-3 p.logos img {
display: inline-block;
margin-right: 4px;
}
#networks-3 p.links {
padding-left: 5px;
color: #504d5e;
font-size: 11px;
font-family: tahoma,arial,sans-serif;
}
#networks-3 p a {
color: #6895d3;
}
#networks-3 p a:hover {
color: #fff;
}
/* Footer ------------------------- */
#footer-container {
display: block;
clear: both;
height: 45px;
background-color: #121215;
}
#footer {
display: block;
position: relative;
left: 50%;
margin-left: -475px;
width: 950px;
height: 18px;
font-size: 11px;
font-family: tahoma,arial,sans-serif;
padding-top: 17px;
color: #93979d;
}
#footer p.footer-contact {
display: block;
float: left;
clear: left;
padding-left: 30px;
}
#footer p.footer-contact strong {
font-weight: bold;
}
#footer p.footer-contact a, #footer p.designed-by a {
color: #93979d;
}
#footer p.footer-contact a:hover, #footer p.designed-by a:hover {
color: #fff;
}
#footer p.designed-by a:hover, #footer p.designed-by a {
text-decoration: none !important;
}
a.bf {
font-weight: bold;
color: #6895d3 !important;
}
a.bf:hover {
color: #4a7cc2 !important;
}
#footer p.designed-by {
display: block;
float: right;
clear: right;
padding-right: 20px;
}