@media only screen {

    /*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
    html {
        font-family: sans-serif;
        -ms-text-size-adjust: 100%;
        -webkit-text-size-adjust: 100%
    }

    body {
        margin: 0
    }

    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    main,
    menu,
    nav,
    section,
    summary {
        display: block
    }

    audio,
    canvas,
    progress,
    video {
        display: inline-block
    }

    audio:not([controls]) {
        display: none;
        height: 0
    }

    progress {
        vertical-align: baseline
    }

    template,
    [hidden] {
        display: none
    }

    a {
        background-color: transparent;
        -webkit-text-decoration-skip: objects
    }

    a:active,
    a:hover {
        outline-width: 0
    }

    abbr[title] {
        border-bottom: none;
        text-decoration: underline;
        text-decoration: underline dotted
    }

    b,
    strong {
        font-weight: inherit
    }

    b,
    strong {
        font-weight: bolder
    }

    dfn {
        font-style: italic
    }

    h1 {
        font-size: 2em;
        margin: 0.67em 0
    }

    mark {
        background-color: #ff0;
        color: #000
    }

    small {
        font-size: 80%
    }

    sub,
    sup {
        font-size: 75%;
        line-height: 0;
        position: relative;
        vertical-align: baseline
    }

    sub {
        bottom: -0.25em
    }

    sup {
        top: -0.5em
    }

    img {
        border-style: none
    }

    svg:not(:root) {
        overflow: hidden
    }

    code,
    kbd,
    pre,
    samp {
        font-family: monospace, monospace;
        font-size: 1em
    }

    figure {
        margin: 1em 40px
    }

    hr {
        box-sizing: content-box;
        height: 0;
        overflow: visible
    }

    button,
    input,
    select,
    textarea {
        font: inherit;
        margin: 0
    }

    optgroup {
        font-weight: bold
    }

    button,
    input {
        overflow: visible
    }

    button,
    select {
        text-transform: none
    }

    button,
    html [type="button"],
    [type="reset"],
    [type="submit"] {
        -webkit-appearance: button
    }

    button::-moz-focus-inner,
    [type="button"]::-moz-focus-inner,
    [type="reset"]::-moz-focus-inner,
    [type="submit"]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    button:-moz-focusring,
    [type="button"]:-moz-focusring,
    [type="reset"]:-moz-focusring,
    [type="submit"]:-moz-focusring {
        outline: 1px dotted ButtonText
    }

    fieldset {
        border: 1px solid #c0c0c0;
        margin: 0 2px;
        padding: 0.35em 0.625em 0.75em
    }

    legend {
        box-sizing: border-box;
        color: inherit;
        display: table;
        max-width: 100%;
        padding: 0;
        white-space: normal
    }

    textarea {
        overflow: auto
    }

    [type="checkbox"],
    [type="radio"] {
        box-sizing: border-box;
        padding: 0
    }

    [type="number"]::-webkit-inner-spin-button,
    [type="number"]::-webkit-outer-spin-button {
        height: auto
    }

    [type="search"] {
        -webkit-appearance: textfield;
        outline-offset: -2px
    }

    [type="search"]::-webkit-search-cancel-button,
    [type="search"]::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-input-placeholder {
        color: inherit;
        opacity: 0.54
    }

    ::-webkit-file-upload-button {
        -webkit-appearance: button;
        font: inherit
    }

    * {
        box-sizing: border-box
    }

    body {
        color: #1a1a1a;
        font-family: "Roboto", Arial, sans-serif;
        font-size: 14px;
        line-height: 1.5
    }

    a {
        color: #10347C
    }

    a:hover {
        text-decoration: none
    }

    a:visited {
        color: #3D37CF
    }

    html {
        font-size: 62.5%
    }

    body {
        font-size: 1.4em;
        line-height: 1.5
    }

    p,
    ul,
    ol,
    dl,
    blockquote,
    pre,
    td,
    th,
    textarea {
        font-size: 1em;
        line-height: 1.5;
        margin: 0.18em 0 1.5em 0
    }

    h1,
    .h1 {
        font-size: 1.83em;
        line-height: 1.6154;
        margin: 0 0 0.18em 0
    }

    h2,
    .h2 {
        font-size: 1.7143em;
        line-height: 1.75;
        margin: 1.75em 0 .875em 0
    }

    h3,
    .h3 {
        font-size: 1.5rem
    }

    h3 .date,
    .h3 .date {
        display: block
    }

    h3:after,
    .h3:after {
        content: ' ';
        display: block;
        margin-top: 1rem;
        width: 5%;
        border-bottom: 3px solid #10347C
    }

    h4,
    .h4 {
        font-size: 1.4286em;
        line-height: 1.05;
        margin: 2.1em 0 1.05em 0
    }

    h5,
    .h5 {
        font-size: 1.2857em;
        line-height: 1.1667;
        margin: 2.3334em 0 1.1667em 0
    }

    h6,
    .h6 {
        font-size: 1.1429em;
        line-height: 1.3125;
        margin: 2.625em 0 1.3125em 0
    }

    .smaller {
        font-size: .7143em;
        line-height: 2.1;
        margin: 2.1em 0 2.1em 0
    }

    .small {
        font-size: .8571em;
        line-height: 1.75;
        margin: 1.75em 0 1.75em 0
    }

    .big {
        font-size: 1.1429em;
        line-height: 1.3125;
        margin: 1.3125em 0 1.3125em 0
    }

    .bigger {
        font-size: 1.2857em;
        line-height: 1.1667;
        margin: 1.1667em 0 1.1667em 0
    }

    .biggest {
        font-size: 1.4286em;
        line-height: 1.05;
        margin: 1.05em 0 1.05em 0
    }

    p:last-child,
    ul:last-child,
    ol:last-child,
    dl:last-child,
    blockquote:last-child,
    pre:last-child,
    table:last-child {
        margin-bottom: 0
    }

    li p,
    li ul {
        margin-top: 0;
        margin-bottom: 0
    }

    textarea,
    table,
    td,
    th,
    code,
    pre,
    samp,
    div,
    p {
        word-wrap: break-word;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        -o-hyphens: auto;
        hyphens: auto
    }

    code,
    pre,
    samp {
        white-space: pre-wrap;
        font-family: consolas, 'DejaVu Sans Mono', courier, monospace
    }

    code {
        line-height: 1
    }

    table {
        margin-bottom: 1.5em
    }
}

@media only screen and (min-width: 480px) {

    h3 .date,
    .h3 .date {
        float: right
    }
}

@media only screen {
    .section {
        margin: 0 24px
    }

    .section h2:before {
        margin-right: 12px;
        margin-right: .75rem
    }

    .sidebar {
        background-color: #10347C;
        color: #fff;
        margin-top: 24px;
        padding-bottom: 24px
    }

    .grid {
        margin: 0 auto;
        max-width: 520px;
        overflow: hidden
    }

    .footer {
        clear: both;
        color: #fff;
        text-align: center
    }

    .footer .grid {
        background-color: #000
    }

    .footer .copyright {
        padding: 6px 0 6px 24px
    }
}

@media only screen and (min-width: 480px) {
    .sidebar {
        margin-top: 0
    }
}

@media only screen and (min-width: 768px) {
    .grid {
        max-width: 960px;
        background-image: -webkit-linear-gradient(left, #10347C 0, #10347C 35%, transparent 35%, transparent 100%);
        background-image: -moz-linear-gradient(left, #10347C 0, #10347C 35%, transparent 35%, transparent 100%);
        background-image: -ms-linear-gradient(left, #10347C 0, #10347C 35%, transparent 35%, transparent 100%);
        background-image: -o-linear-gradient(left, #10347C 0, #10347C 35%, transparent 35%, transparent 100%);
        background-image: linear-gradient(left, #10347C 0, #10347C 35%, transparent 35%, transparent 100%)
    }

    .grid p {
        max-width: 520px
    }

    .main-content {
        float: right;
        width: 65%
    }

    .sidebar {
        float: left;
        width: 35%
    }

    .footer {
        text-align: left
    }

    .footer .grid {
        background-color: transparent
    }
}

@media only screen {
    .company span {
        position: absolute;
        left: -9999px;
        overflow: hidden
    }

    .hide {
        position: absolute;
        left: -9999px;
        overflow: hidden
    }

    @font-face {
        font-family: 'icomoon';
        src: url("../fonts/icomoon.eot?qiph4t");
        src: url("../fonts/icomoon.eot?qiph4t#iefix") format("embedded-opentype"), url("../fonts/icomoon.ttf?qiph4t") format("truetype"), url("../fonts/icomoon.woff?qiph4t") format("woff"), url("../fonts/icomoon.svg?qiph4t#icomoon") format("svg");
        font-weight: normal;
        font-style: normal
    }

    .section h2:before,
    [class^="icon-"],
    [class*=" icon-"] {
        font-family: 'icomoon', sans-serif !important;
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale
    }

    #presentation:before,
    .icon-file-empty:before {
        content: "\e924"
    }

    #education:before,
    .icon-library:before {
        content: "\e921"
    }

    #experience:before,
    .icon-user-tie:before {
        content: "\e976"
    }

    .experience h3 {
        font-size: 1.4rem;
    }

    .experience .date.icon-calendar {
        margin-top: 3px;
    }

    #expertise:before,
    .icon-embed2:before {
        content: "\ea80"
    }

    #languages:before,
    .icon-bubble:before {
        content: "\e96b"
    }

    #volunteering:before,
    .icon-man-woman:before {
        content: "\e9de"
    }

    .icon-mail-envelope-closed:before {
        content: "\e900"
    }

    .icon-location:before {
        content: "\e947"
    }

    .icon-location2:before {
        content: "\e948"
    }

    .icon-calendar:before {
        content: "\e953"
    }

    .icon-mobile:before {
        content: "\e958"
    }

    .icon-bubbles:before {
        content: "\e96c"
    }

    .icon-user:before {
        content: "\e971"
    }

    .icon-accessibility:before {
        content: "\e9b2"
    }

    .icon-earth:before {
        content: "\e9ca"
    }

    .icon-star-half:before {
        content: "\e9d8"
    }

    .icon-star-full:before {
        content: "\e9d9"
    }

    .icon-heart:before {
        content: "\e9da"
    }

    .icon-twitter:before {
        content: "\ea96"
    }

    .icon-github:before {
        content: "\eab0"
    }

    .icon-skype:before {
        content: "\eac5"
    }

    .icon-linkedin:before {
        content: "\eac9"
    }

    .vcard {
        padding-top: 48px
    }

    .vcard .title,
    .vcard .job-title {
        display: none
    }

    .vcard .photo {
        border-radius: 50%;
        border: 4px solid #10347C;
        box-shadow: 0 0 0 4px #fff;
        display: block;
        margin: 0 auto;
        width: 130px
    }

    .list ul {
        list-style: none;
        padding: 0
    }

    .list-contact li,
    .list-personal li {
        clear: both
    }

    .list-contact li>span:first-child,
    .list-contact li>abbr:first-child,
    .list-personal li>span:first-child,
    .list-personal li>abbr:first-child {
        float: left;
        margin-bottom: 12px;
        text-decoration: none
    }

    .list-contact li>span:first-child:before,
    .list-contact li>abbr:first-child:before,
    .list-personal li>span:first-child:before,
    .list-personal li>abbr:first-child:before {
        margin-right: 6px
    }

    .list-contact li>span:first-child:after,
    .list-contact li>abbr:first-child:after,
    .list-personal li>span:first-child:after,
    .list-personal li>abbr:first-child:after {
        margin-right: 6px
    }

    .list-contact li a,
    .list-personal li a {
        color: #fff
    }

    .list-contact .icon-mail-envelope-closed:before,
    .list-personal .icon-mail-envelope-closed:before {
        font-size: 30px;
        font-size: 1.875rem;
        margin-left: -4px;
        font-weight: bold
    }

    .list-timeline {
        margin: 2em 0;
        padding: 0
    }

    .list-timeline-date {
        padding-right: 24px;
        padding-right: 1.5rem
    }

    .list-timeline-element {
        margin: 0
    }

    .list-timeline-element.title {
        font-weight: bold
    }

    .list-timeline-separator {
        clear: both
    }
}

@media only screen and (min-width: 768px) {
    .list-timeline-date {
        float: left;
        text-align: right;
        width: 15%
    }

    .list-timeline-date time {
        display: block
    }

    .list-timeline-element {
        border-left: 1px solid #000;
        margin: 0 0 0 15%;
        max-width: 33.75em;
        padding: 0 0 .5em .5em;
        width: 85%
    }
}

@media only screen {
    .list-expertise li {
        clear: both;
        margin-bottom: 24px
    }

    .list-expertise li>strong {
        display: block
    }

    .list-expertise li>strong:after {
        content: ':'
    }

    .list-expertise li a:before,
    .list-expertise li abbr:before,
    .list-expertise li span:before {
        content: ' | ';
        margin: 0 5px;
        text-decoration: none;
        display: inline-block
    }

    .list-expertise li a.first:before,
    .list-expertise li abbr.first:before,
    .list-expertise li span.first:before {
        content: '';
        margin: 0
    }

    .list-expertise li .highlight {
        background-color: #2AE86A;
        display: inline-block;
        padding: 5px;
        margin: 3px
    }

    .list-expertise li .highlight:before {
        content: '';
        margin: 0
    }

    .list-connect li {
        margin-bottom: 12px
    }

    .list-connect li:last-child {
        margin-bottom: 0
    }

    .list-connect li a {
        color: #fff;
        text-decoration: none;
        font-size: 1.8rem
    }

    .list-connect li a:before {
        margin-right: 12px
    }

    .list-connect li a:hover {
        color: #D72DF5;
        -webkit-transition: color 0.5s ease-out;
        -moz-transition: color 0.5s ease-out;
        -ms-transition: color 0.5s ease-out;
        -o-transition: color 0.5s ease-out;
        transition: color 0.5s ease-out
    }

    .nav.contact a {
        background-color: #C72867;
        color: #fff;
        display: block;
        font-size: 1.5714em;
        line-height: 1.909;
        margin: 0;
        padding: 12px;
        text-align: center;
        text-decoration: none;
        -webkit-transition: all 0.5s ease-out;
        -moz-transition: all 0.5s ease-out;
        -ms-transition: all 0.5s ease-out;
        -o-transition: all 0.5s ease-out;
        transition: all 0.5s ease-out
    }

    .nav.contact a:hover {
        background-color: #fff;
        border: 1px solid #C72867;
        color: #C72867
    }
}

@media only screen and (min-width: 768px) {
    .nav.contact {
        display: none
    }
}

@media only screen {

    .container-12,
    .container-16,
    .container-24 {
        background-color: #fff;
        background-repeat: repeat-y;
        background-position: -5px 0
    }

    .container-12 {
        background-image: url("i/12-col.gif")
    }

    .container-16 {
        background-image: url("i/16-col.gif")
    }

    .container-24 {
        background-image: url("i/24-col.gif")
    }

    .temp-nav {
        list-style: none;
        margin: 0;
        padding: 0;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        display: block
    }

    .temp-nav li {
        border: 1px solid #000;
        float: left;
        margin: 0;
        padding: 5px
    }

    .temp-nav .color-primary-1 {
        background-color: #D72DF5
    }

    .temp-nav .color-primary-2 {
        background-color: #C72867
    }

    .temp-nav .color-primary-3 {
        background-color: #2AE86A
    }

    .temp-nav .color-primary-4 {
        background-color: #10347C
    }

    .temp-nav .color-primary-5 {
        background-color: #3D37CF
    }

    .temp-nav .white {
        color: #fff
    }

    .temp-nav .black {
        color: #1a1a1a
    }
}

@media print {
    body {
        width: auto !important;
        margin: auto !important;
        font-family: sans-serif;
        font-size: 12pt;
        background-color: #fff !important;
        color: #000 !important
    }

    p,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    blockquote,
    ul,
    ol {
        color: #000 !important;
        margin: auto !important
    }

    .print {
        display: block
    }

    .print[href]:after {
        content: " (" attr(href) ")"
    }

    blockquote,
    ul,
    ol {
        page-break-inside: avoid
    }

    h1,
    h2,
    h3,
    caption {
        page-break-after: avoid
    }

    a {
        color: #000 !important;
        text-decoration: underline !important
    }

    [class^="icon-"],
    [class*=" icon-"] {
        text-decoration: none !important
    }

    h2:before {
        border-color: #000 !important
    }

    .header {
        background-color: #fff !important
    }

    .nav-cv,
    .skipper,
    .nav-contact {
        display: none
    }

    @page {
        @top {
            content: element(sidebar)
        }
    }

    h1 {
        position: running(sidebar)
    }
}