Body {
	font-family: 'Karla', sans-serif;
	background-color: #ede1ac;
	margin: 0;
    float: none;
    /*
    background-image: url(../images/rocky_mossy_bgkrd.jpg);
    */
    background-image: url(../assets/background_ditsy.jpg);
    background-size: 33% auto;
    background-repeat: repeat;
    background-attachment: fixed;
        }
h1 {
     margin-top: 0px;
     margin-bottom: 15px;
     font-family: 'Akaya Kanadaka', cursive;
}
h2 {
        font-family: 'Akaya Kanadaka', cursive;
	font-size: 36px ;
	/*
	color: #b95116;
	*/
	margin-top: 3em ;
	margin-bottom: .2em ;
		
}
h3, .ui-tabs-anchor {
	font-family: 'Karla', sans-serif;
	letter-spacing: 4px;
	/*
	font-size: 72px;
	*/
	padding: 40px 0;
		
}
h4 {
	font-family: 'Karla', sans-serif;
	font-size: 24px ;
	color: #b95116;
	margin-top: 3em ;
	margin-bottom: .2em ;
		
}
h4  a {
    text-decoration: none;
    color: rgb(231, 220, 125);
    text-shadow: 2px 2px 4px  rgb(64, 37, 32, 0.7);
}

.hero h2:hover {
	background-color: rgba(46,112,121,1);
	cursor: pointer;
}



.wrapper {
       /*     background-color: rgba(65,125,137,0.93);     */ /* middle blue */
            width: 953px;
            margin: 0 auto;
}
/* Container */
.container {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	background-color: #ede1ac;
}
/* Header */
header {
	width: 100%;
	height: 8%;
        background-color: rgba(146,200,162,1);  /*   light green */
        /* background-color: rgba(119,179,201,1); */  /*  Devils Lake Moss  */
	/* border-bottom: 2px solid #f5b222;  */ /* gold */
	border-bottom: 2px solid #e5a35c;   /* golden buff */
}
.my-logo {
    min-width: 180px;
    max-width: 200px;
    /*
    width: 225px;
    */
    height: auto;
    /*
    margin-left: -8px;
    */
	margin-left: 20px;
	margin-right: auto;
	padding-top: 8px;
	width: 40%;
	float: left;
	opacity: 0;
	-webkit-filter: drop-shadow(0px 1px 2px #f5b222);
	        filter: drop-shadow(0px 1px 2px #f5b222);
     animation-name: move_it; 
     animation-duration: 3s; 
     animation-iteration-count: 1; 
     animation-delay: 0.1s;  
     animation-fill-mode: forwards;
}

.footsie {
	float: none;
	margin-left: 30%;
	width: 40%;
	-webkit-filter: drop-shadow(0px 1px 2px #f5b222);
	        filter: drop-shadow(0px 1px 2px #f5b222);
}
.landscape_grid {
    width: 100%;
    float: left;
}
.landscape_grid img {
    width: 450px;
    height: auto;
    float: left;
    padding-left: 10px;
    padding-bottom: 5px;
}
.portrait_grid {
    width: 100%;
    float: left;
}
.portrait_grid img {
    width: 275px;
    height: auto;
    float: left;
    padding-left: 30px;
}
.space {
    margin: 0 10px 10px 0;
}
/* About Section */
.narrow_column {
	float: left;
	width: 40%;
}
.wide_column {
	padding-top: 20px;
	float: left;
}
.column {
	width: 50%;
	text-align: center;
	padding-top: 20px;
	float: left;
}
/*
.intro .column h3 {
	color: #ede1ac;
	text-align: center;
}
.intro .column p {
	color: #ede1ac;
}
*/
.cards {
	width: 100%;
	height: auto;
	max-width: 400px;
	max-height: 200px;
	opacity: 0.8;
}
/*
.intro .column p {
	padding-left: 30px;
	padding-right: 30px;
	text-align: justify;
	line-height: 25px;
	font-weight: lighter;
	margin-left: 20px;
	margin-right: 20px;
	width: 80%;
	margin-top: 4%;
}
*/
.button {
	width: 200px;
	margin-top: 40px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
	text-align: center;
	vertical-align: middle;
	border-radius: 0px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	border: 3px solid #ede1ac;
	color: #ede1ac;
	transition: all 0.3s linear;
}
.button:hover {
	background-color: #6DC7D0;
	color: #92c8a2 ;     /* pale green  */
	cursor: pointer;
}
.copyright {
        font-family: 'Akaya Kanadaka', cursive;
	text-align: center;
	padding-top: 15px;
	padding-bottom: 5px;
	/*
	color: #fe5046;     */    /*  bright vermillion  */
	color: rgb(220, 201, 116);    /*  yellow  */
	/* color: #bd3e4f;   */      /*  light red   */
	text-transform: uppercase;
	font-weight: lighter;
	letter-spacing: 2px;
	border-top-width: 2px;
}

footer {
        background-color: rgba(47,96,105,.85);   /*   teal    */
        /* background-color: rgba(199,180,104,.85);  */ /*   gold    */
        /*  background-color: rgba(245,178,34,.70);      */
	padding-top: 60px;
	padding-bottom: 60PX;
	/*
        color: rgba(119,179,201,1);  */  /*  Devils Lake Moss  */
        /* color: rgba(189,62,79,1); */  /*  Devils Lake Moss  */
        color: rgba(146,200,162,1);  /*   light green */
}
footer h1 {
	text-align: center;
}
/*
.intro {
	display: inline-block;
	background-color: #7ee4e8;
}
*/
/*
.gallery .thumbnail .tag {
	color: #5D5E5D;
	padding-bottom: 4px;
	padding-top: 4px;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
}
*/
.dkBronze{     max-height: none;
    padding-top: 70px;
    padding-bottom: 70px;
/*	color: #753c1d;   */      /*   another  */
	color: #811e2b;         /*   another  */
	background-color: rgba(199,180,104,.85);
    font-size: 42px;
    text-align: center;
}
.Separator1 {
    /*
    background-image: url(../images/3colorprint.jpg);
    */
    background-image: url(../assets/background_diag.jpg);
    background-attachment: fixed;
    background-size: 15% auto;
    /*
    background-size: contain;
    */
}
.Separator2 {
    /*
    background-image: url(../images/3colorprint.jpg);
    */
    background-image: url(../assets/background_diag.jpg);
    background-size: 15% auto;
    /*
    background-size: cover;
    */
    background-attachment: fixed;
    background-position: 100% ;
}
.greenBox {
    background-color: rgba(146,200,162,0.9);
    color: rgb(189, 62, 79);
    align:  center;
}
.greenBox > a  {
    font-size: 41px;
    font-family: 'Akaya Kanadaka', cursive;
}
.yellowBox {
    background-color: rgba(199,180,104,.95);
    color: rgba(47,96,105);
    align:  center;
}
.centered_thing {
     float: center;
     height: 5em;
     width:  auto;

}
.yellowBox > p  {
	text-align: center;
        font-family: 'Akaya Kanadaka', cursive;
        color: rgba(47,96,105);
}
.yellowBox > a  {
	/*
        font-family: 'Akaya Kanadaka', cursive;
	*/
        color: rgba(47,96,105);
        font-size: 36px;
}
.yellow {
    /* color: rgba(245,178,34,1.00);  */  /*   gold    */
    /* color: rgba(255,198,33,1.00);    */  /*  yellow  */
    /* color: rgba(241,167,35,1.00);    */  /*   gold-orange  */
       color: rgba(127,108,59,1.00);   /*   golden buff    */
    /* background-color: rgba(119,179,201,0.60); */  /*  Devils Lake Moss  */
    /*       background-color: rgba(146,200,162,0.80);*/  /*   light green */
    font-size: 41px;
}
mellNav ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
}
mellNav ul li {
  display: inline;
  float: left;
}

mellNav li > a {
  /*
  display: block;
  padding: 8px;
  */
  padding: 14px 16px;
  background-color: #dddddd;
  color: white;
  text-align: center;
  text-decoration: none;
}

/* Change the link color to #111 (black) on hover */
mellNav li > a:hover {
  background-color: #111;
}
.active {
/*
  background-color: #04AA6D;
*/
  color: rgb(245, 105, 124);
}
		

/* Mobile */
@media (max-width: 470px) {
#smugsite {
    height: 710px; 
}
  .navbar-light .navbar-nav .open .dropdown-menu > li > a {
 
    color: #d7e2e9;
 
  }
 
  .navbar-light .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-light .navbar-nav .open .dropdown-menu > li > a:focus {
 
  color: rgba(254,157,151);
 
  }
 
  .navbar-light .navbar-nav .open .dropdown-menu > .active > a, .navbar-light .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-light .navbar-nav .open .dropdown-menu > .active > a:focus {
 
 
  color: rgba(254,157,151);
    background-color: #a7e2d9;
 
  }
.hero{
    background-position: 100% -7px;
}
.dkBronze{  
    padding-top: 28px;
    padding-bottom: 28px;
    font-size: 24px;
}
.yellow {
    font-size: 24px;
}
        .wrapper {
            width: 420px;
        }
.wide_column {
	width: 0%;
	display: none;
}
.narrow_column {
	width: 100%;
}
.column {
	width: 100%;
	margin-top: 0px;
}
.Separator1 {  
    min-height: 20px;
}
.Separator2 {  
    min-height: 20px;
}
}

/* Tablets */
@media (min-width: 471px) and (max-width: 800px) {
#smugsite {
    height: 885px; 
}
.hero{
    background-position: 100% -7px;
}
.dkBronze{  
    padding-top: 35px;
    padding-bottom: 35px;
    font-size: 28px;
}
.yellow {
    font-size: 28px;
}
        .wrapper {
            width: 550px;
        }
.portrait_grid img {
    width: 200px;
    height: auto;
    float: left;
    padding-left: 30px;
    padding-top: 20px;
    padding-bottom: 20px;
}
  .navbar-light .navbar-nav .open .dropdown-menu > li > a {
 
    color: #d7e2e9;
 
  }
 
  .navbar-light .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-light .navbar-nav .open .dropdown-menu > li > a:focus {
 
  color: rgba(254,157,151);
 
  }
 
  .navbar-light .navbar-nav .open .dropdown-menu > .active > a, .navbar-light .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-light .navbar-nav .open .dropdown-menu > .active > a:focus {
 
 
  color: rgba(254,157,151);
    background-color: #a7e2d9;
 
  }
/*
.text_column {
	width: 100%;
	text-align: left;
	padding: 0;
}
*/
/*
.thumbnail {
	width: 100%;
}
*/
.wide_column {
	width: 50%;
}
.narrow_column {
	width: 45%;
}
.column {
	width: 100%;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	padding-top: 5px;
}
/*
.thumbnail {
	width: 100%;
}
*/
/*
.text_column {
	padding-left: 20px;
	padding-right: 20px;
	width: 90%;
}
*/
/*
.intro .column p {
	width: 90%;
	text-align: center;
	padding-left: 0px;
}
*/
.Separator1 {  
    min-height: 30px;
}
.Separator2 {  
    min-height: 30px;
}
}


/*  small Desktops  */
@media (min-width: 801px) and (max-width: 1300px) {
#smugsite {
    height: 1175px; 
}
.hero{
    background-position: 100% -18px;
}
.dkBronze{  
    padding-top: 70px;
    padding-bottom: 70px;
    font-size: 36px;
}
.yellow {
    font-size: 36px;
}
/*
.text_column {
	width: 100%;
	width: 90%;
	margin: 0;
	padding: 20px;
}
*/
/*
.thumbnail {
	width: 48%;
}
*/

/*
.intro .column p {
	width: 80%;
}
*/
.narrow_column {
	width: 40%;
	float: left;
}
.wide_column {
	width: 60%;
}
.Separator1 {  
    min-height: 100px;
}
.Separator2 {  
    min-height: 100px;
}
}





/* Desktops */


@media (min-width: 1301px) {
#smugsite {
    height: 1150px; 
}
.hero{
    background-position: 100% -60px;
}
/*
.text_column {
	width: 100%;
	width: 90%;
	margin: 0;
	padding: 20px;
}
*/
/*
.thumbnail {
	width: 48%;
}
*/
/*
.intro .column p {
	width: 80%;
}
*/
.narrow_column {
	width: 40%;
	float: left;
}
.wide_column {
	width: 60%;
}
.Separator1   {  
    min-height: 150px;
}
.Separator2 {  
    min-height: 150px;
}
}
	
		
		
		/*
		.Ex3{ max-height: none;
    min-height: 200px;}
    */
		
		.Separator2 { max-height: none;
    }
		
.MossBkgGoldTxt { 
    display: inline-block;
    padding-bottom: 10px;
}
.Ex6 { max-height: none;
    min-height: 200px;  
}
.hero{max-height: none;
    min-height: 150px;
			
}


		/*
.Ex3{
    text-align: center;
    text-decoration: none;
    background-image: url(../images/AbelmansGorge.jpg);
    background-attachment: fixed;
    background-size: cover;
}

.wireframe {
    text-decoration: none;
    position: absolute;
    margin-top: 100px;
}
*/

.MossBkgGoldTxt {  text-align: center;
    text-decoration: none;
    color: rgba(169,148,85,1.00);   /*   golden buff    */
    background-color: rgba(146,200,162,0.8);  /*   light green */
    padding-top: 20px;
    }
.goldtext {
    text-decoration: none;
    color: rgba(229,163,92,1.00);   /*   golden buff    */
    /*  color: rgba(245,178,34,1.00); */  /*   gold    */
}

.hero{
    text-align: right;
    padding-right: 20px;
    /* background-color: rgba(119,179,201,1.00);  */ /*  Devils Lake Moss  */
    background-color: rgba(146,200,162,1);  /*   light green */
    /* color: rgba(229,163,92,1.00); */   /*   golden buff    */
    color: rgba(228,213,148,1.00);   /*   pale yellow    */
    background-image: url(http://asandcountyblog.com/images/bunmore_narrows_extended956x498.png);
    background-attachment: fixed;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-max-width: 900px;

}
.body {
}
.link {
}
.textbox1 {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    width: 390px;
    margin-left: 10px;
    height: 22px;
    position: absolute;
    margin-top: 84px;
    color: rgba(252,154,168,1.00);
    font-size: 36px;
    text-align: center;
}

.navbar-light {
 
  color: rgb(255, 255, 255);
  background-color: rgba(47,96,105,0.9);
 
}
 
 
 /*
.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
 
  color: #e5dbdb;
 
}
 
.navbar-light .navbar-text {
 
  color: rgb(255, 255, 255);
 
}
 
*/
.navbar-collapse {
  text-align:center;
}

.navbar-light .navbar-nav > li > a {
 
  font-size: 20px;
  margin: 0 2px 0 2px;
  background-color: rgb(245, 105, 124);
  border-color: rgb(220, 201, 116);
  border-style: solid;
  min-width: 135px;
  max-width: 185px;
     border-width: 10px 16px 16px 8px;
     border-radius: 5% 75% 15% 99%/99% 79% 15% 60%;  
     -webkit-border-radius: 5% 75% 15% 99%/99% 79% 15% 60%;  
     -moz-border-radius: 5% 75% 15% 99%/99% 79% 15% 60%;  
     padding: 7px 7px 11px 7px;
     margin: 6px auto 5px auto;
     animation-name: breathe;
     animation-delay: 3s;  
     animation-duration: 22s;	
     animation-iteration-count: infinite;
}
 
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link 
{ 
     color: rgb(245, 105, 124);
     font-family: 'Akaya Kanadaka', cursive;
}
.navbar-light .navbar-nav .nav-link {
    color: rgba(0,0,0,.6);
	font-family: 'Karla', sans-serif;
     /*  font-family: 'Akaya Kanadaka', cursive;  */
}

.navbar-light .navbar-nav > .active > a, .navbar-light .navbar-nav > .active > a:hover, .navbar-light .navbar-nav > .active > a:focus {
 
  /*
  color: #e5dbdb;
  */
  color: rgba(254,157,151);
  background-color: #2f6069;
 
}
 
.navbar-light .navbar-nav > .open > a, .navbar-light .navbar-nav > .open > a:hover, .navbar-light .navbar-nav > .open > a:focus {
 
  color: #1d3235;
 
  background-color: #425766;
 
}
.nav-item {
max-width: 280px;
}
 
.navbar {
     padding-left:  0;
}
 
.navbar-light .navbar-toggle .icon-bar {
 
  background-color: #d7e2e9;
 
}
 
.navbar-light .navbar-collapse,
 
.navbar-light .navbar-form {
 
  border-color: #d7e2e9;
 
}

#smugsite{
    height=800px;    /* default height */
}
iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

.output {
    background: #eee;
}

 
 
.navbar-toggler{
/*
border:3px solid transparent;border-radius:.55rem;
*/
	  /*
          border-width: 3px 8px 3px 8px;
	  */
	  opacity: 0;
          border-width: 5px 11px 5px 3px;
     color:rgba(245, 105, 124,1);
     border-color:rgba(220, 201, 116,.8);
     animation-name: hamburger;
     animation-delay: 1s;  
     animation-duration: 22s;	
     animation-iteration-count: infinite;
 }



.navbar-toggler-icon{display:inline-block;
 width:2.5em;
 height:2.5em;
 vertical-align:middle;
 content:"";
 background:no-repeat center center;
 background-size:100% 100%;
          border-radius: 5% 75% 5% 99%/99% 79% 15% 45%;  
          -webkit-border-radius: 5% 75% 5% 99%/99% 79% 15% 45%;  
          -moz-border-radius: 5% 75% 5% 99%/99% 79% 15% 45%;  
 }



/* -----------------------------------animations------------------------ */



@keyframes hamburger {   
       0%,50%,100% {   
	  opacity: 1.0;
          border-width: 4px 9px 5px 4px;
          border-radius: 9% 75% 9% 99%/99% 79% 15% 45%;  
          -webkit-border-radius: 9% 75% 9% 99%/99% 79% 15% 45%;  
          -moz-border-radius: 9% 75% 9% 99%/99% 79% 15% 45%;  
	  /*
          padding: 7px 7px 11px 7px;
	  */
          margin: 6px auto 5px auto;
       } 
       25%,75% {    
          border-width: 9px 6px 8px 5px;
          border-radius:  65% 5% 89% 5% /69% 15% 85% 89%;  
          -webkit-border-radius:  65% 5% 89% 5% /69% 15% 85% 89%;  
          -moz-border-radius:  65% 5% 89% 5%/69% 15% 85% 89%;  
	  /*
          padding: 6px 5px 10px 5px;
	  */
          margin: 4px auto 6px auto;
	  /*
	         top right bottom left
          margin: 1px auto 33px auto;
	  */
       }
}


@keyframes move_it {
     from {   
	  opacity: 0.2;
  	  margin-left: 300px;
	  /*
          padding-left: 200%;
	  */
          }
     to  {   
	  /* 
	  padding-left: 0%;
	  */
  	  margin-left: 20px;
	  opacity: 1;
          }
}

@keyframes breathe {   
       0%,50%,100% {   
	  /*
          border-radius: 18% 25% 18% 15% / 15% 25% 12% 18% ;
          border-radius:  23%  /  17% ;
	  */
          border-width: 10px 16px 16px 8px;
          border-radius: 5% 75% 15% 99%/99% 79% 15% 60%;  
          -webkit-border-radius: 5% 75% 15% 99%/99% 79% 15% 60%;  
          -moz-border-radius: 5% 75% 15% 99%/99% 79% 15% 60%;  
          padding: 7px 7px 11px 7px;
          margin: 6px auto 5px auto;
       } 
       25%,75% {    
          border-width: 16px 14px 10px 9px;
	  /*
          border-radius:  19%  /  24%  ;
	  */
          border-radius:  75% 5% 99% 5% /79% 15% 85% 99%;  
          -webkit-border-radius:  75% 5% 99% 5% /79% 15% 85% 99%;  
          -moz-border-radius:  75% 5% 99% 5%/79% 15% 45% 89%;  
          padding: 6px 5px 12px 5px;
          margin: 4px auto 6px auto;
	  /*
	         top right bottom left
          margin: 1px auto 33px auto;
	  */
       }
}