@charset "utf-8";
/* CSS Document */
/*
 GOLD = hsla(38, 83%, 32%, 1) rgba(189, 137, 58, 1) #bd893a  
*/
@import url('html5reset.css');
@import url('grid8.css');
@import url('grid12.css');
@import url('grid_venkatesa.css');
@import url('typo.css');
@import url('font_formata.css');
@import url('font_formata_cond.css');
@import url('font_optima_std.css');
@import url('font_opensans.css');
@import url('font_fluppie.css');
@import url('typewriter_elegant.css');
@import url('fontawesome/css/all.css');
/* - --------------------- - */
html, body {
  height: 100%;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
  font-family: "typewriter_elegant", Helvetica, Arial, sans-serif;
  
}
/* - --------------------- - */
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
ul li {
  margin: 0;
  padding: 0;
}
/* - --------------------- - */
a {
  text-decoration: none;
  position: relative;
}
a:after {
  transition: 1s;
  content: "";
  position: absolute;
  width: 0;
  height: 1px;
  background: brown;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, -50%);
}
a:hover:after {
  width: 100%;
}
/* - --------------------- - */
a.link {
  color: brown;
}
a.link:hover {
  color: #bd893a;
}
/* - --------------------- - */
a {
  text-decoration: none;
}
a {
  color: maroon;
}
a:hover {
  color: brown;
}
/*======================*/
ul#navi {
  /*list-style: none;
  width: 7rem;*/
}
ul#navi li {
  /* display: inline;
  width: 7rem;*/
}
ul#navi li a {
  text-decoration: none;
  /* display: block;
  width: 7rem;
  padding-left: 1rem;  */
  color: #bd893a;
}
ul#navi li a:hover {
  color: #DCC6A5;
  transition: all 1s;
}
ul#navi li a.active {
  padding-left: 1rem;
  color: white;
}
img {
  max-width: 100%;
  height: auto;
}


 


/*==============================*/
.ToTop {
  width: 9rem;
  border-radius: 5px;
  height: 1.5rem;
  line-height: 1.5rem;
  position: fixed;
  top: 50%;
  right: 1rem;
  z-index: 9;
  cursor: pointer;
  transition: all 1s;
  background: #bd893a;
  text-align: center;
  font-family: "formata_cond", Georgia, "Times New Roman", Times, serif;
  font-weight: 600;
}
a.ToTop {
  text-decoration: none;
  color: maroon;
}
a.ToTop:hover {
  color: linen;
}
.ToBottom {
  width: 9rem;
  border-radius: 5px;
  height: 1.5rem;
  line-height: 1.5rem;
  position: fixed;
  top: 40%;
  right: 1rem;
  z-index: 9;
  cursor: pointer;
  transition: all 1s;
  background: #bd893a;
  text-align: center;
  font-family: "formata_cond", Georgia, "Times New Roman", Times, serif;
  font-weight: 600;
}
a.ToBottom {
  text-decoration: none;
  color: maroon;
}
a.ToBottom:hover {
  color: linen;
}

/*==============================*/