/*-------------------
    MEDIA QUERIES
-------------------*/

@media (min-width: 360px)
{
    div.wrapMisc { /* Flex wrapper for the links section */
        padding-bottom: 14px;
    }

    h1 { /* Content main header */
        font-size: 2.2em;
    }

    h2  { /* Content sub header */
        font-size: 2.1em !important;
    }
    
    img.photo { /* Personal photo */
        width: 160px;

        margin: 0px 0px 2px 8px; /* top, right, bottom, left*/
    }
    
    .textLarge { /* Text formatting classesn */
        font-size: 1.05em;
    }

    .textMedium {
        font-size: 0.95em;
    }

    .textNormal {
        font-size: 0.95em;
    }

    .textSmall {
        font-size: 0.85em;
    }

    .textTiny {
        font-size: 0.75em;
    }
}


@media (min-width: 385px)
{
    div.wrapMisc { /* Flex wrapper for the links section */
        padding-bottom: 16px;
    }
    
    h4 { /* Accordion height */
        height: 120px;
    }
    
    img.photo { /* Personal photo */
        width: 170px;

        margin: 0px 0px 2px 8px; /* top, right, bottom, left*/
    }

    .textLarge { /* Text formatting classesn */
        font-size: 1.1em;
    }

    .textMedium {
        font-size: 1.0em;
    }

    .textNormal {
        font-size: 1.0em;
    }

    .textSmall {
        font-size: 0.9em;
    }

    .textTiny {
        font-size: 0.8em;
    }
}


@media all and (min-width: 512px)
{    
    h4 { /* Accordion height */
        height: 150px;
    }

    img.iconSoftware { /* Software icons */
        width: 23%;
    }
    
    img.iconStudio { /* Studio icons */
        width: 25%;
    }
    
    img.photo { /* Personal photo */
        width: 200px;
    }
}


@media all and (min-width: 600px)
{
    div.wrapSocial { /* Generic wrapper for the content sections */
        width: 50%;
    }
    
    div.wrapThumb a{ /* Links that are children of the gallery wrapper */
        width: 49%;
        
        margin: 0px 2px; /* top/bottom left/right */
    }
    
    h4 { /* Accordion height */
        height: 170px; /* Original size of background image */
    }
    
    a.linkCv:link { /* CV links */
        display: block;
    }

    a.linkCv2:link {
        display: none;
    }
    
    img.iconContact { /* Contact icon */
        width: 20%;
    }
    
    img.iconSoftware { /* Software icons */
        width: 19%;
    }
    
    img.photo { /* Personal photo */
        width: 250px;
    }
}


@media all and (min-width: 768px)
{
    .bgHide { /* Hide background */
        background: none !important;
    }

    #nav-trigger { /* Navigation menu button on mobile devices */
        display: none;
    }

    #nav-main { /* Navigation bar */       
        display: block;
    }
    
    #nav-main a { /* The link with the text inside the list element */
        padding: 0.3em 0.50em; /* top/bottom right/left */
        
        font-size: 2.0em;
    }

    #nav-mobile { /* Navigation bar on mobile devices */
        display: none;
    }

    section.content { /* Wrapper for the main contents */
        padding: 0px 10px 20px 10px; /* top left bottom right */
    }
    
    section.content, a.linkTop  { /* Adds a border around the main content section */
        border: 5px solid;
    }
    
    div.wrapAccordion, div.wrapArt { /* Accordion and Art wrapper */
        border-left: 5px solid;
        border-right: 5px solid;
    }
    
    div.wrapCv { /* Flex wrapper for the CV section */
        width: 50%;
    
        -webkit-flex: 1 0 50% !important; /* Chrome 21+, Opera 15+, Safari 6.1+ */
        -ms-flex: 1 0 100% !important; /* IE 10+ */
        flex: 1 0 50% !important; /* W3 standard */
        
        text-align: left;
    }
    
    div.wrapCv:last-child {
        margin-top: 0;
    }
    
    div.wrapMisc { /* Flex wrapper for the links section */
        width: 50%;
        
        padding-bottom: 10px !important;

        -webkit-flex: 1 0 50% !important; /* Chrome 21+, Opera 15+, Safari 6.1+ */
        -ms-flex: 1 0 50% !important; /* IE 10+ */
        flex: 1 0 50% !important; /* W3 standard */
    }
    
    div.wrapStudio { /* Wrapper for the studio contents */
        width: 50%;
        height: 50%;
    }
    
    footer {
        display: none;
    }

    h1, h2 { /* Content main header */
        margin-bottom: 10px;
        margin-left: 0;
        
        font-size: 2.5em;
    }
    
    h2  { /* Content sub header */
        font-size: 2.4em !important;
    }
    
    h4 { /* Accordion thumbnail */
        background-size: auto !important; /* Gradually removes cropping */
    }

    h4#accordion01 {
        background: url(../img/thumb01.png);
    }

    h4#accordion02 {
        background: url(../img/thumb17.png);
    }

    h4#accordion03 {
        background: url(../img/thumb16.png);
    }

    h4#accordion04 {
        background: url(../img/thumb04.png);
    }

    h4#accordion06 {
        background: url(../img/thumb06.png);
    }

    h4#accordion07 {
        background: url(../img/thumb07.png);
    }

    h4#accordion08 {
        background: url(../img/thumb08.png);
    }

    h4#accordion09 {
        background: url(../img/thumb09.png);
        background-position: center !important;
    }

    h4#accordion10 {
        background: url(../img/thumb10.png);
        background-position: center !important;
    }

    h4#accordion11 {
        background: url(../img/thumb11.png);
    }

    h4#accordion12 {
        background: url(../img/thumb12.png);
    }

    h4#accordion13 {
        background: url(../img/thumb13.png);
    }

    h4#accordion14 {
        background: url(../img/thumb14.png);
    }

    h4#accordion15 {
        background: url(../img/thumb15.png);
        background-position: center !important;
    }

    img.iconContact { /* Contact icon */
        width: 15%;
    }
    
    img.iconSoftware { /* Software icons */
        width: 13%;
        
        margin: 0px 2px 2px 2px;
    }
    
    img.iconStudio { /* Studio icons */
        width: 33%;
    }
    
    img.photo { /* Personal photo */
        width: 280px;

        margin: 0px 0px 4px 10px; /* top, right, bottom, left*/
    }
    
    img.iconScript { /* Script icons */
        width: 20%;
    }
    
    .textSkill {
        font-size: 1.5em !important;
    }

    .margBottomHide { /* Values assigned in mobile.css */
        margin-bottom: 12px !important;
    }
    
    .padRight { /* Extra padding classes */
        padding-right: 10px !important;
    }
    
    .padSidesHide {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    .padTopMobile {
        padding-top: 0 !important;
    }
    
    .textLarge { /* Text formatting classesn */
        font-size: 1.1em;
    }

    .textMedium {
        font-size: 1.0em;
    }

    .textNormal {
        font-size: 0.95em;
    }

    .textSmall {
        font-size: 0.9em;
    }

    .textTiny {
        font-size: 0.8em;
    }
}


@media (min-width: 900px)
{    
    #nav-main a { /* The link with the text inside the list element */
        padding: 0.3em 0.75em; /* top/bottom right/left */
        
        font-size: 2.2em;
    }
    
    div.wrapContact, div.wrapSocial { /* Generic wrapper for the content sections */
        width: 50%;
    }
    
    div.wrapThumb a{ /* Links that are children of the gallery wrapper */
        width: 32.7%;
        
        margin: 0px 2px; /* top/bottom left/right */
    }
    
    img.iconContact { /* Contact icon */
        width: 25%;
    }

    img.iconSoftware { /* Software icons */
        width: 13.5%;
        
        margin: 0px 1px 1px 1px;
    }
    
    img.photo { /* Personal photo */
        width: 350px;

        margin: 0px 0px 5px 12px; /* top, right, bottom, left*/
    }
    
    img.iconScript { /* Script icons */
        width: 15%;
    }
    
    .textLarge { /* Text formatting classesn */
        font-size: 1.2em;
    }

    .textMedium {
        font-size: 1.1em;
    }

    .textNormal {
        font-size: 1.0em;
    }
}