/*
---------------------------------------------------------------------
JM Bailey Ltd
---------------------------------------------------------------------

Author:     Astute Media, www.astutemedia.com
Updated:    November 17 2008
Copyright:  (c) 2008 JM Bailey Ltd. 

All rights reserved.
*/

/* Global
---------------------*/
.tr {text-align: right}
.tl {text-align: left}
.tc {text-align: center}
.fl {float: left}
.fr {float: right}
.cl {clear:both}
		

/* Main layout
---------------------*/
html {background:  #000}
body {background: url(/themes/JMBailey/img/drip_bg.jpg) repeat-x center -342px #00aeef;margin:0;text-align:left}

#doc {width: 864px; margin: auto auto}
	
#low {background: #000}	
#low .wrap{width: 864px;padding: 20px 0 10px 0}

.bt, .ft {width: 100%} 

.ft div, .bt div {width: 864px; margin: auto auto}
.ft div {display: block;height: 100%;background: #000}


/* Header (.hd)
---------------------*/
.hd a.login {float: right} .hd a.login span {display: none}
	
	/* main navigation --- */
.hd ul {width:560px; display:inline; float:right; margin:28px 0 0 0}
.hd ul li {display: inline; float:left}	
.hd ul li a {display:block; height:13px; padding:0 10px 0 0; width:auto; float:left}
.hd ul li a span {display:none}

	/* main navigation sprites --- */
.hd ul li a{background: transparent url(/themes/JMBailey/img/hd_nav.gif) no-repeat}	
.hd ul li a.home{width: 50px} .hd ul li a.home:hover{background-position: -90px 0}
.hd ul li a.services{width: 70px; background-position:0 -13px} .hd ul li a.services:hover{background-position:-90px -13px}	
.hd ul li a.portfolio{width: 80px; background-position:0 -26px} .hd ul li a.portfolio:hover{background-position: -90px -26px}	
.hd ul li a.contact{width: 70px; background-position:0 -39px} .hd ul li a.contact:hover{background-position: -90px -39px}	
.hd ul li a.about{width: 50px; background-position:0 -52px} .hd ul li a.about:hover{background-position: -90px -52px}
.hd ul li a.blog{width: 50px; background-position:0 -65px} .hd ul li a.blog:hover{background-position: -90px -65px}

    /* JMBailey logo --- */
.hd h1 {padding: 10px}
.hd h1 a{width: 148px;height: 50px;display: block;background: url(/themes/JMBailey/img/hd_logo.gif) no-repeat}
.hd h1 span {display: none}
	

/* Document Body (.bd)
------------------------*/
.bd {background: #00aeef;width: 864px}
	
.wl a:link, .wl a:visited {text-decoration: none;color: #fff}		
.wl a:hover, .wl a:active {text-decoration: none;color: #fff}
	
.bd .content {background: #fff}
    
.bd span.spacer {clear: both;height:10px;display:block}
	
.bd h3, .bd h4 {font-family: Arial, Helvetica, Sans-Serif}
.bd p {font-family: "Lucida Sans Unicode", "Lucida Grande",Garuda,sans-serif;}
.bd p.sm {width: 250px;font-size: 93%}
	
/* Bottom (.bt)
------------------------*/
.bt {background: url(/themes/JMBailey/img/bt_bg.gif) top repeat-x #313233;
	font-family: "Lucida Sans Unicode", "Lucida Grande",Garuda,sans-serif}
	
.bt a:link, .bt a:visited {border-bottom: 1px #ccc dotted}
.bt a:hover, .bt a:active {border-bottom: 1px #fff solid}
	
.bt .bt_1, .bt .bt_2, .bt .bt_3 {
	float: left;
	width: 272px;
	padding: 0 0 0 12px}
	
.bt div p {
	font-size: 93%;
	color: #999;
	padding: 0 0 0 8px}
	
.bt h3 {
	margin: 0 0 16px 8px;
    color: #fff;
    font-size: 93%;
    font-weight: bold;
    font-family: Arial, Helvetica, Sans-Serif;}
    
.little:link, .little:visited {color: #999;border-bottom: 1px #999999 dotted;text-decoration: none;font-size: 77%}
.little:hover, .little:active {color: #fff;border-bottom: 1px #999999 solid;text-decoration: none;font-size: 77%}
	
.bt span.spacer {/* clears grid columns */
	clear: both;
	height:10px; 
	display:block}
	
/* Footer (.ft)
------------------------*/
.ft div {height: 80px} /* hmm */
	
.ft div span {
    width: 272px;
    float: left;
    padding: 8px 0 0 16px;
	color: #666;
	text-align: left;
	font: 77% "Lucida Sans Unicode", "Lucida Grande",Garuda,sans-serif}
	
.ft span.spacer {
	clear: both;
	height:10px; 
	display:block}
	
.ft a:link, .ft a:visited {color:#999;text-decoration: none;border-bottom: #999 1px dotted} 
.ft a:hover, .ft a:active {color: #ccc;border-bottom: #ccc 1px solid}


/* Page class: .pagecontent 
---------------------*/
.pagecontent {padding: 6px 0 0 16px;color: #fff}
	
.pagecontent a:link, .pagecontent a:visited {color: #fff;text-decoration: none;	border-bottom: #ffffff 1px dotted}
	
.pagecontent h1 {
	/*font-family: “Trebuchet MS”, sans-serif;*/
	font-family: Arial, Helvetica, Sans-Serif;
	font-weight: bold;
	font-size: 153.9%;
	color: #fff;
	margin: 12px 0 0 0}
	
.pagecontent h2 {
	/*font-family: “Trebuchet MS”, sans-serif;*/
	font-family: Arial, Helvetica, Sans-Serif;
	font-weight: bold;
	font-size: 123.1%;
	color: #fff;
	margin: 12px 0 4px 0}

.pagecontent .top p {color: #fff}

.pagecontent .grid {
	float: left;
	width: 272px;
	color: #fff;
	padding-right: 10px}
	
.pagecontent .grid h2 {
	/*font-family: “Trebuchet MS”, sans-serif;*/
	font-family: Arial, Helvetica, Sans-Serif;
	font-weight: bold;
	font-size: 123.1%;
	color: #fff;
	margin: 4px 0 4px 0}

	
.pagecontent .grid p {
	float: left;
	margin-bottom: 6px;
	padding-right: 16px}
	
.pagecontent .wider {width: 522px}
.pagecontent .wider p {padding-right: 24px}	
	
.pagecontent .col2 {width: 540px;float: left;margin-left: 4px}
.pagecontent .co1l {width: 272px;float: left}

	
/* Page: Home.aspx
---------------------*/
.pg_home {background: url(/themes/JMBailey/img/main_bg.gif) center 0px repeat-x #00aeef}
.pg_home .bd {background: url(../img/bd_home_bg.gif) right 247px no-repeat}
	
    /* Intro text on homepage(h2) */
.bd h2.intro {display:block;height: 30px;background: url(/themes/JMBailey/img/bd_intro.gif) no-repeat 16px 6px} 
.bd h2.intro span {display: none}
	
    /* Flash spotlight */
#spotlight {width: 864px;height: 216px;padding: 0;margin: 0}
	
    /* Services */	
.bd .services h3 {
	width: 125px;
	height: 18px;
	margin: 0px 0 8px 4px;
	font-family: Arial, Helvetica, Sans-Serif;
	font-weight: bold;
	font-size: 100%}

.bd .services ul {
	width: 230px;
	border-top: 1px dotted #2fbdf1;
	margin: 0}

.bd .services ul li {
	width: 230px;
	border-bottom: 1px dotted #2fbdf1;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none}
	
.bd .services li a {
	font-size: 93%;
	padding: 4px 0 2px 0;
	display: block}
	
.bd .services ul li a:link, .bd .services ul li a:visited {text-decoration: none;color: #e7f7fd;padding-left: 4px}
.bd .services ul li a:hover, .bd .services ul li a:active {text-decoration: none;color: #00adef;padding-left: 4px;
	font-weight: bold;background: transparent url(/themes/JMBailey/img/bd_services_bg.jpg) no-repeat scroll right} 
	
.bd .services, .bd .news, .bd .news2 { 
	float: left;
	width: 272px;
	padding: 16px 0 8px 16px;
	color: #fff;
	font-family: "Lucida Sans Unicode","Lucida Grande",Garuda,sans-serif}
	
.bd .news p, .bd .news2 p {font-size: 85%}
		
.news h3, .news2 h3 {
    font-family: Arial, Helvetica, Sans-Serif;
	font-size: 93%;
	font-weight: bold}
	
.news h4, .news2 h4 {
	font-size: 77%;
	color: #313233;
	padding-bottom: 6px}
		
.bd a.more{
	display:inline;
	padding: 4px 0 0 0;
	border-bottom: 1px #fff dotted}

    /* Contact info UC */
ul.contact {width: 220px !important}
ul.contact li {
	color: #fff;
	list-style: none;
	padding: 0 0 2px 8px;
	font-size: 85%;
	width: 200px}

ul.contact li acronym, ul.contact li strong {color: #bdbdbd;font-weight: bold}
ul.contact li.address {margin-top: 20px;color: #999999}	

    /* Contact form UC */

.contact_form {
	overflow: hidden;
	width: 240px !important;
	padding: 0;
	margin: 0;
	color: #fff;
	font-size: 85%;
	margin-left: 6px !important}

.contact_form li {margin-bottom: 6px;float: left}
    
#thanks {width: 220px}
    	
.contact_form input, .contact_form label, .contact_form span {float: left;padding: 1px}
.contact_form ul label {width: 54px;clear: both}
.contact_form span {float:left;margin: 2px 0 0 54px;display: none}
.contact_form li.submit input{margin-left: 56px}
.contact_form .box {width: 160px}


/* Page: .portfolio 
---------------------*/	
.pg_portfolio  {background: url(/themes/JMBailey/img/portfolio_bg.jpg) center 0px repeat-x #00aeef}
.pg_portfolio .bd {margin-top: 16px;background: none;}
	
.pg_portfolio .items span strong {font-weight: bold}
	
.pg_portfolio .items span {
       display: block;
       margin: 0 0 16px 0;
       width: 864px;
       color: #fff;
       font-size: 93%;
	   float: left}
       
.pg_portfolio .items span img {
       float: left;
       display: inline;       
       width: 576px}
	   
.pg_portfolio .items .blue {color: #999999}	   
.pg_portfolio .items .blue strong {color: #00aeef}	
       
.pg_portfolio .items .blue a:link, .pg_portfolio .items .blue a:visited{color: #00aeef;border-bottom: 1px dotted #00aeef}
.pg_portfolio .items .blue a:hover, .pg_portfolio .items .blue a:active{color: #00aeef;border-bottom: 1px solid #00aeef}
	
.pg_portfolio .items span strong {font-weight: bold}
       
.pg_portfolio .items span p {
       float: left;
       width: 220px;
	   height: 210px;
       padding: 0 16px 0 16px}
	   
.pg_portfolio .items h3 {display: block}

.pg_portfolio .items span ul {
	list-style: none;
	float: left;
	width: 576px;
	padding: 12px 0 16px 0;
	background: url(../img/portfolio_items_casestudy_bg.gif) bottom repeat-x #ffffff}	
	
.pg_portfolio .items span ul li {
	list-style: none;
	width: 275px;
	float: left;
	padding: 0 0 16px 10px}
	
.pg_portfolio .items span ul li h3 {
	font-size: 108%;
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 8px}	
	
	
.pg_portfolio .items ul li p {
	float: none;
	width: 266px;
	height: auto;
	padding: 0;
	padding-right: 8px;
	color: #999999;	
	margin: 0}	

.pg_portfolio .top h1 {
	color: #f144ab;
	font-size: 40px;
	margin-top: 26px;
	margin-bottom: 80px}

	
/* Page: .blog 
---------------------*/	
.pg_blog {background: url(/themes/JMBailey/img/blog_bg.jpg) no-repeat center top #00aeef}
.pg_blog .bd {background: none}
.pg_blog .pagecontent {height: 112px}

.pg_blog .pagecontent h1 {
	color: #f144ab;
	font-size: 40px;
	margin-top: 26px;
	margin-bottom: 80px}
	
    /* Main blog styles are in blog.css */
    
    

/* Page: .map
---------------------*/
.pg_map {background: url(/themes/JMBailey/img/drip_bg.jpg) repeat-x center -342px #00aeef}
.pg_map .hd {background: #fff}
.pg_map .bd {margin-bottom: -10px}
	
	
	
/* Page: .services
---------------------*/
.pg_services {background: url(/themes/JMBailey/img/services_bg.gif) center -14px repeat-x #00aeef}
.pg_services .bd {background:none; margin-top:16px; color:#fff}	
	
.pg_services h2, .pg_.about h2 {
	font-family: “Trebuchet MS”, sans-serif;
	font-family: Arial, Helvetica, Sans-Serif;
	font-weight: bold;
	font-size: 108%;
	color: #fff;
	margin: 16px 0 4px 0}
	
.pg_services .bt a:link, .pg_services .bt a:visited {
	color: #fff;
	text-decoration: none}
	
.pg_services .bt strong {font-weight: bold}	
.pg_services .bt p {margin-bottom: 7px}

.pg_services .bt_1 p {padding-right: 12px}	
.pg_services .bt_2 div {width: 420px}	
.pg_services .bt_2 p {text-align: justify;padding-right: 12px}
.pg_services .bt_3 .spacer {width: 200px;height: 4px;display: block}	

.pg_services .top {width: 544px;margin-bottom: 95px}	
.pg_services .top h1 {color: #f144ab;font-size: 40px;margin-top: 26px}
.pg_services .top p {font-size: 93%;color: #333333;width: 470px}

.pg_services .pagecontent .col1 h2{
	font-size: 12px;/* px for sifr */
	} 

.pg_services .pagecontent .col1 p {
	font-size: 93%;
	padding-right: 0px}
	
.pg_services .pagecontent .col1 {
	margin-left: 28px}


/* Page: .about
---------------------*/
.pg_about {background: url(/themes/JMBailey/img/drip_bg.jpg) repeat-x center -342px #00aeef}
.pg_about .pagecontent {margin-bottom: 16px}
.pg_about .bd {margin-top: 16px}
	
.pg_about .top h1 {
	color: #ffffff;
	font-size: 40px;
	margin-top: 26px;
	margin-bottom: 20px}	
	
.pg_about p {width: 580px;margin-bottom: 4px}	
.pg_about p.small {font-size: 85%;margin-top: 20px}	
	

/* Page: .contact
---------------------*/
.pg_contact {background: url(/themes/JMBailey/img/contact_bg.jpg) repeat-x center -116px #00aeef}
.pg_contact .bd {margin-top: 16px; background: none}
	
.pg_contact .top h1 {
	color: #ffffff;
	font-size: 40px;
	margin-top: 26px;
	margin-bottom: 20px}	
	
.pg_contact h2 {
	font-family: “Trebuchet MS”, sans-serif;
	font-weight: bold;
	font-size: 108%;
	color: #fff;
	margin: 16px 0 4px 0}
	
.pg_contact .grid .details span {
    width: 58px;
    display: inline-block}
	   
    
/* Page: .terms / .privacy
---------------------*/
.pg_terms .pagecontent, .pg_privacy .pagecontent {width: 500px}
.pg_terms .hd h1, .pg_privacy .hd h1 {padding-bottom: 30px}	

.pg_terms p, .pg_privacy p {color: #fff;margin: 0 0 8px 16px;font-size: 93%}

.pg_terms .pagecontent h1, .pg_privacy .pagecontent h1 {
	font-family:Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 131%;
	color: #fff;
	margin: 16px 0 4px 16px}
	
.pg_terms h2, .pg_privacy h2 {
	font-family:Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 116%;
	color: #fff;
	margin: 5px 0 5px 16px}

      
/* Module: sIFR Styles
---------------------*/   
@media screen, print{
    .sIFR-flash {visibility: visible !important; margin: 0;padding: 0}
    .sIFR-replaced, .sIFR-ignore {visibility: visible !important}
    .sIFR-alternate {
        position: absolute;
        left: 0;
        top: 0;
        width: 0;
        height: 0;
        display: block;
        overflow: hidden}
    .sIFR-replaced div.sIFR-fixfocus {margin: 0pt;padding: 0pt;overflow: auto;letter-spacing: 0px;float: none} }

@media print{
    .sIFR-flash {
      display    : none !important;
      height     : 0;
      width      : 0;
      position   : absolute;
      overflow   : hidden}

    .sIFR-alternate {
      visibility : visible !important;
      display    : block   !important;
      position   : static  !important;
      left       : auto    !important;
      top        : auto    !important;
      width      : auto    !important;
      height     : auto    !important} }
