
body {font-size: 12px;
      font-family: "trebuchet ms", "tahoma", "arial";
      margin: 0;
      padding: 0;
      background: #FFFFFF url(../../images/background.jpg) repeat-x;
      color: #5B6973;
      text-align: center;} /* Needed to center layout in old IE browsers. */

acronym, abbr {cursor: help;
               border-bottom: 1px dotted;}

h1, h2, h3, h4, h5, h6, p {margin: 10px 0 10px 0;
                           padding: 0;}

p {line-height: 160%;}

.justify {text-align: justify;}

ul {list-style-type: square;}

img {border: 0;
     margin: 0 0 25px 0;}
       
h1 {font-size: 26px;}
h2 {font-size: 24px;}
h3 {font-size: 22px;}
h4 {font-size: 20px;}
h5 {font-size: 18px; color:#4600CC;}
h6 {font-size: 16px;}

.bottom-border {border-bottom: 1px solid #FF9900;}

a {color: #F60; text-decoration: none; background-color: #FFFFFF;}
a:link {color: #F60; background-color: #FFFFFF;}
a:visited {color: #F60; background-color: #FFFFFF;}
a:hover {color: #4153AD; background-color: #FFFFFF;}

.right {float: right;}

.left {float: left;
       margin: 3px 5px 0 0;}

.clear-fix:after {content: ".";
                  display: block;
                  clear: both;
                  height: 0;
                  visibility: hidden;}

.clear-fix {display: inline-block;}

/* Hide from IE Mac \*/

.clear-fix {display:block;}

/* End hide from IE Mac */

#container {width: 780px;
            margin: 0 auto;
            text-align: left;}

#header {width: 100%;
         height: 139px;
         position: relative;}

#header h1 {margin: 0;}




/* Begin placeholder for static image logo 

#logo {												
		position: absolute;									
		left: 1px;											
		top: -1px;									
		width: 281px;									
		height: 100px;										
		background-image: url(images/sapphire_logo.swf);} 	

#logo img {display: block;}								
													
#logo a {background: transparent;}

end placeholder for static image logo */



/* Begin pleaceholder for search

#search {position: absolute;
         right: 0;
         top: 70px;}

#search input#s {margin-right: 5px;
                 vertical-align: middle;
                 border: 1px solid #6A7A86;
                 padding: 0.24em;
                 width: 135px;
                 background-color: #E4E4E4;
                 color: #6C7074;}

#search input#s:focus {background-color: #F3F3F3;
                       color: #6C7074;}

#search input#submit
 
{background: #6C7074 url(images/search_background.jpg) repeat-x;
 color: #D8DCE0;
 border: 1px solid #515D67;
 vertical-align: middle;
 padding: 0.38em;
 font-size: 0.8em;}

end placeholder for Search */


/* Begin main navigation menu. */

#menu
{
	width: 100%;
	height: 27px;
	clear: both;
	background: url( ../../images/button_end_gradient.jpg ) no-repeat left;
	position: relative;
}

#menu ul {list-style-type: none;
          margin: 0;
          padding: 0;
          position: absolute;
          left: 2px;
          background: #4600CC url(../../images/menu_background.jpg) repeat-x;
          color: #DCE0E4;}

#menu ul li {display: inline;}

#menu ul li a {
	text-decoration: none;
	height: 27px;
	padding: 0 17px;
	margin: 0;
	line-height: 27px;
	display: block;
	float: left !important;
	background: url(../../images/button_end_gradient.jpg) center right no-repeat;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
}

#menu ul li a:hover {background: url(../../images/button_end_gradient.jpg) center right no-repeat;
                     color: #FF9900;}

/* End main navigation menu. */

#wrapper {width: 100%;
          margin-top: 11px;
          padding: 0;} 

#left-column {width: 510px;
              float: left;
              padding: 0;
              margin: 0;}

#right-column {width: 240px;
               padding: 0;
               float: right;
               margin: 0;}
#right-column1 {width: 240px;
               padding: 0;
               float: right;
               margin: 0;}

p#intro {font-size: 24px;
         font-style: italic;
         margin: 0;}

#learn-more {width: 100%;}

#learn-more a img {display: block;
                   float: right;}

/* Sub-content section */

#sub-outer 
{
	background:#ffffff;
	text-align:justify;
	width: 100%;
    clear: both;
    padding: 0;
    margin: 0;
}

#sub-wrapper 
{
	text-align:justify;
	float: left;
    width: 100%;
	margin:0,0,0,0;

}

#sub-center 
{
	margin-left:34%;
	float:none;
	width: 32%;
}

#sub-right 
{
	float: right;
	width: 32%;
    /*  width: 240px;
	margin-left: -240px; */
}

#sub-left 
{
	float: left;
	width: 32%;
    /* width: 240px;
    margin:0;
    margin-left: -780px; */
}

/* End sub-content section */

/* The footer is outside of the main container and has an extra 10px in width to compensate visually for the background shadows. */ 

#footer {width: 790px;
         height: 56px;
         margin: 0 auto;
         background: #FFFFFF url(../../images/footer_background.jpg) repeat-x;
         color: #5B6973;
         clear: both;
         text-align: left;
         padding: 0;
         position: relative;}

#footer-content {padding: 19px 15px;}

#footer-right {position: absolute;
               right: 0;
               top: 0;
               width: 15px;
               height: 56px;
               background: #FFFFFF url(../../images/footer_right.jpg) no-repeat;
               color: #5B6973;}
               
#footer-left {position: absolute;
              left: 0;
              top: 0;
              width: 15px;
              height: 56px;
              background: #FFFFFF url(../../images/footer_left.jpg) no-repeat;
              color: #5B6973;}

#footer p {margin: 0;}

#footer a {background: transparent;}

#footer-navigation 
{
	margin: 0;
	width: 100%;
}

/* Featured services */

.featured-wrapper 
{
	background: url(../../images/featured_background.jpg) repeat-y;
    color: #FFFFFF;
    width: 100%;
    margin-bottom: 30px;  
}

.featured-content {padding: 0;
                   margin: -8px 0 0; 
                   height: 275px;
                   text-align:left;
                   font-size: 14px;}

.featured-content ul {list-style-type :disc;
                      list-style-position:outside;
                      text-align:left;
                      font-style: italic;
                      list-style-type: none;
                      line-height: 120%; 
                      width:75%}
.featured-content li 
{
    list-style-type:disc;
}

.featured-content p 
{
	margin: 0;
    width:85%;
    padding: 0 10px; 
    line-height: 120%;
}

.featured-content a 
{
	background: transparent;
	position:absolute;
	top:840px;
}

.featured-content a img 
{
	padding: 0;
    margin: 0;
    display: block;
    width:241px;
	height: 44px;
}
						 

.featured-top {width: 100%;
               height: 18px;
               background: url(../../images/featured_top.jpg) no-repeat;
               color: #4600CC;}

/* End Featured Services CSS */

/* Featured news */

.headline {margin: 0 0 5px;
           padding: 0;
           font-size: 12px;}

.date {color: #F60;
       background-color: #FFFFFF;
       float: right;}

/* A single column division. Good for terms of use, privacy policy, etc. */

#single-column {width: 100%;
                clear: both;
                margin-top: 22px;
                padding: 0;}


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	SIDE NAV 

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#nav-side {
	clear: both;
	background:#4600CC; 
    /*
	background: url( ../../images/button_end_gradient.jpg ) no-repeat left;
	*/
	margin-left:auto;
	margin-right:auto;
	width:110px;
	padding:.8em 0 1em 20px;
	position:relative;
	font-weight:bold;
}

.nav-side-table {
	width:110px;
	vertical-align:top;
	background:#4600CC;
	}


#nav-side div {
	background:#4600CC;
	width:15%;
	position:absolute;
	top:0;
	right:0;
	padding:.8em 0 1em 0;
}

#nav-side ul {
/*	margin:0;
	padding:0 20% 0 0;
	background:#4600CC;
*/
	list-style-type:none;
    margin: 0;
    padding: 0;
    position: absolute;
    left: 2px;
    background: #4600CC url(../../images/menu_background.jpg) repeat-x;
    color: #DCE0E4;
	}
	
#nav-side li {
	display:inline;
	list-style:none;
/*	
	padding:0 1em 0 0;
	background:4600CC;
*/
	}

#nav-side a:link,
#nav-side a:visited 
{
	text-decoration: none;
	height: 27px;
	padding: 0 17px;
	margin: 0;
	line-height: 27px;
	display: block;
	float: left !important;
	background:#4600CC;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
/*
	background: url(../../images/button_end_gradient.jpg) center right no-repeat;
	color:#FFFFFF;
	text-decoration:none;
*/
}

#nav-side a:hover 
{
	color: #FF9900;
/*
	color:#D4E7F8;
	text-decoration:underline;
*/
}

/*

#nav-side a:active {
	background:#4600CC;
	color:#FFFFFF;
}

#nav-side li.current a:link,
#nav-side li.current a:visited {
	background:#4600CC;
	text-decoration:underline;
}

#nav-side li.current a:hover {
	background:#4600CC;
	color:#D4E7F8;
	text-decoration:underline;
}

#nav-side li.current a:active {
	background:#4600CC;
	color:#FFFFFF;
}

*/

/* ACTIVE PAGES */
#nav-side a.StaticSelectedStyle:link,
#nav-side a.StaticSelectedStyle:visited {
	background:#4600CC;
	color:#D4E7F8;
	text-decoration:underline;
}

/* Case Studies */
.case-study-logo 
{
    width: 150px;
}
.case-study-logo-detail
{
    width: 150px;
}
.case-study-quote 
{
	font-size: 16px; 
	font-style:italic;
	margin-left:30px;
	margin-right:30px;
	color:#4600CC;
}

.header-logo
{
    float: left;
    text-align: left;
    margin-top: 10px;
    margin-left: 0px;
}

a.logo
{
    background: url('../../images/PanoramixLogo.gif') no-repeat;
    display: block;
    width: 277px;
    height: 147px;
    text-decoration: none;
}

.header-tagline
{
    margin-top: 80px;
    margin-left:50px;
    width: 420px;
    height: 32px;
    text-decoration: none;
    font-family: Trebuchet MS;
    float: right;
    background: url('../../images/Tagline.png') no-repeat;
    background-size:100%;
}
.tagline-bold
{
    font-weight: bold;
    font-size: 21px;
    letter-spacing: .2em;
}

.Panoramix-header
{
    float: left;
    width: 100%;
}

.Panoramix-content
{
    font-size:14px;
    float: left;
    text-align: left;
    margin-top: 10px;
    margin-left: 0px;
}