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

    .desktop{
        display: none !important;
    }

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

    #container-bar {
        position: absolute;
        display: inline-block;
        right: 1.5rem;
        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: #1075ac;
        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;
    }
}

@media (min-width : 992px) {
    .instruction-tablet{
        display: none;
    }
}

@media (max-width : 1200px) {
	.gync_logo{
        left: 2rem;
    }
    #header{
        background-image: linear-gradient(90deg rgba(16,117,172,1) 0%, rgba(255, 255, 255, 0.9) 7%, rgba(16,117,172,1) 100%);
    }
}

@media (max-width : 992px) {
    #razionale-container .flex{
        display: block;
    }
    
    .container-bottoni-video .flex{
        display: flex;
    }

    .section div:nth-child(2), .section-4 div:nth-child(2), .section-4 div:nth-child(3){
        text-align: center;
    }

    .gync_logo{
        position: static;
        margin: auto;
        width: 5rem;
    }

    #razionale, #razionale-container, .flex .tab{
        padding-left: 0;
        padding-right: 0;
    }

    .section, .section-4{
        margin: 0;
    }

    .center-mobile{
        text-align: center;
    }

    .section-white{
        padding: 0.5rem;
        margin: 0;
    }
    
    .instruction-desktop{
        display: none;
    }

    .instruction-tablet{
        display: block;
    }

    .instruction-mobile{
        display: block;
    }

    .instruction-phone{
        display: none;
    }

    .container-brescia .flex-1 img{
        margin-bottom: 0.5rem;
    }

    .instruction-phone .flex{
        display: none;
    }
    
    .container-bottoni-video{
        display: block;
    }

    #information-heading {
        display: block;
    }

    #information-heading-anchors {
        margin-bottom: 2.5rem;
        background-image: none;
        text-align: center;
    }

    #information-heading-anchors a {
        display: block;
        margin: 0.5rem;
    }

    #information-image {
        display: none;
    }

    #information-program-body img {
        width: 100%;
    }

    .ondemand-table-first-column, .ondemand-table-second-column {
        width: 50%;
    }
}

@media (max-width: 576px) {
    #information-logo {
        width: 15rem;
    }

    #information-download, #committee {
        width: 100%;
    }

    #committee {
        display: block;
    }

    .instruction-desktop{
        display: none;
    }

    .instruction-tablet{
        display: none;
    }

    .instruction-phone{
        display: block;
    }

    #comune-brescia {
        width: 15rem;
    }

    #università-brescia {
        width: 7rem;
    }

    .container-bottoni-video button{
        display: block;
        width: 100%;
        margin: 0;
        padding: 0.5rem;
    }
}

/*---------------------------------------== 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){

}
/*---------------------------------------== 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) {

}

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

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

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

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