/* CSS Document */

/* CSS for the Dyslexic Dyslexia Consultant website at theddc.org.uk
Contains main styling for entire site
Copyright theDDC.org.uk 2009 */


/* Generic Redefined HTML tags */
* {margin:0;padding:0;border:0;}
html {font-size: 62.5%;}
body {font-family: arial, sans-serif; color:#000000; 
text-align:center;background-repeat: repeat-x;
background-image:url('http://www.theddc.org.uk/images/bg_runner.jpg');
background-position: left top;
background-color:#031219;}
ul {list-style:none;}
a {text-decoration:none; color:#000; cursor:pointer;}
a:hover {text-decoration:underline; color:#000;}
h1 {font-size:3em; padding0em;}
h2 {font-size:2.6em; padding:0.5em 0em 0.3em 0em;}
h3 {font-size:2.2em; padding:0.5em 0em 0.3em 0em;}
h4 {font-size:1.4em; padding:0.6em 0em 0.4em 0em;}
h5 {font-size:1.6em; padding:0.4em 0em 0.2em 0em;}

input,textarea {border:solid 1px #000; background-color:#fff;}
select {font-size: 1em; border:solid 1px #000; background-color:#fff;}

/* Generic Class Styles */
.bold {font-weight:bold;}
.noDisplay {display:none;}
.colour1 {color:#FFF;}
.colour2 {color:#0d276b;}
.colour3 {color:#FF0000;}
.small {font-size:0.5em;}
.left {float:left;}
.centralise_top {width:800px; text-align:center; height:100%; margin: 0 auto 0 auto;}
.centralise_base {width:800px; height:100%; margin: 0 auto 0 auto;}

/* AccessOptions */ 
/* Font Colours */
.black_font	{ color:#000; }
.white_font	{ color:#fff; }
.green_font	{ color:#090; }
.blue_font	{ color:#009; }
.grey_font	{ color:#666; }
.yellow_font	{ color:#fffc00; }

.black_font .colour1 { color:#000; }
.white_font .colour1 { color:#fff; }
.green_font .colour1 { color:#090; }
.blue_font .colour1 { color:#009; }
.grey_font .colour1 { color:#666; }
.yellow_font .colour1 { color:#fffc00; }

.black_font .colour3 { color:#000; }
.white_font .colour3 { color:#fff; }
.green_font .colour3 { color:#090; }
.blue_font .colour3 { color:#009; }
.grey_font .colour3 { color:#666; }
.yellow_font .colour3 { color:#fffc00; }

/* Background Colours */
.black_bg	{ background-color:#000; }
.pink_bg	{ background-color:#f9b; }
.green_bg	{ background-color:#0b0; }
.blue_bg	{ background-color:#00b; }
.grey_bg	{ background-color:#999; }
.cream_bg	{ background-color:#fec; }

/* Font Sizes */

.medium_font	{ font-size:1em; }
.large_font		{ font-size:1.4em; }
.x_large_font	{ font-size:1.8em; }
.xx_large_font	{ font-size:2.5em; }


/* Font Family */

.arial	{ font-family: Arial, helvetica, sans-serif; }
.tohoma		{ font-family: Tahoma, arial, helvetica, sans-serif;}
.times	{ font-family: Times new roman, serif; }
.georgia	{ font-family: Georgia, Times new roman, serif; }
.comic	{ font-family: Comic Sans MS, comic, sans-serif; }

#accessOptions {float:left; text-align:right;width:100%; background-color:#000; color:#fff;
padding:0px 10px;}
#accessOptions a {color:#fff; }
#accessOptions h1 {float:left;padding:5px 0px; margin:0px; font-size:2em;}
#accessOptions p {float:left; font-size:1.6em; padding:7px 20px; font-weight:bold;}
#accessOptions p.font_size { padding:1px 10px;}
#accessOptions p a.access_a_small {font-size:0.5em;}
#accessOptions p a.access_a_mid {font-size:1em;}
#accessOptions p a.access_a_large {font-size:1.5em;}

/* Site Layout */

#outerContainer {width:100%; float:left; height:auto;}/* Level 1 */

#bg_top {background-image:url('http://www.theddc.org.uk/images/bg_top.jpg');width:100%; float:left; height:auto;
background-position: 50% top; background-repeat:no-repeat;
}
#bg_repeat {background-image:url('http://www.theddc.org.uk/images/bg_repeat.jpg');width:100%; float:left; height:auto;
background-position: 50% top; background-repeat:repeat-y; margin:40px 0px 0px 0px;
}


#innerContainer {width:760px; height:100%; margin: 0 auto 0 auto; text-align: left;}



/* ----------------------------- end site layout ----------------------------- */


/* Header */

#headerContainer {float:left; width:760px;}

#headerContainer h1 {float:left; margin:0px 25px 0px 5px;}
#mainMenu {float:left; font-family :georgia, times new roman, times, serif;
margin:20px 0px 0px 20px; height:170px;}
#mm_row1 {float:left; border-left:1px solid #989d9f; margin: 0px 30px 0px 10px;font-weight:normal;
padding:5px 0px 0px 20px; height:112px;
font-family: comic sans MS, comic sans, comic, arial, verdana, helvetica, sans-serif;}
#mm_row2 {float:left;border-left:1px solid #989d9f; margin: 0px 0px 0px 10px;font-weight:normal;
padding:5px 0px 0px 20px; height:112px;
font-family: comic sans MS, comic sans, comic, arial, verdana, helvetica, sans-serif;}
#mainMenu li a {color:#fff; font-size:1.6em; line-height:1.4em;
}

.wrapper {
  margin: 50px auto;
  width: 280px;
  height: 370px;
  background: white;
  border-radius: 10px;
  -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.3);
  -moz-box-shadow:    0px 0px 8px rgba(0,0,0,0.3);
  box-shadow:         0px 0px 8px rgba(0,0,0,0.3);
  position: relative;
  z-index: 90;
}

.ribbon-wrapper-green {
	width: 240px;
	height: 200px;
	overflow: hidden;
	position: absolute;
	top: -26px;
	right: -83px;
}

.ribbon-green {
	font: bold 15px Sans-Serif;
	color: #333;
	text-align: center;
	text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	position: relative;
	padding: 5px 0;
	left: -25px;
	top: 52px;
	width: 250px;
  background-color: #BFDC7A;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45)); 
  background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45); 
  background-image:    -moz-linear-gradient(top, #BFDC7A, #8EBF45); 
  background-image:     -ms-linear-gradient(top, #BFDC7A, #8EBF45); 
  background-image:      -o-linear-gradient(top, #BFDC7A, #8EBF45); 
  color: #6a6340;
  -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
  -moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
  box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}

.ribbon-green:before, .ribbon-green:after {
  content: "";
  border-top:   3px solid #6e8900;   
  border-left:  3px solid transparent;
  border-right: 3px solid transparent;
  position:absolute;
  bottom: -3px;
}

.ribbon-green:before {
  left: 0;
}
.ribbon-green:after {
  right: 0;
}​

.ribbon_headline, .ribbon_footline {
	display: inherit;
}

/* ----------------------------- end header ----------------------------- */



/* Board */

#mainContent {float:left; width:760px;}

#mainArticle {float:left; color:#ffffe8; width:420px; 
font-family: comic sans MS, comic sans, comic, arial, verdana, helvetica, sans-serif;
margin:0px 0px 40px 0px;}
#mainArticle p {color:#ffffe8; padding:6px 0px 8px 0px; font-size:1.4em;}
p.pro_quote {color:#ffffe8; padding:6px 0px 8px 40px; font-size:1.7em; width:220px;
font-family: comic sans MS, comic sans, comic, arial, verdana, helvetica, sans-serif;}
#mainArticle a {color:#ffffe8;}
#mainArticle ul {list-style:disc; padding:0px 0px 10px 30px;}
#mainArticle li {font-size:1.5em; padding:4px 0px 6px 5px;}
#mainArticle blockquote {font-weight:normal; font-size:1.5em; padding:15px 0px 0px 0px; color:#fff;}
#mainArticle blockquote ul {padding:0px 0px 0px 30px;}
#mainArticle blockquote li {font-size:1em; padding:4px 0px 6px 5px;}
#sideBar {float:right; width:290px;}
#sideBar .side_item {padding:0px 0px 20px 0px; float:left;}
#youtube_link {float:right; margin:0px 20px 0px 0px;}
#youtube_link_wide {float:left; margin:0px 20px 30px 40px; width:400px;}
#sideBar p.link_title {font-family :georgia, times new roman, times, serif;
color:#ffffe8; font-size:1.4em;font-weight:bold; float:left;
padding:12px 5px 0px 0px;}
#sideBar p.vid_link {font-weight:bold;font-family :georgia, times new roman, times, serif; color:#ffffe8; font-size:1.2em;}
#sideBar p.vid_link a { color:#ffffe8;}
#promo {border:1px #696 solid; padding:10px;}
#mainArticle #promo p {color:#ff0;}
#promo h2 {color:#ff0; font-size:1.8em; padding:0px 0px 5px 0px;}
/* ----------------------------- end board ----------------------------- */


/* Contact Form Side */

#contactBox {background-image:url('http://www.theddc.org.uk/images/contact_bg_long_yellow.png');
float:left; width:220px; 
background-position: left top; background-repeat:no-repeat;
padding:10px 20px 20px 30px;
font-family: comic sans MS, comic sans, comic, arial, verdana, helvetica, sans-serif;
margin:10px 10px 0px 20px;
}
#contactBox p {font-size:1.2em;padding:0px 0px 4px 0px;}
p.video {margin:0px 40px 0px 40px; float:left; width:280px;}
#contactBox form div {float:left; margin:2px 0px; }
#contactBox label {float:left; width:50px; font-size:1.3em;}
#contactBox input {width:120px;}
#contactBox textarea {width:170px; height:99px;}
#contactBox div.submitBox {float:left; width:170px; text-align:right;}
#contactBox input.submit {width:80px;}
#contactBox input.submit:hover {cursor:pointer; color:#fff; background-color:#212516;}
p#box_base {float:left; margin:3px 30px 0px 20px; text-align:right;}
/* ----------------------------- end form ----------------------------- */

/* Footer */

#footerContainer {width:100%; float:left; height:100%;  text-align: center;
background-image:url('http://www.theddc.org.uk/images/bg_footer.png');width:100%; float:left; height:auto;
background-position: 50% top; background-repeat:no-repeat;
padding:80px 0px 0px 0px;
}
#footerBar {float:left; width:100%; text-align:center;font-family :georgia, times new roman, times, serif;
background-color:#010405;padding:10px 20px 10px 20px}
#footerMenu {width:800px; height:100%; margin: 0 auto 0 auto; text-align: center;
}

#footerMenu li {float:left; padding:0px 20px 0px 20px;
border-right: solid 1px #fff; font-size:1.6em;}
#footerMenu li.first {padding:0px 20px 0px 0px;}

#footerMenu li.last {border-right:none;}

#footerMenu li a {color:#fff;}

#footerInfo {float:left; width:760px; text-align:left; padding:0px 0px 10px 20px; background-color:#031219;}
#footerInfo_left {float:left; width:400px;}
#footerLinks {float:left; padding:10px 0px 10px 0px; clear:both; width:500px;}
#footerLinks img {margin:0px 0px 0px 0px;}
#footerLinks p {float:left; margin:0px 10px 0px 0px;}
#footerInfo p {float:left; padding:5px 0px; color:#fff; font-size:1.2em;}

#footerInfo_right {float:right; padding:10px 0px;}
#footerInfo_right img {float:left; padding:5px}

/* ----------------------------- end footer ----------------------------- */

/* Access Panel */

#accessMenu {float:left; width:500px; padding:0px 0px 0px 150px}
#access_panel {float:left; width:800px;}


#access_panel h4 {color:#fff;float:left;font-size:1.4em; padding:0px 15px 0px 0px;}

#ap_fontColour {width:600px; float:left; padding:11px 20px 0px 20px;}
#ap_fontColour span {font-size:1.5em; }
#ap_bgColour { width:600px; float:left; padding:11px 10px 0px 20px;}
#ap_bgColour span {font-size:1.5em; padding:0px 5px; margin:0px 5px;}
#ap_bgColour {font-weight:bold;}
#ap_fontSize {width:600px; float:left; padding:11px 20px 0px 20px;}
#ap_fontSize h4 {padding:10px 10px 0px 0px;}
#ap_fontSize a {color:#fff;}
#ap_fontFace { width:600px; float:left; padding:11px 20px 0px 20px;
margin:0px 0px 10px 0px;}
#ap_fontFace a {font-size:1.5em; color:#fff;}


#access_panel_inside {width:360px; float:left; text-align:left;
padding:0px; margin:0px; border: 2px solid #ddd;}
#access_panel_inside h4 {color:#fff;float:left;font-size:1.4em; padding:10px 15px 5px 0px;
width:340px;}
#access_panel_inside p {padding:0px;}
#ais_fontColour {width:300px; float:left; padding:11px 20px 0px 20px;}
#ais_fontColour span {font-size:1.5em; }
#ais_bgColour { width:300px; float:left; padding:11px 20px 0px 20px;}
#ais_bgColour span {font-size:1.5em; padding:0px 10px; margin:0px 0px;}
#ais_bgColour a {color:#fff; font-weight:bold;}
#ais_fontSize {width:300px; float:left; padding:11px 20px 0px 20px;}
#ais_fontSize h4 {padding:10px 10px 0px 0px;}
#ais_fontSize a {color:#fff;}
#ais_fontFace { width:300px; float:left; padding:11px 20px 0px 20px;
margin:0px 0px 10px 0px;}
#ais_fontFace a {font-size:1.5em; color:#fff;}


/* ----------------------------- end access panel----------------------------- */