@charset 'UTF-8';

/*------------------------------------------------------------------
[Media Stylesheet]
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[Table of contents]

1. Min width 992px and Max width: 1199px
2. Max width: 1140px 
3. Max width: 992px
4. Max width: 992px and min width: 768px
5. Max width: 767px
6. Max width: 480px
7. Custom media for IE

-------------------------------------------------------------------*/


@media (min-width: 1300px) {}

@media (max-width: 1270px) {}

@media (max-width: 1199px) {}


@media (min-width: 1140px) and (max-width: 1350px) {}

/*------------------------------------------------------------------
[1. Min width 992px and Max width: 1199px ]
*/

@media (min-width: 992px) and (max-width: 1199px) {}

/*------------------------------------------------------------------
[2. Max width: 1140px ]
*/
@media (max-width: 1140px) {}

/*------------------------------------------------------------------
[3. Max width: 991px ]
*/
@media (max-width: 991px) {
    .container {
        padding: 0 15px;
    }

    body {
        padding-bottom: 0;
        overflow-x: hidden;
    }

    div.separator,
    .footer-container-full,
    .carousel,
    .container-full {
        min-width: initial;
    }

    div.separator {
        width: 100%;
    }

    iframe {
        max-width: 100%;
    }

    .masthead div.facebook {
        right: 8px;
    }

    .navbar .nav>li {
        float: none;
        flex: 2 1 auto;
    }

    .navbar .nav>li:first-child {
        flex: 0 0;
    }

    .navbar .nav {
        display: flex;
        margin: 0;
        flex-wrap: wrap;
        gap: 1px;
        border-top: 1px solid #000;
        border-left: 1px solid #000;
    }

    .navbar .nav>li {
        background: transparent;
        border-right: 1px solid #000;
        border-bottom: 1px solid #000;
    }

    .carousel-inner>.item {
        height: 100%;
    }

    .carousel-caption h4 {
        margin-bottom: 0;
    }

    .carousel-caption {
        background-color: white;
        opacity: 0.5;
        padding: 10px 70px 10px 70px;
        bottom: 50%;
        transform: translateY(50%);
    }

    .carousel-caption {
        background-color: white;
        opacity: 0.5;
        padding: 10px 70px 10px 70px;
        bottom: 50%;
        transform: translateY(50%);
    }

    .carousel-control {
        top: 50%;
        margin-top: -23px;
    }

    .carousel-inner .item img {
        width: 100%;
        margin-top: 0;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    .my-item {
        text-align: center;
    }

    .footer-container-full .content-footer {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .footer-container-full .content-footer>* {
        margin: 20px 0;
    }

    .contact-form form > .row-fluid::before,
    .contact-form form > .row-fluid::after,
    .footer-container-full .content-footer::before,
    .footer-container-full .content-footer::after {
        display: none;
    }

    .footer-container-full .content-footer span {
        position: initial;
        top: 0;
        line-height: 30px;
    }

    .container-full {
        background: #2D2D2D url(../img/menu-bkg.jpg);
        background-repeat: no-repeat;
        background-size: cover;
    }

    .contact-form form > .row-fluid  {
        display: flex;
        margin-bottom: 10px;
        gap: 15px;
        padding: 0 10px;
    }

    .contact-form form > .row-fluid .span6,
    .contact-form form > .row-fluid .span5 {
        width: 50%;
        padding: 0px;
    }

    .contact-form form > .row-fluid div.span-mini
    {
        display: none;
    }

    .contact-form .input-prepend {
        display: flex;
    }

    .contact-form .input-prepend input {
        width: 100%;
    }
}

/* bootstrap replace */
@media (min-width: 768px) and (max-width: 979px) {
    .row-fluid .span3 {
        width: 50%;
        margin: 0;
    }

    .row-fluid [class*="span"] {
        margin-left: 0;
        padding: 10px 10px;
    }

    .row-fluid {
        margin: 0 -10px;
    }
}

/*------------------------------------------------------------------
[4. Max width: 992px and min width: 768px]
*/

@media (min-width: 768px) and (max-width: 991px) {}

/*------------------------------------------------------------------
[5. Max width: 767px]
*/
@media (max-width: 767px) {

    .contact-form form > .row-fluid
    {
        flex-direction: column;
        padding: 0;
    }

    .contact-form form > .row-fluid .span6, .contact-form form > .row-fluid .span5
    {
        width: 100%;
        padding: 0px;
    }

    .carousel-inner {
        height: 250px;
    }

    .contact-form form>.row-fluid>.span5 {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-bottom: 0;
    }

    .contact-form form>.row-fluid>.span5 .control-group {
        flex: 1 2 auto;
        margin-bottom: 0;
    }

    .contact-form .input-prepend {
        display: flex;
    }

    .contact-form .input-prepend input {
        width: 100%;
    }


    .main-navbar .btn-navbar {
        display: block;
    }

    .main-navbar .navbar .nav>li:not(:first-child) {
        display: none;
    }

    .navbar .nav,
    .navbar .nav>li {
        border: 0;
    }


    .main-navbar .btn-navbar {
        display: block;
        height: 100%;
        background: transparent;
        border: 0;
        box-shadow: none;
        border-left: 1px solid #000;
        border-radius: 0;
        border-right: 1px solid #000;
        margin: 0;
        padding: 17px 20px;
    }
}

@media (max-width: 767px) and (min-width: 720px) {}


/*------------------------------------------------------------------
[6. Max width: 680px]
*/

@media (max-width:680px) {

    .masthead .top-small li,
    .masthead .top-small {
        float: none;
    }

    .masthead .top-small {
        width: 100%;
    }

    .masthead .top-small li {
        display: inline-block;
    }

    .masthead .top-small {
        text-align: center;
    }

    .masthead .top-small {
        border-bottom: 1px solid silver;
    }

    .masthead {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }

    .masthead .top-small {
        margin-bottom: 0;
        width: 100%;
    }

    .masthead div.facebook {
        position: initial;
    }

    .masthead div.facebook,
    .masthead a.logo {
        padding: 0;
        margin: 20px 0px 20px 0px;
    }

    .masthead a.logo img {
        height: calc(100vw * .12);
        max-width: 100%;
    }

    .carousel-caption {
        position: absolute;
        bottom: 0;
        padding: 15px 15px;
        transform: initial;
    }



    .carousel-caption h4 {
        font-size: 24px;
        margin: 0;
    }

    .files-list {
        text-align: center;
    }

    .files-list li {
        display: inline-block;
        float: none;
    }
}

/*------------------------------------------------------------------
[6. Max width: 600px]
*/

@media (max-width:600px) {}

/*------------------------------------------------------------------
[6. Max width: 540px]
*/

@media (max-width:540px) {


    .footer-facebook
    {
        display: block;
        text-align: center;
        padding-bottom: 43px;
      }


    .masthead div.facebook,
    .masthead a.logo,
    .masthead .top-small {
        width: initial;
    }

    .masthead div.facebook {
        width: 100%;
        text-align: center;
        position: relative;
        padding: 20px 0;
        margin: 0;
        top: 0;
        left: 0;
        right: 0;
        display: none;
    }

    .masthead div.facebook:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: calc(100% + 40px);
        margin-left: -20px;
        height: 7px;
        background: #000;
    }

    .masthead a.logo {
        order: 1;
    }

    .masthead .top-small {
        order: 2;
    }

    .masthead div.facebook {
        order: 3;
    }

    .masthead .top-small {
        display: flex;
        flex-direction: column;
    }

    .masthead .top-small li {
        padding: 0;
        margin: 5px 0;
        border-left: 0;
        text-align: right;
    }

    .masthead .top-small {
        border-bottom: 0;
    }


    .navbar .nav>li:first-child {
        flex: 1 2 auto;
    }

    .contact-form .btn.btn-danger {
        width: 100%;
        float: none;
    }
}


/*------------------------------------------------------------------
[7. Custom media for IE]
*/

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {}

@media screen and (max-width:1140px) and (-ms-high-contrast: active) and (-ms-high-contrast: none) {}

@media screen and (max-width:768px) and (-ms-high-contrast: active) and (-ms-high-contrast: none) {}