.navbar-default {
  background-color: #000000;
  border-color: #369750;
}
.navbar-default .navbar-brand {
  color: #ffffff;
}
.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
  color: #ffffff;
}
.navbar-default .navbar-text {
  color: #ffffff;
}
.navbar-default .navbar-nav > li > a {
  color: #ffffff;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
  color: #ffffff;
}
.navbar-default .navbar-nav > li > .dropdown-menu {
  background-color: #000000;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a {
  color: #ffffff;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus {
  color: #ffffff;
  background-color: #369750;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > .divider {
  background-color: #000000;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: #369750;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
  color: #ffffff;
  background-color: #369750;
}
.navbar-default .navbar-toggle {
  border-color: #4E9736;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  background-color: #369750;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #ffffff;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #ffffff;
}
.navbar-default .navbar-link {
  color: #ffffff;
}
.navbar-default .navbar-link:hover {
  color: #ffffff;
}

@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #369750;
  }
}

body {
  background-color: white;
  font-family: "Open Sans", sans-serif;
}

#super-container {
  background-color: #FBFAEA;
  padding-top: 10px;
}

.navbar-default {
  font-size: 20px;
  background-color: #333333;
  padding: 5px;
  margin-bottom: 0px;
}

.showcase {
  background-color: white;
  border: 5px solid #FBFAEA;
  margin-bottom: 20px;
}

#MShop {
  font-size: 100%;
  color: #37CF22;
  font-weight: bold;
}

@-moz-document url-prefix() {  
    img{
        width: 100%;
        max-width: 100%;
    }
}

@media screen and (-webkit-min-device-pixel-ratio:0) {    
     img{
        max-width: 100%;
    }    
}

.img-responsive {
  max-height: 250px;
  max-width: 340px;
}

#social {
  background-color: #333333;
  padding: 5px;
}

#show {
  margin-right: 7px;
  margin-left: 7px;
}


#embed {
  border-style: solid;
  border-color: gray;
}

/*role for desktop*/
@media screen and (min-width: 900px){
  #embed {
    width: 490px;
    height: 400px;
  }
}

/*role for ipad*/
@media screen and (max-width: 770px) and (min-width: 420px){
  #embed {
    width: 330px;
    height: 240px;
  }
}

/*role for iphone*/
@media screen and (max-width: 415px){
  #embed {
    width: 300px;
    height: 200px;
  }
}

h3 {
  color: rgb(54,151,80);
}

h1 {
  color: #E25100;
}

.jumbotron {
  background-color: rgba(146, 171, 226, 0.57); 
  padding: 2px;
}

.jumbotron h1, p {
  margin: 5px;
}