/* ========================================
    
    File: changefirst.css
    Site: changefirst.com
    Author: Phil Cole / Rob Dove (preview.co.uk)
    Copyright: 2009 changefirst.com
 
   ======================================== */

    @import url("reset.css");

/* ----------------------------------------
    1. Body
   ---------------------------------------- */

    html {
        font-size: 100%;
    }

    body {
        font-size: 69%;
        margin: 0px auto;
        padding: 0px;
        font-family: Verdana, helvetica, arial, sans-serif;
        color:#333;
        background-color:#EBEBED;
        line-height:1.2em;
    }

/* ----------------------------------------
    2. Standard Type
   ---------------------------------------- */
    h1, .category-top, h2  {
            color:#CC3366;
            font-size:1.8em;
            margin:0 0 0.2em 0;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            padding:0.8em 0 0.8em 10px;
            display:block;
            background:#E9E9E9;
            font-weight:normal;
            text-align:left; }
    .category-top {
        margin-top:20px;
    }
	h2 a:link, h2 a:active, h2 a:visited {
		color:#CC3366;
	}
    h2 { background:none; padding:0 0 0.4em 0; }
    .textbox h2 { color:#CC3366; }
	h2 { line-height: 20px;}

    h3 { color:#286C9E; font-size:1em; margin:0.4em 0;font-weight:bold;}
    .story h3 { font-weight:bold; color:#CC3366; font-size:1.4em; margin:0.8em 0 0.6em 0;}
    h4 { color:#999; font-size:1em; margin:0 0 0.4em 0;line-height:1.2em;font-weight:bold;}


    p, ul, form, ol {
        font-size: 1em; line-height:1.2em;margin-bottom:0.6em;
    }
    ol li ol {
        margin-top:0.6em;
    }
    
    .highlight { font-size:1.1em; color:#CC3366; }
    .storyheading { color:#286C9E; margin-bottom:0em; font-weight:bold;}
    
    
    form ul, ul li ul, ol, ol li ol {
        font-size: inherit;
    }
    
    img {
        border: 0px;
    }
    
    a:link, a:active, a:visited {
        color:#0066CC;
    }
    a:hover {
       color:#CC3366;
    }
    
    .textbox ul, #centerCol ul {
        margin-left:2em;
    }
    
    sub, sup {
        font-size:8px;
    }
    

/* ----------------------------------------
    3. Structure
   ---------------------------------------- */

    #background {
        width:100%;
        background:url(images/footbg.jpg) repeat-x bottom #FFF;
    }
    #background2 {
        min-width:980px;
		width:100%;
    }
    
    #wrapper, #mainWrapper {
        width:980px;
        margin:0 auto;
		position:relative;
    }

	#meet-hal {
		position:absolute;
		left:50%;
		margin-left:-470px;
		top: 160px;
		width: 131px;
		height: 39px;
		background: url(images/meet-drhal.png) no-repeat center;
	}
	#visitshop {
		position:absolute;
		left:50%;
		margin-left:-480px;
		top: 330px;
		width: 156px;
		height: 136px;
		background: url(images/visit-the-shop.png) no-repeat center;
	}
	#card-stack {
		position:absolute;
		left:50%;
		top: 500px;
		margin-left:-500px;
		width: 122px;
		height: 66px;
		background: url(images/cards.png) no-repeat center;
	}
	.linkblock {
		display: block;
		width: 100%;
		height: 100%;
	}
    
    /* page backgrounds */
    .pagehome {
        background:url(images/bg_home.png) no-repeat center top;
    }
    .pageabout {
        background:url(images/bg_about.jpg) no-repeat center 100px;
    }
    .pagefaqs {
        background:url(images/bg_faq.jpg) no-repeat center 40px;
    }
    .pagemeet {
        background:url(images/bg_meet.jpg) no-repeat center 20px;
    }
    .pagenews{
        background:url(images/bg_news.jpg) no-repeat center 300px;
    }
    .pagelabs {
        background:url(images/bg_lab.jpg) no-repeat center 160px;
    }
    .shop,  .pagenews #wrapper, .pagetrumps #wrapper, .pagelabs #wrapper,  .pagesample #wrapper  {
        background:url(images/shopbg_head.png) no-repeat 200px top;
    }  
    .pagecontact, .pagesample2{
        background:url(images/bg_contact.jpg) no-repeat center 70px;
    }
    .pagesample2 #wrapper {
        background:none;
    }
    #navColumnOne {
        background:url(images/shopbg_left.png) no-repeat center 220px;
    }
    #navColumnTwo {
        background:url(images/shopbg_right.png) no-repeat center 250px;
    }
    
    #navigation {
        float:right;
    }
    #logo {float:left;margin-top:5px;margin-left:10px;}
    
    #leftCol {
        width:235px;
        float:left;
        margin-top:28px;
    }
    #centerCol {
        width:366px;
        float:left;
        margin:-40px 0px 0 18px;
    }
    #centerColindex {
        width:433px;
        float:left;
        margin:-50px 0px 0 196px;
    }
    #centerCol.news {
        width:475px;
    }
    #rightCol.news {
        width:230px;
        min-height:560px;
    }
    #rightCol {
        width:340px;
        float:right;
        margin-left:20px;
        margin-top:-40px;
        margin-bottom:70px;
    }
    #rightCol.index {
        margin-left:0;
    }

    #content, #footer {
        clear:both;
    }
    #newsitems {
        padding-top:2em;
    }
    .homebox {
        margin-top:-40px;
    }
    .textbox, .textboxhead, .textboxfoot, .textboxH, .textboxN {
        background:url('images/textbox_bg.gif') repeat-y ;
        width:309px;
        padding:10px 15px;
    }
    .textboxH {
        background:url('images/textboxH_bg.gif') repeat-y;
        width:336px;
    }
    .textboxN {
        background:url('images/textboxN_bg.gif') repeat-y;
        width:200px;
    }
    .textbox_head {
        background:url('images/textbox_head.gif') no-repeat;
        height:25px;
    }
    .textbox_foot {
        background:url('images/textbox_foot.gif') no-repeat;
        height:16px;
    }
    .textbox2_head {
        background:url('images/textbox2_head.gif') no-repeat;
        height:32px;
    }
    .textbox2_foot {
        background:url('images/textbox2_foot.gif') no-repeat;
        height:18px;
    }
    .textbox3_head {
        background:url('images/textbox3_head.gif') no-repeat;
        height:12px;
    }
    .textbox3_foot {
        background:url('images/textbox3_foot.gif') no-repeat;
        height:11px;
    }
    .textboxH_head {
        background:url('images/textboxH_head.gif') no-repeat bottom;
        height:32px;
    }
    .textboxH_foot {
        background:url('images/textboxH_foot.gif') no-repeat;
        height:10px;
    }
    .textboxN_head {
        background:url('images/textboxN_head.gif') no-repeat;
        height:23px;
    }
    .textboxN_foot {
        background:url('images/textboxN_foot.gif') no-repeat;
        height:16px;
    }
    .difference1 {
        padding-top:6px;
    }
	.videobox {
		background: #fff;
		width:320px;
        padding:10px;
	}
    
    #footer {margin-top:40px;}
  

/* ----------------------------------------
    4. Navigation
   ---------------------------------------- */
    #navigation ul li, #footer ul li {
        display:inline;
    }
    #navigation ul li a {
        float:left;
        width:111px;
        background:url(images/navbg.jpg) no-repeat center top;
        line-height:22px;
        text-transform:uppercase;
        margin-left:5px;
        text-align:center;
        color:#FFF;
        font-size:0.8em;
        height:25px;
    }
    #navigation ul li a:hover {
        background:url(images/navbg_over.jpg) no-repeat center top;
    }
    
    ul#subnav, #categorylistbox ul {
        width:90%;
        margin:0 auto;
        list-style:none;        
    }
    #categorylistbox ul {
        width:100%;
    }
    ul#subnav li a, #categorylistbox ul li a.category-products, #faqs div.on, #faqs div.off, #newslist a {
        display:block;
        line-height:30px;
        border-bottom:1px solid #BEBEBE;
        color:#0066CC;
        padding-left:5px;
        font-weight:bold;
        font-size:1em; }
    
    #categorylistbox ul li a.category-products {
        width:90%;
        margin:0 auto;
    }
        
    ul#subnav li a:hover, #categorylistbox ul li a.category-products:hover, #footer ul li a:hover, #faqs div.on:hover, #faqs div.off:hover, #newslist a:hover, #newslist a.current, ul#subnav li a.current {
        color:#CC3366;
    }
   
    ul#subnav li a.last, #footer ul li a.last { border:0;}
    
    #footer ul li a {
        color:#2B70A2;
        padding-right:10px;
        border-right:1px solid #999;
        margin-right:5px;
        font-size:0.8em;
    }
    #footer #previewsite a {
        float:right;
        font-size:0.8em;
        color:#999;
    }
     #footer #previewsite a:hover {
        color:#CC3366;
     }

/* ----------------------------------------
    5. Classes
   ---------------------------------------- */
    
    .clearall {
        clear: both;
        font-size: 0px;
        height: 0px;
        line-height:0;
        padding:0;
        margin:0;
    }
    .alignright {
        float:right;
        padding:3px 0;
    }
   
    .floatright { float:right; }
    .floatleft { float:left; padding-right:10px; }
    
    div.hide {display:none; width:0; overflow:hidden;}
    div.show {clear:left;}
    
    #faqs div.on, #faqs div.off, #newslist a {
        cursor:pointer;
        line-height:1.1em;
        padding:0.8em;
        font-size:1em;
    }
    #newslist a {
        padding-left:0;
    }
    .story {
        padding:0.8em 0;
    }
    #faqs div.on {
        color:#CC3366;
    }


/* ----------------------------------------
    6. FORMS
   ---------------------------------------- */
    .pagecontact input, .pagecontact textarea, .pagecontact select, .pagesample input {
        color:#666;
        font-family:Verdana;
        font-size:1em;
        width:180px;
    }
    .pagecontact FORM .formrow, .pagenews FORM .formrow, .pagesample FORM .formrow {
        clear:both;
        margin-bottom:4px;
    }
    .pagecontact FORM LABEL,.pagesample FORM LABEL, .pagecontact span.label, .pagesample span.label, .pagenews FORM LABEL, .pagenews FORM span.label {
        width:8em;
        float:left;
        clear:left;
        margin-right:0.5em;
    }
    .pagesample FORM LABEL {
        width:9em;
    }
    .pagenews FORM span.label, .pagenews FORM LABEL {
        width:12em;
    }
    .pagecontact FORM, .pagesample FORM   {
        margin-top:1em;
    }
    .pagecontact FORM input.submit,.pagenews FORM input.submit, .pagesample FORM input.submit  {
        width:auto;
    }
    
    #human {
        visibility:hidden;
        display:none;
    }
    
    input.checkbox {
        width:auto;

    }
    
    label.error {
        float:none !important;
        clear:both !important;
        width:auto !important;
        display:block;
        color:#ff0000;
        margin-left:9.5em;
    }
    input.error {
        border:1px solid #ff0000 !important;
    }


/* ----------------------------------------
    7. Other
   ---------------------------------------- */

    #debug {
        border: 1px solid #333;
        margin: 10px;
        padding: 10px;
        background-color: #CCC;
    }
    #debug h1 {
        text-align: center;
        font-size: 1em;
    }
    #debug h2 {
        font-size: 0.9em;
    }

/* ----------------------------------------
    8. The Shop
   ---------------------------------------- */
    body#page2Body .leftBoxContainer, body#page2Body .rightBoxContainer, body#privacyBody .leftBoxContainer, body#privacyBody .rightBoxContainer, body#conditionsBody .leftBoxContainer, body#conditionsBody .rightBoxContainer {
        display:none;
    }

    TABLE#contentMainWrapper TD {
        vertical-align:top;
    }
    TABLE#contentMainWrapper TD TABLE TD {
        vertical-align:middle;
    }

    .centerColumn {
        padding:0.8em 1.2em 0.8em 0;
    }

    .centerColumn form {
        padding-top:0;
        margin-top:0;
    }
    .centerColumn form legend, .centerColumn h2 {
        color:#CC3366;
        font-size:1.2em;
        padding:0.6em 0 0.4em;
    }
    TH#scProductsHeading, TH#scQuantityHeading {
        text-indent:10px;
    }
    #cartImage {
        margin:0 1em;
    }
    .cartProductDisplay {
        padding-left:10px;
    }
    .centerColumn th {
        color:#CC3366;
        font-weight:bold;
        text-align:left;
        
    }
    .centerColumn #cartContentsDisplay TD {
        text-align:left;
    }
    .centerColumn ul,  .centerColumn ol {
        margin-left:2em;
    }
    #navColumnOne {
        padding-top:10px;
    }
    
    #categorylistbox, #shoppingcart, #blanksidebox, #cartsummary, #teacherbox {
        border:0;
        margin:0;
        padding:0;
    }
    
    #navColumnTwo .sideBoxContent { background:none;color:#CC3366;}
    
    #navColumnTwo .sideBoxContent a { color:#0066CC;}
    
    #navColumnTwo .sideBoxContent a:hover { color:#CC3366;}
    
    #navColumnOneWrapper, #navColumnTwoWrapper {
        margin:0;
    }
    #categorylistboxHeading {
        display:none;
    }
    #cartsummary {
        background:url(images/cartboxbg.jpg) no-repeat top center;
        height:90px;
        padding-top:27px;
    }
    #blanksidebox {
        background:url(images/checkoutboxbg.jpg) no-repeat top center;
        height:100px;
        padding-top:27px;
    }
    #cartsummaryHeading, #blanksideboxHeading {
        margin:0;
        background:none;
        color:#CC3366;
        text-align:left;
        padding:2px 0 10px 15px;
        font-size:1.6em;
        font-weight:normal;}
    
    #blanksideboxContent, #cartsummaryContent {
        padding:0 15px;
    }
    
    /* product info page */
    
    h2#productPrices {
        padding:0;
    }
    .product_image, .basket_box {
        width:100%;
        height:288px;
        text-align:center;
        padding:5px 0;
    }
    .basket_box {
        width:100%;
        height:270px;
        background-color:#E9E9E9;
        border:1px solid #999;
         -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        text-align:center;
        padding:5px 0;
    }
    .product_image a {
        margin:0 auto;
        text-align:center;
    }
    .basket_box {
        height:auto;
    }
    h1#productName, h2#productPrices, .centerColumn h1 {
        background:none;
        padding-left:0;
        margin:0;
        color:#CC3366;
        font-size:1.8em;
        font-weight:normal;
    }
    #productDescription {
        padding:1.2em 0;
    }
    #extrainfo {
        background-color:#f4f4f4;
        padding:10px;
        margin-top:10px;
    }
    a#more_info {
        font-size:1.2em;
    }
    .product_buy {
        width:100%;
        background-color:#F3F3F3;
        border:2px solid #999;
         -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        text-align:center;
        color:#CC3366;
        font-weight:bold;
        font-size:1.2em;
        padding:0.6em 0; }
        
    .product_buy .col {
        float:left;
        width:40%;
        padding:0.7em 10px 0 10px;
        text-align:left;
    }
    .product_buy .floatright {
        float:right;
        text-align:right;
        padding-top:0;
    }
    #productsListingTopNumber, #productsListingBottomNumber {
        display: none;
    }
    #productAttributes {
        clear:both;
    }
    #productAdditionalImages {
        position:absolute;
        left:-9999px;
        top:-9999px;
    }
    .taxmessage {
        font-size:0.6em;
        font-weight:normal;
    }
    .wrapperAttribsOptions {
        padding:0 10px;
        margin:0.2em 0;
        text-align:left;
    }
    .attributesComments {
        font-size:1em;
        padding:0.4em 10px;
        text-align:left;
    }
    #productAttributes label {
        color:#333;
        font-size:0.8em;
        font-weight:normal;
        width:11.4em;
        float:left;
        clear:both;
        text-align:left;
    }
    
    ADDRESS.addressblock {
        padding:0.2em 0 0.6em 2em;
    }
    #hideshow {
        display:none;
    }
    
    .teachernotes li {
        list-style:none;
    }
    #teacherbox {
        background:url(images/teacherboxbg.jpg) no-repeat top center;
        height:200px;
        padding-top:27px;
    }


#shopnavtab {
	background: url("images/navbg_over.jpg") no-repeat scroll center top transparent !important;
}
#shopnavtab:hover {
	background: url("images/navbg.jpg") no-repeat scroll center top transparent !important;
}