﻿@media (max-width: 575.98px) {
    .gx-8 {
        --bs-gutter-x: 1.2rem;
    }
    .modal-open {
        padding-right: inherit !important;
    }
    #modalResponsive {
        padding-right: inherit !important;
    }
    #mainheader {
        background: inherit;
        background-color: rgba(6, 52, 93, 1);
        padding-bottom: 0;
    }
    .overlay .closebtn {
        font-size: 2.5rem;
        top: 0;
        right: 2rem;
    }
    #mainheader .bread {
        background-color: #06345D !important;
        display: none !important;
    }
    #mainheader .navLine {
        background-color: #06345D !important;
    }
    #mainheader .navLine .subpageTitle {
        font-size: 1.2rem;
        margin-top: 1.25rem;
    }
    .navLine .mmenu-bar {
        color: #fff !important;
    }
    .navLine .search {
        align-self: center !important;
        float: right !important;
        padding: 1rem 0;
    }
    .navLine .websiteLogo {
        position: initial;
        margin-left: -0.5rem;
        margin-top: .15rem;
    }
    .navLine .websiteLogo img {
        width: 60px;
    }
    .navLine h1.websiteTitle {
        display: none;
    }

    #slider {
        padding-top: 125px;
    }

    #buttonList {
        margin-top: -6.5rem;
		background: linear-gradient(180deg, transparent 0%, rgb(0, 0, 0) 12%, rgb(0, 0, 0) 100%);
    }
    #buttonList.down {
        background: linear-gradient(180deg, transparent 0%, rgb(0, 0, 0) 16%, rgb(0, 0, 0) 100%);
    }
    #buttonList a {
        width: 160px;
    }
    .external-links {
        margin-top: 3rem;
    }
    .footerLogo .w-15 {
        width: 35% !important;
    }
    a.scrollUp {
        right: 1rem;
    }
    #pauGuide .defaultGudie .title {
        padding-left: .5rem;
        font-size: initial;
    }    
    #pauGuide .resultSearch .item div.gorevyeri {
        border-left: .15rem solid #014974;
    }
    #pauGuide .resultSearch .item div.gorevyeri p {
        padding: 0 .5rem;
    }
    #pauGuide .resultSearch .item div.gorevyeri:after {
        content: inherit;
    }
    .pauGuide .searchBox {
        margin-top: 1rem;
    }
    .pauGuide .card {
        display: flow-root;
    }
    .pauGuide .card .card-header {
        text-align: center;
    }
    #mealDays .nav-link {
        padding: 0;
    }

    #pauInfo .nav-tabs .nav-link {
        font-size: .7rem;
        padding: .5rem;
    }

    #foodSection #mealDays .nav-link {
        font-size: .75rem;
    }
    #foodSection .hall0,
    #foodSection .hall1,
    #foodSection .hall2,
    #foodSection .hall3 {
        height: auto;
    }
}

@media screen and (orientation:landscape) and (max-device-width: 767.98px) {
    .modal-open {
        padding-right: inherit !important;
    }
    #modalResponsive {
        padding-right: inherit !important;
    }
    .navLine .mmenu-bar {
        color: #fff !important;
    }
    .navLine .websiteLogo {
        margin-right: auto !important;
        position: initial;
        margin-left: -0.5rem;
    }
    .navLine .websiteLogo img {
        width: 60px;
    }
    .navLine h1.websiteTitle {
        display: none;
    }
    .navLine .search {
        align-self: center !important;
    }
    #slider div.tparrows.uranus {
        top: 70% !important;
    }
    #buttonList {
        margin-top: -3rem;
        background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,1) 20%, rgba(0,0,0,1) 100%);
    }
    #buttonList.down {
        background: linear-gradient(180deg, transparent 0%, rgb(0, 0, 0) 10%, rgb(0, 0, 0) 100%);
    }
    #pauGuide .defaultGudie .title {
        padding-left: .5rem;
        font-size: initial;
    }
    #pauGuide .resultSearch .item div.gorevyeri {
        border-left: .15rem solid #014974;
    }
    #pauGuide .resultSearch .item div.gorevyeri p {
        padding: 0 .5rem;
    }
    #pauGuide .resultSearch .item div.gorevyeri:after {
        content: inherit;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .gx-8 {
        --bs-gutter-x: 1.2rem;
    }
    #mainheader {
        background: inherit;
        background-color: #06345D;
        padding-bottom: 0;
    }
    .navLine .mmenu-bar {
        color: #fff !important;
    }
    .overlay .closebtn {
        font-size: 2.5rem;
        top: 0;
        right: 2rem;
    }
    #mainheader .bread {
        background-color: #06345D !important;
        display: none !important;
    }
    #mainheader .navLine {
        background-color: #06345D !important;
    }
    #mainheader .navLine .subpageTitle {
        font-size: 1.2rem;
        margin-top: .7rem;
    }
    .navLine .mmenu-bar {
        color: #fff !important;
    }
    .navLine .websiteLogo {
        top: 0.2rem;
    }
    .navLine .websiteLogo img {
        width: 60px;
    }
    .navLine h1.websiteTitle {
        font-size: 1.25rem;
        margin-left: 4rem;
        margin-top: 1.3rem;
        padding-bottom: 1rem;
    }
    .navLine .search {
        align-self: center !important;
        padding: 1rem 0;
    }
    .external-links {
        margin-top: 3rem;
    }
    .footerLogo .w-15 {
        width: 30% !important;
    }
    a.scrollUp {
        right: 1rem;
    }
    #pauGuide .defaultGudie .title {
        padding-left: .5rem;
        font-size: initial;
    }
    #pauGuide .defaultGudie .title {
        padding-left: .5rem;
        font-size: initial;
    }
    #pauGuide .resultSearch .item div.gorevyeri {
        border-left: .15rem solid #014974;
    }
    #pauGuide .resultSearch .item div.gorevyeri p {
        padding: 0 .5rem;
    }
    #pauGuide .resultSearch .item div.gorevyeri:after {
        content: inherit;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .gx-8 {
        --bs-gutter-x: 3rem;
    }
    .breadPAU a:after {
        content: 'PAU';
    }
    .breadPAU a span {        
        display: none;
    }
    .navLine .websiteLogo img {
        width: 90px;
    }
    .navLine h1.websiteTitle {
        display: none;
    }
    .overlay .closebtn {
        font-size: 2.5rem;
        top: 0;
        right: 2rem;
    }
    .websiteNav ul.navbar-nav > li.nav-item {
        margin-left: 1rem !important;
        margin-right: 1rem !important;
    }
    .websiteNav ul.navbar-nav > li.nav-item a.nav-link {
        font-size: 1.1rem;
    }
    .navLine .search {
        margin-left: 1rem !important;
    }
    #owl-News .item h5 {
        font-size: 1.1rem;
    }
	.px-md-5 {
		padding-right: 4.5rem !important;
		padding-left: 4.5rem !important;
	}   
    .external-links {
        margin-top: 3rem;
    }
    .footerLogo .w-15 {
        width: 20% !important;
    }
    .announcementDetail article,
    .eventDetail article {
        padding-right: 3rem;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .gx-8 {
        --bs-gutter-x: 3rem;
    }
    .navLine h1.websiteTitle {
        font-size: 1.2rem;
    }
    .overlay .closebtn {
        font-size: 2.5rem;
        top: 0;
        right: 2rem;
    }
    .homePageComponent {
        padding-right: 6rem;
        padding-left: 6rem;    
    }
	.px-md-5 {
		padding-right: 4.5rem !important;
		padding-left: 4.5rem !important;
	}    
    .announcementDetail article,
    .eventDetail article {
        padding-right: 3rem;
    }
	.footerLogo .w-15 {
        width: 20% !important;
    }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .carousel-inner .carousel-item,
    .carousel-inner .carousel-item img {
        height: 75vh;
    }
    .homePageComponent {
        padding-right: 8rem;
        padding-left: 8rem;
    }
    .announcementDetail article,
    .eventDetail article {
        padding-right: 3rem;
    }
}

@media (min-width: 1400px) {
    #slider .tp-parallax-wrap {
        left: 0 !important;
    }
	.homePageComponent {
        padding-right: 6rem;
        padding-left: 6rem;    
    }
    .announcementDetail article,
    .eventDetail article {
        padding-right: 3rem;
    }    
	.px-md-5 {
		padding-right: 4.5rem !important;
		padding-left: 4.5rem !important;
	}
}