/*******************************************

        CSS Document for Sage
        
        CONTENTS
        1. Content Positioning
        2. Main Navigation
        3. Typography
        4. Video PopUp
        5. Footer

********************************************/

body {
        margin:auto;
        font-family:Helvetica, Arial, sans-serif;
        font-size:small;
        color:#666666;
}

a {
        font-weight:bold;
        color:#666666;
        text-decoration:none;
        outline: none;
}

a:hover {
        color:#004632;
}

img {
        border:none;
}

.divider {
        display: none;
}

input{
        background-image:url(../images/input.gif);
        background-repeat:no-repeat;
        width:377px;
        height:27px;
        border:none;
        text-indent:10px;
        padding-top:0px;
        margin-top:2px;
}
.select-list {
        background-image:url(../images/input.gif);
        background-repeat:no-repeat;
        width:377px;
        height:27px;
        border:none;
        padding-top:2px;
        margin-top:2px;
}
select{
	width:360px;
    height:22px;
    border:none;
    color: #666666;
    margin-left: 10px;
}

#button {
        width:80px;
        height:30px;
        background-image:none;
}

#overlay { 
        background: url('../images/trans.png') repeat-y;
}
form #formErroMsg {
	display: none;
	color: #ff0000;
	float: left;
	width: 200px;
}
form strong.invalid{
	border: none;
}
form .invalid{
	border: none;
	color: #ff0000;
}

/******************************************** 1. Content Positioning ********************************************/

#wrapper {
        margin:0;
        width:100%;
        height:auto;
}

#header {
        width:100%;
}

#logo {
        margin-top: 5px;
        margin-left:10px;
        width:360px;
        height:40px;
}

#mainBoxHome {
        width: 100%;
        background-repeat:no-repeat;
        margin-bottom:15px;
        color:#666666;
}

#mainBox {
}

#mainBox #topWrapper {
}

/*#mainBox #caseStudiesContent {display:none;}*/

#mainBox2 {
        margin:auto;
        width:960px;
        height:1130px;
        background-image:url(../images/boxBg2.jpg);
        background-repeat:no-repeat;
        margin-bottom:25px;
}

#hdrMain {
       overflow: hidden;
}
.videoframe{
	display: none;
}
#hdrMain h1{
	color: #004632;
	margin: 10px;
}
#hdrText {
        padding-top:0px;
        color:#666666;
		line-height:15.6px;
		margin: 20px 10px 20px 10px;
}

/* Table Departments + Social */

#tableStyled, #tableSocial {
		list-style: none;
        height:auto;
        margin-bottom:20px;
        width:100%;
        border:0;
        font-size:90%;
		position:relative;
		margin-left: -30px;
}

#tableStyled td, #tableSocial td {
        vertical-align:top;
        padding:15px;
        width:25%;
		position:relative;
		padding-bottom:0px;
}
#tableStyled .linkRow td {padding:0px 15px;}

#tableStyled p {line-height:15px;}


/* Page 02 Table (Case Studies) */

#caseStudies {
        height:auto;
        border:0;
        font-size:90%;
        list-style: none;
        margin: 0 0 0 -40px;
}

#caseStudies td {
        vertical-align:top;
}

#whatLeft {
        padding-left:15px;
        height:auto;
}

#whatRight {
        height:auto;
        font-weight:bold;
		line-height:25px;
		margin: 15px 10px 10px 15px;
}

#contactHome {
        width:100%;
        font-size:90%;
}

#social {
        width:100%;
        height:40px;
        padding-left:15px;
}

#pagesBoxContent {
        padding-left:10px;
        line-height:15.6px;
}
#pagesBoxContent p{
	margin-top: 6px;
	margin-bottom: 6px;
	font-weight:normal;
}
#pagesBoxContent p a{
	color: #004632;
	font-weight: bold;

}
#pagesBoxContent p a:hover{
	color: #fff;
	font-weight: bold;
}
#vidBg {
        margin-top:10px;
}

#featuredTxt {
        margin-left:15px;
        color:#666666;
		line-height:15.6px;
}

#video {
		display: none;
}

#caseStudiesContent {
        margin:auto;
        padding-top:0px;
        height:auto;
        width:100%;
		padding-left:10px;
		padding-bottom:10px;
}

#contactS {
		line-height:25px;
		
}

/******************** Carousel ********************/

#carousel {
        display: none;
}

#carousel span:hover {
        position:absolute;
        z-index:5;
}

.play {
        position:absolute;
        margin-left:175px;
        width: 70px;
        height: 70px;
        margin-top:100px;
        z-index:1;
}

.vidTitle {
	margin-top:-70px;
	padding-left:20px;
    font-family:FocoLightRegular, Helvetica, Arial, sans-serif;
    font-size:160%;
    font-weight:lighter;
	color:#FFFFFF;
    z-index:1;
}

#videoNav {
	display: none;
}

#videoNav li {
	float:left;
	padding:4px;
}

#videoNav li a {
	display:block;
	height:10px;
	width:11px;
	overflow:hidden;
	cursor: pointer;
}

#videoNav li a:hover {
	text-indent:-17px;
}

/******************************************** 2. Main Navigation ********************************************/

#nav {
    
}
#nav li a {
	cursor:pointer;
}


/******************************************** 3. Typography ********************************************/

@font-face {
        font-family: 'FocoBold';
        src: url('../fonts/foco-bold-webfont.eot');
        src: local('?'), url('../fonts/foco-bold-webfont.woff') format('woff'),
url('../fonts/foco-bold-webfont.ttf') format('truetype'),
url('../fonts/foco-bold-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;
}

@font-face {
        font-family: 'FocoBlackRegular';
        src: url('../fonts/focoblack-regular-webfont.eot');
        src: local('?'), url('../fonts/focoblack-regular-webfont.woff') format('woff'),
url('../fonts/focoblack-regular-webfont.ttf') format('truetype'),
url('../fonts/focoblack-regular-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;
}

@font-face {
        font-family: 'FocoLightRegular';
        src: url('../fonts/focolight-regular-webfont.eot');
        src: local('?'), url('../fonts/focolight-regular-webfont.woff') format('woff'),
url('../fonts/focolight-regular-webfont.ttf') format('truetype'),
url('../fonts/focolight-regular-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;
}

@font-face {
        font-family: 'FocoRegular';
        src: url('../fonts/foco-regular-webfont.eot');
        src: local('?'), url('../fonts/foco-regular-webfont.woff') format('woff'),
url('../fonts/foco-regular-webfont.ttf') format('truetype'),
url('../fonts/foco-regular-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;
}

h1 {
        font-family:FocoLightRegular, Helvetica, Arial, sans-serif;
        font-size:235%;
        font-weight:lighter;
        color:#004632;
        margin-bottom:12px;
}
h1 a {font-weight:normal;
color:#004632;}

h2 {
        margin:auto;
        font-family:FocoLightRegular, Helvetica, Arial, sans-serif;
        font-size:330%;
        font-weight:lighter;
        color:#004632;
        width:100%;
        height:40px;
        padding:15px;
        margin-bottom:14px;
		clear:both;
}

h3 {
        font-family:FocoBold, Helvetica, Arial, sans-serif;
        font-size:180%;
        font-weight:lighter;
        color:#004632;
        margin-bottom:10px;
}

h4 {
        margin:auto;
        font-family:FocoLightRegular, Helvetica, Arial, sans-serif;
        font-size:350%;
        font-weight:lighter;
        color:#FFFFFF;
        width:100%;
        margin-bottom:17px;
}

.red {
        color:#FE0000;
}

.subHdr {
        font-family:FocoBold, Helvetica, Arial, sans-serif;
        font-size:160%;
        color:#004632;
        margin-top:6px;
        margin-bottom:6px;
		line-height:120%;
}

.subHdrMore {
        font-family:FocoBold, Helvetica, Arial, sans-serif;
        font-size:160%;
        color:#004632;
        margin-top:15px;
        margin-bottom:15px;
		line-height:120%;
}

.darkGrn {
        font-weight:bold;
        color:#004632;
        margin-bottom:2px;
        margin-top:2px;
}

.mediumGreen {
        font-family:FocoBold, Helvetica, Arial, sans-serif;
        font-size:160%;
        font-weight:lighter;
        color:#004632;
        margin-top:10px;
        margin-left:15px;
}

.greenArrow {
		line-height:19px;
		margin: 3px 0px 10px 5px;
}

.greenArrow a:hover {
        color:#79BD00;
}

.greenWhite a {
        color:#FFFFFF;
}

.greenWhite a:hover {
        text-decoration:underline;
}

.greyLight a {
        color:#666666;
        font-size:90%;
}

.greyLight a:hover {
        text-decoration:underline;
}

/******************************************** 4. Video PopUp ********************************************/

#videoDisplay {
		margin-top: 10px;
        margin-left: 10px;
        width:320px;
        height:190px;
}

.videoTitle {
        font-family:FocoBold, Helvetica, Arial, sans-serif;
        font-size:165%;
        font-weight:lighter;
        color:#004632;
        margin-top:25px;
        margin-left:10px;
}

.videoSubT {
        font-family:FocoLightRegular, Helvetica, Arial, sans-serif;
        font-size:165%;
        font-weight:lighter;
        color:#676767;
        margin-top:10px;
        margin-left:10px;
}

#videoText {
        font-size:105%;
        margin-left:10px;
        margin-top:10px;
        color:#666666;
}

.vidTxt {
        font-family:FocoBold, Helvetica, Arial, sans-serif;
        font-size:122%;
        color:#79BD00;
        margin: 8px 0px 0px 0px;
        
}
#featuredTxt .vidTxt {
       margin: 8px 0px 15px 0px;       
}
.vidCpy {
        margin: 3px 0px 0px 0px;
        
}

#pdfBox {
 	    margin-left: 10px;
        width:320px;
        height:105px;
        background-color:#F3F3F3;
}

#pdfIcon {
        position:absolute;
        margin-left:20px;
        margin-top:15px;
        background-image:url(../images/pdf.gif);
        height:45px;
        width:38px;
}

#pdfText {
        position:absolute;
        margin-top:20px;
        margin-left:70px;
        color:#666666;
		line-height:20px;
}

/******************************************** 5. Footer ********************************************/

.contactList {
	list-style-type:none;
	margin:0px 0px 0px 0px;
	padding:0px;

}

.contactList li {
	line-height:18px;
}

#contact-form p {
	margin:0px;
}
#footer {
        font-size:80%;
        padding-top:15px;
        color:#999999;
}
#footer {
	margin-left: -10px;
}
#footer span {
	display: none;
}
#footer a {
        display: block;
        color:#999999;
        font-weight:normal;
        font-size: 11px;
}

#footer a:hover {
        color:#666666;
}