/* ======= Rest  ==========   */
@media screen {

    body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, a {
        margin: 0px;
        padding: 0px;
    }

    body {
        background-image: url(../images/background-tile.jpg);
        font-family: Arial, Helvetica, sans-serif;
        font-size: 15px;
        color: #4D4D4D;
    }

    #wrapper {
        margin: 20px auto;
        width: 999px;
    }

    .clear {
        clear: both;
    }

    /*   =====  Main and Sub headings   ======   */
    h1 {
        font-family: 'Yanone Kaffeesatz', arial, serif;
        text-shadow: 2px 2px 2px #000;
        font-size: 100px;
        color: #fff;
        float: left;
    }

    h2 {
        font-family: 'Crimson Text', arial, serif;
        font-size: 35px;
        color: #000;
        font-weight: bold;
    }

    h2 a, h2 a:visited, h2 a:active {
        font-family: 'Crimson Text', arial, serif;
        font-size: 35px;
        color: #000;
        font-weight: normal;
        text-decoration: none;
        font-weight: bold;
    }

    h2 a:hover {
        text-shadow: 0px 0px 5px #FADA00;
    }

    /*   =====  Top header   ======   */
    #header {
    }

    #header:after {
        clear: both;
        display: block;
        content: "";
    }

    #header ul {
        color: #fff;
        font-size: 14px;
        float: right;
        list-style: none;
        margin-top: 10px;
    }

    #header ul li {
        padding-bottom: 6px;
    }

    /*   =====  Links on the top   ======   */
    #contact-info {
        color: #fff;
        font-size: 14px;
        width: 100%;
        border-bottom: 2px dashed #000;
        padding-bottom: 20px;
        float: left;
    }

    #contact-info .col1, #contact-info .col2 {
        text-align: left;
        display: table-cell;
        padding-left: 5px;
    }

    #contact-info .col1 {
        text-align: right;
        padding-right: 10px;
    }

    #contact-info a, #contact-info a:active, #contact-info a:visited {
        color: #FADA00;
        text-decoration: none;
    }

    #contact-info a:hover {
        color: #FFFF00;
        text-decoration: none;
        text-shadow: 0px 0px 5px #fff;
    }

    .links {
        float: left;
        margin-left: 80px;
    }

    /*   =====  Introduction text   ======   */
    #header-left h1 {
        width: 550px;
    }

    #address {
        float: right;
        padding-top: 100px;
        padding-bottom: 35px;
        color: white;
        width: 135px;
        padding-right: 65px;
    }

    #address p {
        text-align: right;
    }

    #intro {
        margin-top: 10px;
    }

    #intro:after {
        clear: both;
        display: block;
        content: "";
    }

    #intro p {
        font-family: 'Crimson Text', arial, serif;
        font-size: 30px;
        color: #fff;
    }

    #intro p:selection {
        color: #000;
    }

    .highlight {
        color: #FADA00;
    }

    ::selection {
        background: #000;
        color: #fff;
    }

    /* Safari */
    ::-moz-selection {
        background: #000;
        color: #fff;
    }

    /* Firefox */
    #aboutme-header, #projects-header, #skills-header {
        display: none
    }

    /*   =====  Sections   ======   */
    .section {
        margin: 30px 0px 30px 0px;
    }

    .section:after {
        clear: both;
        display: block;
        content: "";
    }

    .section-title {
        background-image: url(../images/section-title-bg.png);
        background-repeat: no-repeat;
        width: 171px;
        height: 41px;
        float: left;
    }

    .section-title:after {
        clear: both;
        display: block;
        content: "";
    }

    .section-title p {
        padding: 7px 0px 8px 7px;
        font-weight: bold;
        cursor: pointer;
    }

    .section-title p:hover {
        color: #fff;
        text-decoration: none;
        text-shadow: 0px 0px 5px #000;
    }

    .section-body {
        background-color: #fff;
        width: 94%;
        margin: -10px 0px 0px 10px;
        padding: 0px 25px 25px 25px;
        box-shadow: 0px 0px 30px #000;
    }

    .section-title2 {
        margin-left: 1px;
        background-image: url(../images/section-title-bg3.png);
        background-repeat: no-repeat;
        width: 171px;
        height: 41px;
        float: left;
    }

    .section-title2:after {
        clear: both;
        display: block;
        content: "";
    }

    .section-title2 p:hover {
        color: #FADA00;
        text-decoration: none;
        text-shadow: 0px 0px 5px #000;
    }

    .section-title2 p {
        padding: 7px 0px 8px 7px;
        font-weight: bold;
        cursor: pointer;
    }

    .section-body div {
        display: inline-table;
    }

    .item-template {
        border-bottom: 1px dashed #CCCCCC;
        width: 100%;
        margin-bottom: 25px;
        margin-top: 25px;
        padding-bottom: 15px;
    }

    .item-template:after {
        clear: both;
        display: block;
        content: "";
    }

    .section-body p {
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 25px;
    }

    .last-item {
        margin-bottom: 0px;
        border-bottom: 0px !important;
    }

    .skill-name {
        float: left;
    }

    .skill-rating {
        font-family: 'Crimson Text', arial, serif;
        font-size: 55px;
        float: right;
        border: 0px solid red;
        line-height: 1px;
        padding-top: 58px;
    }

    a.hidden, a.hidden:hover, a.hidden:visited, a.hidden:active {
        text-decoration: none;
        color: #4D4D4D;
    }

    .item-template-lessmargin {
        border-bottom: 1px dashed #CCCCCC;
        width: 100%;
        margin-bottom: 25px;
        margin-top: 0px;
        padding-bottom: 25px;
    }

    .item-template-skills:lessmargin {
        clear: both;
        display: block;
        content: "";
    }

    .your-details {
        float: right;
    }

    .your-details ul {
        list-style: none;
        margin-top: 15px;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .your-details ul li {
        padding: 9px 10px 7px 40px;
        height: 25px;
        display: inline;
        background-image: url(../images/icon-check.jpg);
        background-repeat: no-repeat;
    }

    #photo {
        float: left;
        display: inline;
        width: 170px;
        height: 236px;
        margin: 0px;
        background-image: url(../images/ulrich_sw.png);
        background-repeat: no-repeat;
    }

    #header-left {
        float: left;
        width: 750px;
    }

    /* highlight date on white bg*/
    /*.date{ color: #4D4D4D ; background-color: #FADA00; ;  padding: 3px;margin-right: 1px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
    */
    .date {
        border-bottom: 3px solid #FADA00;
    }

    /* current tab highlight  */
    #tabs div.current p {
        background-color: #FADA00;
        color: #FFF;
        text-decoration: none;
        text-shadow: 0px 0px 5px #000; /* #FADA00;*/
        box-shadow: 5px -8px 10px #333;
    }

    /* round edges*/
    .section-title, #aboutme-section {
        border-top-right-radius: 7px;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0px;
        border-top-left-radius: 0px;
        -moz-border-radius-topright: 7px;
        -moz-border-radius-bottomright: 0px;
        -moz-border-radius-bottomleft: 0px;
        -moz-border-radius-topleft: 0px;
        -webkit-border-top-right-radius: 7px;
        -webkit-border-bottom-right-radius: 0px;
        -webkit-border-bottom-left-radius: 0px;
        -webkit-border-top-left-radius: 0px;

    }

    .section-title2, #tabs div.section-title2.current p {
        border-top-right-radius: 7px;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0px;
        border-top-left-radius: 7px;
        -moz-border-radius-topright: 7px;
        -moz-border-radius-bottomright: 0px;
        -moz-border-radius-bottomleft: 0px;
        -moz-border-radius-topleft: 7px;
        -webkit-border-top-right-radius: 7px;
        -webkit-border-bottom-right-radius: 0px;
        -webkit-border-bottom-left-radius: 0px;
        -webkit-border-top-left-radius: 7px;
    }

    /*  skill rating */
    .high3 {
        background-image: url(../images/plus2.png);
        background-repeat: repeat-x;
        background-position: right bottom;
        width: 95px;
    }

    .high2 {
        background-image: url(../images/plus2.png);
        background-repeat: repeat-x;
        background-position: right bottom;
        width: 63px;
    }

    .high1 {
        background-image: url(../images/plus2.png);
        background-repeat: repeat-x;
        background-position: right bottom;
        width: 32px;
    }

    .medium {
        background-image: url(../images/circle.png);
        background-repeat: no-repeat;
        background-position: right bottom;
        width: 32px;
    }

    .low {
        background-image: url(../images/minus.png);
        background-repeat: no-repeat;
        background-position: right bottom;
        width: 32px;
    }

    /* external and download links*/
    .external {
        background-image: url(../images/externallinkgr.png);
        background-repeat: no-repeat;
        background-position: right bottom;
        padding-right: 10px;
    }

    .download {
        background-image: url(../images/download2gr.png);
        background-repeat: no-repeat;
        background-position: right bottom;
        padding-bottom: 3px;
        padding-right: 12px;
    }

    /* calendar*/
    #calendar-area {
        float: left;
        width: 980px;
    }

    .calendar {
        float: left;
        margin: 5px;
    }

    /* tooltip styling */
    .tooltip {
        float: left;
        display: none;
        background: url(../images/black_arrow2.png);
        font-size: 12px;
        height: 70px;
        width: 160px;
        padding: 25px;
        color: #fff;
    }

    .text-small {
        font-size: 12px;
        color: #4D4D4D;
        text-transform: uppercase;
        display: block
    }

    .first {
        margin-bottom: 3px;
        padding-top: 10px;
    }

    #go-top {
        margin: -8px 0px 0px 1px;
    }

    .hand-cursor {
        cursor: pointer;
    }

    .scroll-links {
        margin: 3px 0px 0px 0px;
        color: #fff;
        width: 100%;
        text-align: right;
    }

    .scroll-links a, .scroll-links a:active, .scroll-links a:visited {
        color: #fff;
        font-size: 10px;
        text-transform: uppercase;
    }

    .scroll-links a:hover {
        color: #FFFF00;
    }

    /*   =====  Footer   ======   */
    #footer {
        color: #fff;
        font-size: 12px;
    }

    #footer p {
        margin-bottom: 10px;
    }

    #footer div {
        float: left;
        margin-right: 5px;
    }

    #footer a, #footer a:active, #footer a:visited {
        color: #FADA00;
        text-decoration: none;
    }

    #footer a:hover {
        color: #FFFF00;
        text-shadow: 0px 0px 5px #fff;
    }

}

@media print {

    /*   =====  Main and Sub headings   ======   */
    /*h1 { font-family: 'Yanone Kaffeesatz', arial, serif;  text-shadow: 2px 2px 2px #000; font-size:40px; color:#fff;float: left;}*/
    /*h2{font-family: 'Crimson Text', arial, serif; font-size:20px; color:#000; font-weight:bold;}*/
    /*h2 a, h2 a:visited, h2 a:active{font-family: 'Crimson Text', arial, serif; font-size:35px; color:#000; font-weight:normal; text-decoration:none; font-weight:bold;}*/
    /*h2 a:hover{text-shadow: 0px 0px 5px #FADA00;}*/
    /*   =====  Top header   ======   */
    #header {
    }

    #header:after {
        clear: both;
        display: block;
        content: "";
    }

    #header ul {
        color: #fff;
        font-size: 14px;
        float: right;
        list-style: none;
        margin-top: 10px;
    }

    #header ul li {
        padding-bottom: 6px;
    }

    /*   =====  Links on the top   ======   */
    #contact-info {
        color: #fff;
        font-size: 14px;
        width: 100%;
        border-bottom: 2px dashed #000;
        padding-bottom: 20px;
        float: left;
    }

    #contact-info .col1, #contact-info .col2 {
        text-align: left;
        display: table-cell;
        padding-left: 5px;
    }

    #contact-info .col1 {
        text-align: right;
        padding-right: 10px;
    }

    #contact-info a, #contact-info a:active, #contact-info a:visited {
        color: #245182;
        text-decoration: none;
    }

    #contact-info a:hover {
        color: #FFFF00;
        text-decoration: none;
        text-shadow: 0px 0px 5px #fff;
    }

    .links {
        float: left;
        margin-left: 80px;
    }

    /*   =====  Introduction text   ======   */
    /*#header-left h1{width: 550px;}*/
    #header-left {
        float: left
    }

    #address {
        float: right;
        padding-top: 100px;
        padding-bottom: 35px;
        color: #2b2b2b;
        width: 135px;
        padding-right: 65px;
    }

    #address p {
        text-align: right;
    }

    .your-details {
        float: right;
    }

    .your-details ul {
        list-style: none;
        margin-top: 15px;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .your-details ul li {
        padding: 9px 10px 7px 40px;
        height: 25px;
        display: inline;
        background-image: url(../images/icon-check.jpg);
        background-repeat: no-repeat;
    }

    #photo {
        float: right;
        display: inline;
        width: 170px;
        height: 236px;
        margin: 0px;
        content: url(../images/ulrich_sw.png)!important;
        background-repeat: no-repeat;
    }

    .item-template-lessmargin {
        border-bottom: 1px dashed #CCCCCC;
        width: 100%;
        margin-bottom: 25px;
        margin-top: 0px;
        padding-bottom: 25px;
    }

    .item-template {
        border-bottom: 1px dashed #CCCCCC;
        width: 100%;
        margin-bottom: 25px;
        margin-top: 50px;
        padding-bottom: 25px;
    }

    .item-template:after {
        clear: both;
        display: block;
        content: "";
    }

    .item-template-skills:lessmargin {
        clear: both;
        display: block;
        content: "";
    }

    /*.skill-name{float:left;}*/
    .skill-rating {
        font-family: 'Crimson Text', arial, serif;
        font-size: 55px;
        float: right;
        border: 0px solid red;
        line-height: 1px;
        padding-top: 58px;
    }

    .date {
        border-bottom: 3px solid #FADA00;
    }

    #aboutme-body,  #projects-body, #skills-body {
        display: block !important;
    }

    div #tabs {
        display: none;
    }

    #intro {
        display: none;
    }

    .item-template:nth-of-type(5) {
        display: none;
    }

    #aboutme-body p:nth-of-type(5) {
        display: none;
    }

    #skills-body .item-template:nth-of-type(1) p:first-of-type {
        display: none;
    }

    #aboutme-header, #projects-header, #skills-header{
        border-bottom: solid 1px;
        margin-top: 80px;
    }

    .text-small {
        font-size: 12px;
        display: block
    }
    .text-small span {
        display: inline-block;
    }

    #skills-body div.item-template-lessmargin, #skills-body div.item-template {
        float: left;
        width: 50%;
        margin-bottom: 10px;
        padding-bottom: 10px;
    }

    #skills-body .skill-rating {
        display: none;
    }

    #skills-body .item-template {
        margin-top: 0px;
    }

    #skills-body h2 {
        font-size: 18px;
    }

    #aboutme-body .item-template h3:first-of-type, #aboutme-body .item-template p:first-of-type {
        display: none;
    }
    #contact-info .links:nth-of-type(4) {
        display: none;
    }

    body a {
        text-decoration: none;
        color: #000;
    }

}