@charset: "UTF-8";
/* LESS Document */

/*
===========================================

Created by Thomas Bredin-Grey on 16/05/2011.
© 2011 PAN Media. All rights reserved.

Table of Contents

    1. Variables
    
    2. Reset - Reset of browser styles

    3. Fonts
    
    4. Preset Classes
    
    5. Grids

    6. Generic Formatting

    7. Generic Classes

    8. Main Layout

===========================================
*/

/* ==== 1. Variables ==== */

@body-text: #111;
@heading-text: #312f30;
@link-colour: #0b60c1;
@link-hover: #1eb1f6;
@background: #695b4d;

@col-num: 12;
@page-width: 1002px;

/* ==== 2. Reset ==== */

/* Currently using Eric Meyer's reset v1.0 | 20080212 */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, 
dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, 
label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}

body {
	line-height: 1.2;
	font-size: 62.5%;
}

ol, ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

:focus {outline: 0;}

ins {text-decoration: none;}

del {text-decoration: line-through;}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* End of Eric Meyer's reset */

body {
    font-family: Verdana, "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: @body-text;
    background: url(/images/bg-grunge-top.jpg) right top no-repeat @background;
    overflow: auto;
}

a {color: @link-colour;}

a:hover {color: @link-hover;}

h1, h2, h3, h4, h5, h6 {color: @heading-text;}

#cms-visor-left a { text-decoration: none!important; }


/* ==== 3. Fonts ==== */

@font-face {
    /* This declaration targets Internet Explorer */
    font-family: 'DirtyEgo';
    src: url('/fonts/dirtyego-webfont.eot');
}

@font-face {
    /* This declaration targets everything else */
    font-family: 'DirtyEgo';
    src: url(//:) format('no404'), url('/fonts/dirtyego-webfont.woff') format('woff'), url('/fonts/dirtyego-webfont.ttf') format('truetype'), url('/fonts/dirtyego-webfont.svg#DirtyEgoRegular') format('svg');
    font-weight: bold;
    font-style: normal;
}

/* ==== 4. Preset Classes ==== */

.gradient3(@top: #2D2D2D, @middle: #413D3E, @bottom: #211F1F) {
    background-color: @middle !important;
    background-image: -moz-linear-gradient(top, @top, @middle, @bottom) !important;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@top), color-stop(50%,@middle), color-stop(100%,@bottom)) !important;
}

.gradient2(@top: #FFFFFF, @bottom: #000000) {
    background-color: @top !important;
    background-image: -moz-linear-gradient(top, @top, @bottom) !important;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@top), color-stop(100%,@bottom)) !important;
}

.rounded-corners (@radius: 5px) {
    -moz-border-radius: @radius;
    -webkit-border-radius: @radius;
    border-radius: @radius;
}

.rounded-corners-top-left (@radius: 5px) {
    -moz-border-radius-topleft: @radius;
    -webkit-border-top-left-radius: @radius;
    border-top-left-radius: @radius;
}

.rounded-corners-top-right (@radius: 5px) {
    -moz-border-radius-topright: @radius;
    -webkit-border-top-right-radius: @radius;
    border-top-right-radius: @radius;
}

.rounded-corners-bottom-right (@radius: 5px) {
    -moz-border-radius-bottomright: @radius;
    -webkit-border-bottom-right-radius: @radius;
    border-bottom-right-radius: @radius;
}

.rounded-corners-bottom-left (@radius: 5px) {
    -moz-border-radius-bottomleft: @radius;
    -webkit-border-bottom-left-radius: @radius;
    border-bottom-left-radius: @radius;
}

.box-shadow (@xshift: 1px, @yshift: 1px, @blur: 10px, @color: #666) {
    -moz-box-shadow: @xshift @yshift @blur @color;
    -webkit-box-shadow: @xshift @yshift @blur @color;
    box-shadow: @xshift @yshift @blur @color;
}

.box-shadow-inset (@xshift: 1px, @yshift: 1px, @blur: 10px, @color: #666) {
    -moz-box-shadow: @xshift @yshift @blur @color inset;
    -webkit-box-shadow: @xshift @yshift @blur @color inset;
    box-shadow: @xshift @yshift @blur @color inset;
}

.box-shadow-both (@xshift1: 1px, @yshift1: 1px, @blur1: 10px, @color1: #666, @xshift2: 1px, @yshift2: 1px, @blur2: 10px, @color2: #666) {
    -moz-box-shadow: @xshift1 @yshift1 @blur1 @color1;
    -webkit-box-shadow:  @xshift1 @yshift1 @blur1 @color1;
    box-shadow: @xshift1 @yshift1 @blur1 @color1;
    -moz-box-shadow: @xshift1 @yshift1 @blur1 @color1, @xshift2 @yshift2 @blur2 @color2 inset;
    -webkit-box-shadow: @xshift1 @yshift1 @blur1 @color1, @xshift2 @yshift2 @blur2 @color2 inset;
    box-shadow: @xshift1 @yshift1 @blur1 @color1, @xshift2 @yshift2 @blur2 @color2 inset;
}

.scale(@factor: 1) {
    -moz-transform: scale(@factor);
    -webkit-transform: scale(@factor);
    -o-transform: scale(@factor);
    -ms-transform: scale(@factor);
}

.rotate(@angle: 1) {
    -moz-transform: rotate(@angle);
    -webkit-transform: rotate(@angle);
    -o-transform: rotate(@angle);
    -ms-transform: rotate(@angle);
}

/* ==== 5. Grids ==== */

@gutter: 40px;

@column-width: (@page-width - @gutter) / @col-num;

.grid1, .grid2, .grid3, .grid4, .grid5, .grid6, .grid7, .grid8, .grid9, .grid10, .grid11, .grid12 { 
    float: left;
    padding-bottom: @gutter;
    margin: 0 @gutter 0 0;
    overflow: hidden;
    float: left;
    display: inline;
}

.grid-width (@column-number: 1) { width: (@column-width * @column-number) - @gutter; }
.gridrow-width (@column-number: 1) { width: (@column-width * @column-number) }

.grid1 { .grid-width(1); }
.grid2 { .grid-width(2); }
.grid3 { .grid-width(3); }
.grid4 { .grid-width(4); }
.grid5 { .grid-width(5); }
.grid6 { .grid-width(6); }
.grid7 { .grid-width(7); }
.grid8 { .grid-width(8); }
.grid9 { .grid-width(9); }
.grid10 { .grid-width(10); }
.grid11 { .grid-width(11); }
.grid12 { .grid-width(12); }

.gridrow {
    &.grid1 { .gridrow-width(1); }
    &.grid2 { .gridrow-width(2); }
    &.grid3 { .gridrow-width(3); }
    &.grid4 { .gridrow-width(4); }
    &.grid5 { .gridrow-width(5); }
    &.grid6 { .gridrow-width(6); }
    &.grid7 { .gridrow-width(7); }
    &.grid8 { .gridrow-width(8); }
    &.grid9 { .gridrow-width(9); }
    &.grid10 { .gridrow-width(10); }
    &.grid11 { .gridrow-width(11); }
    &.grid12 { .gridrow-width(12); }
}

.row {
    width: @page-width;
    margin: 0 auto;
    overflow: hidden;
}

.row .row {
    width: auto;
    margin: (0 - @gutter) 0;
    display: inline-block;
    padding-left: 0;
}

.gridrow {
    margin-right: 0;
    padding-bottom: 0;
}


/* ==== 6. Generic Formatting ==== */

h1, h2, h3, h4, h5, h6, p, dl, ul, ol, blockquote, table, hr {
    margin-bottom: 14px;
    line-height: 1.5;
}
    
h1, h2, h3, h4, h5, h6 {
    color: #687666;
    font-family: Verdana, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 20px;
    font-weight: normal;
}

h2 { font-size: 15px; }

h3, h4, h5, h6 {
    font-size: 12px;
    font-weight: bold;
    color: #000;
}

p, li, dl, table, label, .input-text {
    font-size: 12px;
}

label {
    display: block;
    margin-bottom: 3px;
}


/* ==== 7. Generic Classes ==== */


.input-text,
.generic-form .si_text, .si_textarea {
    .rounded-corners(5px);
    border-width: 1px;
    border-style: solid;
    border-color: #ccc #999 #999 #ccc;
    width: 220px;
    padding: 6px 8px 7px;
    resize: none;
    margin-bottom: 5px;
    text-shadow: #fff 1px 1px 0;
    text-shadow: rgba(0,0,0,0.001) 1px 1px 1px, #fff 1px 1px 0;
    .gradient3(#fff, #fafafa, #eee);
    color: #555;
    &:hover {
        border-color: #ccc #888 #696969 #bbb;
        .box-shadow(#e4e4e4 1px 1px 2px);
        color: #777;
        .gradient3(#fff, #fff, #eee);
    }
    &:focus {
        border-color: #999 #636363 #444 #999;
        .box-shadow(none);
        color: #2c2c2c;
        .gradient3(#eee, #fff, #fff);
    }
}

.generic-btn {
    .rounded-corners(5px);
    .gradient2(#9fa39f, #575e57);
    border: 1px solid #c3c5c3;
    border-color: #c3c5c3 #686d68 #3e443e #a2a6a2;
    cursor: pointer;
    padding: 5px 22px 6px !important;
    margin-bottom: 8px;
    &:hover {
        .gradient2(#575e57, #9fa39f);
        border-color: #d3d5d3 #585d58 #2e342e #b2b6b2;
    }
}

.generic-btn, .generic-btn span {
    font-family: Verdana, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: normal !important;
    text-shadow: rgba(0,0,0,0.4) 0 0 3px !important;
    text-transform: none !important;
}
.generic-btn span {
    margin: 0 !important;
    padding: 0 !important;
}

.clear { clear: both; }

/* ==== 8. Main Layout ==== */

.wrapper {
    width: 1002px;
    margin: 0 auto;
    background: #fff;
    .box-shadow(0, 0, 20px, rgba(0,0,0,0.6));
    z-index: 10;
    position: relative;
}

.header {
    background: url(/images/header-main.jpg) 0 0 no-repeat;
    width: 1002px;
    height: 113px;
    padding-top: 195px;
    position: relative;
    z-index: 5000;
    ul.nav {
        display: block;
        text-shadow: rgba(0,0,0,0.5) 0 0 4px, rgba(0,0,0,0.01) 1px 1px 1px;
        float: left;
        margin-bottom: 0;
        clear: both;
        margin-left: 0;
        list-style-image: none;
        list-style-type: none;
    }
    li {
        width: 167px;
        display: block;
        float: left;
        position: relative;
        height: 113px;
        font-weight: normal;
        a {
            background: url(/images/category-btns.jpg) no-repeat 0 0;
            display: block;
            height: 0;
            overflow: hidden;
            padding: 112px 0 0;
            width: 167px;
        }
        ul {
            display: none;
            position: absolute;
        }
        li {
            display: block;
            width: 167px;
            height: 30px;
            height: auto;
            a {
                display: block;
                width: 148px;
                border-bottom: 1px solid #fff;
                font-family: Verdana, "Helvetica Neue", Helvetica, Arial, sans-serif;
                text-align: left;
                font-size: 12px;
                background: #d2d2d2;
                text-decoration: none;
                text-transform: uppercase;
                height: auto;
                padding: 6px 7px 7px 10px;
                color: #4e4e4e;
                text-shadow: rgba(255,255,255,0.5) 1px 1px 0;
                border-left: 1px solid #fff;
                border-right: 1px solid #fff;
            }
            a:hover {
                background: #4e4e4e;
                color: #fff;
                text-shadow: rgba(0,0,0,0.5) 1px 1px 0;
            }
        }
        span {
            z-index: 2;
            position: absolute;
            width: 167px;
            text-align: center;
            cursor: pointer;
            cursor: hand;
            -webkit-mask-image: -webkit-gradient(linear, left 10%, left 90%, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
        }
    }
    li:hover, li.hover {
        ul { display: block; }
    }
    .hinterlands {
        a { background-position: -334px 0; }
        a:hover { background-position: -334px -112px; }
    }
    .archery {
        a { background-position: -835px 0; }
        a:hover { background-position: -835px -112px; }
    }
    .clay-bird {
        a { background-position: 0 0; }
        a:hover { background-position: 0 -113px; }
    }
    .corporate {
        a { background-position: -167px 0; }
        a:hover { background-position: -167px -112px; }
    }
    .laser-tag {
        a { background-position: -501px 0; }
        a:hover { background-position: -501px -113px; }
    }
    .paintball {
        a { background-position: -668px 0; }
        a:hover { background-position: -668px -113px; }
    }
}

.home {
    background: url(/images/header-home.jpg) 0 0 no-repeat;
    width: 1002px;
    height: 231px;
    padding-top: 193px;
    position: relative;
    .generic-btn {
        margin-left: 48px !important;
        margin-top: 12px !important;
    }
    p {
        color: #def9da;
        position: relative;
        margin-left: 48px;
        line-height: 1.5;
        width: 300px;
        margin-bottom: 22px;
    }
}

.contact-modal {
    text-transform: uppercase !important;
    .gradient2(#6a6a6a, #303030);
    text-shadow: #000 0 0 4px !important;
    display: inline-block !important;
    font-family: "DirtyEgo",Impact,Verdana,Arial,sans-serif !important;
    font-size: 23px !important;
    position: relative !important;
    padding: 3px 16px 4px !important;
    text-decoration: none !important;
    color: #def9da !important;
    border: 1px solid #555 !important;
    &:hover {
        border: 1px solid #555 !important;
        .gradient2(#303030, #6a6a6a);
    }
}

.main {
    width: @page-width - @gutter;
    padding: 14px 0 20px @gutter;
    z-index: 1000;
    background: url(/images/body-grunge-bottom.jpg) 0 bottom no-repeat;
}

.grunge-bottom {
    background: url(/images/bg-grunge-bottom.jpg) 0 0 no-repeat;
    z-index: -1;
    height: 662px;
    width: 584px;
}

.footer {
    background: #a5a29d;
    color: #cdcccb;
    font-size: 12px;
    height: 15px;
    padding: 13px;
    margin-bottom: -1px;
    ul { float: left; }
    li {
        float: left;
        color: #453b2a;
        a {
            color: #453b2a;
            margin: 0 4px;
        }
    }
    a { text-decoration: none; }
    a:hover { text-decoration: underline; }
    p {
        float: right;
        a { color: #fff; }
    }
}

.content {
    padding-top: 18px;
    text-shadow: #fff 1px 1px 0;
    z-index: 1000;
}

.sidebar {
    background: url(/images/sidebar.png) 0 0 no-repeat;
    padding: 17px 20px 0;
    width: 240px;
    .box-shadow(3px, 5px, 13px, #fff);
    margin-bottom: 40px;
    text-shadow: rgba(255,255,255,0.6) 1px 1px 0;
    dd {
        color: #3d4240;
        line-height: 45px;
        font-size: 40px;
        font-family: "DirtyEgo", Impact, Verdana, Arial, sans-serif;
        text-shadow: rgba(0,0,0,0.1) 1px 1px 4px;
    }
    dl { margin-bottom: 5px; }
    .input-text { margin-bottom: 12px; }
}

.sidebar-cap {
    background: url(/images/sidebar-cap.png) 0 0 no-repeat;
    margin: 0 -20px;
    height: 18px;
}

html, body {height: 100%;}

.bg-wrapper {
    min-height: 100%;
}

.wrapper {
	padding-bottom: 0;
	margin-bottom: 20px;}  /* must be same height as the footer */

.grunge-bottom {
    position: relative;
	margin-top: -650px; /* negative value of footer height */
}

/* Daves Changes */
.content {
    
/*   h1, h2 {
        text-transform: uppercase;
    }*/
    h1, h2, h3, h4, h5, h6 {
        margin: 4px 0 8px 0;
    }
    
    hr {
        border: 0;
        border-bottom: 1px solid #aaa;
    }
    
    ol {
        margin-left: 27px;
        li {
            list-style-position: inside;
            list-style: decimal;
        }
    }
    
    ul {
        margin-left: 5px;
        li {
            background: url(/images/bullet.gif) no-repeat 6px 7px;
            padding-left: 22px; 
        }
    }
    
    object {
        margin: 10px;
    }
    
    .image-list img {
        float: left;
        margin: 2px;
    }
}



/******************************************************************************\
 * Rounded borders
\******************************************************************************/
.si_border_radius(@radius: 5px) {
    -moz-border-radius: @radius !important;
    -webkit-border-radius: @radius !important;
    border-radius: @radius !important;
}

.si_box_sizing(@type: border-box) {
    -moz-box-sizing: @type !important;
    -webkit-box-sizing: @type !important;
    -ms-box-sizing: @type !important;
    box-sizing: @type !important;
}

/******************************************************************************\
 * Shadows
\******************************************************************************/
.si_box_shadow_inset(@left_offset: 1px, @right_offset: 1px, @blur: 20px, @color: #666) {
    -moz-box-shadow: @left_offset @right_offset @blur @color inset !important;
    -webkit-box-shadow: @left_offset @right_offset @blur @color inset !important;
    box-shadow: @left_offset @right_offset @blur @color inset !important;
}

/******************************************************************************\
 * Gradients
\******************************************************************************/

/* Gradient consisting of two colours */
.si_gradient_2(@top: #FFFFFF, @bottom: #000000) {
    background-color: @top !important;
    background-image: -moz-linear-gradient(top, @top, @bottom) !important;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@top), color-stop(100%,@bottom)) !important;
}

/* Gradient consisting of three colours */
.si_gradient_3(@top: #2D2D2D, @middle: #413D3E, @bottom: #211F1F) {
    background-color: @middle !important;
    background-image: -moz-linear-gradient(top, @top, @middle, @bottom) !important;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@top), color-stop(50%,@middle), color-stop(100%,@bottom)) !important;
}

.si_gradient_image_2(@top: #FFFFFF, @bottom: #000000, @image, @position) {
    background: @top @image no-repeat @position !important;
    background-image: @image, -moz-linear-gradient(top, @top, @bottom) !important;
    background-image: @image, -webkit-gradient(linear, left top, left bottom, color-stop(0%,@top), color-stop(100%,@bottom)) !important;
    background-position: @position, 0 0;
}

.si_box_shadow(@params: 1px 1px 1px #fff) {
    -moz-box-shadow: @params !important;
    -webkit-box-shadow: @params !important;
    box-shadow: @params !important;
}



input.si_error,
input.si_error:hover,
input.si_error:focus,
select.si_error,
select.si_error:hover,
select.si_error:focus {
    border: 1px solid #f8a2a2;
}

input.si_error,
select.si_error,
textarea.si_error {
    margin-bottom: 0px !important;
    border: 1px solid #f9b5b5 !important;
    border-bottom: 0 none !important;
    color: #f78282 !important;
    outline: 0 none !important;
    .si_border_radius(5px 5px 0 0);
    .si_box_shadow_inset(1px, 1px, 5px, #feecec);
    .si_gradient_2(#fde9e9, #fef3f3);
}

input.si_error:hover,
select.si_error:hover,
textarea.si_error:hover {
    border: 1px solid #f8a2a2;
    border-bottom: 0 none;
    color: #a45d5d;
    outline: 0 none;
    .si_gradient_2(#fde9e9, #fef3f3);
}

input.si_error:focus,
select.si_error:focus,
textarea.si_error:focus {
    border: 1px solid #ce6363;
    border-bottom: 0 none;
    color: #7a4545;
    outline: 0 none;
    .si_gradient_2(#feeeee, #feecec);
}

.si_error_message {
    font-weight: normal;
    font-style: normal;
    font-size: 10px;
    margin-bottom: 10px;
    color: #963f3a;
    padding: 5px 3px 3px 3px;
    border: 1px solid #cf827d;
    text-shadow: rgba(255,255,255,0.5) 1px 1px 0;
    display: block;
    overflow: auto;
    width: 100%;
    position:relative;
    overflow: hidden;
    .si_border_radius(0 0 5px 5px);
    .si_gradient_2(#ffd0c9, #ffa8a0);
    width: 230px;

    span.ui-icon {
        position:absolute;
        top: 3px;
    }
    ul, li {
        list-style: none;
        margin: -1px 2px 2px 2px;
        padding: 0;
    }
    li {
        padding: 0 0 0 15px;
    }
 }

.hinterland-heading, .hinterland-heading-home {
    overflow: hidden;
    display: block;
    height: 0;
    width: 356px;
    padding-top: 152px;
    cursor: pointer;
    position: absolute;
    top: 21px;
    left: 23px;
    background: url(../images/hinterland-adventures.png) 0 0 no-repeat;
}

.hinterland-heading-home { background-image: url(../images/hinterland-adventures-home.png); }