/* 
    Document   : mobile.css
    Created on : 23.04.2010, 09:40:02
    Author     : cdjm
    Description:
        Adapts the page for mobile devices
*/

#left {
    width:auto !important;
    float:none !important;
}

#right {
    margin-top: 15px;
    margin-left: 0 !important;
}

#header_content, #content_inner, #footer_inner {
    width:auto !important;
}

#header_outer {
    height:auto !important;
}

#header_content img {
    display:none !important;
}

#header_content {
    background:url("../gfx/header_mobile.jpg") no-repeat;
    background-position: center;
    height: 78px !important;
}

a {
    font-size:1.25em;
}


div.navigation {
    border:1px solid black;
    position:absolute;
    left:5px;
    top:10px;
    background-color:white;
}

/* Stretch the content across the whole page */
div.content  {
    width:100%;
    float:inherit;
}

/* Make the headings a bit larger */
h3.ui-accordion-header {
    padding-top: 5px;
    padding-bottom: 5px;
}

/* Navigation -> Extruder */
.extruder li {
    margin:10px auto;
}

.extruder li a {
    width:85%;
    display:block;
    text-align: left;
    color:white;
    text-decoration: none;
    padding:8px !important;
}

.extruder ul {
    border:none !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
}

.extruder h2 {
    color:#888;
    font-weight:normal;
    border-bottom:1px solid grey;
}

.extruder form div {
    margin-bottom:20px !important;
}