/*phone-only*/
    @media (max-width: 599px) {

        p {
            line-height: normal;
        }

        img.logo{
            width: 80vw;
        }
        
        /* Introduccion */

        img.logo-intro{
            width: 60vw;
            top: 5vh;
        }

        .intro-text-container {
            width: 95vw;
        }

        /*home*/
        #btnHelp {
            display: none;
        }
        
        .title-avenir-black {
            font-size: 1em;
            line-height: normal;
        }

        .container-home-text {
            font-size: 1em;
            line-height: normal;
            margin-top: 5%;
            flex: 4;
        }

        .container-navigation-folio{
            display: flex;
        }

        #hint-selecciona {
            margin-top: 5%;
        }

        #set-folio-2{
            display: none;
        }

        /*Detalle de folio*/
        .folio-indicator {
            margin: 0.6em 0.5em;
            font-family: Avenir-Light;
            font-size: 1em;
        }

        .option > span {
            font-size: 1em;
            margin-left: 1rem;
        }

        .container-folio-detail {
            flex-flow: column;
        }

        .img-detail-container {
            flex: 2;
        }
        .modes-folio-container {
            flex-flow: row;
            flex: 1;
        }

        .radio-buttons-box {
            flex-flow: row;
            flex-wrap: wrap;
            margin-left: 0; 
        }

        .option img {
            width: 1.2em;
        }

        .option {
            margin: 3% 0;
            align-items: flex-start;
        }

        .option > span {
            margin-left: 0.5rem;
        }

        /* Elementos estilísticos */
        
        #title-stylistic-mobile{
            display: flex;
        }

         #title-stylistic-ipad{
            display: none;
        }

        .stylistc-options-container {
            flex-flow: column;
            overflow: auto;
            flex: 1;
        }

        #fade-top-stylistics{
            display: table;
        }

        #fade-bottom-stylistics{
            display: table;
        }

        #fade-bottom-suffered{
            display: none;
        }

        #fade-top-suffered{
            display: none;
        }

        #fade-bottom-deity{
            display: none;
        }

        #fade-top-deity{
            display: none;
        }

        .deity-container-scroll {
            overflow-y: unset;
        }

        .option-elements-box {
            display: block; 
            flex-flow: column;
            padding: 0 4%;
        }

    }

/* Mobile landscape */
@media only screen and (min-width: 480px) 
                   and (max-width: 853px)
                   and (orientation: landscape) {
        /*Introduccion */
        .container-continuar {
            flex: 2.5;
        }
        /*Home*/
        .main-container-home {
            display: block;
            overflow: auto;
        }
        .title-avenir-black {
            font-size: 1em;
            line-height: normal;
        }

        .container-home-text {
            font-size: 1em;
            line-height: normal;
            margin-top: 5%;
            flex: 4;
        }

        .container-navigation-folio{
            display: flex;
        }

        #hint-selecciona {
            margin-top: 5%;
        }

        #set-folio-2{
            display: none;
        }

    /* Detalle de folio */
        .container-folio-detail {
            flex-flow: row;
            margin-top: 5%;
        }

        .img-detail-container {
            flex: 1;
        }
        .modes-folio-container {
            flex-flow: column;
            flex: 1;
        }

        .radio-buttons-box {
            display: flex;
            flex-flow: column;
            flex: 6;
        }

        .folio-indicator {
            margin: 0.6em 0.5em;
            font-family: Avenir-Light;
            font-size: 1em;
        }

        .option img {
            width: 1.2em;
        }

        .option {
            margin: 5% 0;
            align-items: flex-start;
        }

        .option > span {
            margin-left: 0.5em;
            font-size: 1em;
        }
    
    /* Elementos estilísticos */
        #title-stylistic-mobile {
            visibility: visible;
        }

        #title-stylistic-ipad{
            display: none;
        }

        .stylistc-options-container {
            flex-flow: column;
            flex: 1;
            overflow-y: auto;
            display: block;
        }

        #fade-top-stylistics{
            display: table;
        }

        #fade-bottom-stylistics{
            display: table;
        }

        #fade-bottom-suffered{
            display: none;
        }

        #fade-top-suffered{
            display: none;
        }

        #fade-bottom-deity{
            display: none;
        }

        #fade-top-deity{
            display: none;
        }

        .deity-container-scroll {
            overflow-y: unset;
        }
}

/*tablet-portrait-up */
    @media (min-width: 600px) {
        img.logo-intro{
            width: 66vw;
        }
        
        #btnEntrar {
            margin-top: 2%;
        }

        /* Elementos estilísticos */
        #title-stylistic-mobile {
            visibility: visible;
        }

        #title-stylistic-ipad{
            display: none;
        }
    }
/*tablet-landscape-up */
    @media (min-width: 900px) {
        .main-container-home {
            display: block;
            overflow: auto;
        }

        /* Elementos estilísticos */
        #title-stylistic-mobile {
            visibility: visible;
        }

        #title-stylistic-ipad{
            display: none;
        }
    }
/*desktop-up */
    @media (min-width: 1200px) {
        img.logo-intro{
           width: 36vw;
        }

        /*Home*/
        .main-container-home {
            display: flex;
            max-width: 1200px;
            left: 0;
            right: 0;
            margin: auto;
            overflow: unset;
        }

        #btnHelp {
            display: none;
        }

        #btnIntro {
            display: block;
        }

        #btnIntroM {
            display: none;
        }

        /*Folio detail*/
        .main-container-detail {
            max-width: 1200px;
            left: 0;
            right: 0;
            margin: auto;
        }

        #btnBackM{
            display: none;
        }

        #btnBack{
            display: block;
        }

        /* Elemento estilísticos*/

        #title-stylistic-mobile {
            display: flex;
            visibility: hidden;
        }

        #title-stylistic-ipad{
            display: flex;
        }

        .close-buttonM {
            display: none;
        }

        .close-button {
            display: block;
        }

        .main-container-stylistic {
            max-width: 1200px;
            left: 0;
            right: 0;
            margin: auto;
        }

    }
/*big-desktop-up */
    @media (min-width: 1800px) {

    }