/* Desktops and laptops ----------- */

@media only screen
and (min-width : 50px)
and (max-width : 200px) {

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -50px;
    }

}

@media only screen
and (min-width : 200px)
and (max-width : 300px) {

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -120px;
    }

}

@media only screen
and (min-width : 300px)
and (max-width : 400px) {

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -160px;
    }

}

@media only screen
and (min-width : 400px)
and (max-width : 500px) {

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -190px;
    }
}

@media only screen
and (min-width : 500px)
and (max-width : 600px) {

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -285px;
    }
}

@media only screen
and (min-width : 600px)
and (max-width : 700px) {

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -300px;
    }
}

@media only screen
and (min-width : 0px)
and (max-width : 767px) {

    #menu {
        margin-top: 80px;
    }
    
}

@media only screen
and (min-width : 700px)
and (max-width : 800px) {

    .btn-align {
        position: absolute;
        height: 95px;
        width: 100%;
        bottom: 0;
        left: 0;
    }

    .bx-panel {
        height: 560px;
    }

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -360px;
    }
    
}

@media only screen
and (min-width : 800px)
and (max-width : 900px) {

    .btn-align {
        position: absolute;
        height: 95px;
        width: 100%;
        bottom: 0;
        left: 0;
    }

    .bx-panel {
        height: 560px;
    }

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -400px;
    }
}

@media only screen
and (min-width : 900px)
and (max-width : 1000px) {

    .btn-align {
        position: absolute;
        height: 95px;
        width: 100%;
        bottom: 0;
        left: 0;
    }

    .bx-panel {
        height: 560px;
    }

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -450px;
    }
}

@media only screen
and (min-width : 1000px) {

    .btn-align {
        position: absolute;
        height: 95px;
        width: 100%;
        bottom: 0;
        left: 0;
    }

    .bx-panel {
        height: 650px;
    }

    .hover-hot {
        margin-top: -7px !important;
        border-top: 6px solid #3a3a3a;
    }

    .hover-hot:hover {
        margin-top: -7px !important;
        border-top: 6px solid #d9534f;
        background-color: rgba(236, 236, 237, 0.7);
    }

    .navbar-ex1-collapse {
        margin: 0;
        padding: 0;
    }

    .navbar .navbar-collapse {
        border-bottom: 1px solid rgba(236, 236, 237, 0.7);
    }

    .hover-hot {
        -webkit-transition: all 200ms ease-in-out;
        -moz-transition: all 200ms ease-in-out;
        -o-transition: all 200ms ease-in-out;
        transition: all 200ms ease-in-out;
    }

    .carousel-inner img {
        position: relative;
        left: 50%;
        margin-left: -500px;
    }
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {

}
