@media (max-width: 991px) { 
    #menu-mobile{
        display: block;
    }

    .desktop{
        display: none !important;
    }

    #container-bar{
        display: block !important;
    }

    #container-bar {
        position: absolute;
        display: inline-block;
        left: 2rem;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 20px;
        height: 16px;
        z-index: 100;
        -webkit-transition: background-color .35s,-webkit-transform .175s cubic-bezier(.215,.61,.355,1),opacity .175s cubic-bezier(.215,.61,.355,1);
        -webkit-transition: background-color .35s, opacity .175s cubic-bezier(.215,.61,.355,1), -webkit-transform .175s cubic-bezier(.215,.61,.355,1);
        transition: background-color .35s, opacity .175s cubic-bezier(.215,.61,.355,1), -webkit-transform .175s cubic-bezier(.215,.61,.355,1);
        transition: background-color .35s, transform .175s cubic-bezier(.215,.61,.355,1),opacity .175s cubic-bezier(.215,.61,.355,1);
        transition: background-color .35s, transform .175s cubic-bezier(.215,.61,.355,1),opacity .175s cubic-bezier(.215,.61,.355,1), -webkit-transform .175s cubic-bezier(.215,.61,.355,1);
    }

    .bar1, .bar2, .bar3 {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 3px;
        background: white;
        -webkit-transition: background-color .35s,-webkit-transform .175s cubic-bezier(.215,.61,.355,1),opacity .175s cubic-bezier(.215,.61,.355,1);
        -webkit-transition: background-color .35s, opacity .175s cubic-bezier(.215,.61,.355,1), -webkit-transform .175s cubic-bezier(.215,.61,.355,1);
        transition: background-color .35s, opacity .175s cubic-bezier(.215,.61,.355,1), -webkit-transform .175s cubic-bezier(.215,.61,.355,1);
        transition: background-color .35s, transform .175s cubic-bezier(.215,.61,.355,1),opacity .175s cubic-bezier(.215,.61,.355,1);
        transition: background-color .35s, transform .175s cubic-bezier(.215,.61,.355,1),opacity .175s cubic-bezier(.215,.61,.355,1), -webkit-transform .175s cubic-bezier(.215,.61,.355,1);
        -webkit-transform: translateY(0) translateZ(0);
        transform: translateY(0) translateZ(0);
    }

    .bar1 {
        top: 0;
    }

    .bar2 {
        top: 6px;
    }

    .bar3 {
        top: 12px;
    }

    .change .bar2 {
        opacity: 0;
    }

    .change .bar1 {
        -webkit-transform: translateY(6px) rotate(45deg);
        transform: translateY(6px) rotate(45deg);
        background: #FFFFFF;
    }

    .change .bar3 {
        -webkit-transform: translateY(-6px) rotate(-45deg);
        transform: translateY(-6px) rotate(-45deg);
        background: #FFFFFF;
    }

    #menu-mobile{
        background: #2a498a;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        display: none;
        z-index: 98;
    }

    #menu-mobile>#wrapper-mobile{
        position: relative;
        width: 100%;
        height: 100%;
        padding: 0 15px;
        padding-top: 5rem;
        padding-bottom: 5rem;
        overflow-y: auto;
    }

    #wrapper-mobile>#background-header{
        background: #FFF;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
    }

    #menu-mobile>#wrapper-mobile ul{
        padding: 0;
        list-style: none;
        display: block;
        position: relative;
        top: 0;
        vertical-align: top;
    }

    #menu-mobile>#wrapper-mobile ul li {
        font-family: 'Lato', sans-serif;
        position: relative;
        display: block;
        width: 100%;
        font-size: 14px;
        /*letter-spacing: 20;*/
        font-weight: 300;
    }

    #menu-mobile>#wrapper-mobile ul li a {
        color: #fff;
        text-transform: uppercase;
        text-decoration: none;
        position: relative;
        display: inline-block;
        width: 100%;
        padding: 20px 10px;
        border-bottom: 1px solid #FFF;
        font-size: 1.5rem;
    }

    #menu-mobile>#wrapper-mobile ul li a.active{
        font-weight: 700;
    }
}
/*---------------------------------------== SMARTPHONES ==-----------------------------------------*/
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 320px) and (max-device-width : 740px) and (orientation : landscape) {
    /* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 420px) and (orientation : portrait){
    
    .logo-container{
        width: 50%;
    }
    
    .menu-container{
        width: 50%;
    }
    
    #header{
        height: 15vh;
    }
    
    #header h1 {
        font-size: 1.9em;
    }

    #header h2 {
        font-size: 1.4em;
    }
    
    .text-container h1 {
        font-size: 1.2em;
        letter-spacing: .8em;
    }
    
    .infomeetagenda{
        text-align: center;
        padding: 1em;
    }
    
    .infomeetagenda .gotolive{
        display: inline-block;
    }
    
    .imgrel{
        width: 60%;
    }
    
    .jobtitle{
        margin-bottom: 2em;
    }
    
    .text-container .titolotappo {
        font-size: 1.2em;
    }
    
    .text-container h2.datatappo{
        font-size: 1em;
    }

}
/*---------------------------------------== IPADS ==-----------------------------------------*/

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */

}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    .menu-desktop{
        padding-left: 2em;
    }

    #header {
        height: 45vh;
    }

    #header h1 {
        font-size: 2em;
    }

    #header h2 {
        font-size: 1.5em;
    }
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    /* Styles */
    .menu-desktop{
        padding-left: 0;
    }

    .menu-desktop ul li a {
        font-size: .9em;
    }

    #header {
        height: 20vh;
    }

    #header h1 {
        font-size: 2em;
    }

    #header h2 {
        font-size: 1.5em;
    }
    
    .logo-container{
        width: 40%;
    }
    
    .menu-container{
        width: 10%;
    }
    
    .text-container h1 {
        font-size: 1.2em;
        letter-spacing: .8em;
    }
    
    .infomeetagenda{
        text-align: center;
        padding: 1em;
    }
    
    .infomeetagenda .gotolive{
        display: inline-block;
    }
    
    .imgrel{
        width: 80%;
    }
    
    .jobtitle{
        margin-bottom: 2em;
    }
    
    .text-container .titolotappo {
        font-size: 1.2em;
    }
    
    .text-container h2.datatappo{
        font-size: 1em;
    }
}

/*---------------------------------------== LAPTOP ==-----------------------------------------*/

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
}

/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
}