/* unvisited link */
a:link {
    color: #c8981e;/* GOLDEROT text-decoration: none;/* #357203; green - was black*/
    padding-right: 20px;
}

/* visited link */
a:visited {
    color: #c8981e ; text-decoration: none;/* #093246 dark blue*/
}

/* mouse over link */
a:hover {
    color: #c8981e; /*green black#19597b;*/
}

/* selected link */
a:active {
    color: #19597b;text-decoration: none;
}

.hvcenter {
   
    margin: auto;
    width: 50%;
    border: 3px solid green;
    padding: 10px;
    text-align: center;

 }

.parent {
  background-image: url(../img/sneekpick1.jpg);
  background-repeat: no-repeat;
  /*background-size: cover; 100% 100%;*/
  background-size: cover;
  min-width: 213px; /* 273 341*/
  min-height: 220px; /* 280 384 768
  max-height: 768px;*/
  border: 0px solid blue;
  margin:0 auto;
  text-align:center;
  color: white;
}

.child {
  width: 40%;
  min-height: 40px;
  border: 2px solid #ffcc66;
  margin:0 auto;
  margin-top: 25%;
  background-color: white;
  color: black;
  text-align:center;
}


.maincontainer{
  padding-top: 0px;
  top:0px;
  width: 100%;
  height: auto;
  background-color: white;
  border: 1px solid #ffcc66;
  text-align:center;
}

.mainpic{
  margin-left: 0%;
  width: 100%;
  min-width: auto;
  height: inherit;
  background-color: #858585;
  border: 2px solid darkblue ;
}


.menupic{
  display: inline-block;
  padding-left: 0px;
  margin-left: 0%;
  margin-bottom: 1%;
  margin-top: 1%;
  /*was 273 349px  */
  width: auto;
  max-width: 70px; /*was 120  60 153px 192  178px*/
  min-width: 20px; 
  height: auto; /* 68,12 */
  color: darkblue;
  background-color:white; 
   /*background-color: white; #404040;  Dark grey 25%*/
  border: 1px solid darkblue;
  text-align: center;
}

.description{
  margin-left: 0%;
  margin-top: 0%;
  width: 100%;
  min-width: auto;
  background-color: white;
  border: 1px solid #ffcc66 ;
}

/*USE TO RESIZE SMALL IMAGES*/
img.resize_imgs{
    width: 100%;
    height: auto;
}


/* SECTION FOOTER( */
/* -------------- */

.bfooter{
    position: none;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: black; 
    color: grey;/*yellow*/
    text-align: center;
}


/* SECTION NAVEGATION *
/*--------------------*/

.navcenter{
  /*padding-left: 10%; move it to the left or center */
  width: 100%;
  font-family: 'Lato', sans-serif; /*was 'Steiner'; navegation bar*/
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  /*background-image: url(../img/bgbl.jpg);*/
  background-color: white;
  opacity: 0.90;
  filter: alpha(opacity=90); /* For IE8 and earlier */
  position: fixed;
}

.nav_info{
  /*padding-left: 10%; move it to the left or center */
  width: 100%;
  background-color: white;
  font-family: 'Lato', sans-serif; /*was 'Steiner'; navegation bar*/
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  max-height: 280px;
  text-align: left;
  padding-top: 5px; /*5%*/
  padding-left: 1%;
  /*background-image: url(../img/bgbl.jpg);
  position: fixed;*/
}

.topnav {
/*width: 100%;*/
overflow: hidden;
padding-top: 0%;
/*background-color: #444;*/
padding-right: 1%; /*10% 50px;*/
/*position: fixed;  Make it stick, even on scroll */
}

.topnav a {
  float: left; /* was right*/
  display: block;
  color: #e69900; /*#f2f2f2; */
  text-align: center;
  padding: 10px 16px; /* was 14change the nav bar hight +or- , change width +or -*/  
  text-decoration: none;
  font-size: 18px;
}

.topnav a:hover {
  background-color: black; /*was ddd; 1591ae blue*/
  color: #e69900; 
}

.topnav .icon{
  display: none;
}

/*was originaly @media screen and (max-width: 780px) {*/

@media screen and (max-width: 780px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: left;/*was right*/
    top: 0;
    display: block;
  }
}

@media screen and (max-width: 780px) {
  .topnav.responsive {position: relative;}
  .icon.topnav.responsive {
    position: absolute;
    left: 0;/*was left: 0; */
    top: 0; /*change position of the icon sandwich*/
  }

.topnav.responsive a {
    float: none; /*was none*/
    display: block;
    top: 0px; /*change position of */
    text-align: left; /*change the position of the sandwich menu*/
  }


/*USE TO RESIZE ANY IMAGE*/
img.resize_img{
    max-width: 100%;
    height: auto;

}

/* SECTION BOX1( MAIN BODY) */
/* -------------- */
.mainbox1{
  float: left;
  top: 20px; /*5%*/
  background-color:red; 
  width: auto;
  height: auto;
  padding-top: 20px;
  
 /*background-image: url('img/sneekpick1.jpg');*/
}
/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}