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

    AWSAM HRM
    Master Stylesheet
    Author: Pixel House
    www.pixel-house.com.au

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

body { background: url(../images/bg.gif) repeat 0 0 #bd2d24; margin: 0; padding: 0; font-family: 'Open Sans', arial, helvetica, sans-serif; }
p, ul li, ol li, table td { font-size: 0.95em; color: #3e3e3e; line-height: 1.45em; }
p strong { color: #000; font-weight: 600; }
ul, ol { margin: 0 0 1.45em 0; }
a { color: #c03027; }
a:hover { color: #146da6; }
h1, h2, h3, h4, h5, h6 { color: #c03027; margin: 0 0 1.0em 0; font-weight: normal; }
h1 { color: #000; font-size: 32px; font-weight: bold; }
h2 { font-size: 27px; }
h2 span { font-weight: 700; }
h3 span { font-weight: 700; }
h3 { font-size: 22px; color: #000; margin: 0 0 0.7em 0; }
blockquote { margin: 0 0 1.0em 0; padding: 0; font-size: 22px; color: #575757; line-height: 28px; }
hr { background: #fff; border: none; border-top: solid 1px #bfc6ca; margin: 0 0 1.0em 0; }
table { border: none; cellspacing: 0; padding: 0; margin: 0 0 1.45em 0; }
table td { cellspacing: 0; padding: 0; }

h1, h2, h3,
#header,
#nav,
blockquote,
#home-top p
{ font-family: 'Archivo Narrow', sans-serif; }

.left { float: left; }
.right { float: right; }

#header-wrap,
#nav-wrap,
#main-wrap, 
#colorbar-wrap,
#colorbar-radial,
#greybar-wrap,
#footer-wrap
{
    float: left;
    width: 100%;
}

#header,
#nav,
#main,
#colorbar,
#greybar,
#footer
{ width: 960px; margin: 0 auto; padding: 0 30px; position: relative; }

#header-wrap, #main-wrap { background: #fff; }
#colorbar-wrap { background: url(../images/colorbar-bg.jpg) repeat center 0 #77c3ec; }
#colorbar-radial { background: url(../images/white-radial.png) no-repeat center 0; }
#greybar-wrap { background: #e5e5e5; border-top: solid 1px #c8c8c8; }

#logo { float: left; margin: 35px 0 23px 0; }
#logo a { float: left; width: 279px; height: 88px; background: url(../images/logo.gif) no-repeat 0 0; }
#logo a span { display: none; }

/* ---------------------------------------------------------------------------------
   HEADER 
--------------------------------------------------------------------------------- */

#header-right { float: right; text-align: right; padding: 41px 0; }
#header .phone { color: #bf2f26; font-size: 36px; margin: 0; background: url(../images/icon-phone.png) no-repeat right center; padding-right: 36px; }

#header .slogan { color: #3c3c3c; font-size: 24px; margin: 0; }
#header .slogan span { color: #000; font-weight: 700; }

/* ---------------------------------------------------------------------------------
   NAV
--------------------------------------------------------------------------------- */

#nav ul { float: left; width: 100%; margin: 0; padding: 0; background: url(../images/nav-divider.gif) no-repeat 0 center; }
#nav ul li { font-size: 18px; float: left; list-style-type: none; padding: 0 1px 0 0; margin: 0; background: url(../images/nav-divider.gif) no-repeat right center; font-size: 18px; }
#nav ul li a { float: left; padding: 15px 0; font-size: 18px!important; color: #fff; text-decoration: none; font-size: 400; text-align: center; line-height: 1.1em; }
#nav ul li a:hover { background: #902a26; }

#nav #n01 { padding-left: 1px; }

#nav #n06 a { color: #ffea00; font-size: 15px!important; text-transform: uppercase; padding-top: 17px; padding-bottom: 17px; }

#p01 #n01,
#p02 #n02,
#p03 #n03,
#p04 #n04,
#p05 #n05,
#p06 #n06,
#p07 #n07,
#p08 #n08,
#p09 #n09
{ background: none; }

#p02 #n01,
#p03 #n02,
#p04 #n03,
#p05 #n04,
#p06 #n05,
#p07 #n06,
#p08 #n07,
#p09 #n08
{ background: none; }

#p01 #nav ul { background: none; }

#p01 #n01 a,
#p02 #n02 a,
#p03 #n03 a,
#p04 #n04 a,
#p05 #n05 a,
#p06 #n06 a,
#p07 #n07 a,
#p08 #n08 a,
#p09 #n09 a
{ background: #902a26; }

#n01 a { width: 85px; }
#n02 a { width: 86px; }
#n03 a { width: 102px; }
#n04 a { width: 141px; }
#n05 a { width: 126px; }
#n06 a { width: 187px; }
#n07 a { width: 124px; }
#n08 a { width: 98px; }

/* ---------------------------------------------------------------------------------
   CONTENT
--------------------------------------------------------------------------------- */

#content { float: left; width: 100%; }
#content.girl { background: url(../images/girl.jpg) no-repeat right 360px; }
#content.man { background: url(../images/man.jpg) no-repeat 660px 540px; }
#content.tradesman { background: url(../images/tradesman.jpg) no-repeat 580px 360px; }
#full-width { float: left; width: 100%; padding: 30px 0 0 0; }

#colorbar h1 { margin: 0; float: left; padding: 30px 0; }
#left { float: left; width: 630px; padding: 30px 0; }
#right { float: right; width: 300px; padding-bottom: 200px; }

.btn { float: left; background: url(../images/btn-bg.gif) repeat-x 0 0 #a22923; -moz-border-radius: 5px; border-radius: 5px; padding: 8px 13px; cursor: pointer; cursor: hand; }
.btn { color: #fff; text-align: left; text-transform: uppercase; font-size: 13px; font-weight: 600; text-decoration: none; }
.btn span { background: url(../images/btn-arrow.png) no-repeat 0 center; padding-left: 15px; }
.btn:hover { background: #000; color: #fff; }

.callout { float: left; width: 300px; height: 200px; margin: 0 0 30px 0; }
.callout-top { float: left; width: 100px; padding: 71px 0 0 20px; height: 99px; }
.callout h3 { color: #fff; margin: 0; }
.callout a { color: #fff; text-decoration: none; }
.callout-btn { float: left; clear: both; padding-left: 35px; font-size: 13px; text-decoration: none; font-weight: 600; text-transform: uppercase; text-shadow: 1px 1px 2px #962620; }
.callout-btn:hover { text-decoration: underline; }

#callout-employer { background: url(../images/callout-employers.png) no-repeat 0 0; }
#callout-jobseeker { background: url(../images/callout-jobseeker.png) no-repeat 0 0; }

#right #callout-employer,
#right #callout-jobseeker { margin-top: -20px; }
#greybar #callout-employer { margin-right: 30px; }
#greybar #callout-employer,
#greybar #callout-jobseeker { margin-top: -25px; }

.speech-bubble { float: left; width: 100%; }
.speech-top { float: left; padding: 20px 20px 5px 20px; width: 260px; background: url(../images/speech-top.gif) no-repeat 0 0; }
.speech-top p { font-size: 13px; font-style: italic; margin: 0; }
.speech-btm { float: left; width: 100%; background: url(../images/speech-btm.gif) no-repeat 0 0; height: 51px; }

.job { float: left; width: 100%; border-top: solid 1px #cfcfcf; padding: 20px 0; }
.job-left { float: left; width: 470px; }
.job-left h3 { color: #000; }
.job-left p { margin: 0; }
.job-right { float: right; width: 135px; text-align: center; }
.job-right h3 { margin: 0 0 20px 0; }
.job-right h3 span { color: #000; }

select { padding: 5px; -moz-border-radius: 3px; border-radius: 3px; border: solid 1px #cfcfcf; }
#state { margin-top: 4px; }


#details .type { color: #000; font-weight: 600; padding-right: 30px; }
.job-desc {  }

#p07 #content h2 { font-size: 18px; }
#p07 #content p { font-style: italic; }

/* ---------------------------------------------------------------------------------
   HOMEPAGE
--------------------------------------------------------------------------------- */

#banners { float: left; width: 960px; height: 374px; overflow: hidden; }

.panel blockquote { font-size: 28px; color: #1578b8; margin: 0; padding: 0; float: left; line-height: 1.2em; }
.panel blockquote span { font-size: 32px; color: #00548b; font-weight: bold; }

#banner-01 { background: url(../images/banners/people-01.png) no-repeat right bottom; }
#banner-01 blockquote { padding-top: 70px; }
#banner-02 { background: url(../images/banners/girl.png) no-repeat 250px bottom; }
#banner-03 { background: url(../images/banners/man-04.png) no-repeat 170px bottom; }
#banner-04 { background: url(../images/banners/man-02.png) no-repeat 250px bottom; }

.comment-wrap { float: left; background: url(../images/banners/comment-left.png) no-repeat 0 20px; padding-left: 39px; }
.comment { float: left; width: 350px; padding: 20px; background: #fff; -moz-border-radius: 10px; border-radius: 10px; box-shadow: 2px 2px 3px #87b5cd; }
.comment p { margin: 0; }

#banner-02 .comment-wrap { margin: 90px 0 0 480px; }
#banner-03 .comment-wrap { margin: 90px 0 0 480px; }
#banner-04 .comment-wrap { margin: 90px 0 0 480px; }

.panel { float: left; width: 960px; height: 374px; z-index: 10; }

.stripViewer { /* This is the viewing window */
    position: relative;
    overflow: hidden;
    margin: auto;
    width: 940px; /* Also specified in  .stripViewer .panelContainer .panel  below */
    height: 319px;
    clear: both;
    z-index: 100;
}

.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
    position: relative;
    left: 0; top: 0;
    width: 100%;
    list-style-type: none;
    z-index: 100;
    /* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
}
.stripNav { display: none; }

.coda-nav-left a, .coda-nav-right a { display: none; }
.coda-nav { }
.coda-nav ul { float: left; width: 500px!important; display: block; position: absolute; top: 310px; left: 27px; padding: 0; margin: 0; }
.coda-nav ul li { list-style-type: none; float: left; margin: 0; padding: 0; margin-right: 3px; width: 22px; }
.coda-nav ul li a { float: left; width: 22px; height: 22px; background: url(../images/banner-bullet.png) no-repeat 0 0; }
.coda-nav .current { background: url(../images/banner-bullet-active.png) no-repeat 0 0;}

#home-top { float: left; width: 100%; border-bottom: solid 1px #bfc6ca; padding: 0 0 10px 0; margin: 0 0 30px 0; }
#home-left { float: left; width: 450px; padding: 0 30px 40px 0; }
#home-left .btn { margin-top: 5px; }
#home-right { float: left; width: 480px; }
#home-left p, #home-right p { }
#home-top p { margin: 0 0 1.0em 0; padding: 0; font-size: 22px; color: #575757; line-height: 28px; }

#news-callout { float: left; width: 300px; margin-left: 30px; padding: 30px 0 10px 0; }
#news-callout h3 { float: left; width: 100%; border-bottom: solid 1px #cacaca; padding: 0 0 10px 0; margin: 0 0 15px 0; }
#news-callout h4 { font-size: 13px; margin: 0; font-weight: 600; }
#news-callout p { font-size: 13px; margin: 0 0 5px 0; }
#news-callout .arrow { background: url(../images/btn-arrow-red.png) no-repeat 0 4px; padding-left: 15px; }
#news-callout .news-date { float: left; width: 45px; -moz-border-radius: 5px; border-radius: 5px; background: #abb3b8; padding: 10px 0 12px 0; text-align: center; color: #464545; margin: 0 10px 0 0; }
#news-callout .news-right { float: left; width: 240px; }
#news-callout .day { font-size: 22px; }
#news-callout .mth { text-transform: uppercase; font-size: 13px; }

#right #news-callout { margin-left: 0; margin: 0 0 15px 0; padding-top: 0; }

/* ---------------------------------------------------------------------------------
   CONTACT
--------------------------------------------------------------------------------- */

.contact-details { float: left; width: 100%; }
.contact-left { float: left; width: 270px; }
.contact-right { float: right; width: 330px; }

#contact-form { float: left; width: 100%; padding: 20px 0 10px 0; border-top: solid 1px #bfc6ca; margin: 20px 0 0 0; }

fieldset { border: none; margin: 0; padding: 0; }
fieldset div { position: relative; float: left; width: 100%; margin: 0 0 9px 0; }
fieldset input[type="text"], fieldset textarea { border: solid 1px #bbbbbb; padding: 11px 10px; -moz-border-radius: 4px; border-radius: 4px; font-size: 13px; color: #7b7b7b; background: url(../images/input-bg.gif) repeat-x 0 bottom #fff; }
fieldset input[type="text"]:focus, fieldset textarea:focus { border: solid 1px #ba3027; }
fieldset label { position: absolute; top: 12px; left: 11px; font-size: 13px; color: #7b7b7b; }
.label { font-size: 13px; color: #7b7b7b; }
fieldset label .req { font-size: 0.75em; color: #b60404; }
fieldset .sm { font-size: 11px; color: #7b7b7b; }
fieldset .btn.sm { color: #fff; }
.align-right { float: right; margin-right: 30px; }
.submit-file { margin-top: 10px; }

#contact-form fieldset { float: left; width: 100%; }
#contact-form fieldset p { position: relative; float: left; width: 100%; margin: 0 0 9px 0; line-height: 1.0em; }
#contact-form fieldset input[type="text"], #contact-form fieldset input[type="password"], #contact-form fieldset textarea { width: 188px; }
#contact-form fieldset textarea { width: 345px; }
#contact-form fieldset .smtxt { font-size: 0.7em; line-height: 1.3em; color: #888888; padding-top: 5px; }
.fieldset-left { float: left; width: 200px; }
.fieldset-right { float: right; width: 400px; }
#left #error { color: #d40000; border-top: solid 1px #d40000; font-size: 0.85em; padding-top: 10px; }
#left #success { color: #449624; }


/* ---------------------------------------------------------------------------------
   FOOTER
--------------------------------------------------------------------------------- */

#footer ul { margin: 0; padding: 30px 0; }
#footer ul li { float: left; list-style-type: none; padding-right: 10px; font-size: 13px; }
#footer ul li a { color: #fff; text-decoration: none; }
#footer ul li a:hover { text-decoration: underline; }
#footer .right { padding: 30px 0; color: #fff; font-size: 13px; margin: 0; }