﻿@charset "utf-8";

/*-----------------------------------------------------------------------------
SMG Training Master Stylesheet

version:   1.0
author:    Daniel Coverdale
website:   www.jellymedia.com

Colour Refs:


-----------------------------------------------------------------------------*/

/* =Resets and Page Setup
-----------------------------------------------------------------------------*/

body
{
  margin:0px;
  padding:0px;
  font-family:Arial, "Times New Roman", Times, serif;
  font-size:12px;
  color:#363636;
  line-height:17px;
  background-color:#fcf5d8;
}

/* =Typography
-----------------------------------------------------------------------------*/

p + p
{
  margin-top: 12px;
}

.smalltext
{
  font-size:11px;
  color:#999;
  line-height:16px;
}

strong
{
  color:#000;
  font-weight:bold;
}

.left
{
  float: left;
}

.right
{
  float: right;
}

.clear
{
  clear: both;
  height: 0;
}

.center
{
  text-align: center;
}

/* Headings */

h1
{
  font-size:30px;
  font-weight:bold;
  line-height:28px;
  margin: .67em 0;
  font-family:Georgia, "Times New Roman", Times, serif;
  font-weight:100;
  font-style:italic;
  color:#e59f04;
}

h2
{
  font-size:20px;
  line-height:24px;
  margin: .75em 0;
  font-family:Georgia, "Times New Roman", Times, serif;
  font-style:italic;
  color:#000;
  font-weight:100;
}

h3
{
  font-size:14px;
  line-height:21px;
  margin: .83em 0;
  color:#000;
  font-family:Georgia, "Georgia", Times, serif;
  font-weight:400;
  font-style:italic;
}

h3.status
{
  color: #FF0000;
}

h4
{
  font-size:13px;
  line-height:21px;
  margin: .83em 0;
  color:#000;
  font-family:Georgia, "Georgia", Times, serif;
  font-weight:400;
  margin-bottom:0px;
}

h2 a
{
  text-decoration:none;
  color:#000;
}

.c1 h1
{
  margin-top:0px;
  padding:0px;
}

.c1 h2
{
  margin-top:0px;
}

/* Heading links */
.c1 h1 a
{
  color: #e59f04;
}

.c1 h1 a:hover
{
  border: 0;
  color: #000000;
}

/* Links */

a
{
  color:#000;
  text-decoration:none;
}

a:hover
{
  border-bottom:1px dotted #000;
}

#content p a, #content ul li a
{
  border-bottom: 1px dotted #000000;
}

/* Branding */

/* Main Nav */

#menu
{
  float:right;
  display:block;
  width:600px;
  text-align:center;
  margin-top:62px;
}

#menu li
{
  display:inline;
  margin:6px;
  font-family:Georgia, "Times New Roman", Times, serif;
  color:#000;
  font-size:16px;
}

#menu li a:hover
{
  background-color:#ffde62;
}


/* =Sub Nav
-----------------------------------------------------------------------------*/




/* =Homepage Content
-----------------------------------------------------------------------------*/

#events
{
  width:290px;
  float:left;
}

#meettheteam
{
  width:210px;
  float:right;
}

/* Main Content */

#header
{
  width:100%;
  background-color:#fffcb0;
  background-image:url(/images/headerbar.jpg);
  background-repeat:repeat-x;
  height:130px;
  margin-bottom:20px;
}

#headercenter
{
  width:860px;
  margin-left:auto;
  margin-right:auto;
  height:129px;
  padding-top:10px;
}

#bannerbg
{
  width:100%;
  background-color:#fffcb0;
  height:243px;
  margin-bottom:60px;
}

#banner
{
  width:860px;
  margin-left:auto;
  margin-right:auto;
}

#logo
{
  width:100px;
  float:left;
  margin-top:42px;
}

#content
{
  width:860px;
  margin-left:auto;
  margin-right:auto;
  margin-bottom:30px;
  height:auto;
}

#subcontent
{
  height:220px;
  width:860px;
  margin-left:auto;
  margin-right:auto;
  margin-top:10px;
  padding-bottom:20px;
  margin-bottom:40px;
  border-top:1px dotted #000;
  padding-top:10px;
}

.c1
{
  width:300px;
  float:left;
  margin-bottom:20px;
}

.c1 ul
{
  margin-left:0px;
  padding-left:0px;
}

.c1 li
{
  list-style-type:none;
}

.c2
{
  width:540px;
  float:right;
  margin-bottom:20px;
}

#nationalcert img
{
  margin-bottom:10px;
}

.c2 h2:first-child
{
  margin-top:0px;
}

.c2 p:first-child
{
  margin-top:0px;
}

.c2 ul
{
  margin-left:5px;
  padding-left:10px;
}

#c3
{
  width:48%;
  float:left;
  margin-right:5px;
  border-top:1px dotted #000;
  margin-top:15px;
}

#c4
{
  width:48%;
  float:right;
  margin-left:5px;
  border-top:1px dotted #000;
  margin-top:15px;
}

#events a:hover, #cpdcourses a:hover, #meettheteam a:hover
{
  background-color:#ffcf52;
}

/* Footer */

#footer .c1 img
{
  margin-top:15px;
}

#footer li 
{
  display:inline;
}

#footer ul
{
  display:block;
margin-left:0px;
padding-left:0px;
}

#footercenter
{
  width:860px;
  margin-left:auto;
  margin-right:auto;
  height:129px;
}

#copyright
{
  border-top:1px dotted #000;
  font-family:Georgia, "Times New Roman", Times, serif;
  font-style:italic;
}

.jellymedia
{
  float:right;
  margin-right:58px;
}

.smgtraining
{
  float:left;
}

#footer
{
  width:100%;
  background-color:#fcf6bb;
  height:190px;
  color:#000;
  margin-top:20px;
}

#quicklinks
{
  width:105px;
  margin-right:10px;
  float:left;
}


#footer h3
{
  font-weight:bold;
}

#aboutus
{
  width:220px;
  margin-right:10px;
  float:left;
}

#contactus
{
  width:170px;
  margin-right:10px;
  float:right;
}



/* Events */

#calendar
{
  width:960px;
  float:left;
  margin-bottom:60px;
}

/* Courses */

.new
{
  width:auto;
  height:auto;
  position:relative;
  right:47px;
  float:right;
  z-index:1;
  margin:0px;
  padding:0px;
  top:-78px;
}

.courseimg
{
  margin-top:20px;
}

#cpdcourses
{
  width:290px;
}

/* Contact page */

#contactdet
{
  width:260px;
  height:130px;
  float:left;

  height:140px;
}

#contactdet li
{
  display:inline;
}

#contactdet ul
{
  display:block;
  margin:0px;
  padding:0px;
}

#map
{
  width:260px;
  height:140px;
  float:right;
}

form p
{
  margin: 0px;
}

form p.margin
{
  margin: 10px;
}

form label
{
  width: 100px;
  display: inline-block;
}

form span.short input
{
  width: 100px;
}

form span.long input
{
  width: 450px;
}

form label.long
{
  width: 150px;
}

form label.longer
{
  width: 100%;
}

form h4.status
{
  font-size: 18px;
  color: #222222;
}

div.table
{
  border: 1px solid #000000;
  width: 250px;
  margin-right: 30px;
  float: left;
}

div.table p
{
  border-top: 1px solid #000000;
  padding: 5px;
}

div.table p:first-child
{
  border-top: 0px;
}

div.noMargin
{
  margin: 0px;
  border-right: 0px;
}

div.bump
{
  margin-bottom: 20px;
}

p.setWidth, p.setWidthWider
{
  float: left;
  clear: both;
}

p.setWidthWider
{
  width: 150px;
}

p.setWidth
{
  width: 60px;
}

p.left, p.setWidth, p.setWidthWider
{
  margin: 2px 0px;
}

/* Registration page */
div#registration label, div#contact label
{
  float: left;
  width: 150px;
}

div#registration input, div#contact input
{
  float: left;
  margin-right: 50px;
}

div#registration p, div#contact p
{
  clear: both;
}

input.fieldError
{
  border: 1px solid #FF0000;
  background-color: #F4C2C2;
}

/* Question boxes */
textarea.approved
{
  border: 1px solid #00AA00;
  background-color: #99EE99;
}

.question span
{
  font-weight: bold;
}

.questionSuccess
{
  color: #488214;
}

.questionFailure
{
  color: #FF0000;
}

/* Feedback */
/* Positions the contact form so it doesn't interfere with any other content, as well as a z-index above any other elements on the page */
#feedbackFormContainer
{
  position:fixed;
  top:20%;
  z-index:1;
}

/* Hides the whole contact form until needed */
#feedbackForm
{
  height:289px;
  width:558px;
  background-color:#515151;
  border:1px solid #929191;
  padding:7px 12px;
  color:#fff;
  display:none;
}

/* Loading bar that will appear while the ajax magic is happening */
.bar
{
  display:none;
  background:url('/images/ajax-loader.gif') no-repeat center;
  margin-top:100px;
  height:40px;
  width:230px;
}

/* Hides the confirmation message until needed */
#messageSent
{
  display:none;
}

/* This hides the form validation alert messages until needed */
#feedbackForm span
{
  display:none;
  font-size:9px;
  line-height:10px;
  padding-left:6px;
  color:#f5c478;
}

/* Hides the darkening layer for the Modal effect. The z-index is necessary for layering purposes, and be sure to keep the positioning/height/width the same */
#backgroundPopup
{
  display:none;
  position:fixed;
  _position:absolute;
  height:100%;
  width:100%;
  top:0;
  left:0;
  background:#000;
  z-index:11;
}

#feedbackForm .feedback
{
  float: right;
  text-align: center;
}

/* Form styling from here on out. There is nothing in here that you HAVE to use to get this to work */
#feedbackForm textarea, #feedbackForm input, #feedbackForm .feedback
{
  background:#6d6d6d;
  color:#fff;
  border:1px solid #8a8a8a;
  line-height:14px;
  font-size:11px;
  padding:2px 2px 0px;
}

#feedbackForm h2, #feedbackForm label strong
{
  color: #FFFFFF;
}

#feedbackForm input, #feedbackForm .feedback
{
  height:20px;
  width:180px;
  padding:0px;
}

#feedbackForm textarea
{
  height:114px;
  width: 547px;
  font-family:Verdana, Geneva, sans-serif;
}

#feedbackForm .submit
{
  border:1px solid #aba8a8;
  background:#e5e5e5;
  text-transform:uppercase;
  color:#4d4d4d;
  font-weight:bold;
  padding:7px 16px 7px 14px;
  height:37px;
  width:124px;
  cursor:pointer;
  float:left;
  margin-top:196px;
}

#feedbackForm .submit:active
{
  background:#cacaca;
}

#feedbackForm label
{
  padding-left:4px;
  font-weight:bold;
}

#feedbackForm p
{
  padding-bottom:8px;
}

#feedbackForm .input_boxes
{
  float:left;
  width:204px;
}

#dummycontent
{
  padding-top:100px;
  height:900px;
  position:relative;
}

.bottomlink
{
  position:absolute;
  bottom:0;
}
