*{margin: 0px; padding: 0px;}

@font-face {
    font-family: 'bebasregular';
    src: url('font/BEBAS___-webfont.eot');
    src: url('font/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/BEBAS___-webfont.woff') format('woff'),
         url('font/BEBAS___-webfont.ttf') format('truetype'),
         url('font/BEBAS___-webfont.svg#bebasregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

html{background-color: #171717;}

body{font-size: 15px;
     color: #171717; /*3e310d*/
     font-family: "Century Gothic",CenturyGothic,AppleGothic,Helvetica,Arial,sans-serif;
     line-height: 175%;
     margin-left: 0px;
     margin-right: 0px;
    }


/*STRUCTURE*/

#header{position: relative; clear: both; overflow: hidden; height: 174px; background-color: #FFFFFF; background-image: url('images/gradient_Header.jpg'); background-repeat: repeat-x;}
.innerWrapper{position: relative; width: 1020px; margin-left: auto; margin-right: auto;}
.innerPadding{padding: 25px;}
.innerPadding2{padding: 15px;}

#logo{position: absolute;  top: 0px; width: 240px; height: 174px; background-image: url('images/logo_ErongoTaxidermy.jpg'); background-repeat: no-repeat;}

#titleTxt{position: absolute; top: 28px; margin-left: 240px; padding-top: 52px; width: 315px; font-size: 12px; background-image: url('images/logoTxt.gif'); background-repeat: no-repeat; line-height: 100%;}

/*#titleTxt p{font-size: 32px; line-height: 120%; border-style: solid; border-width: 0px 0px 1px 0px; border-color: #ccb88e; margin-bottom: 5px;}*/

.contentDiv{background-image: url('bg_Content.jpg'); overflow: hidden;}

.contentTan{clear: both; background-color: #9f8c64; padding-bottom: 20px; background-image: url('images/bg_Tan.jpg'); background-repeat: repeat-x; overflow: hidden;}


/*NAVIGATION*/

#navWrapper{clear: both; height: 58px; margin-top: 116px; background-image: url('images/bg_Nav.jpg'); background-repeat: repeat-x;}
#navDiv{float: right; margin-top: 18px; margin-right: 5px;}

#subNavDiv{position: absolute; right: 5px; margin-top: 70px;}

#buttonMenu{position: relative; height: 30px; cursor: pointer; cursor: hand; display: none;}

#buttonMenu{padding: 10px; background-color: #d06900; text-align: right; padding-right: 10px; font-weight: bold; overflow: hidden;}
#mobileNavDiv{padding: 10px; background-color: #d07518; overflow: hidden; display: none;}
.mobileCol{float: left; width: 40%; margin-right: 8%;}


a.nav{display: block; float: left; background-color: transparent; font-family: bebasregular, sans-serif; font-size: 16px; color: #FFFFFF; padding: 1px 12px 12px 12px; background-image: url('images/divider.gif'); background-repeat: no-repeat; background-position: top right;}
a.nav:link {color: #FFFFFF;} 
a.nav:visited {color: #FFFFFF;}
a.nav:active {color: #FFFFFF;}
a.nav:hover {color: #000000;}

a.navLive{display: block; float: left; background-color: transparent; font-family: bebasregular, sans-serif; font-size: 16px; color: #eaa500; padding: 1px 12px 12px 12px; background-image: url('images/divider.gif'); background-repeat: no-repeat; background-position: top right;}
a.navLive:link {color: #eaa500;} 
a.navLive:visited {color: #eaa500;}
a.navLive:active {color: #eaa500;}
a.navLive:hover {color: #eaa500;}

a.navSub{display: block; float: left; background-color: transparent; font-size: 15px; color: #322813; font-weight: bold; padding: 4px 6px 8px 6px;}
a.navSub:link {color: #322813;} 
a.navSub:visited {color: #322813;}
a.navSub:active {color: #322813;}
a.navSub:hover {color: #cc6200;}

a.navSubLive{display: block; float: left; background-color: transparent; font-size: 15px; color: #322813; font-weight: bold; padding: 4px 6px 8px 6px; text-decoration: underline;}


a.navSubContact{display: block; float: left; margin-left: 8px; background-color: #cab68c; font-size: 15px; color: #FFFFFF; font-weight: bold; line-height: 120%; padding: 5px 10px 5px 10px; border-style: solid; border-color: #3e310d; border-width: 2px; border-radius: 6px;}
a.navSubContact:link {color: #FFFFFF;} 
a.navSubContact:visited {color: #FFFFFF;}
a.navSubContact:active {color: #FFFFFF;}
a.navSubContact:hover {color: #FFFFFF; background-color: #322813;}

a.navMobile{display: block; background-color: #d07518; font-size: 15px; color: #322813; font-weight: bold; line-height: 130%; padding: 6px 8px 6px 8px; margin-bottom: 0px; border-style: dotted; border-width: 0px 0px 1px 0px; border-color: #a04300;}
a.navMobile:link {color: #322813;} 
a.navMobile:visited {color: #322813;}
a.navMobile:active {color: #322813;}
a.navMobile:hover {color: #322813; background-color: #d08437;}

a.navMobileLive{display: block; background-color: #d07518; font-size: 15px; color: #FFFFFF; font-weight: bold; line-height: 130%; padding: 6px 8px 6px 8px; margin-bottom: 0px; border-style: dotted; border-width: 0px 0px 1px 0px; border-color: #a04300;}
a.navMobileLive:link {color: #FFFFFF;} 
a.navMobileLive:visited {color: #FFFFFF;}
a.navMobileLive:active {color: #FFFFFF;}
a.navMobileLive:hover {color: #FFFFFF; background-color: #d08437;}

/*BASIC*/
h1{font-family: "Century Gothic",CenturyGothic,AppleGothic,Helvetica,Arial,sans-serif; font-weight: normal;  color: #FFFFFF; font-size: 30px; line-height: 120%; margin-top: 0px; margin-bottom: 20px; border-style: solid; border-color: #FFFFFF; border-width: 0px 0px 1px 0px; padding-bottom: 8px;}

h2{ font-family: bebasregular, sans-serif; font-size: 22px; text-align: left; margin-top: 30px; margin-bottom: 20px; padding-bottom: 20px; border-style: solid; border-width: 0px 0px 2px 0px; border-color: #72613b;}

h3{ font-family: bebasregular, sans-serif; font-size: 16px; margin-top: 30px; margin-bottom: 20px;}


p{
    color: #171717; /*3e310d*/
    font-size: 15px;
     font-family: "Century Gothic",CenturyGothic,AppleGothic,Helvetica,Arial,sans-serif;
     line-height: 175%;
     margin-bottom: 18px;
}

p.blocSpacer{margin: 77px 0px 20px 0px; border-style: solid; border-width: 2px 0px 0px 0px; border-color: #72613b;}

.small{font-size: 10px;}

ul{padding-left: 30px;}

img.content{border-style: solid; border-color: #3e310d;}
img.vertical{vertical-align: middle; margin-right: 10px; margin-bottom: 3px;}

a.img{border-style: none; outline: none;}

/*Blocs*/
.bloc{width: 29.5%; float: left; margin-right: 3%; text-align: justify;}

.blocPic{width: 75%; text-align: justify;}
.subImages{float: right; width: 20%; margin-top: 60px;}
.subImages img{width: 100%;}

.colImg{width: 100%; margin-left: auto; margin-right: auto;}


/*Pics*/
.blocManyPics{clear: both; width: 100%; border-style: solid; border-color: #000000; border-width: 3px 0px 3px 0px; margin: 25px 0px 25px 0px; padding: 25px 0px 25px 5px; text-align: left;}
.picThird{width: 32%; margin-right: 1%; margin-bottom: 5px;}

/*Columns - contact page*/
.blocCol{float: left; width: 55%; text-align: justify; margin-right: 40px;}
.col3{float: right; width: 35%; margin-top: 60px; text-align: center;}



/*map*/
#bingMap{width: 100%;  overflow: hidden; margin-left: 0px; margin-right: 0px;}
#bingMap iframe{height: 280px;}

blocFull{width: 100%;}

/* Google maps */
.googleMaps {
  position: relative;
  margin-top: 0px;
  width: 100%; margin-left: auto; margin-right: auto;
  padding-bottom: 80%; /*This is the aspect ratio 56.25*/
  height: 0;
  overflow: hidden;
}
.googleMaps iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/*ul*/

/*Forms*/
label{display: block; color: #FFFFFF; font-size: 14px;}
input{width: 90%; padding: 8px; border-radius: 5px;}
textarea{width: 90%; padding: 8px; border-radius: 5px;}
fieldset{border-style: none; margin-bottom: 15px;}


.error2{font-size: 11px; color: #e66857;}
.throw_error{color: #FFFFFF; font-size: 12px; padding-bottom: 10px;}
.smallError{font-size: 11px; color: #e66857;}
#message{color: #FFFFFF; font-size: 12px; padding-bottom: 10px;}
.checkmark{padding-top: 10px;}


/*LINKS*/

/* gold to black */
a{color: #51421e; font-family: "Century Gothic",CenturyGothic,AppleGothic,Helvetica,Arial,sans-serif; font-size: 15px; text-decoration: none; font-weight: bold;}
a:link {color: #51421e;} 
a:visited {color: #51421e;}
a:active {color: #51421e;}
a:hover {color: #171717;}

/* gold to light */
a.alt{color: #51421e; font-family: "Century Gothic",CenturyGothic,AppleGothic,Helvetica,Arial,sans-serif; font-size: 15px; text-decoration: none; font-weight: bold;}
a.alt:link {color: #51421e;} 
a.alt:visited {color: #51421e;}
a.alt:active {color: #51421e;}
a.alt:hover {color: #bba77e;}

/* gold to black -small */
a.small{color: #51421e; font-family: "Century Gothic",CenturyGothic,AppleGothic,Helvetica,Arial,sans-serif; font-size: 12px; text-decoration: none; font-weight: bold;}
a.small:link {color: #51421e;} 
a.small:visited {color: #51421e;}
a.small:active {color: #51421e;}
a.small:hover {color: #171717;}


/*IntroBloc*/
#introDiv{position: absolute; margin-top: 20px; width: 50%; left: 0px; margin-left: 20px; color: #FFFFFF; background-image: url('images/bg_Intro.png'); z-index: 100;}
#introDiv2{position: absolute; margin-top: 80px; width: 50%; left: 0; margin-left: 20px; color: #FFFFFF; background-image: url('images/bg_Intro.png'); z-index: 100;} /* bit lower*/
#introDiv3{position: display; margin-top: 20px; width: 100%; margin-left: 0px; color: #FFFFFF; background-image: none; z-index: 100; text-align: center; overflow: hidden;}
#introDiv3 div.innerPadding{padding: 10px;}
#introDiv3 h1{width: 50%; text-align: center; margin-top: 0px; margin-left: auto; margin-right: auto; margin-bottom: 0px;}
#introDiv p, #introDiv2 p{color: #FFFFFF; font-size: 15px;}

/*Footer*/
#Footer{height: 150px; padding-top: 30px;}
#Footer p{color: #7c6e51; font-size: 14px;}

#Footer span{font-size: 13px;}

/* SLIDE*/
/*Slide show */
#slideDiv{width: 830px; height: 434px; margin-left: 230px;} 

/*! http://responsiveslides.com v1.54 by @viljamis */

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }


/* COOKIE BANNER */
#cookieBanner{position: fixed;
  bottom: 0px;
  width: 100%;
  padding: 10px 14px 5px 16px;
  background-color: rgba(0, 0, 0, 0.7);
  /* border-style: solid; border-width: 1px 0px 0px 0px; border-color: #FFFFFF; */
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
  z-index: 1011;
}
#cookieBanner p{margin: 0px; padding: 15px; color: #FFFFFF; font-size: 13px;}
#cookieBanner p.cookieButtons{margin: 0px; padding: 0px 15px; color: #FFFFFF;}
#cookieBanner button{margin: 0px; padding: 5px 15px 8px 15px; border-radius: 8px; cursor: pointer; cursor: hand; background-color: #666666; font-size: 16px; color: #FFFFFF; border-width: 0px; transition: all .3s;}
#cookieBanner button:hover{background-color: #aaaaaa;}
#cookieBanner button.accept{margin: 0px; padding: 5px 15px 8px 42px; color: #FFFFFF; background-color: #ca5e00; border-width: 0px; background-image: url('images/icon_Cookie.png'); background-repeat: no-repeat; background-position: 12px center;}
#cookieBanner button.accept:hover{background-color: #ee6f00;}
button.accept{margin: 0px; padding: 5px 15px 8px 42px; border-radius: 8px; cursor: pointer; cursor: hand; background-color: #ca5e00; font-size: 16px; color: #FFFFFF;  border-width: 0px; background-image: url('../images/icon_Cookie.png'); background-repeat: no-repeat; background-position: 12px center; transition: all .3s;}
button.accept:hover{background-color: #ee6f00;}

.cookieHide{display: none;}
.cookieShow{display: block;}


button.cookieChange{margin: 0px; padding: 5px 15px 8px 15px; border-radius: 8px; cursor: pointer; cursor: hand; background-color: transparent; font-size: 14px; color: #FFFFFF; border-style: solid; border-width: 1px; border-color: #FFFFFF; transition: all .3s;}
button.cookieChange:hover{background-color: $color-red;}


/* footer */
#Footer{background-image: url('images/gradient_Footer.jpg'); background-repeat: repeat-x;}
#logos{float: right; height: 110px; overflow: auto;}
#logos img{float: right; margin-left: 15px; margin-right: 0px;}

