ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input, img {
    margin: 0;
    padding: 0;
    line-height: 1.5;}

html {
    font-size: small;}
    
body {
    background: #ffffff;
    font-family: Arial, Verdana, "Luxi Sans", sans-serif;
    margin: 0;
    padding: 0;
    font-size: 1.1em;}

/* Header */
#header {
    padding: 0.2em 0;
    width: 100%;}

#header h1 {
    float: left;
    margin: 0 0 0 0.2em;}

#header h1 a, #header h1 a:hover {
    background: transparent;
    display: block;}
    
#header h1 img {
    width: 95px;
    display: block;
    padding: 0 0 0.2em 0;
    margin: 0;}
        
#header a {
    color: #919394;
    text-decoration: none;
    font-weight: bold;
    padding: 0 0.2em;}
    
#header a.current {
    color: #ffffff;
    background: #919394;}
        
#header a:hover {
    color: #ffffff;
    background: #000000;
    text-decoration: none;}
    
/* Navigation */
#nav {
    display: none;
    background: rgba(255,255,255,0.9);
    box-shadow: 0.1em 0.1em 0.5em rgba(0,0,0,0.6);
    position: absolute;
    right: 0;
    top: 0;
    margin: 1em 3.5em 0 0;
    z-index: 1000;}
    
#nav.show {
    display: block;}
    
#mob_menu_link {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0.5em 0.5em 0 0;}
    
#mob_menu_link a {
    background: #000000;
    display: block;
    padding: 0.5em 0.8em 0 0.8em;
    box-shadow: 0.1em 0.1em 0.5em rgba(0,0,0,0.6);}
    
.ulNav {
    margin: 0;
    padding: 0;
    list-style-type: none;}

.ulNav a {
    text-transform: uppercase;}

.ulNav li {
    margin: 0 0.5em;
    list-style-type: none;
    float: left;
    margin: 0;
    padding: 0;}

#header .ulNav a {
    color: #8C8C8C;
    padding: 0.5em;
    display: block;
    width: 8em;}
    
#header .ulNav a:hover {
    color: #ffffff;}
    
#header .ulNav a.current {
    color: #ffffff;}
    
#mobile_switch {
    left: 110px;
    /*top: 32px;*/
    top: 0;
    position: absolute;
    display: block;
    font-size: 0.8em;}
    
/* Tabs */
#tabs {
    clear: both;
    height: 20em;
    background: #BE1E2D;}
    
.service #tabs {
    height: 16em;}
    
#contentTab {
    float: left;
    height: 100%;}
    
#ajaxBuffer {
    height: 100%;}

div.resultTab {
    height: 100%;
    float: left;
    position: relative;}
    
#resultTab_y {
    width: 100%;
    float: none;
    height: auto;
    clear: both;}
    
div.resultImage {
    height: 100%;
    background-position: center bottom;
    background-repeat: no-repeat;}
    
div.resultTab a {
    height: 100%;
    width: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;}
    
div.resultTab a.active {
    background: rgba(0,0,0,0.6);
    cursor: default;}
    
div.resultImage a span {
    position: absolute;
    left: -999em;}
    
#resultTab_x {
    float: left;
    width: 50%;
    background: #BE1E2D;
    color: #ffffff;}
    
#tab_x_content {
    padding: 0.2em 0 0 0;
    font-size: 0.9em;}    

#tab_x_content p {
    margin: 0.5em;
    line-height: 1;}    

#tab_x_content blockquote {
    border: 0 none;
    margin: 1em 0 1em;}    

#tab_x_content blockquote p {
    line-height: 1;
    font-size: 1.4em;}    

#tab_x_content blockquote strong {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #BE1E2D;
    font-weight: normal;}
    
ul.newsHighlights {
    margin-top: 100px;}
    
/* News */
#newsScroller {
    width: 100%;
    overflow-x: scroll;}

#main ul.newsHighlights {
    list-style-type: none;
    display: block;
    margin: 1em 0;
    padding: 0;
    width: 67em;
    height: 4em;}
    
#main ul.newsHighlights li {
    margin: 0 0.5em 0 0;
    padding: 0;
    float: left;
    width: 13em;
    height: 100%;
    overflow: hidden;}
    
#main ul.newsHighlights li:last-child {
    margin-right: 0;}
    
#main ul.newsHighlights a {
    display: block;
    width: 100%;
    background: #E0E0E0;
    color: #000000;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    height: 100%;}
    
#main ul.newsHighlights a:hover {
    color: #ffffff;
    background: #000000;}
    
#main ul.newsHighlights a img {
    float: right;
    width: 48%;}
    
#main ul.newsHighlights a span.highlightSummary {
    overflow: hidden;
    padding: 0.5em;
    display: block;
    font-size: 0.8em;
    line-height: 1;}
    
/* Main */
h1.pageTitle {
    color: #A3B0B5;
    letter-spacing: -0.05em;
    font-size: 1.8em;
    margin: 0;
    padding: 0;}
    
#tabs.portfoliolist #contentTab {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #000000;
    width: 100%;}
    
.service #tabs.portfoliolist #contentTab {
    width: 100%;}
    
#general_content.expander_active {
    padding: 0;
    height: 100%;}
    
#general_content.expander_active h2.expander {
    background: #919394 url(/images/slider_border.png) right repeat-y;
    width: 5%;
    height: 100%;
    float: left;
    position: relative;
    margin: 0;
    padding: 0;
    font-size: 1.3em;}
    
#general_content.expander_active h2.expander a {
    height: 100%;
    width: 100%;
    display: block;
    text-decoration: none;}
    
#general_content.expander_active h2.expander a span.rotate {
    position: absolute;
    height: 0;
    width: 0;
    bottom: 0.25em;
    left: 0;
    color: #ffffff;
    font-weight: bold;
    line-height: 1.2;
    /*text-align: right;*/}
    
#general_content.expander_active h2.expander a span.rotate span {
    display: block;
    width: 11.5em;
    position: absolute;}
    
#general_content.expander_active h2.expander:hover {
    background-color: #000000;}

#general_content.expander_active h2.expander:hover span {
    color: #ffffff;}
  
#general_content.expander_active h2.expander.current {
    background: #ffffff;}
    
#general_content.expander_active h2.expander.current span {
    color: #919394;}
    
#general_content.expander_active h2.expander + div {
    width: 0;
    height: 100%;
    overflow: hidden;
    float: left;
    background: #E5F1F3;}
    
#general_content.expander_active h2.expander + div.expanded  {
    height: 100%;
    overflow: auto;}
    
#general_content.expander_active h2.expander + div > div {
    /*padding: 0.5em;*/
    background: #E5F1F3}
    
h2.expander + div.expanded > div {
    position: absolute;
    overflow: hidden;}
    
#general_content {
    background: #E5F1F3;
    padding: 0.5em 1em;}
    
#general_content p {
    margin: 0.5em 1em;
    line-height: 1.2;}
    
#general_content label {}
    
#general_content input {
    height: 20px;
    padding-left: 20px;
    background: #ffffff url(/webassets/images/icons/fugue/icons/user.png) 2px center no-repeat;}
    
#general_content input.email {
    background-image: url(/webassets/images/icons/fugue/icons/mail-at-sign.png);}
    
#general_content textarea {
    padding-left: 20px;
    background: #ffffff url(/webassets/images/icons/fugue/icons/pencil.png) 2px 2px no-repeat;}

#general_content h3 {
    text-align: left;
    font-weight: normal;
    margin: 0.65em 0.8em;}
    
#general_content ul {
    margin: 0.5em 1.5em;}
    
#general_content li {
    margin: 0.2em 0;
    padding: 0;}
    
#general_content a {
    color: #be1e2d;
    position: static;
    display: inline;
    width: auto;
    height: auto;}
    
img.newsImage {
    width: 5em;}
    
/* Portfolio */
#resultTab_y ul {
    list-style-type: none;
    margin: 0;
    padding: 0.5em 0;
    overflow: hidden;}
    
#resultTab_y li {
    float: left;}

#resultTab_y a {
    position: static;
    height: auto;
    width: auto;
    padding: 0.2em 1em;
    text-decoration: none;
    color: #000000;
    font-weight: bold;
    text-transform: uppercase;}
    
#resultTab_y a.current {
    color: #ffffff;
    background: #000000;}
    
div.portfolioImagesTab {
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    width: auto;}
    
div.portfolioImagesScroll {
    height: 100%;
    width: auto !important;
    white-space: nowrap;}
    
div.clientImage {
    float: left;
    height: 475px;
    width: 300px;
    background-position: top left;
    background-repeat: no-repeat;}
    
div.portfolioDesc {
    position: absolute;
    top: 0;
    left: 2em;
    width: 95%;
    padding-right: 5%;
    height: 100%;
    background: #BE1E2D;
    color: #ffffff;}
    
div.portfolioDesc a {
    background: transparent;
    position: static;
    width: auto;
    display: inline;
    height: auto;
    color: #ffffff;
    font-weight: bold;}
    
div.portfolioDesc p {
    padding: 0 1em;
    margin: 0.5em 0;}
    
div.resultContent {
    float: left;
    height: 100%;
    background: #ffffff;}
    
div.resultColumnContent {
    height: 100%;
    width: 100%;
    position: relative;}
    
#ajaxBuffer {
    background: #BE1E2D;}
    
#mobAjaxBuffer {
    height: 100%;
    position: relative;}
    
img.clientImage {
    height: 100%;}
    
/* Forms */
div.form {
    width: 100%;}
    
#main ol.form, #main ul.formActions {
    list-style-type: none;
    width: 100%;
    margin-lefT: 1em;}
    
ol.form input, ol.form textarea {
    border: 1px solid #3f3f3f;}
    
#main ul.formActions {
    margin: 0 2em;
    padding: 0;}
    
ul.formActions li.alignedRight {
    float: right;}
    
span.required {
    color: #ac2125;}
    
button {
    background: #ac2125;
    border: 1px outset #3f3f3f;
    color: #ffffff;
    text-transform: uppercase;
    cursor: pointer;
    padding: 0.2em;}
    
    button:hover {
        border-color: #ffffff;}
        
ol.form div.formError {
    color: #ac2125;}
    
p.feedbackSuccess {
    font-weight: bold;
    margin: 1em 0;}
    
#general_content p.required {
    margin-left: 2em;}
    
/* General */
    
#general_content {
    overflow: hidden;
    background: #E5F1F3;}
    
#general_content p {
    margin: 0.5em 1em;}
    
#general_content label {
    width: 30%;
    float: left;}
    
#general_content input {
    padding-left: 20px;
    background: #ffffff url(/webassets/images/icons/fugue/icons/user.png) 2px center no-repeat;}
    
#general_content input.email {
    background-image: url(/webassets/images/icons/fugue/icons/mail-at-sign.png);}
    
#general_content textarea {
    padding-left: 20px;
    height: 6em;
    background: #ffffff url(/webassets/images/icons/fugue/icons/pencil.png) 2px 2px no-repeat;}

#general_content h3 {
    text-align: left;
    font-weight: normal;
    margin: 0.65em 0.8em;}
    
#general_content ul {
    margin: 0.5em 2em;}
    
#general_content li {
    margin: 0.2em 0;
    width: 100%;
    padding: 0;}
    
#general_content a {
    color: #be1e2d;
    position: static;
    display: inline;
    width: auto;
    height: auto;}
    
img {
    border: 0;}
    
img.alignRight {
    float: right;
    margin: 0.2em 0 0.2em 0.5em;}
    
img.alignLeft {
    float: left;
    margin: 0.2em 0.5em 0.2em 0;}

@media (orientation: portrait)
{
    .ulNav li {
        float: none;}
        
    #tabs {
        height: auto !important;}
        
    #contentTab {
        float: none;
        width: 100% !important;}
        
    div.resultTab {
        height: 55px;
        width: 100% !important;
        float: none;}
        
    div.resultImage {
        background-position: center center;}
        
    #resultTab_x {
        height: auto;}
        
    #general_content.expander_active h2.expander {
        float: none;
        width: 100%;
        height: auto;
        background: #919394;
        border-bottom: 1px solid #ffffff;}
        
    #general_content.expander_active h2.expander + div {
        width: 100% !important;
        float: none;}
        
    #general_content.expander_active h2.expander a {
        padding: 0.2em;}
        
    #general_content.expander_active h2.expander a span.rotate {
        text-align: left;
        position: static;}
        
    #general_content.expander_active h2.expander a span.rotate span {
        position: static;
        width: auto;}
        
    #mobAjaxBuffer {
        width: 100%;}
        
    div.portfolioImagesTab {
        width: 100%;
        float: none;
        height: 250px;}
        
    div.resultContent {
        height: auto;
        float: none;
        width: 100% !important;}
        
    h2.portfolioTitle {
        display: none;}
        
    div.portfolioDesc {
        display: block !important;
        position: static;
        overflow: hidden;}
        
    a.portfolioDescTrigger {
        display: none;}
        
    h2.expander + div.expanded > div {
        position: static;}
        
    #general_content.expander_active h2.expander + div {
        height: auto;}
                
    #general_content.expander_active h2.expander + div > div {
        width: 100% !important;
        overflow: hidden;}
}

@media (orientation: landscape)
{
    #general_content.expander_active h2.expander a span.rotate {
        -ms-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        transform: rotate(-90deg);}
        
    h2.portfolioTitle {
        float: left;
        position: relative;
        height: 100%;
        width: 1em;
        padding: 0 0.5em;
        color: #ffffff;}
    
    h2.portfolioTitle span.rotate {
        position: absolute;
        height: 0;
        width: 0;
        bottom: 0.5em;
        left: 0.2em;
        font-weight: bold;
        line-height: 1;
        -ms-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        transform: rotate(-90deg);}
        
    div.resultTab {
        display: block !important;}
        
    div.resultContent {
        display: block !important;}
    
    h2.portfolioTitle span.rotate span {
        width: 12em;
        display: block;
        position: absolute;}
        
    a.portfolioDescTrigger {
        position: absolute;
        top: 0;
        left: 0;}
        
    h2.expander + div.expanded > div {
        height: auto !important;}
        
    h2.expander + div {
        display: block !important;}
}