@charset "UTF-8";
/*
 Project:
    Title: ClickLock Website
    URL: http://www.clicklock.com/
    Created: 2010-06-20

 File:
    Filename: style.css
    Location: /css/
    Created 2010-06-23
    
 Developers:
    -   Name: Ryan Ball
        Last_Edit: 2010-06-23
        
 Contents:
    -   Section: general
        Comments: Resets and standardizes styles among browsers
    -   Section: sprites
        Comments: sprites used throughout template.
    -   Section: forms
        Comments: none
    -   Section: header
        Comments: none
    -   Section: body
        Comments: includes the content and sidemenu
    -   Section: side-menu
        Comments: 'side-menu' section embeded in 'body'.
    -   Section: content
        Comments: 'content' section embeded in 'body'.
    -   Section: blog
        Comments: Special blog styles.
    -   Section: footer
        Comments: none
    -   Section: general-classes
        Comments: none
    
 Palette:
    -   Color: #7883F2
        Uses: shade of blue used in the layout
    -   Color: #565656
        Uses: default text color
    -   Color: #FFF200
        Uses: yellow used in for active links
    -   Color: #7A7DEE
        Uses: Light blue for some text (footer text)
    -   Color: #434343
        Uses: general h3 (bylines, article subheadings)
        
*/
/*= yahoo-yui */
/*
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 2.8.1
*/

/* Fonts */
@font-face {
	font-family: 'StencilRegular';
	src: url('stencilbt-webfont.eot');
	src: local('Stencil'), url('fonts/stencilbt-webfont.woff') format('woff'), url('fonts/stencilbt-webfont.ttf') format('truetype'), url('fonts/stencilbt-webfont.svg#webfontwGTOxZYJ') format('svg');
	font-weight: normal;
	font-style: normal;
}

body{margin:10px; font-size:100%;}
h1{font-size:138.5%;}
h2{font-size:123.1%;}
h3{font-size:108%;}
h1,h2,h3{margin:1em 0;}h
1,h2,h3,h4,h5,h6,strong,dt{font-weight:bold;}
optgroup{font-weight:normal;}
abbr,acronym{border-bottom:1px dotted #000;cursor:help;}
em{font-style:italic;}
del{text-decoration:line-through;}
blockquote{margin:1.2em;font-weight:bold;font-style:italic;}
ul,ol,dl{margin:1em;}
ol,ul,dl{margin-left:2em;}
ol li{list-style:decimal outside;}
ul li{list-style:disc outside;}
dl dd{margin-left:1em;}
th,td{border:1px solid #000;padding:.5em;}
th{font-weight:bold;text-align:center;}
caption{margin-bottom:.5em;text-align:center;}
sup{vertical-align:super;}
sub{vertical-align:sub;}
p,fieldset,table,pre{margin-bottom:1em;}
button,input[type="checkbox"],input[type="radio"],input[type="reset"],input[type="submit"]{padding:1px;}

/*= general */
body, html{margin:0; font-family:Helvetica, Arial, sans-serif; font-size:.95em; color:#565656;}
h1{color:#6969EC; font-weight:100; font-size:25px; text-transform:capitalize; margin-top:4px; margin-bottom:1px; }
h3{color:#434343; text-transform:capitalize; font-size:13px;}
a{outline:none;}

/*= sprites */
.sprite-logo{background: url('../images/template/sprite-trans-24bit.png') 0 -175px no-repeat; width: 476px; height: 140px;}
.sprite-message{background: url('../images/template/sprite-trans-24bit.png') 0 0 no-repeat; width: 497px; height: 165px;}
.sprite-btn{background: url('../images/template/sprite-trans-24bit.png') -520px -270px no-repeat; width: 160px; height: 28px;}
.sprite-btn-mouseover, .sprite-btn-current-page{background: url('../images/template/sprite-trans-24bit.png') -522px -219px no-repeat; width: 160px; height: 28px;}
.sprite-diag-neck{background: url('../images/template/sprite-trans-24bit.png') -500px 0px no-repeat; width: 192px; height: 168px;}
.sprite-bar{background: url('../images/template/sprite-trans-24bit.png') 0 -321px repeat-x; width: 100%; height: 15px;}
.sprite-sidemenu{background: url('../images/template/sprite-trans-24bit.png') -693px 0px no-repeat; width: 157px; height: 250px;}
.sprite-footer{background: url('../images/template/sprite-trans-24bit.png') 0 -340px no-repeat; width: 703px; min-height: 30px;}
.sprite-sidenav-top{background: url('../images/template/sprite-sidnav-trans-24bit.png') -162px 0px no-repeat; width: 155px; height: 36px;}
.sprite-sidenav-middle{background: url('../images/template/sprite-sidnav-trans-24bit.png') 0px 0px repeat-y; width: 155px; min-height: 160px;}
.sprite-sidenav-bottom{background: url('../images/template/sprite-sidnav-trans-24bit.png') -162px -40px no-repeat; width: 155px; height: 41px;}

/*= forms */
#form fieldset{width:370px; border:1px solid #fff200; background:#7883f2; text-align:center; padding:0px; margin:0 auto 0 auto;}
#form table{border:none; margin-left:auto; margin-right:auto;}
#form tr{border:none;}
#form td{border:none;}
#form td:first-child{text-align:left;}
#form tr:last-child > td{text-align:right;}
#form input[type="text"]{width:100%; border:solid 1px #737373; height:20px; font-size:14px; color:#565656;}
#form td.description{margin-bottom:0px; padding-bottom:0px; color:#ffffff;}
#form td.field{padding-top:0;}
#form input[type="submit"]{width:90px;height:25px;}
#form ul.errorlist li{color:#AA004B; list-style:none;}

/*= header */
#header{position:relative; width:920px; height:173px; margin:0 auto 0 auto;}
#logo{position:absolute; top:18px; left:37px;}
#header-menu{position:absolute; top:12px; right:17px;}
#btn-1, a[name="btn-1"]{position:absolute; top:18px; left:177px;}
#btn-2, a[name="btn-2"]{position:absolute; top:48px; left:202px;}
#btn-3, a[name="btn-3"]{position:absolute; top:78px; left:227px;}
#btn-4, a[name="btn-4"]{position:absolute; top:108px; left:252px;}
#diag-neck{position:absolute; top:0px; right:21px;}

a.btn-clear, a.btn-clear:visited, a.btn-current-page{color:white; display:block; width:140px; height:21px; padding-top:1px; text-align:center; text-transform:uppercase; text-decoration:none;}
a.btn-clear:active, a.btn-clear:hover, a.btn-current-page{color: #FFF200;}

/*= body */
#body{position:relative; padding:20px 20px 20px 20px; min-height:500px; margin:0 auto; width:920px;}

/*= side-menu */
#sidemenu{float:left; padding-bottom:20px; min-height:244px}
#sidemenu-top{position:relative;}
#sidemenu-middle{position:relative;}
#sidemenu-content{position:relative; padding-left:19px; padding-bottom:30px;}
#sidemenu-bottom{position:relative;}
#sidemenu-content ul{margin:0px; margin-right:20px; padding:0px;}
#sidemenu-content li{list-style:none; margin-bottom:10px;}
#sidemenu-content li:last-child{margin-bottom:0px;}
#sidemenu-content a, #sidemenu-content:visited{color:white;}
#sidemenu-content a:hover, #sidemenu-content a:active{text-decoration:none;}
#sidemenu-content > :first-child{margin-top:0px;}
#sidemenu-content > :last-child{margin-bottom:0px;}

#sidemenu-blog input[type="text"]{width:105px; height:10px; color:#565656;}
#sidemenu-blog ul{margin-left:3px;}
#sidemenu-blog li{margin-bottom:5px; margin-left:0px; font-size:12px;}
#sidemenu-blog li li{margin-bottom:5px;}
#sidemenu-blog > ul >li:first-child{margin-bottom:0px;}
#sidemenu-blog li form{text-indent:0px;}
#sidemenu-blog h3.widget-title{font-size:15px; color:#FFFFFF; font-weight:100; margin:14px 0 6px -8px;}



/*= content */
#content{margin-right:15px; position:relative;}
#content > #content-height{min-height:460px;}
#content div.horizbar{height:3px; background:#FFF200;}
#content div#horizbar-top{width:330px; margin-top:1px; margin-bottom:7px; }
#content div#horizbar-middle{width:354px; margin-bottom:7px; margin-top:4px;}
#content div#horizbar-bottom{width:365px;}
#content img{border:none; margin:10px;}

.content-withnav {width:600px;margin-left:195px;}
.content-withoutnav {margin-left:0px;}

/*= Site Map */
.site-map  {
    margin-left: 0px;
    font-size: 1.25em;
}
.site-map li { 
    list-style: none;
    padding: 6px 0 0 0;
}
.site-map ul { 
    margin: 0;
    padding: 0 0 0 20px;
}


/*= blog */
#blog {width:600px;}
#blog h2{margin-bottom:4px; margin-top:30px;}
#blog h2 a, #blog h2 a:visited{color:#6969EC; font-weight:100; font-size:25px; text-transform:capitalize; margin-top:4px; margin-bottom:0px; text-decoration:none;}
#blog h2 a:hover, #blog h2 a:active{text-decoration:underline;}
#blog div.entry-meta{margin-bottom:25px;}
#blog div.entry-meta, #blog div.entry-meta span{color:#565656; text-transform:capitalize; font-size:11px;}
#blog div.entry-utility{margin-top:25px;}
#blog div.entry-utility span{color:#111111; text-transform:capitalize; font-size:11px;}

#blog img.alignright {float:right; margin:0 0 1em 1em}
#blog img.alignleft {float:left; margin:0 1em 1em 0}
#blog img.aligncenter {display: block; margin-left: auto; margin-right: auto}
#blog a img.alignright {float:right; margin:0 0 1em 1em}
#blog a img.alignleft {float:left; margin:0 1em 1em 0}
#blog a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

/*= footer */
#footer{font-size:.8em; position:relative; margin:15px auto 0 auto; text-align:center; color:#7A7DEE; padding-top:9px;}
#footer a, #footer a:visited{color:inherit; text-transform:uppercase; margin-left:60px; margin-top:2px; }
#footer a:first-child{margin-left:0px;}
#footer a:hover, #footer a:active{text-decoration:none;}

#home-footer{font-size:.8em; position:relative; margin:0 auto; text-align:center; color:#7A7DEE; padding-top:9px;}

/*= general-classes */
.block{display:block;}
.all-wide{width:100%;}
.all-tall{height:100%;}

/*= Mail Chimp form styles */
#mc_embed_signup {
    margin:24px 0 24px 30px;
    padding: 0 30px 0 30px;
}
#mc_embed_signup fieldset { 
    border:1px solid #fff200; 
    padding: 8px 30px 8px 30px;
    background:#7883f2; 
    color:#ffffff;
    width:325px;
}
#mc_embed_signup .validate { 
    margin:30px 0; 
}
#mc_embed_signup .form-content { 
    margin:10px 0 10px 0; 
}
#mc_embed_signup .mc-field-group {
    margin-top: 16px;
    font-size: 1em;
}
#mc_embed_signup .note-required {
    color:#ffffff;
    font-weight: bold;
}
#mc_embed_signup .indicate-required {
    color:#ffffff;
    text-align: right;
    padding: 10px 0 0 0;
}
#mc_embed_signup input[type="text"] {
    display: block;
    width:100%; 
    border:solid 1px #737373; 
    height:20px; 
    font-size:14px; 
    color:#565656;
    margin-top: 2px;
}
#mc_embed_signup textarea {
    display: block;
    width:100%; 
    border:solid 1px #737373; 
    height:60px; 
    font-size:14px; 
    color:#565656;
    margin-top: 2px;
}
#mc_embed_signup ul {
    padding: 0 0 0 10px;
    margin: 0;
}
#mc_embed_signup li {
    padding: 6px;
    list-style:none;
}
#mc_embed_signup .input-group-label {
    margin-top: 3px;
}
#mc_embed_signup input[type="checkbox"] {
    display: inline;
    margin: 3px;
}
#mc-embedded-subscribe {
    margin: 8px 24px 8px 0;
    float: right;
}

#plan-container {
    overflow: auto;
	width: 100%;
}

.plan {
    width: 250px;
    border: 0 0 0 0;
    margin: 0 25px 0 25px;
    border-collapse:collapse;
    float: left;
}

.plan .boxtop {
    width: 250px;
    border: 0 0 0 0;
    margin: 0 0 0 0;
    background: #ffffff url('../images/content/plans/boxtop.png') no-repeat right top;
}

.plan .boxbottom {
    width: 250px;
    min-height: 50px;
    _height: 50px;
    text-align: center;
    align: center;
    border: 0 0 0 0;
    margin: 0 auto 0 auto;
    background: #ffffff url('../images/content/plans/boxbottom.png') no-repeat right bottom;
}

.plan .planhead {
    font-family: StencilRegular, Arial, Helvetica, "sans serif";
    font-size: 1.6em;
    color: #565656;
    text-align: center;
    padding: 16px 6px 3px 6px;
    margin: 0 0 0 0;
}

.plan .plantitle {
    font-family: Arial, Helvetica, "sans serif";
    font-size: 1.4em;
    color: #565656;
    text-align: center;
    padding: 3px 6px 16px 6px;
}

.plan .plandetail {
    font-family: Arial, Helvetica, "sans serif";
    font-size: 1em;
    color: #7883f2;
    text-align: center;
    border: 0 #ffffff solid;
    border-top: 3px #fff200 solid;
    padding: 9px 9px 0 9px;
    margin: 0 0 0 0;
}

.plan .plandetail p {
    padding: 6px 0px 6px 0px;
    margin: 0 0 0 0;
}

.signup {
    height: 33px;
    width: 111px;
    padding: 8px 0 32px 0;
    margin: 0 auto 0 auto;
}

.contactus {
    height: 33px;
    width: 126px;
    padding: 8px 0 32px 0;
    margin: 0 auto 0 auto;
}

/* Company Name */
.co { 
    font-family: 'StencilRegular', Helvetica, Arial, sans-serif;
    font-size: 1em;
}