/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Feb 27, 2021, 9:22:30 AM
    Author     : maticm
*/

@media (max-width: 1500px) {
    .navbar-nav>li>a{
        margin-right: 30px;
        font-size: 13px;
    }

}
@media (max-width: 1300px) {
    .navbar-nav>li>a{
        margin-right: 15px;
        font-size: 12px;
    }

}
@media (max-width: 1200px) {
    .join h3{
        height: 220px;
    }
}
@media (max-width: 1100px) {
    .navbar-nav>li>a{
        margin-right: 10px;
        font-size: 11px;
    }
}

@media (max-width: 991px) {
    .container-fluid{
        padding-right: 15px;
    }
    .main-navbar .nav>li>a{
        margin-right: 0px;
    }
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        text-align: center;
        float: none!important;
    }
    .navbar.main-navbar .navbar-nav > li > a.activeNav {
        color: #f5821e;
        border-bottom: none;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav .orange {
        font-family: "SuaRegular", sans-serif;
        background-color: #fe7701;
        color: #ffffff;
        line-height: 1.5;
        padding-top: 8px;
        padding-bottom: 6px;
        margin-top: 10px;
        transition: all .3s;
        margin-right: 15px;
        margin-left: 15px;
    }
    .navbar.main-navbar .navbar-nav .orange.activeNav {
        color: #ffffff;
    }
    .collapse.in{
        display:block !important;
    }
    .language-active{
        color: #ff0000;
    }   
    .navbar-toggle .icon-bar{
        background-color: #000000;
    }

    .navbar-toggle {
        margin: 0px;
        padding: 0px;
        padding-top: 16px;
        padding-right: 20px;
        display: block;
    }

    .topNav{
        font-size: 10px;
    }    
    .topNav span:last-child {
        margin-right: 15px;
    }
    
    .content .big {
        font-size: 24px;
    }
    
    .content p {
        font-size: 11px;
    }
    .content h2{
        font-size: 16px;
    }
    .boardItem3{
        padding-left: 15px;
        padding-right: 15px;
    }
    .join h2{
        font-size: 20px;
    }
    .join h3{
        font-size: 12px;
        height: 250px;
    }
    .sectionTitle{
        font-size: 32px;
    }
    .membership{
        padding-top: 60px;
        padding-bottom: 40px;
    }
    .membership .membershipImage {
        margin-left: 0px;
        height: 300px;
    }
    .membership .description{
        padding-bottom: 75px;
    }
    .membership .title{
        text-align: center;
        font-size: 32px;
    }
    .membership .text{
        text-align: center;
    }
    .membership .buttonContainer{
        text-align: center;
    }
    .pt-5 {
        padding-top: 15px;
    }
    .members{
        padding-top: 60px;
        padding-bottom: 80px;
    }
    .members .title{
        font-size: 32px;
        text-align: center;
    }
    .members .text{
        text-align: center;
    }
    .members .images{
        text-align: center;
    }
    .footer{
        text-align: center;
    }
    .footerLogo {
        background-color: #ffffff;
        width: 100%;
        height: auto;
        padding-top: 60px;
        padding-bottom: 60px;
        margin-top: -145px;
        margin-left: 0; 
        text-align: center;
        margin-bottom: 25px;
    }
    .footerLogo img {
        height: 80px;
    }
    .footer h2{
        font-size: 18px;
    }
    .footer ul{
        margin-bottom: 30px;
    }
    
    .tab-content {
        padding-top: 50px;
    }
    .grey-box {
        padding-top: 40px;
        padding-bottom: 100px;
        text-align: center;
    }
    
    .contact{
        padding-top: 120px;
    }
    .contact .text{
        padding-bottom: 50px;
        text-align: center;
    }
    .login{
        padding-bottom: 100px;
    }
    .description img{
        width: 50px;
        height: 50px;
    }
    .joinUs h2{
        text-align: center;
    }
    .joinUs p{
        text-align: center;
    }
    .joinUsLinks h2{
        text-align: center;
    }
    .scrollable-menu {
        position: relative;
        top: 0;
    }
}

@media (max-width: 767px){
    .filters {
	gap: 5px;
	flex-direction: column;
    }
    .navbar-nav>li>a{
        margin-top: 8px;
    }
    .searchbar-container{
        margin-top: 20px;
        flex-direction: column;
    }
    .search-query{
        width: 460px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        padding-right: 25px;
    }
    .search-button{
        width: 460px;
        margin-top: 15px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }
    .filter-button {
        height: calc((100% - 15px) / 2);
        left: calc((100% - 460px) / 2 + 420px);
    }
    .links-container{
        flex-direction: column;
    }
    .result-container_parent{
        width: 460px;
    }
    .header img{
        right: 20px;
    }
    .boardItem1 {
        height: 250px;
    }
    .boardItem2 {
        height: 200px;
        margin-top: 30px;
    }
    .boardItem3 {
        margin-top: 30px;
        padding-top: 40px;
    }
    .boardItem4 {
        height: 170px;
        margin-top: -170px;
    }
    .boardItem5 {
        height: 200px;
        margin-top: 30px;
    }
    .boardItem6 {
        height: 200px;
        margin-top: -198px;
    }
    
    .actual img{
        right: 20px;
    }
    
    .membership .membershipImage{
        height: 200px;
    }
    .trustImage{
        margin-bottom: 0;
    }
    .trustImage img{
        margin-bottom: 20px;
        height: 30px;
        width: auto;
    }
    
    .contact{
        padding-top: 60px;
    }
    .join h3{
        height: 145px;
        font-size: 12px;
    }
    .partnerBox{
        height: 35px;
    }
}

@media (max-width: 500px) {
    .navbar.main-navbar .navbar-nav .orange{
        margin-left: 0px;
    }
    body{
        font-size: 14px;
    }
    .topNav span{
        padding-right: 10px;
    }
    .topNav span:last-child{
        margin-right: 0;
    }
    .navbar-brand>img {
        display: block;
        margin-top: -10px;
        margin-left: 0px;
        width: 130px;
        height: auto;
    }
    .search-query{
        width: 250px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        padding-right: 25px;
    }
    .filter-button {
        left: calc((100% - 250px) / 2 + 210px);
    }
    .searchbar-container2 {
        display: flex;
        flex-direction: column;
    }
    .searchbar-container {
        width: 100%;
    }
    .search-query2 {
        margin-bottom: 10px;
        width: 100%;
    }
    .search-button2 {
        width: 100%;
    }
    .filter-button2 {
        height: calc((100% - 15px) / 2);
        left: calc(100% - 35px);
        display: block;
    }
    .result-container_parent{
        width: 300px;
    }
    .search-button{
        width: 250px;
        margin-top: 15px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }
    .tab-pane > table {
        font-size: 10px;
    }
    .header h1 {
        font-size: 30px;
        margin-top: 30vh;
    }
    .header h2 {
        font-size: 14px;
    }
    .sectionTitle{
        font-size: 24px;
    }
    .content .big{
        font-size: 20px;
    }
    .content p{
        font-size: 9px;
    }
    .join h2 {
        font-size: 18px;
        margin-bottom: 40px;
    }
    .join h3 {
        font-size: 12px;
        height: 180px;
    }
    .button2{
        font-size: 12px;
    }
    .membership .title{
        font-size: 24px;
    }
    .membership .text{
        font-size: 14px;
    }
    .pt-5{
        padding-top: 5px;
    }
    .members .title{
        font-size: 24px;
    }
    .members .text{
        font-size: 14px;
    }
    .tab-content p{
        font-size: 14px;
    }
    .grey-box h2 {
        font-size: 24px;
        padding-top: 30px;
    }
    .grey-box p{
        font-size: 14px;
    }
    .about{
        padding-top: 40px;
    }
    .events{
        padding-top: 40px;
        padding-bottom: 0px;
    }
    .events .noEvent{
        font-size: 16px;
        margin-bottom: 30px;
    }
    .events .pageTitle{
        font-size: 24px;
        margin-bottom: 20px;
    }
    .notification {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .notification h2{
        font-size: 24px;
    }
    .notification p{
        font-size: 14px;
    }
    .notification .imageContainer{
        height: 100px;
    }
    .events.ecdlImageContainer{
        height: 90px;
    }
    .lastEvent h2{
        font-size: 24px;
    }
    .newsCard .body{
        font-size: 14px;
    }
    .subpageHeader .text .title{
        font-size: 24px;    
    }
    .contact {
        padding-top: 40px;
    }
    .contact h2{
        font-size: 24px;
    }
    .contact p{
        font-size: 14px;
    }
    .joinUs{
        padding-top: 60px;
    }
    .joinUs h2{
        font-size: 24px;
    }
    .joinUs p{
        font-size: 14px;
    }
    .joinUsLinks h2{
        font-size: 24px;
    }
    .join{
        padding-top: 0;
    }
    .pageBody{
        padding-top: 40px;
    }
    .pageBody p{
        font-size: 14px;
    }
    .topNav{
        font-size: 8px;
    }
    .submitButton{
        width: 70%;
    }
    .contact_form__title span{
        display: block;
    }
}
@media (max-width: 400px) {
    .join h3{
        height: 195px;
        font-size: 11px;
    }
}