/* MEDIA QUERIES ****************************************************************************/

@media (max-width:1020px)
{

/*innerWrapper*/
.innerWrapper{width: 100%;}


}

@media only screen and (max-width: 960px)
{
  
  /*IntroBloc*/
#introDiv, #introDiv2{position: relative; width: 90%; margin-top: 20px; margin-left: auto; margin-right: auto; }
/*Slide show */
#slideDiv{width: 90%; height: auto; margin-left: -30px; margin-right: auto;}
 
}


@media only screen and (max-width: 900px)
{

/*NAV*/
#navDiv{display: none;}
#subNavDiv{display: none;}
#buttonMenu{display: block;}

  /*Blocs*/
.blocPic{width: 70%; text-align: justify;}

/*Pics*/
.picThird{width: 31%; margin-right: 1.5%;}

}
  
 
@media only screen and (max-width: 850px)
{



}



@media only screen and (max-width: 800px)
{

  /*Blocs*/
.blocPic{width: 65%; text-align: justify;}
.subImages{float: right; margin-top: 60px; width: 27%}
.subImages img{width: 100%;}



}



@media only screen and (max-width: 750px)
{
  


  
}


@media only screen and (max-width: 700px)
{
  

/*Blocs*/
.bloc{width: 100%; float: none; margin-right: 3%; text-align: justify;}
p.blocSpacer{margin: 0px; border-style: none;}

.blocPic{width: 100%; text-align: justify;}
.subImages{float: none; margin-top: 20px; padding-top: 20px; width: 100%; text-align: center; border-style: solid; border-width: 1px 0px 0px 0px; overflow: hidden;}
.subImages img{width: 50%;}

/*Columns - contact page*/
.blocCol{float: none; width: 100%; text-align: justify; margin-right: 0px;}
.col3{float: none; width: 100%; margin-top: 60px;}

.colImgDiv{width: 100%; text-align: center;}
.colImg{width: 80%; margin-left: auto; margin-right: auto;}

/*map*/
#bingMap{width: 100%;  overflow: hidden; margin-left: auto; margin-right: auto;}
#bingMap iframe{height: 280px;}

/* footer  logos*/
#Footer p{text-align: center;}
#logos{float: none; width: 100%; height: auto; margin-bottom: 50px; text-align: center; overflow: auto;}
#logos img{float: none; margin-left: 5px; margin-right: 5px;}

}


@media only screen and (max-width: 580px)
{
  
#header{height: 280px; background-position: 0px 110px;}
#navWrapper{clear: both; height: 58px; margin-top: 52px; background-image: url('images/bg_Nav.jpg'); background-repeat: repeat-x;}
#logo{position: relative;  top: 110px; width: 240px; height: 174px; background-image: url('images/logo_ErongoTaxidermy.jpg'); background-repeat: no-repeat; margin-left: auto; margin-right: auto;}
#titleTxt{position: absolute; top: 18px; margin-left: 0px; padding-top: 52px; width: 100%; font-size: 12px; text-align: center; background-position: center;}
/*#titleTxt p{width: 100%; font-size: 32px; line-height: 160%; text-align: center; border-style: solid; border-width: 0px 0px 1px 0px; border-color: #ccb88e; margin-bottom: 5px;}


   /*IntroBloc*/
  #introDiv, #introDiv2{position: relative; width: 90%; margin-top: 20px; margin-left: auto; margin-right: auto; }
  #introDiv p, #introDiv2 p{color: #FFFFFF; font-size: 15px;}
  #slideDiv{width: 100%; height: auto; margin-left: -40px; margin-right: auto;}
  
/*Pics*/
.blocManyPics{text-align: center;}
.picThird{width: 60%; margin-bottom: 5px; margin-right: 0%;}

}


@media only screen and (max-width: 500px)
{
 /*STRUCTURE*/ 
.innerPadding{padding: 15px;}
.innerPadding2{padding: 10px;}


/*mobile menu*/
.mobileCol{float: left; width: 45%; margin-right: 3%;}

/*logoTitle
#titleTxt{position: absolute; top: 0px; margin-left: 0px; width: 100%; font-size: 12px; text-align: center;}
#titleTxt p{width: 100%; font-size: 32px; line-height: 130%; text-align: center; border-style: solid; border-width: 0px 0px 1px 0px; border-color: #ccb88e; margin-bottom: 5px;}*/

/*Pics*/
.picThird{width: 80%; margin-right: 0%;}

.colImg{width: 100%;}

}


@media only screen and (max-width: 380px)
{
  
/*header*/
#titleTxt{background-image: url('images/logoTxtSmall.gif');}
  
/*Blocs*/
.blocPic{width: 100%; text-align: justify;}
.subImages{float: none; margin-top: 20px; width: 100%; text-align: center; overflow: hidden;}
.subImages img{width: 80%;}



/*Pics*/
.picThird{width: 90%; margin-right: 0%;}

   /*IntroBloc*/
  #slideDiv{width: 100%; height: auto; margin-left: -30px; margin-right: auto;}

}

@media only screen and (max-width: 350px)
{
  
/*Pics*/
.picThird{width: 100%; margin-right: 0%;}

}


@media only screen and (max-width: 250px)
{
  
  /*Blocs*/
.subImages img{width: 95%;}

   /*IntroBloc*/
  #slideDiv{width: 100%; height: auto; margin-left: -10px; margin-right: auto;}

}