body {
background: #000000;
padding: 0px;
margin: 5px;
font-family: 'Nunito', sans-serif;
font-size: 16px;
}

.fixtextarea { 
    width:auto;
    resize:horizontal; 
    max-width:550px; 
    min-width:100px; 
    display: block;
}

input, button {
font-family: 'Nunito', sans-serif;
font-weight: 700;
}

.main-div, .loggedin-div {
width: auto;
margin:0px auto;
margin-top: 100px;
padding: 10px;
display: none;
}


.main-div input {
display: block;
border: 1px solid #ccc;
border-radius: 5px;
background: #fff;
padding: 15px;
outline: none;
width: 100%;
margin-bottom: 20px;
}

.main-div input:focus {
border: 1px solid #777;
}

.main-div button, .loggedin-div  button {
 background: #5d8ffc;
 color: #fff;
 border: 1px solid #5b84d7:
 border-radius: 5px;
 padding: 15px;
 display: block;
 width: 100%;
 transition: 0.3s;
 -webkit-transition: 0.3s;
 -moz-transition: 0.3s;
}

.main-div button:hover, .loggedin-div button:hover {
background: #fff;
color: #5d8ffc;
border: 1px solid #5d8ffc;
cursor: pointer;
}

/* standard QC CSS */

 body {
      font: 400 15px Lato, sans-serif;
      line-height: 1.8;
      color: #818181;
  }

 .bg-1 {
    background-color: #1abc9c; /* Green */
    color: #ffffff;
 }
 .bg-2 {
    background-color: #5b84d7; /* Dark Blue */
    color: #ffffff;

 }
 .bg-3 {
    background-color: #ffffff; /* White */
    color: #555555;
 }

.dropdown-toggle > .active > a,.dropdown-menu > .active > a:hover.dropdown-menu > .active > a:focus {
color: #555555!important; background-color: #e7e7e7!important;
}

  h2 {
      font-size: 24px;
      text-transform: uppercase;
      color: #303030;
      font-weight: 600;
      margin-bottom: 30px;
  }
  h4 {
      font-size: 19px;
      line-height: 1.375em;
      color: #303030;
      font-weight: 400;
      margin-bottom: 30px;
  }  

h5{
    font-size: 1.4em;
}


@media (max-width: @screen-xs) {
    body{font-size: 10px;}
}

@media (max-width: @screen-sm) {
    body{font-size: 14px;}
}



@media (max-width: 900px) {
.myH1 {
font-size:20px;
}
}


@media screen and (max-width: 767px) {
    body {
        font-size: 0.9em;
    }
}

/* sm */
@media screen and (min-width: 768px) {
    body {
        font-size: 1em;
    }
}

/* md */
@media screen and (min-width: 992px) {
    body {
        font-size: 1.2em;
    }
}

/* lg */
@media screen and (min-width: 1200px) {
    body {
        font-size: 1.3em;
    }
}
  .jumbotron1 {
      background-color: #000000;
      color: #3366cc;
      padding: 100px 25px;
      font-family: Montserrat, sans-serif; 
}
/* remove this to default no-image background */
.jumbotron1{
    background: url("content/mine.png") no-repeat center center; 
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
}

  .jumbotron2 {
      background-color: #000000;
      color: #3366cc;
      padding: 100px 25px;
      font-family: Montserrat, sans-serif; 
}
/* remove this to default no-image background */
.jumbotron2{
    background: url("content/Untitled-7_4_1b.png") no-repeat center center; 
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
}

.container-fluid1{
      background-color: #000000;
      color: #3366cc;
      padding: 100px 25px;
      font-family: Montserrat, sans-serif; 
}
/* remove this to default no-image background */
.container-fluid1{
    background: url("content/World_Map1.png") no-repeat center center; 
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
}

.zone1{
    background: url("content/solarized.png") no-repeat center center; 
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
}

  .container-fluid {
      padding: 60px 50px;
  }
  .bg-grey {
      background-color: #f6f6f6;
  }
  .logo-small {
      color: #3366cc;
      font-size: 50px;
  }
  .logo {
      color: #000000;
      font-size: 200px;
  }
  .thumbnail {
      padding: 0 0 15px 0;
      border: none;
      border-radius: 0;
  }
  .thumbnail img {
      width: 100%;
      height: 100%;
      margin-bottom: 10px;
  }

  .caption {
        width:100%;
        bottom: .3rem;
        position: absolute;
        background:#000;
        background: -webkit-linear-gradient(bottom, #000 40%, rgba(0, 0, 0, 0) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
        background: -moz-linear-gradient(bottom, #000 40%, rgba(0, 0, 0, 0) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
        background: -o-linear-gradient(bottom, #000 40%, rgba(0, 0, 0, 0) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
        background: linear-gradient(to top, #000 40%, rgba(0, 0, 0, 0) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    }
.caption h4 {
        color: #fff;
        -webkit-font-smoothing: antialiased;
}
  .carousel-control.right, .carousel-control.left {
      background-image: none;
      color: #000000;
  }
  .carousel-indicators li {
      border-color: #000000;
  }
  .carousel-indicators li.active {
      background-color: #000000;
  }


  .item h4 {
      font-size: 19px;
      line-height: 1.375em;
      font-weight: 400;
      font-style: italic;
      margin: 70px 0;
  }
  .item span {
      font-style: normal;
  }
  .panel {
      border: 1px solid #000000; 
      border-radius:0 !important;
      transition: box-shadow 0.5s;
  }
  .panel:hover {
      box-shadow: 5px 0px 40px rgba(0,0,0, .2);
  }
  .panel-footer .btn:hover {
      border: 1px solid #000000;
      background-color: #FFF !important;
      color: #000000;
  }
  .panel-heading {
      color: #FFF !important;
      background-color: #000000 !important;
      padding: 25px;
      border-bottom: 1px solid transparent;
      border-top-left-radius: 0px;
      border-top-right-radius: 0px;
      border-bottom-left-radius: 0px;
      border-bottom-right-radius: 0px;
  }
  .panel-footer {
      background-color: white !important;
  }
  .panel-footer h3 {
      font-size: 32px;
  }
  .panel-footer h4 {
      color: #aaa;
      font-size: 14px;
  }
  .panel-footer .btn {
      margin: 15px 0;
      background-color: #000000;
      color: #FFF;
  }
  .navbar {
      margin-bottom: 0;
      background-color: #000000;
      z-index: 9999;
      border: 0;
      font-size: 10px !important;
      line-height: 1.42857143 !important;
      letter-spacing: 2px;
      border-radius: 0;
      font-family: Michroma, sans-serif;
  }

.navbar-brand
{
  font-size: 22px;
}

.navbar-default .navbar-brand {
  color: #3366cd;
}

.navbar li a, .navbar .nav-brand {
color: #3366cd !important;
}

.navbar-nav li a:hover, .navbar-nav li.active a {
color: #3366cd ! important;
background-color: #fff !important;
}

.navbar-default .navbar-toggle {
border-color: transparent;
color: #3366cd !important;
}

.navbar-inner{
padding-left:0;
padding-right:0;
}  

.navbar > .container {width:auto;
}

.buckle{
     position:fixed;
     top:5px;
}

/* use for animate hamburger to X */
.navbar-toggle.collapsed span.icon-bar:nth-child(2) {
  -webkit-transform: translateY(0) rotate(0);
          transform: translateY(0) rotate(0);
}
.navbar-toggle.collapsed span.icon-bar:nth-child(3) {
  opacity: 1;
}
.navbar-toggle.collapsed span.icon-bar:nth-child(4) {
  -webkit-transform: translateY(0) rotate(0);
          transform: translateY(0) rotate(0);
}
.navbar-toggle span.icon-bar {
  -webkit-transition: all 300ms;
  transition: all 300ms;
}
.navbar-toggle span.icon-bar:nth-child(2) {
  -webkit-transform: translateY(300%) rotate(45deg);
          transform: translateY(300%) rotate(45deg);
}
.navbar-toggle span.icon-bar:nth-child(3) {
  opacity: 0;
}
.navbar-toggle span.icon-bar:nth-child(4) {
  -webkit-transform: translateY(-300%) rotate(-45deg);
          transform: translateY(-300%) rotate(-45deg);
}
/*end animate X*/

@media (max-width: 900px) {
.navbar-brand {
font-size:12px;
}
}

.navbar-foot
{
  font-size: 8px;
}

@media (max-width: 900px) {
.navbar-foot {
font-size:6px;
}
}

.post-content {
    background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
    opacity: 0.5;
    top:0;
    left:0;
    min-width: 90px;
    min-height: 50px; 
    position: absolute;
    color: #ffffff; 
}

    .thumbnail {
        border: 0 none;
        box-shadow: none;
        margin:0;
        padding:0;
    }

.details {
    position: absolute; 
    z-index: 2; 
    color: #ffffff; 
}

.wrapper {
    text-align:right;
}