/* General styles */
	html { overflow:scroll; }

    body {
    	text-align:center;
        margin:0;
        padding:0;
        border:0;			/* This removes the border around the viewport in old versions of IE */
        width:100%;
        min-width:600px;
}
    

/*Fixed Div holds page into center lock do not remove*/        
    
	#fixed {
	   margin:0 auto;
	   width:969px;   		/* you can use px, em or % */
	   text-align:left;
	   
	}
	
	
	/* 'widths' sub menu */
	#layoutdims {
		clear:both;
		background:#eee;
		border-top:4px solid #ccc;
		margin:0;
		padding:6px 15px !important;
		text-align:right;
	}
	
	
/*header styles*/

#header {
        clear:both;
        float:left;
        width:100%;
        padding-bottom: 20px;
    }
	

#topsection{
background: url(../img/cc_headerbar_blank.png) no-repeat left;
height: 136px;
position: relative;
top: 15px;
}

#logo {
position: relative;
top: 0px;
left: 10px;
float: left;
}

#button {
position: relative;
top: 36px;
right: 18px;
float: right;
}

.byline{
position: relative;
top: 28px;	
margin: 0px;
float: left;

}

/* this is the horizontal links */

#subnav
{
position: relative;
top: 11px;
width: 969px;	
height: 70;
background: url(../img/subnav_bg.png) no-repeat;
margin: 0;
padding: 5px 0 0 10px;
float: left;
}
	
	
	/* column container */
	.colmaskheader {
		position:relative;	
		clear:both;
	    float:left;
        width:100%;				/* width of whole page */
        height: 20px;
		overflow:hidden;
	background-color: transparent;
	background-image: url(../img/page_top_bg.png);
}


	.colmask {
		position:relative;		/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	    clear:both;
	    float:left;
        width:100%;				/* width of whole page */
		overflow:hidden;
}

/* 1 column full page settings */
	.fullpage { 
	border-left: 1px solid #eee;
	border-right: 1px solid #eee;
	background-color: #fff;
}
	.fullpage .col1 {
        margin:0 15px 20px 15px;
        background: url(../img/fade.jpg) repeat-x;

        	}

/* Footer styles */
	#footer {
        clear:both;
        float:left;
        width:100%;
		border-top:1px dotted #ccc;
    }

#footer p{
color: #808080;
float: left;
display: block;
	position: relative;
	left: 15px;
	top: 15px;
padding-bottom:  15px;	
}

/* below are for other layouts */

#scroll {
width:400px;
height:300px;
margin-left:13px;
margin-right:13px;
border: 1px dotted #aaa;
text-align:center;
float:left;
overflow-y:scroll;
font-weight:normal;
}
#scrollsmall {
width:310px;
height:110px;
margin-left:0px;
margin-right:13px;
text-align:justify;
float:left;
overflow-y:scroll;
font-weight:normal;
}



/* holy grail 3 column settings */
	.holygrail {
	    background: transparent url(../images/bg_grad100.jpg) repeat-x;    	  	/* Right column background colour */
	}
    .holygrail .colmid {
        float:left;
        width:200%;
        margin-left:-200px; 	/* Width of right column */
        position:relative;
        right:100%;
        background: #fff url(../images/bg_grad100_purp.jpg) repeat-x;   	/* Centre column background colour */
    }
    .holygrail .colleft {
        float:left;
        width:100%;
        margin-left:-50%;
        position:relative;
        left:400px;         	/* Left column width + right column width */
        background: transparent url(../images/bg_grad100.jpg) repeat-x;    	/* Left column background colour */
    }
    .holygrail .col1wrap {
        float:left;
	    width:50%;
	    position:relative;
	    right:200px;        	/* Width of left column */
	    padding-bottom:1em; 	/* Centre column bottom padding. Leave it out if it's zero */
	}
	.holygrail .col1 {
        margin:0 215px;     	/* Centre column side padding:
                            	Left padding = left column width + centre column left padding width
                            	Right padding = right column width + centre column right padding width */
        position:relative;
	    left:200%;
	    overflow:hidden;
	}
    .holygrail .col2 {
        float:left;
        float:right;			/* This overrides the float:left above */
        width:170px;        	/* Width of left column content (left column width minus left and right padding) */
        position:relative;
        right:15px;         	/* Width of the left-had side padding on the left column */
    }
    .holygrail .col3 {
        float:left;
        float:right;			/* This overrides the float:left above */
        width:170px;        	/* Width of right column content (right column width minus left and right padding) */
        margin-right:45px;  	/* Width of right column right-hand padding + left column left and right padding */
        position:relative;
        left:50%;
    }
    /* 3 column blog style settings */
	.blogstyle {
	    background: #dbf3ff;    	/* Right column background colour */
	}
    .blogstyle .colmid {
        float:left;
        width:200%;
        margin-left:-200px; 	/* Width of right column */
        position:relative;
        right:100%;
        background: #fff url(../images/bg_grad100.jpg) repeat-x;    	/* Centre column background colour */
    }
    .blogstyle .colleft {
        float:left;
        width:100%;
        margin-left:-200px; 	/* Width of centre column */
        background:#fff;    	/* Left column background colour */
    }
    .blogstyle .col1wrap {
        float:left;
	    width:50%;
	    padding-bottom:1em; 	/* Centre column bottom padding. Leave it out if it's zero */
	}
	.blogstyle .col1 {
        margin:0 15px 0 415px;	/* Centre column side padding:
                            	Left padding = left column width + centre column left padding width
                            	Right padding = right column width + centre column right padding width */
        position:relative;
	    left:100%;
	    overflow:hidden;
	}
    .blogstyle .col2 {
        float:right;
        width:170px;        	/* Width of left column content (left column width minus left and right padding) */
        position:relative;
        left:185px;         	/* Width of the left-had side padding on the left column */
    }
    .blogstyle .col3 {
        float:right;
        width:170px;        	/* Width of right column content (right column width minus left and right padding) */
        position:relative;
        left:555px;
    }
   

    /* 2 column EVEN settings */
	.twoequal {
	    background: #FFF;
	}
	.twoequal .colright {
        float:left;
        width:200%;
		position:relative;
		left:485px;

    }
    .twoequal .col1wrap {
	    float:right;
	    width:50%;
	    position:relative;
	    right:200px;
	    padding-bottom:1em;
	}
	.twoequal .col1 {
        margin:0 15px 0 215px;
	  width:475px;
	    position:relative;
	    right:100%;
	    overflow:hidden;
	    background: url(../img/fade.jpg) repeat-x;

	}
    .twoequal .col2 {
        float:left;
        width:465px;
        position:relative;
        right:470px;
        background: url(../img/fade.jpg) repeat-x;

    }




    /* 2 column left menu settings */
	.leftmenu {
	    background: #ccfbff;
	}
	.leftmenu .colright {
        float:left;
        width:200%;
		position:relative;
		left:200px;
        background:#fff;
    }
    .leftmenu .col1wrap {
	    float:right;
	    width:50%;
	    position:relative;
	    right:200px;
	    padding-bottom:1em;
	}
	.leftmenu .col1 {
        margin:0 15px 0 215px;
	    position:relative;
	    right:100%;
	    overflow:hidden;
	}
    .leftmenu .col2 {
        float:left;
        width:170px;
        position:relative;
        right:185px;
    }
    
  
    /* 2 column right menu settings */
	.rightmenu {
	    background: #FFF;
	}
	.rightmenu .colleft {
        float:left;
        width:200%;
        margin-left:-200px;
        position:relative;
        right:100%;
        background:#fff;
    }
    .rightmenu .col1wrap {
	    float:left;
	    width:50%;
	    position:relative;
	    left:50%;
	    padding-bottom:1em;
	}
	.rightmenu .col1 {
        margin:0 15px 0 215px;
        overflow:hidden;
	}
    .rightmenu .col2 {
        float:right;
        width:170px;
        position:relative;
        left:185px;
    }

--> 
    </style>
    <!--[if lt IE 7]>
    <style media="screen" type="text/css">
    .col1 {
	    width:100%;
	}
    </style>
    <![endif]-->