/*
Theme Name: SHOC
Version: 1.0
Author: Creative Jar
Author URI: http://www.creative-jar.com
Description: SHOC template theme.
*/

* {
    margin:                 0;
    padding:                0;
}

body {
    background:             rgb(255,255,255);
    color:                  rgb(0,0,0);
    font:                   14px 'Convergence', sans-serif;    
}

.wrapper {
    max-width:              100%;
    overflow:               hidden;
    position:               relative;
}

/* Global */

img {
    border:                 0;
}

h1, h2, h3, h4, p, ul, ol {
    padding:                10px 0;     
}

h1 {
    font:                   34px 'Covered By Your Grace', sans-serif;
    font-weight:            normal;
    color:                  #ea475f;
    padding:                0;
}

h2 {
    font-size:              20px;
    font-weight:            normal;
    color:                  rgb(234,71,95);
}

ul, ol {
    margin-left:            20px;
}

a {
    color:                  rgb(0,0,0);
    text-decoration:        underline;
}

a:hover {
    color:                  rgb(0,112,74);
    text-decoration:        underline;
}

.container {
    margin:                 0 auto;
    padding:                0;
    width:                  980px;   
}

.container:after {
    content:                "";
    clear:                  both;
    display:                block;
}

.clear {
    clear:                  both;
}

/* Forms */

form label {
    padding:                5px 5px 0 0;
}

form input[type=text] {
    background:             rgb(255,255,255);
    border:                 none;
    padding:                4px 5px;
    width:                  140px;
}

form input[type=submit] {
    background:             rgb(30,30,30);
    border:                 none;
    color:                  rgb(255,255,255);
    cursor:                 pointer;
    padding:                3px 5px;
}

/* Search form */

form#searchform label, 
form#searchform input[type=text] {
    float:                  left;
}

form#searchform input[type=text] {
    margin-right:           5px;
}

/* newsletter sign up form*/
form#newsletter-signup {
    float:                  right;
    width:                  428px;
    height:                 25px;
    margin:                 20px 0 0 0;
    text-align:             right;  
    display:                none;
} 

form#newsletter-signup:after {
    content:                "";
    clear:                  both;
    display:                block;
} 

form#newsletter-signup label {
    font:                   22px 'Covered By Your Grace', sans-serif;
    color:                  rgb(51,51,51);
    float:                  left;
    line-height:            26px;
    padding:                0 10px 0 0;
 }
 

form#newsletter-signup input[type=email], form#newsletter-signup input[type=text]  {
    border:                 0;
    border-top:             2px solid rgb(92,92,92);
    border-bottom:          2px solid rgb(92,92,92);
    border-left:            2px solid rgb(92,92,92);
    width:                  198px;
    height:                 20px;
    padding:                0 5px;
    float:                  left;
    margin:                 0;
} 

form#newsletter-signup input[type=image] {
    padding:                3px 5px 2px 5px;
    vertical-align:         bottom;
    border-top:             2px solid rgb(92,92,92);
    border-bottom:          2px solid rgb(92,92,92);
    border-right:           2px solid rgb(92,92,92);
    margin:                 0;
    float:                  left;
    width:                  12px;
}

form#newsletter-signup input[type=email].error, 
form#newsletter-signup input[type=image].error {
    border-color:                       red;   
}


form#contact fieldset {
    border:                 0;
    margin:                 10px 0 0 0;
    padding:                20px 0;
}

form#contact fieldset dl {
    padding:                15px 0 5px 0;
    border-top:             1px solid rgb(0,0,0);
    border-bottom:          1px solid rgb(0,0,0);
}

form#contact fieldset dt {
    width:                  200px;
    float:                  left;
    padding:                0 0 10px 0;
    text-align:             left;
}

form#contact fieldset dd {
    padding:                0 0 10px 0;
}

form#contact fieldset input[type=text], form#contact fieldset input[type=email] {
    border:                 1px solid rgb(0,0,0);
    width:                  200px;
    height:                 15px;
    padding:                2px;
}

form#contact fieldset input[type=submit] {
    margin-top:             10px;
    float:                  right;
    background-color:       rgb(229,25,55);
    font-size:              15px;
    padding:                7px 10px;
    font-weight:            bold;
}

form#contact fieldset input[type=submit]:hover {
    background-color:       rgb(183,0,27);
}

form#contact fieldset input[type=text].error, 
form#contact fieldset input[type=email].error {
    border-color:           red;
}

/* Header */

header[role=banner] {
    padding:                0;
    margin:                 0;
    background:             url(images/banner-image-bg.png) bottom repeat-x;
}

header[role=banner] .container {   
    min-height:             172px; 
    position:               relative;
}

header[role=banner] #telephone {
    float:                  right;
    color:                  rgb(229,25,55);
    font-size:              22px;
    height:                 25px;
    clear:                  both;
    margin-top:             -75px; 
}

header[role=banner]:after {
    clear:                  both;
    content:                "";
    display:                block;
}

header[role=banner] hgroup {
    float:                  left;
}

header[role=banner] h1 {
    float:                  left;
}

header[role=banner] h1 a {
    color:                  rgb(255,255,255);
    text-decoration:        none;
}

header[role=banner] h2 {
    font:                   55px 'Covered By Your Grace', sans-serif;
    clear:                  both;
    color:                  rgb(51,51,51);
    line-height:            56px;
    padding:                0 0 0 20px;
}

header[role=banner] #image:before, header[role=banner] #image span.before {
    content:                "";
    background:             url(images/banner-image-mask.png);
    height:                 281px;
    width:                  985px;    
    position:               absolute;
    display:                block;
    zoom:                   1;
}

header[role=banner] #image {
    height:                 281px;
    clear:                  both;
    width:                  977px;
    margin:                 10px 0 0 0;
    overflow:               hidden;
    display:                block;
}

header[role=banner] #image img {
    display:                block;
}

header[role=banner] #image #title {
    float:                  right;
    background:             rgba(78,78,76,0.8);
    padding:                5px 30px 10px 20px;
    margin:                 -70px 0 0 0;
    color:                  rgb(255,255,255);
    font-size:              20px;
    min-width:              200px;
    z-index:                3;
    position:               relative;
}

header[role=banner] #image:after {
    clear:                  both;
    content:                "";
    display:                block;
}

header[role=banner] .container:after {
    clear:                  both;
    content:                "";
    display:                block;
}

header[role=banner] .container > ul {
    list-style:             none;
    margin:                 0;
    width:                  470px;
    height:                 211px;
    position:               relative;
}

header[role=banner] .container > ul:before, header[role=banner] .container > ul > span.before {
    content:                "";
    display:                block;
    width:                  379px;
    height:                 92px;
    background:             url('images/cta-background.png') no-repeat;
    position:               absolute;
    left:                   -236px;
    bottom:                 -4px;
}

header[role=banner] .container > ul:after {
    clear:                  both;
    content:                "";
    display:                block;    
}

header[role=banner] .container > ul li {
    float:                  left;
    text-align:             center;
}

header[role=banner] .container > ul li a {
    background:             url(images/cta-links-background.png) no-repeat;
    height:                 101px;
    width:                  100px;
    display:                block;
    font:                   32px Covered By Your Grace, sans-serif;
    color:                  rgb(255,255,255);
    padding:                75px 34px 0 45px;
    line-height:            28px;
    text-decoration:        none;
}

header[role=banner] .container > ul li a:hover {
    text-decoration:        none;
    color:                  rgb(0,0,0);
    background-position:    0 -214px;
}

header[role=banner] .container > ul li:nth-child(2) a {  
    background-position:    -179px 0;
    height:                 131px;
    width:                  98px;
    padding:                35px 20px;
}

header[role=banner] .container > ul li:nth-child(2) a:hover {
    background-position:    -179px -214px;
}

header[role=banner] .container > ul li:nth-child(3) a {  
    background-position:    -317px 0;
    height:                 88px;
    width:                  133px;
    padding:                70px 10px;
}

header[role=banner] .container > ul li:nth-child(3) a:hover {
    background-position:    -317px -214px;
}

header[role=banner] .carousel-wrapper {
    width:					793px; 
    height:                 403px;
    right:                  -283px;
    top:                    150px;
    position:               absolute; 
    clear:                  both;
}

header[role=banner] .carousel-wrapper div.carousel {
	margin:					auto;
	overflow:				hidden;
	width:					793px;   
    height:                 403px;
    position:               relative;
    z-index:                99;
}

header[role=banner] .carousel-wrapper:before, header[role=banner] .carousel-wrapper > span.before {
    content:                "";
    display:                block;
    width:                  100px;
    height:                 403px;
    background:             url('images/carousel-mask-left.png') no-repeat;
    position:               absolute;
    left:                   0;
    top:                    0;
    z-index:                100;
}

header[role=banner] .carousel-wrapper:after, header[role=banner] .carousel-wrapper > span.after {
    content:                "";
    display:                block;
    width:                  693px;
    height:                 29px;
    background:             url('images/carousel-mask-top.png') no-repeat;
    position:               absolute;
    left:                   100px;
    top:                    0;
    z-index:                100;
}

header[role=banner] .carousel-wrapper div.carousel ul {
	list-style: 			none;
	margin:					0;
	width:					999999px;
}

header[role=banner] .carousel-wrapper div.carousel ul:after {
    clear:                  both;
    content:                "";
    display:                block;    
}

header[role=banner] .carousel-wrapper div.carousel ul li {
	float:					left;
	width:					793px;
    height:					403px;    
}

header[role=banner] .carousel-wrapper div.carousel ul li img {
    display:                block;
	max-width:              793px;    
}

header[role=banner] .carousel-wrapper a.previous, 
header[role=banner] .carousel-wrapper a.next {
	color:					rgb(51,51,51);
	cursor: 				pointer;
	display:				inline-block;
	padding:				2px 4px;	
    position:               absolute;
    width:                  10px;
    height:                 10px;
    font:                   65px 'Covered By Your Grace', sans-serif;
    z-index:                102;
    text-decoration:        none;
}

header[role=banner] .carousel-wrapper a.previous {
	left:                   23px;
	top:					144px;
}

header[role=banner] .carousel-wrapper a.next {
	top:					143px;
    left:                   53px;
}

header[role=banner] .carousel-wrapper a.previous:hover {
	text-decoration:        none;
    color:                  rgb(0,112,74);
}

header[role=banner] .carousel-wrapper a.next:hover {
	text-decoration:        none;
    color:                  rgb(0,112,74);
}

header[role=banner] .carousel-wrapper div.carousel ul li div.caption {
    float:                  right;
    background:             rgba(78,78,76,0.8);
    padding:                10px 30px 10px 20px;
    margin:                 -190px 0 0 0;
    color:                  rgb(255,255,255);
    font-size:              20px;
    width:                  550px;
    position:               relative;
    z-index:                101;
}

header[role=banner] .carousel-wrapper div.carousel ul li div.caption a {
    color:                  rgb(255,255,255);
    width:                  313px;
    text-align:             right;
    display:                block;
    padding:                10px 0;
    font-size:              13px;
    text-decoration:        none;
}

header[role=banner] .carousel-wrapper div.carousel ul li div.caption a:after, 
header[role=banner] .carousel-wrapper div.carousel ul li div.caption a span.after {
    font:                   16px 'Covered By Your Grace', sans-serif;
    content:                " >";
}

header[role=banner] .carousel-wrapper div.carousel ul li div.caption blockquote {
    margin:                 25px 0 0 20px;  
    width:                  300px;   
    line-height:            20px;
}

header[role=banner] .carousel-wrapper div.carousel ul li div.caption blockquote:before {
    content:                url(images/open-quote2.png);
    float:                  left;   
    margin:                 -20px 0 0 -20px;  
    width:                  300px;   
}

/* Navigation */

nav[role=navigation] {
    padding:                0 5px 0 0; 
    float:                  right; 
    margin-top:             -70px;  
    margin-right:           248px;
}

nav[role=navigation] ul {
    list-style:             none;
    margin:                 0;
}

nav[role=navigation] ul:after {
    clear:                  both;
    content:                "";
    display:                block;
}

nav[role=navigation] ul li {
    float:                  left;
    margin:                 0;    
}

nav[role=navigation] ul li:after, nav[role=navigation] ul li span.after {
    content:                "|";
    display:                inline-block;
    padding:                0 7px;
    margin-top:             1px;
}

nav[role=navigation] ul li:last-child {
    margin:                 0;
}

nav[role=navigation] ul li:last-child:after {
    content:                "";
    padding:                0;  
}

nav[role=navigation] ul li a {
    display:                block;
    float:                  left;
    font-size:              18px;
    text-decoration:        none;
}

nav[role=navigation] ul li a:hover {
    color:                  rgb(0,112,74);
}

nav[role=navigation] ul li.current_page_item a {
    color:                  rgb(0,112,74);
}

#breadcrumb {
    margin:                 0;
    padding:                5px 0 5px 10px;    
    display:                block;
    list-style:             none;
    margin:                 0;    
}

#breadcrumb li {
    float:                  left;
    margin:                 0;
    color:                  rgb(146,146,146);
}

#breadcrumb li:after {
    content:                "|";
    padding:                0 7px;
}

#breadcrumb li:last-child {
    margin:                 0;
    color:                  rgb(0,112,74);
}

#breadcrumb li:last-child:after {
    margin:                 0;
    content:                "";    
}

#breadcrumb li a {
    text-decoration:        none;
    color:                  rgb(146,146,146);
}

#breadcrumb li a:hover {
    color:                  rgb(0,0,0);
}

/* Main */


#content {
    padding:                10px 0 0 10px;
    margin:                 0;
    clear:                  both;
}

#content:after {
    clear:                  both;
    content:                "";
    display:                block;   
}

section[role=main] {
    float:                  left;
    padding:                0 20px 10px 10px;
    width:                  440px;
    margin:                 0;
}

section[role=main].wide {
    width:                  650px;
    padding:                0 20px 10px 0;
}

section[role=main] ul li {
    list-style-image:       url(images/list-1.png);
}

section[role=main] ul li:nth-child(even) {
    list-style-image:       url(images/list-2.png);
}

section[role=main] img.attachment-medium {
    float:                  right;
    padding:                10px 10px 10px 0;
}

/* Posts */

article.post {
	border-bottom:			1px solid rgb(0,0,0);
	margin-bottom:			10px;
}

article.post:after {
    content:                "";
	clear:                  both;
    display:                block;
}

article.post:first-of-type {
	border-top:			    1px solid rgb(0,0,0);
	margin-top:			    10px;
    padding-top:            10px;
}

article.post h1 {
	font:				    18px 'Convergence', sans-serif;
}

article.post h1 a {
	text-decoration:        none;
}

article.post img {
	float:                  left;
    padding:                0 10px 10px 0;
}

/* Sub-navigation */

nav#sub-navigation {
	float:					left;
	width:					175px;
}

nav#sub-navigation ul {
	list-style: 			none;
	margin:					0;
	padding:				0;
}

nav#sub-navigation ul li a {
	display:				block;
	padding:				10px 10px 20px 0;
    color:                  rgb(77,77,77);
    font-size:              17px;
    margin:                 0;
    text-decoration:        none;
}

nav#sub-navigation ul li:first-child:before {
	content:                "";
    padding-top:            0;
}
nav#sub-navigation ul li:first-child a {
    padding-top:            4px;
}

nav#sub-navigation ul li {
	background:             url(images/sub-nav-separator.gif) bottom left no-repeat;
}

nav#sub-navigation ul li:nth-child(even) {
	background:             url(images/sub-nav-separator2.gif) bottom left no-repeat;
}

nav#sub-navigation ul li:last-child {
	background:             none;
}

nav#sub-navigation ul li a:hover, 
nav#sub-navigation ul li.current-menu-item > a, 
nav#sub-navigation ul li.current_page_ancestor > a {
	color:					rgb(0,112,74);
	text-decoration: 		none;
}

nav#sub-navigation ul ul li a {
	padding:				10px 40px;
}

nav#sub-navigation ul ul li a:hover, 
nav#sub-navigation ul ul li.current-menu-item > a {
    color:					rgb(0,112,74);
}

nav#sub-navigation + section[role=main] {
	/* width:					440px; */
}

/* Side column */

aside[role=complementary] {
    float:                  left;
    padding:                0;
    margin:                 0;
    width:                  280px;
}

aside[role=complementary] nav#right-navigation {
    font-family:            'Covered By Your Grace', sans-serif;
}

aside[role=complementary] nav#right-navigation dl {
    width:                  300px;
}

aside[role=complementary] nav#right-navigation dl dt a {
    text-align:             left;
    height:                 100px;
    float:                  left;
    background:             url(images/right-cta-links-background.png) no-repeat;
    padding:                30px 0 0 50px;
    width:                  110px;
    margin-right:           10px;
    font-size:              32px;
    color:                  rgb(255,255,255);
    line-height:            25px;
    text-decoration:        none;
}

aside[role=complementary] nav#right-navigation dl dt:nth-of-type(2) a {   
    text-align:             center;
    background-position:    -8px -132px;
    height:                 74px;
    width:                  103px;
    padding:                31px 28px;
}

aside[role=complementary] nav#right-navigation dl dt:nth-of-type(3) a {
    background-position:    -3px -263px;
    height:                 74px;
    width:                  118px;
    padding:                30px 20px;
}

aside[role=complementary] nav#right-navigation dl dt a:hover {
    text-decoration:        none;
    color:                  rgb(0,0,0);
    background-position:    -170px 0px;
}

aside[role=complementary] nav#right-navigation dl dt:nth-of-type(2) a:hover {
    background-position:    -178px -132px;
}

aside[role=complementary] nav#right-navigation dl dt:nth-of-type(3) a:hover {
    background-position:    -173px -263px;
}

aside[role=complementary] nav#right-navigation dl dd {
    float:                  left;
    text-align:             left;
    height:                 130px;
    width:                  130px;
    font-size:              21px;
    line-height:            97%;
    padding-top:            10px;
    margin:                 0;
}

aside[role=complementary] section.success-story {
    color:                  rgb(77,77,77);
    text-align:             center;
    padding:                30px 0 30px 0;
    width:                  300px;
    clear:                  both;
}

aside[role=complementary] section.success-story h1 {
    color:                  rgb(77,77,77);
    text-align:             center;
    font-size:              28px;
    background:             url(images/widget-underline.png) bottom no-repeat;
    padding-bottom:         15px;
}

aside[role=complementary] section.success-story img {
    margin-top:             20px;
    padding:                2px 5px 4px 2px;
    width:                  auto !important;
    height:                 auto !important;
    max-width:              262px;
    -moz-box-shadow:        3px 3px rgb(204, 204, 204);
    -webkit-box-shadow:     3px 3px rgb(204, 204, 204);
    box-shadow:             3px 3px rgb(204, 204, 204);
}

aside[role=complementary] section.success-story a {
    color:                  rgb(77,77,77);
    font-size:              13px;
    text-decoration:        none;
}

aside[role=complementary] section.success-story a:hover {
    text-decoration:        underline;
}

aside[role=complementary] section.success-story a:after,
aside[role=complementary] section.success-story a span.after {
    font:                   16px 'Covered By Your Grace', sans-serif;
    content:                " >";
}

aside[role=complementary] section.success-story blockquote {
    font-size:              20px;
    text-align:             left;
    padding:                20px 5px 10px 26px;
    margin:                 10px;
    background:             url(images/open-quote.png) top left no-repeat;
    background-position:    5px 0;
}

#home {
    background:             url(images/home-grey-bg.png);
}

#home .container {
    padding-top:            20px;
}



#home section.promo {
    color:                  rgb(77,77,77);
    text-align:             center;
    padding:                10px 0 30px ;
    width:                  315px;
    float:                  left;
    margin-left:            17px;
}

#home section.promo:first-child {
    margin:                 0;
}

#home section.promo:nth-last-of-type():after {
    content:                "";
	clear:                  both;
    display:                block;
}

#home section.promo h1 {
    background:             url(images/promo-underline1.png) bottom no-repeat;
    padding-bottom:         15px;
    margin-bottom:          15px;
}
    
#home section.promo:nth-of-type(2) h1 {
    background:             url(images/promo-underline2.png) bottom no-repeat;
    padding-bottom:         15px;
    margin-bottom:          15px;
}

#home section.promo h1, #home section.promo h1 a {
    color:                  rgb(77,77,77);
    text-align:             center;
    font-size:              28px;
    text-decoration:        none;
}

#home section.promo h1 a:hover {
    text-decoration:        underline;
}



#home section.promo img {
    width:                  auto !important;
    height:                 auto !important;
    max-width:              301px;
    padding:                5px;
    background-color:       rgb(255,255,255);
    -moz-box-shadow:        3px 3px rgb(166, 166, 166);
    -webkit-box-shadow:     3px 3px rgb(166, 166, 166);
    box-shadow:             3px 3px rgb(166, 166, 166);
}

#home section.promo a.cta {
    color:                  rgb(77,77,77);
    font-size:              13px;
    text-decoration:        none;
}

#home section.promo a:hover {
    text-decoration:        underline;
}

#home section.promo a.cta:after, 
#home section.promo a.cta span.after {
    font:                   15px 'Covered By Your Grace', sans-serif;
    content:                " >";
}

#home section.promo p {
    font-size:              14px;
    text-align:             left;
    margin:                 10px 0 10px 0;
}



/* Footer */

footer[role=contentinfo] {
    background:             url(images/footer-grad.png) top repeat-x #e51937;
    color:                  rgb(0,0,0);
}

footer[role=contentinfo]:after {
    clear:                  both;
    content:                "";
    display:                block;	
}

footer[role=contentinfo] nav {
	float:					left;
}

footer[role=contentinfo] nav ul {
    list-style:             none;
    margin:                 0;
}

footer[role=contentinfo] nav ul:after {
    clear:                  both;
    content:                "";
    display:                block;
}

footer[role=contentinfo] nav ul li {
    float:                  left;
    font-size:              11px;
    margin-right:           10px;
}

footer[role=contentinfo] nav ul li:last-child {
    margin:                 0;
}

footer[role=contentinfo] nav ul li a {
    color:                  rgb(255,255,255);
    text-decoration:        none;
}



footer[role=contentinfo] #copyright {
    background:             rgb(183,0,27);
    padding:                0 20px;
    color:                  rgb(0,0,0);
    height:                 58px;
    margin-top:             20px;
}

footer[role=contentinfo] #copyright p {
    float:                  left;
    margin:                 0;
    display:                block;
    padding-right:          20px;
    padding-top:            20px;
}

footer[role=contentinfo] #copyright p a {
    text-decoration:        none;
}

footer[role=contentinfo] #copyright p a:hover {
    color:                  rgb(255,255,255);
    text-decoration:        none;
}

footer[role=contentinfo] #copyright dl {
    float:                  right;
}

footer[role=contentinfo] #copyright dl dt {
    padding-top:            20px;
}

footer[role=contentinfo] #copyright dl dd, 
footer[role=contentinfo] #copyright dl dt {
    display:                inline;
    float:                  left;
    color:                  rgb(255,255,255);
    padding:                7px 15px 5px 5px;
}

footer[role=contentinfo] section#milestones {
    padding:                30px 0;
    float:                  left;
}

footer[role=contentinfo] section#milestones h1 {
    font:                   28px 'Covered By Your Grace', sans-serif;
    color:                  rgb(255,255,255);
    text-align:             center;
}

footer[role=contentinfo] section#milestones h1:before, 
footer[role=contentinfo] section#milestones h1 span.before {
    content:                url(images/year-header-left.png);
    padding:                0 25px 0 0;
}

footer[role=contentinfo] section#milestones h1:after, 
footer[role=contentinfo] section#milestones h1 span.after {
    content:                url(images/year-header-right.png);
    padding:                0 0 0 25px;
}



footer[role=contentinfo] section#milestones dl {
    color:                  rgb(255,255,255);
    position:               relative;
    margin-top:             20px;
}

footer[role=contentinfo] section#milestones dl dt {
    padding:                0 10px;
    text-align:             center;
    float:                  left;   
    width:                  140px;
    padding-top:            120px;
    font-size:              12px;
}

footer[role=contentinfo] section#milestones dl dd {
    font:                   45px 'Covered By Your Grace', sans-serif;
	text-align:             center;
    padding-top:            60px;
    float:                  left; 
    position:               absolute;
    top:                    0;
    width:                  140px;
}

footer[role=contentinfo] section#milestones dl dt.clients + dd {
    background:             url(images/year-clients.png) no-repeat top center;
    left:                   10px;
}

footer[role=contentinfo] section#milestones dl dt.meals + dd {
    background:             url(images/year-meals.png) no-repeat top center;
    left:                   170px;
    background-position:    55px 3px;
}

footer[role=contentinfo] section#milestones dl dt.housed + dd {
    background:             url(images/year-housed.png) no-repeat top center;
    left:                   330px;
    background-position:    43px 5px;
}

footer[role=contentinfo] section#milestones dl dt.employment + dd {
    background:             url(images/year-employment.png) no-repeat top center;
    left:                   490px;
    background-position:    49px 10px;
}

footer[role=contentinfo] section#milestones dl dt.courses + dd {
    background:             url(images/year-courses.png) no-repeat top center;
    left:                   650px;
    background-position:    49px 0;
}

footer[role=contentinfo] section#milestones dl dt.counselling + dd {
    background:             url(images/year-counselling.png) no-repeat top center;
    left:                   810px;
}

footer[role=contentinfo] section#contact-us {
    padding:                10px 0;
    clear:                  both;
}

footer[role=contentinfo] section#contact-us h1 {
    font:                   17px 'Convergence', sans-serif; 
    color:                  rgb(0,0,0);
    padding-bottom:         10px;   
}

footer[role=contentinfo] section#contact-us div.contact {
    float:                  left;
    padding-right:          20px;
    width:                  335px;
    font-size:              14px;
}

footer[role=contentinfo] section#contact-us div.contact p {
    padding-top:            0;
}

footer[role=contentinfo] section#contact-us div.contact:nth-of-type(1) {
    width:                  240px;
}

footer[role=contentinfo] section#contact-us div.contact dt {
    float:                  left;
    margin-right:           5px;
}

footer[role=contentinfo] section#contact-us div.contact a {
    text-decoration:        underline;
}

footer[role=contentinfo] section#contact-us div.contact a:hover {
    text-decoration:        none;
    color:                  rgb(0,0,0);
}

footer[role=contentinfo] ul#awards {
    float:                  left;
    list-style:             none;
    margin:                 20px 0 0 0;
    clear:                  both;
    width:                  966px;
}

footer[role=contentinfo] ul#awards li {
    font-size:              16px;
    color:                  rgb(255,255,255);
    padding:                0 15px;
    display:                inline-block;
}

footer[role=contentinfo] ul#awards li:first-child {
    padding:                0 15px 0 0;
}

footer[role=contentinfo] ul#awards li:last-child {
    text-align:             right;
    width:                  400px;
    padding:                0;
}

ul.msg-error {
    list-style:             none;
}

ul.msg-error li {
    margin:                 0;
}

