
/* ------- page layout -------- */

h1 {
 margin-bottom: 20px;
 }

h2 {
 width: 100%;
 border: 1px solid #ddd;
 background-color: #eeeeee;
 margin: 0 0 10px 0;
 padding: 10px;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 }

h3 {
 margin: 10px 0;
 }

h4 {
 font-size: 18px;
 width: 100%;
 border: 1px solid #ffedd1;
 background-color: #fff3df;
 color:brown;
 border-radius:5px;
 margin: 10px 0 20px 0;
 padding: 5px;
 text-align:center;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
 --box-shadow: 0 4px 8px 0 rgba(0,0,0,.2); 	/* Shadow below Navbar */
 --box-shadow: 0px 8px 24px 0px rgba(140, 149, 159, 0.2);
 }

.wrapper {
 width: 100%;
 text-align: center; /* center hack */
 }

.container {
 width: 100%;
 text-align: left;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 margin: 0 auto; /* center hack */
 border:0px solid red;
 }

header {
 display: block;
 width: 100%; 
 text-align: center;
 position: relative; 
 margin: 0;
 border:0px solid red;
 }

footer {
clear: both;
 text-align: center;
 margin-top: 1.5em;
 background-color: #cb9e7d;	/* #d3a66b - #eaa775 - #ebb791 - #d3a66b */
 color:#fff;
 text-transform: uppercase;
 border-top:1px solid brown;
 width: 100%;
 height:auto;
 padding: 10px;
 display: block;
 overflow:hidden;
 --box-shadow: 0 -3px 10px 3px rgba(0, 0, 0, 0.2);
 }
.footer-left { 
 float:left;
 padding-left:30px;
 color:#fff;
 font-size:0.7em; 
 }
.footer-right { 
 float:right;
 padding-right:30px;
 padding-top:10px;
 color:#fff;
 font-size:0.7em; 
 }

.main {
 word-wrap: break-word;
 border: 1px solid #dddddd;
 border-radius:6px;
 background-color: #ffffff;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 padding: 20px; 
 border:0px solid blue;
 }

.two-column {
 float: none;
 width: auto;
 overflow: hidden;
 }

.side-a {
 float: left;
 position: relative;
 overflow: hidden;
 width: 350px;
 word-wrap: break-word;
 border: 1px solid #dddddd;
 border-radius:6px;
 background-color: #ffffff;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 margin-right: 15px;
 padding:20px;
 border:0px solid blue; 
 font-weight: 200;
 }

.very-top {
 height:24px;
 overflow:hidden;
 border:0px solid blue;
 background-color:#eaa775;
 text-align:right;
 font-size:14px;
 line-height:14px;
 }

.fa-envelope, .fa-file-text-o, .fa-book {
 color:white;
 font-size:14px;
 line-height:14px;
 float:right;
 padding:4px 10px;
 padding-right:50px;
 }

/* media queries */
@media only screen and (max-width: 767px) {
 .container {
 width: 100%;
 max-width: 767px;
line-height:1em;
 }
 
.side-a {
 float: none; 
 position: static;
 width: 100%;
 margin-right: 0;
 margin-bottom: 20px;
 }
}

.middle2columns {
 overflow:hidden;
 width:92%;
 margin:0 auto;
 border:0px dashed red;
 }


/* ------------ Banner Image ------------ */

.banner-img {
 height:65px;
 background-image: url("../img/banner-img-trans2.png");
 background-repeat:no-repeat;
 background-size: cover;
 background-position: bottom;
 }
