@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&subset=latin-ext');

html,body {
    height: 100%;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    color: #666;
    background: #ececec;
    width: 100%;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1,h2,h3,h4,h5,h6 {color: #000;}
a {cursor: pointer;}
.carousel {z-index: 10;background: #000;}
.fright {float: right;}
.fleft {float: left;}
.carousel,
.item,
.active {
    height: 100%;
}

.carousel-inner {
    height: 100%;
}

.carousel-caption {display: table;height: 100%;text-align: center;width: 100%;left: 0;right: 0;padding-bottom: 0;}
.carousel-caption .caption-inner{display: table-cell;vertical-align: middle;}

.carousel-caption h2 {font-size: 70px; font-weight: 900;text-transform: uppercase;letter-spacing: -2px;margin-top: 0;padding-top: 50px;}

.carousel-indicators {bottom: 50%;}
.carousel-indicators li{padding: 5px;}

.navbar {height: 80px;text-transform: uppercase;font-size: 14px; letter-spacing: 1px;}

.navbar-inverse {background: #ba0000;z-index: 1060;border: 0;}
.navbar-nav {padding-left: 20px;}
.scroll {
    bottom: 30px;
    position: absolute;
    left: 50%;
    z-index: 15;
    width: 10%;
    padding-left: 0;
    margin-left: -25px;}

.scroll img {width: 50px;}
.logo {float:left;top: 0;width: 40%;background: #fff;}
.logo img {height: 80px;float: right;padding-right: 20px;}

.navbar-nav>li>a {padding: 30px 20px; font-weight: 500;}
.navbar-inverse .navbar-nav>li>a {color: #fff;}

.navbar-right{
position: fixed;
top: 0;
right: 0;
width: 80px;
height: 100%;
background: #ba0000;
z-index: 1050;
text-align: center;
margin-right: 0;
}
.navbar-right .left-social{
position: absolute;
bottom: 20px;
left: 0;
width: 100%;
}

.navbar-right .left-social ul{
    list-style: none;
    padding: 0;
}
.navbar-right .left-social a{
color: #fff;
}

.navbar-right .carousel-indicators {width: 50%;margin-left: -20%;margin-bottom: -40px;}

.navbar-right .carousel-indicators li{
float: left;
width: 20px;
height: 20px;
margin: 5px;
border: 2px solid #fff;
}
.menu-bar {position: fixed;right:20px;top: 30px;color: #fff;font-size: 20px; }

/* Background images are set within the HTML using inline CSS, not here */

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    background-position: 30% 0px;
}

.content {background: #fff;padding: 100px 0 100px 0;z-index: 11;position: relative;width: 100%;}

.content h1 {font-size: 50px; font-weight: 900;text-transform: uppercase;letter-spacing: -2px;}
.modal-content h1 {font-size: 50px; font-weight: 900;text-transform: uppercase;letter-spacing: -2px;}
.text {padding: 100px 0;}

.image-div {position: relative;width: 100%;z-index: 12;}

.image-div img{width: 100%;}
.footer-place {width: 100%;height: 350px;z-index: 0;position: absolute;}
.footer {
    padding: 100px 0 0 0;
    text-align: left;
    background: #17171a;
    color: #fff;
    font-size: 14px;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 1;
}

.footer .navbar-nav {text-align: left; margin:0;}
.footer h3 {text-transform: uppercase;color: #fff;font-size: 14px; border-left: solid #ff0000 2px;padding: 10px;}
.footer p {color: #ccc; padding-left: 20px;}
.footer .navbar-nav>li {text-align: left;width: 100%;padding-left: 20px;}
.footer .navbar-nav>li>a {padding: 0 0 5px 0;color: #ccc;}
.footer .navbar-nav>li>a:hover, .footer .navbar-nav>li>a:focus {background:transparent;color: #fff;}
.footer .logo-bottom{margin-top: -50px;float: left;}

.copy{
background: #131314;
text-align: center;
color: #fff;
height: 60px;
padding-top: 15px;
position: relative;
margin-top: 50px;
font-size: 14px;
}
.copy p {font-size: 14px;}
.copy a {color: #ff0000;}

.modal-backdrop {background-color: #fff;}
.modal-backdrop.in {
    filter: alpha(opacity=100);
    opacity: 1
}

.modal-content {
    padding: 100px 50px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    border: 0;
}



.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}

/* just for demo purpose */
    html,
    body,
    .carousel,
    .carousel-inner,
    .carousel-inner .item {
      height: 100%;
    }

   


@-webkit-keyframes pulse {    
    0 {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes pulse {    
    0 {
        -moz-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
}


@media (max-width: 768px) {
    body {padding-top: 50px;}
    .logo {position: fixed;width: 70%;}
    .logo img {float: left; padding-left: 20px;}
    .navbar-right {display: none;}
    .menu-bar {display: none;}
    .navbar-collapse {background: #000;}
    .navbar-nav {padding-left: 0px;}
    .navbar-nav>li>a {padding: 15px 15px 15px 30px;}
    .content {padding: 80px 30px;}
    .carousel {height: 60%;}
    .footer-place {height: 500px;}
    .navbar-toggle {padding: 25px 10px;}
    .navbar-inverse .navbar-toggle {border: 0;}
    .navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {background: transparent;}
    .carousel-caption h2,.content h1,.modal-content h1 {font-size: 30px;}


}
@media (max-width: 320px) {
.logo-bottom {display: none;}
}