/*
---------------------------
base-style
---------------------------
Version: 1.0
Date: Novenber 2017
---------------------------
Author: Age Hadi
URL: http://age.penaraya.id
For: Belantara Foundation
---------------------------
CONTENTS
---------------------------
1. general
2. structure
3. blocks
4. typography
5. colors
6. helper
7. queries
---------------------------
happy reading!
---------------------------
*/



/* ================ */
/*  1. general    */
/* ================ */

/* ================ */
/*  2. structure    */
/* ================ */

/* ================ */
/*  3. blocks       */
/* ================ */



/* ====FOOTER==== */
#myFooter {
    background-color: #3c3d41;
    background: url("../images/theme/NS-SetulangMalinau-Forest-7834-footer-small.jpg")no-repeat bottom left;;
    min-height:480px;
    /*padding-top:64px;*/
    /*margin-top:64px;*/
    color: white;
    position: relative;
}
#myFooter .footer-copyright {
    background-color: rgba(0,0,0,0);
    padding-top: 3px;
    padding-bottom: 3px;
    text-align: center;
    position: absolute;
    bottom: 2rem;
    left: 0; right: 0;
    margin:auto;
}
#myFooter .row {
    margin-bottom: 64px;
}
#myFooter .footer-hr{
  width:50%;
  padding-top:32px;
}
#myFooter .footer-logo{
  width:75%;
  margin-top:20px;
}
#myFooter .navbar-brand {
    margin-top: 45px;
    height: 64px;
}
#myFooter .footer-copyright p {
    margin: 10px;
}
#myFooter ul {
    list-style-type: none;
    padding-left: 0;
    line-height: 1.7;
}
#myFooter h5 {
    font-size: 18px;
    color: #44a34b;
    margin-top: 30px;
}
#myFooter h2 a{
    font-size: 50px;
    text-align: center;
    color: #fff;
}
#myFooter a {
    color: #999999;
    text-decoration: none;
}
#myFooter a:hover,
#myFooter a:focus {
    text-decoration: none;
    color: #333333;
}
#myFooter .social-networks {
    text-align: center;
    padding-top: 30px;
    padding-bottom: 16px;
}
#myFooter .social-networks a {
    font-size: 24px;
    color: #44a34b;
    padding: 10px;
    transition: 0.2s;
}
#myFooter .social-networks a:hover {
    text-decoration: none;
}
#myFooter .facebook:hover {
    color: #0077e2;
}
#myFooter .instagram:hover {
    color: #ef1a1a;
}
#myFooter .twitter:hover {
    color: #00aced;
}
#myFooter .youtube:hover {
    color: #cc0000;
}
#myFooter .btn {
    color: white;
    background-color: #44a34b;
    border-radius: 5px;
    border: none;
    width: 170px;
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    line-height: 35px;
}
@media screen and (max-width: 767px) {
    #myFooter {
        text-align: center;
    }
    #myFooter .footer-logo{
      width:50%;
      margin:0 auto;
    }
    #myFooter .footer-hr{
        width:90%;
    }
    #myFooter .social-networks a{
      color:white;
      text-shadow: 1px 1px 3px rgba(129, 129, 129, 0.5);
    }
    #myFooter .social-networks a:hover{
      text-shadow: 1px 1px 3px rgba(129, 129, 129, 0.5);
    }
}



/* ================ */
/*  4. typography   */
/* ================ */
body{
  font-family: "Avenir", Helvetica, Arial, sans-serif;
}
.headings{
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-weight: 900;
  text-transform: uppercase;
  color:#333333 /*black 80% / rgb(51,51,51)  */
}
.headings span.green {
  color: #44a34b;
}
.headings span.light {
  font-weight: 200;
}

.text-small{
  font-size: 0.8rem;
}
.text-white-shadow{
  color:white;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}
/* ================ */
/*   5. colors      */
/* ================ */
.light{background-color: #ffffff; color: #333333;}
.dark{background-color: #333333; color: #ffffff;}
.grey{background-color: #cccccc; color: #000000;}
.bg-trans { background-color: rgba(255, 0, 0, 0); }
.text-dark{color: #333333;}
.text-light{color: #ffffff;}

/* ================ */
/*   6. helper      */
/* ================ */
.margin-0{margin:0}
.bred{ border: 1px solid red}
.hidden{display: none;}
.ptb-32{padding-top:32px;padding-bottom:32px;}
.pt-32{padding-top:32px;}
.plr-32{padding-left:32px ; padding-right: 32px}
.plr-16{padding-left:16px ; padding-right: 16px}

.mt-8{margin-top:8px}
.mt-16{margin-top:16px}
.mt-32{margin-top:32px}
.mt-64{margin-top:64px}
.mtb-32{margin-top:32px;margin-bottom:32px;}
.mtb-32{margin-top:16px;margin-bottom:16px;}


.row { margin: 0; padding: 0 }
.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}


/* ================ */
/*   7. queries     */
/* ================ */

/*
Extra small devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap
 */

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {

}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {

}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {

}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {

}
/* ================ */
/*   END            */
/* ================ */



.temp{
  height: 100vh;
  background-color: blue;
}