body{
    background-color: #E2E2E2;
}
@font-face {
    font-family: Garamond;
    src: url(../Garamond/AGaramond-Italic.otf);
}

@font-face {
    font-family: Futura_Bold;
    src: url(../Futura_Bold/Futura_Bold.otf);
}

@font-face {
    font-family: Futura_Italic;
    src: url(../Futura_Italic/Futura_Book.otf);
}

@media screen and (min-width: 1500px) and (max-width: 2200px)
{
    
    /*----------------- STYLING FOR NAVBAR ----------------*/

    .navbar-default{
        background-color:transparent !important;
        border-color:transparent;
    }

    .navbar-wrapper {
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      z-index: 20;
    }

    .navbar {
        font-family: Garamond;
        margin-bottom: 0;
        background-color: transparent ;
        border: 0;
        font-size: 11px !important;
        letter-spacing: 4px;
        opacity: 0.9;
    }

    .navbar li a, .navbar .navbar-brand { 
        color: #ffffff !important;
        font-size: 30px;
        font-weight: bold;
    }

    .navbar-nav li a:hover {
        color: #fff !important;
    }

    .navbar-left {
        padding-right: 100px;
        padding-top: 100px;
    }

    .menu_link {
        color: white;
    }

    .navbar-right {
        padding-left: 100px;
        padding-top: 100px;
    }

    .middle {
        text-align: center;
    }

    .slider_header {
        font-family: Futura_Bold;
        font-size: 25px;
    }

    .mobile_header {
        display: none;
    }

    @media (min-width: 768px) {
        .navbar-nav.navbar-center {
            position: absolute;
            left: 50%;
            transform: translatex(-50%);
        }
    }

    /*--------------- END OF STYLING FOR NAVBAR --------------*/


    /*----------------- BACKGROUND IMAGE ---------------------*/

    #slider-parallax span {
        background:none;
    }

    #slider-parallax {
        background:url(../images/roots.jpg);
        background-size: cover;
        background-attachment: scroll;
        background-repeat:no-repeat;
        margin: auto;
    }

    #slider-parallax {
        height: 980px;
    }

    .parallex-content {
        position:absolute;
        left: 1%;
        right: 15px;
        top: 55%;
        width: 60%;
        margin: 0 auto;
        text-align:center;
        font-family: Garamond;
        font-size: 70px;
        color: white;
    }

    .nav_slider {
        font-size: 25px;
    }

    /*--------------- END OF BACKGROUND IMAGE ----------------*/

    .carousel-control.left, .carousel-control.right {
        background: none !important;
        filter: progid: none !important;
        outline: 0;
    }

    .carousel .carousel-control {
        visibility: hidden;
    }

    .carousel:hover .carousel-control {
        visibility: visible;
    }

    .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {
        right: 0;  //or you can increase this
    }

    .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev {
        left: 0; //or you can increase this
    }

    .mobile_slider {
        display: none;
    }

    .ptop {
        padding-top: 5px;
    }

    .two_slider {
        padding-top: 70px;
    }

    .slider_text {
        padding-top: 40px;
        font-family: Garamond;
        font-size: 35px;   
    }

    .three_text {
        font-family: Futura_Italic;
        font-size: 24px;
        padding-top: 40px;
    }

    .four_text {
        padding-top: 20px;
        font-family: Garamond;
        font-size: 35px;   
    }

    .four_itext {
        font-family: Futura_Italic;
        font-size: 30px;
        padding-top: 60px;
    }

    .two_root {
        float: left; 
        margin-left: -20px;
        height: 700px;
        margin-top: -150px;
    }   

    footer{
        background-color: #3D441D;
        padding-top: 20px;
        padding-bottom: 20px;
    }   

    .footer_text {
        color: white;
        font-family: Futura_Italic;
        font-size: 20px;
        padding-top: 20px;
    }
}

@media screen and (min-width: 769px) and (max-width: 1500px)
{
    /*-------------------- STYLING FOR NAVBAR ----------------*/

    .navbar-default{
        background-color:transparent !important;
        border-color:transparent;
    }

    .navbar-wrapper {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        z-index: 20;
    }

    .navbar {
        font-family: Garamond;
        margin-bottom: 0;
        background-color: transparent ;
        border: 0;
        font-size: 11px !important;
        letter-spacing: 4px;
        opacity: 0.9;
    }

    .navbar li a, .navbar .navbar-brand { 
        color: #ffffff !important;
        font-size: 25px;
        font-weight: bold;
    }

    .navbar-nav li a:hover {
        color: #fff !important;
    }

    .navbar-left {
        padding-right: 50px;
        padding-top: 70px;
    }

    .menu_link {
        color: white;
    }

    .navbar-right {
        padding-left: 50px;
        padding-top: 70px;
    }

    .middle {
        text-align: center;
    }

    .two_root {
        display: none;
    }

    .slider_header {
        font-family: Futura_Bold;
        font-size: 25px;
    }

    @media (min-width: 768px) {
        .navbar-nav.navbar-center {
            position: absolute;
            left: 50%;
            transform: translatex(-50%);
        }
    }

    /*------------------ END OF STYLING FOR NAVBAR -------------------*/

    /*----------------- BACKGROUND IMAGE ---------------------*/

    #slider-parallax span {
        background:none;
    }

    #slider-parallax {
        background:url(../images/roots.jpg);
        background-size: cover;
        background-attachment: scroll;
        background-repeat:no-repeat;
        margin: auto;
    }

    #slider-parallax {
        height: 780px;
    }
 
    .nav_slider {
        width: 35px;
    }

    .parallex-content {
        position:absolute;
        left: 1%;
        right: 15px;
        top: 55%;
        width: 60%;
        margin: 0 auto;
        text-align:center;
        font-family: Garamond;
        font-size: 50px;
        color: white;
    }

    /*--------------- END OF BACKGROUND IMAGE ----------------*/

    .carousel-control.left, .carousel-control.right {
        background: none !important;
        filter: progid: none !important;
        outline: 0;
    }

    .carousel .carousel-control {
        visibility: hidden;
    }

    .carousel:hover .carousel-control {
        visibility: visible;
    }

    .mobile_header {
        display: none;
    }

    .slider_text {
        padding-top: 40px;
        font-family: Garamond;
        font-size: 35px;   
    }

    .ptop {
        padding-top: 5px;
    }

    .three_text {
        font-family: Futura_Italic;
        font-size: 20px;
        padding-top: 40px;
    }

    .four_text {
        padding-top: 16px;
        font-family: Garamond;
        font-size: 35px;   
    }

    .four_itext {
        font-family: Futura_Italic;
        font-size: 25px;
        padding-top: 60px;
    }

    .desktop_slider {
        display: none;
    }

    footer{
        background-color: #3D441D;
        padding-top: 20px;
        padding-bottom: 20px;
    }   

    .hide_text {
        display: none;
    }

    .footer_text {
        color: white;
        font-family: Futura_Italic;
        font-size: 20px;
        padding-top: 20px;
    }
}

@media screen and (min-width: 200px) and (max-width: 768px)
{
    
    /*-------------------- STYLING FOR NAVBAR ----------------*/

    .sidenav {
        height: 100%;
        width: 0;
        position: fixed;
        z-index: 1;
        top: 0;
        left: 0;
        background-color: #111;
        overflow-x: hidden;
        transition: 0.5s;
        padding-top: 60px;
        text-align:center;
    }

    .sidenav a {
        padding: 8px 8px 8px 32px;
        text-decoration: none;
        font-size: 25px;
        color: #818181;
        display: block;
        transition: 0.3s;
    }

   .sidenav a:hover{
        color: #f1f1f1;
    }

    .sidenav .closebtn {
        position: absolute;
        top: 0;
        right: 25px;
        font-size: 36px;
        margin-left: 50px;
    }

    @media screen and (max-height: 450px) {
        .sidenav {padding-top: 15px;}
        .sidenav a {font-size: 18px;}
    }

    /*---------------------- END OF NAVBAR --------------------*/

    #slider-parallax span {
        background:none;
    }

    #slider-parallax {
        background:url(../images/roots.jpg);
        background-size: cover;
        background-attachment: scroll;
        background-repeat:no-repeat;
        margin: auto;
        height: 250px;
    }

    .desktop_header {
        display: none;
    }

    .nhead {
        position: fixed;
        right: 25px;
        top: 10px;
    }

    .parallex-content {
        position:absolute;
        left: 1%;
        right: 15px;
        top: 5%;
        width: 60%;
        margin: 0 auto;
        text-align:center;
        font-family: Garamond;
        font-size: 38px;
        color: white;
    }

    .middle {
        text-align: center;
    }

    .two_root {
        display: none;
    }

    .desktop_slider {
        display: none;
    }

    .slider_header {
        font-family: Futura_Bold;
        font-size: 25px;
    }

    .slider_button {
        display: none;
    }

    @media (min-width: 768px) {
        .navbar-nav.navbar-center {
            position: absolute;
            left: 50%;
            transform: translatex(-50%);
        }
    }

    /*------------------ END OF STYLING FOR NAVBAR -------------------*/

    /*----------------- BACKGROUND IMAGE ---------------------*/

    .carousel-control.left, .carousel-control.right {
        background: none !important;
        filter: progid: none !important;
        outline: 0;
    }

    .carousel .carousel-control {
        visibility: hidden;
    }

    .carousel:hover .carousel-control {
        visibility: visible;
    }

    .ptop {
        padding-top: 5px;
    }

    .three_text {
        font-family: Futura_Italic;
        font-size: 20px;
        padding-top: 40px;
    }

    .four_text {
        padding-top: 16px;
        font-family: Garamond;
        font-size: 35px;   
    }

    .four_itext {
        font-family: Futura_Italic;
        font-size: 25px;
        padding-top: 60px;
    }

    footer{
        background-color: #3D441D;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .footer_text {
        display: none;
    }
}