/* --------------------------------------------------------------
	Site Specific Stylesheet
	Portland School
	2010-01-11
	Author: Jack Howell - www.e4education.co.uk
-------------------------------------------------------------- */

@import url(reset.css); /* Global Reset */
@import url(default.css); /* Sets sensible default styles */
@import url(forms.css); 


/* Typography and Defaults
-------------------------------------------------- */

body                              {margin: 0; background: #fff; color: #333;}
#background                       {background: url(../images/design/background.jpg) top no-repeat; position: relative;}

#background h1, #background h2, #background h3, #background h4, #background h5, #background h6
{ margin: 0.75em 0; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-weight: normal; line-height: 1.25em; color: #999;}

#background h1 { font-size: 28px; }
#background h2 { font-size: 22px; }
#background h3 { font-size: 14px; }
#background h4 { font-size: 12px; }
#background h5 { font-size: 12px; }
#background h6 { font-size: 12px; }

#background a {color: #091d35; text-decoration: none;}
#background a:hover {color: #2b6fc0;}

/* Site specific styling
-------------------------------------------------- */

#container                        {margin: 0 auto; width: 960px; text-align: left; position: relative;}

#header                           {width: 960px; height: 265px; margin: 0 auto; color: #FFF; position: relative; background: url(../images/design/background.jpg) center top no-repeat;}
#header h1, #header h2            {display: none;}

a#homeLink                        {width: 200px; height: 200px; position: absolute; top: 10px; left: 20px;}
a#homeLink span                   {display: none;}

#slideshow                        {position: absolute; top: 10px; left: 250px;}

#accessibilityLinks               {display: inline; font-size: 80%; position: absolute; top: 20px; right: 10px;}
#accessibilityLinks li            {display: inline; text-shadow: 1px 1px 1px #000;}
#accessibilityLinks li a          {margin: 0 .2em; padding: 0; background: url(../images/design/text_link.gif) no-repeat left; color: #fff;}

#vleLogon                         {position: absolute; right: 0; top: 80px; width: 230px;}
#vleLogon h2                      {display: block; margin: 0 0 13px 50px; width: 130px; color: #fff; height: 30px;}
#vleLogon input#username, #vleLogon input#password, #vleLogon input#SubmitCreds {background: none; border: none; float: left; display: inline; color: #fff; height: 18px; width: 210px; padding: 6px 5px; margin: 0 10px 10px 0;}
#vleLogon input#username          {margin: 0;}
#vleLogon input#password          {width: 140px; margin: 10px 10px 0 0;}
#vleLogon input#SubmitCreds       {width: 60px; height: 30px; float: left; cursor: pointer; margin: 7px 0 0 0; padding: 0;}
#vleLogon input#SubmitCreds:hover {text-shadow: 0px 0px 6px #fff, 0px 0px 10px #fff;}

#main                             {width: 960px; position: relative;}

.column {float: left; width: 200px; padding: 0; border-right: 1px dashed #ccc;}
.column.last {border-right: none;}

/* ------------------ start menu classes for standard menus ----------------- */

#menu                             {position: absolute; bottom: 0; left: 0;}
#menu ul#mainMenu                 {margin: 0; padding: 0; width: 960px; height: 40px;}
#menu ul#mainMenu li              {display: inline; float: left; list-style: none; margin: 0 20px;}
#menu ul#mainMenu li.last         {background: none; margin-right: 0;}
#menu ul#mainMenu li a            {display: inline; float: left; padding: 11px 22px 10px; color: #fff; text-decoration: none; text-align: center; text-shadow: 1px 1px 1px #000, 0px 0px 12px #567e96}
#menu ul#mainMenu li a:hover      {text-decoration: none; color: #CCC;}
                    
/* ------------------ ^^ end menu classes for standard menus ^^ ----------------- */

#contentWrapper                   {float: right; width: 740px; display: inline;  position: relative;}

#subnavWrapper                    {float: left; display: inline; padding: 15px 0 0 0; margin: 0; width: 220px;}
#subnavWrapper ul#subNav          {margin: 0; padding: 0;}
#subnavWrapper ul#subNav li                 {display: block; margin: 0; padding: 0; list-style: none;}
#subnavWrapper ul#subNav li a               {float: left; padding: 10px 10px 10px 30px; width: 160px; margin: 0 0 1px 0; display: block; background: #5b1543 url(../images/design/subarrow_off.png) 10px 14px no-repeat; color: #FFF; text-decoration: none;}
#subnavWrapper ul#subNav li a:hover         {color: #CCC;}
#subnavWrapper ul#subNav li.selected a      {background: #5b1543 url(../images/design/subarrow_on.png) 10px 14px no-repeat;}
#subnavWrapper ul#subNav li ul              {margin: 0;}
#subnavWrapper ul#subNav li ul li           {background: none; float: left; display: block; margin: 0 0 1px 0}
#subnavWrapper ul#subNav li ul li a         {padding-left: 13px; width: 160px; margin-left: 12px; background: none; border-left: 5px solid #5b1543; color: #fff;}
#subnavWrapper ul#subNav li.selected ul li a {background: none; color: #333;}

#quickLinks ul, #quickLinks li {padding: 0; margin: 0; list-style: none;}
#quickLinks ul {padding: 10px 0 0 0; clear: both;}
#quickLinks li {display: block; height: 40px; margin-bottom: 10px;}
#quickLinks ul#buttons li a {display: block; width: 190px; height: 27px; padding: 13px 10px 0 0; margin: 0; color: #fff; text-align: right; font-size: 120%; text-shadow: 1px 1px 1px #000;}
#quickLinks ul#buttons li a:hover {text-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff;}
#quickLinks ul#buttons li#quicklink1 a {background: url(../images/design/button_staffwebmail.png) no-repeat;}
#quickLinks ul#buttons li#quicklink2 a {background: url(../images/design/button_studentwebmail.png) no-repeat;}
#quickLinks ul#buttons li#quicklink3 a {background: url(../images/design/button_vle.png) no-repeat;}
#quickLinks ul#buttons li#quicklink4 a {background: url(../images/design/button_vacancies.png) no-repeat;}
#quickLinks ul#buttons li#quicklink5 a {background: url(../images/design/button_prospectus.png) no-repeat;}
#quickLinks ul#buttons li#quicklink6 a {background: url(../images/design/button_esafety.png) no-repeat;}

#breadcrumbsWrapper                      {float: left; padding: 10px 0; margin: 10px 0 20px; width: 740px; font-size: 95%; color: #999; border-bottom: 1px dashed #ccc;}
#breadcrumbsWrapper ul                   {margin: 0; padding: 0; list-style: none; float: left; width: 500px; display: inline;}
#breadcrumbsWrapper p                    {float: left; display: inline; margin: 0;}
#breadcrumbsWrapper li                   {display: inline; margin: 0; padding: 0;}
#breadcrumbsWrapper li a                 {text-decoration: none;  padding: 0 10px; color: #999;}
#breadcrumbsWrapper .last .arrow         {display: none;}

#dateTime                         {float: right; width: 110px; margin: 0; text-align: right; color: #666; }

#content                          {display: inline;}

#content .e4eVideo                {padding: 5px;}

.forcer                           {float: left; width: 0; height: 250px;}

iframe#embed                      {height: 600px;}

#newsFeeds                        {margin: 30px 10px 0px; font-size: 90%;}
#newsFeeds li                     {list-style: none;}
#newsFeeds li a                   {font-size: 110%;}
#newsFeeds img                    {margin: 0px 10px 0px 0px; padding: 0;}

#footerRpt                        {width: 100%; background: url(../images/design/footer_rpt.jpg) repeat-x;}
#footerWrapper                    {width: 100%; background: url(../images/design/footer.jpg) center top no-repeat; margin-top:30px;}
#footer                           {clear: both; margin: 0 auto; height: 170px; padding: 100px 0 0 0; width: 960px; background: url(../images/design/footer.jpg) center top no-repeat; color: #FFF; text-align: center;}
#footer a                         {color: #FFF;}
#copyrightdetails                 {padding: 10px 0 0 0;}

/* Required for the editor in the backend. Make sure background images etc are removed in this attrubute... */
#editor                           {margin: 0; padding: 0; width: 495px; min-height: 590px; background-image: none; background-color: #fff; border: 5px solid #898989; text-align: left; color: 000;}

#editor #mainContent,
#editor #subContent               {border-right: 1px solid #cacaca; min-height: 590px; }

#mainContent                      {float: left; margin: 0; width: 400px;}
#mainContent.twoColumns           {width: 400px;}
#mainContent.even                 {width: 300px;}

#subContent                       {float: right; margin: 0; width: 200px;}
#subContent.even                  {width: 300px;}

/* icons and styles for file attachments
-------------------------------------------------- */
ol.fileAttachmentList                               {min-height: 40px; padding: 0 0 20px 0; margin: 0;}
ol.fileAttachmentList li                            {list-style-type: none; height: 35px; padding-left: 40px; padding-top: 20px; margin-bottom: -10px; background-position: left; background-repeat: no-repeat; }
ol.podcastList li                                   {height: auto !important; }
ol.podcastList li.attachmentDownload_mp3            {background-position: top left;}
ol.fileAttachmentList li.attachmentDownload_doc     {background-image: url(../images/icons/doc.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_mp3     {background-image: url(../images/icons/mp3.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_pdf     {background-image: url(../images/icons/pdf.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_pub     {background-image: url(../images/icons/pub.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_zip     {background-image: url(../images/icons/zip.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_jpg     {background-image: url(../images/icons/jpg.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_jpeg   {background-image: url(../images/icons/jpeg.gif) !important;}
ol.fileAttachmentList li.attachmentDownload_gif     {background-image: url(../images/icons/gif.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_xls     {background-image: url(../images/icons/xls.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_ppt     {background-image: url(../images/icons/ppt.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_rar     {background-image: url(../images/icons/rar.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_rtf     {background-image: url(../images/icons/rtf.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_txt     {background-image: url(../images/icons/txt.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_csv     {background-image: url(../images/icons/csv.gif)  !important;}
ol.fileAttachmentList li.attachmentDownload_png     {background-image: url(../images/icons/png.gif)  !important;}

/* Pagination - change border colours if necessary
-------------------------------------------------- */
div#pagination                    {margin-top: 3px; height: 50px;}
div#pagination .count             {display: inline; float: left; padding: 5px;}
div#pagination .pages             {display: inline; float: right; padding: 5px;}
div.pagination                    {display: inline; float: right; margin: 3px; padding: 3px;}
div.pagination a, .Rows a         {margin: 2px; padding: 2px 5px 2px 5px; border: 1px solid #0c1a27; text-decoration: none;}
div.pagination a:hover,
div.pagination a:active,
.Rows a:hover, .Rows a:active     {border: 1px solid #999; color: #999;}
div.pagination span.current       {margin: 2px; padding: 2px 5px 2px 5px; background: #26537a; border: 1px solid #0c1a27; font-weight: bold; color: #FFF;}
div.pagination span.disabled      {margin: 2px; padding: 2px 5px 2px 5px; border: 1px solid #EEE; color: #DDD;}

/* Countdown Code */
#countdowncontainer {}
#countdown div.special {background: transparent url("/_includes/images/design/smallcountdown.jpg") no-repeat scroll 0 0; width: 14px; height: 23px; float: left;}
#label {text-align: right; background: none #320524!important; width: 186px; height: auto!important; clear: both!important; float: none!important;}
