* {

    padding:                0;
    margin:                 0;
    font-family:            'Roboto', sans-serif;
    color:                  #5D5D5D;

}

body, html {

	background-color:       #FFFFFF;
	line-height:            1.65;

}

strong {

    font-weight:            500;

}

h1,
h2 {

    color:                  #0177B4;

}

section {

    margin:                 50px 0;

}

    section h1 {

        font-weight:             400;

    }

@media only screen and ( max-device-width: 640px ) {

    .mobile-hide {

        display:                none;

    }

    .mobile-break {

        display:                block;

    }

    section {

        margin:                 30px 0;

    }
}

.mobile-clearfix:before,
.mobile-clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.mobile-clearfix:after {
    clear: both;
}

#header {

    background-color:       #f8f8f8;

}

    #header .inner {

        max-width:              720px;
        margin:                 0 auto;
        padding:                50px 0;

    }

        #header .inner .picture {

            width:                  110px;
            height:                 110px;
            border-radius:          55px;
            float:                  right;
            margin:                 -9px 0 0 0;

        }

        #header .inner .name-and-label {

            display:                inline-block;

        }

        #header .inner h1 {

            font-weight:            200;
            font-size:              38px;
            color:                  #0177B4;

        }

        #header .inner h2 {

            font-weight:            300;
            color:                  #0177B4;
            margin-top:             -10px;

        }

@media only screen and ( max-device-width: 640px ) {

        #header .inner {

            max-width:              100%;
            padding:                20px 15px;

        }

            #header .inner .picture {

                width:                  60px;
                height:                 60px;
                border-radius:          30px;
                margin:                 0;

            }

            #header .inner h1 {

                font-size:              24px

            }

            #header .inner h2 {

                font-size:              16px

            }

}


#resume {

	margin:                 0 auto;
	max-width:              720px;
    padding:                0 5px 0 15px;

}

#basics { }

    #basics .contact {

        margin-left:            0px;

    }

    #basics .contact strong,
    #location strong {

        clear:                  both;
        float:                  left;
        line-height:            1.3;
        width:                  170px;

    }

@media only screen and ( max-device-width: 640px ) {

    #basics .contact strong,
    #location strong {

        display:                inline-block;
        line-height:            1.65;
        width:                  auto;
        float:                  none;

    }

}

#work,
#volunteer,
#education,
#awards,
#publications,
#skill,
#interests {}

    #work .item:not(:first-of-type),
    #volunteer .item:not(:first-of-type),
    #awards .item:not(:first-of-type),
    #publications .item:not(:first-of-type) {

        margin-top: 50px

    }

    #work .name,
    #volunteer .name,
    #education .studyType,
    #awards .title,
    #publications .name,
    #skills .name,
    #languages .language,
    #references .name,
    #interests .name {

        font-weight:            500;
        display:                inline-block;

    }

    #interests .name:nth-of-type(2n+2) {

        text-align:             center;

    }

    #interests .name:nth-of-type(3n+3) {

        text-align:             right;

    }

    #work .date,
    #volunteer .date,
    #education .date,
    #awards .date,
    #publications .releaseDate {

        float:                  right;

    }

    #work .highlights,
    #volunteer .highlights,
    #education .courses,
    #skills .keywords {

        padding-left:           25px;
        margin-top:             5px;

    }

    #work .highlights li,
    #volunteer .highlights li,
    #education .courses li,
    #skills .keywords li {

        margin-top:             1px;

    }

    #interests .keywords li {

        display:                inline-block;

    }


    #interests .item {

        max-width:              204px;
        text-align:             justify;
        display:                inline-block;
        margin-right:           0px;

    }

    #skills .item,
    #interests .item:not(:nth-of-type(3n+3)) {

        display:                inline-block;
        vertical-align:         top;
        margin-right:           50px;

    }



    #skills .level {

        margin-top:             -7px;

    }

    #education .item,
    #languages .item {

        margin-bottom:          5px;

    }

    .date,
    #languages .fluency {

        font-style:             italic;

    }

@media only screen and ( max-device-width: 640px ) {

    #work .position {

        font-size:              15px;
        font-style:             italic;

    }

    #work .date {

        font-size:              15px;
        float:                  none;
        margin-top:             -8px;
        display:                block;
        font-style:             normal;
        margin-bottom:          10px;

    }

    #work .item:not(:first-of-type),
    #volunteer .item:not(:first-of-type),
    #awards .item:not(:first-of-type),
    #publications .item:not(:first-of-type) {

        margin-top:             30px

    }

    #education .institution {

        display:                inline-block

    }

    #education .item:not(:last-of-type) {

        margin-bottom:          20px;

    }

    #interests .item {

        max-width:              none;
        text-align:             inherit;
        margin-right:           0 !important;

    }

    #interests .item:not(:last-of-type),
    #skills .item:not(:last-of-type) {

        margin-bottom:          20px;

    }



}

#footer {

    background:             #f8f8f8;
    margin:                 0;

}

    #footer .inner {

        width:                  720px;
        padding:                50px 5px;
        margin:                 0 auto;

    }