add new files #45

/* CUSTOMIZE THE NAVBAR

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

/* Special class on .container surrounding .navbar, used for positioning it into place. */

.navbar-wrapper {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  z-index: 20;

  margin-top: 0px;

}

/* Flip around the padding for proper display in narrow viewports */

.navbar-wrapper > .container {

  padding-right: 0;

  padding-left: 0;

}

.navbar-wrapper .navbar {

  padding-right: 15px;

  padding-left: 15px;

}

.navbar-wrapper .navbar .container {

  width: auto;

  background-color: #fff;

  border-radius: 5px;

}

.banner{

  height: 500px;    

}

.banner-title{

    right: 56%;

    position: absolute; 

    top: 25%;

    left: 10%; 

    color:#FFF;

    text-shadow: 0 1px 2px rgba(0,0,0,.6);

}

/* MARKETING CONTENT

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

/* Center align the text within the three columns below the carousel */

.marketing .col-lg-4 {

  margin-bottom: 20px;

  text-align: center;

}

.marketing h2 {

  font-weight: normal;

}

.marketing .col-lg-4 p {

  margin-right: 10px;

  margin-left: 10px;

}

/* Featurettes

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

.featurette-divider {

  margin: 80px 0; /* Space out the Bootstrap <hr> more */

}

/* Thin out the marketing headings */

.featurette-heading {

  font-weight: 300;

  line-height: 1;

  letter-spacing: -1px;

}

/* RESPONSIVE CSS

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

@media (min-width: 768px) {

  /* Navbar positioning foo */

  .navbar-wrapper {

    margin-top: 0px;

  }

  .navbar-wrapper .container {

    padding-right: 15px;

    padding-left: 15px;

  }

  .navbar-wrapper .navbar {

    padding-right: 0;

    padding-left: 0;

  }

  /* The navbar becomes detached from the top, so we round the corners */

  .navbar-wrapper .navbar {

    border-radius: 4px;

  }

  .featurette-heading {

    font-size: 50px;

  }

}

@media (min-width: 992px) {

  .featurette-heading {

    margin-top: 120px;

  }

}

@media (max-width: 780px){

    .banner img{

	min-height: 300px;

	min-width: 780px;

    }

}

<div class="row banner">

  <div class="col-md-12">

    <img class="img-responsive" src="/isogrids/banner/random/gradient?theme=seascape&h=800&w=3000&xt=20" alt="First slide">

    <div class="banner-title">

     <h1>UNIQUE AVATARS FOR YOUR WEBSITE</h1>

    </div>

  </div>

</div>