/*
Theme Name: Beyond The Range
Theme URI: http://www.australianforge.com.au
Description: This theme has been designed by Central Web Services.
Version: 1.0
Author: Central Web Services.
Author URI: http://www.centralwebservices.com.au
*/

/*
red: #bf1e2e
gold: #daa520;
*/

@font-face {
	font-family: 'Nexa Light';
	src: url('fonts/nexa-light.eot');
	src: url('fonts/nexa-light.eot?#iefix') format('embedded-opentype'),
	     url('fonts/nexa-light.woff') format('woff'),
	     url('fonts/nexa-light.ttf') format('truetype'),
	     url('fonts/nexa-light.svg#ywftsvg') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'Nexa Bold';
	src: url('fonts/nexa-bold.eot');
	src: url('fonts/nexa-bold.eot?#iefix') format('embedded-opentype'),
	     url('fonts/nexa-bold.woff') format('woff'),
	     url('fonts/nexa-bold.ttf') format('truetype'),
	     url('fonts/nexa-bold.svg#ywftsvg') format('svg');
	font-weight: normal;
	font-style: normal;
}



.width-value {
position: fixed;
bottom: 0px;
background-color: #CCC;
border: 0px solid #C00;
width: 100px;
display: none;
}


* {
margin: 0px;
padding: 0px;
	}

body {
position: relative;
background-color: #000055;
/* font-family: 'Nexa Light', Helvetica, Arial, Sans-Serif; */
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
}

/*
        header{
            position: fixed;
            width: 100%;
            text-align: center;
            font-size: 72px;
            line-height: 108px;
            height: 108px;
            background: #335C7D;
            color: #fff;
            font-family: 'PT Sans', sans-serif;

            // set animation
            -webkit-transition: all 0.4s ease;
            transition: all 0.4s ease;
        }

        header.sticky {
            font-size: 24px;
            line-height: 48px;
            height: 48px;
            background: #efc47D;
            text-align: left;
            padding-left: 20px;
        }
 */




/* HEADER */
#header_outer {
	position: absolute;
	top: 0px;
	width: 100%;
	border-top: 0px solid #daa520;
	height: 125px;
	border: 0px solid #0F0;

z-index: 99;

}

#header {
position: relative;
margin: 0 auto;
height: 125px;
width: 944px;
border: 0px solid #0F0;
	}

#header.single_search {
	background-image: url(images/single_header_image.jpg);
}

	#header h1{
display: block;
position: absolute;
top: 10px;
left: 45px;
width: 255px;
height: 95px;
border: 0px solid #0F0;

	}

	#header h1 a{
display: block;

width: 255px;
height: 95px;
border: 0px solid #0F0;
background-image: url(images/BeyondtheRange_logo.png);

    background-repeat: no-repeat;
text-indent: -9000px;
z-index: 0;
	}
	
		#header #tagline{
display: block;
position: absolute;
top: 25px;
right: 45px;
width: 520px;
height: 80px;
border: 0px solid #0F0;
text-align: left;
font-size: 27px;
line-height: 27px;
color: #FFF;
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
letter-spacing: 1px;
	}
	#header #tagline div{
		text-align: right;
		font-weight: 500;
		font-size: 54px;
		line-height: 54px;
		letter-spacing: 1px;
		text-transform: uppercase;
	}
	
	#header #tagline div.small{
	font-size: 45px;	
	}
	
#hp_slider_outer {
	display: block;
	width: 100%;
height: 579px;
	border: 0px solid #9cf;
    margin-top: 0px;
}
	
	
#hp_slider {
position: relative;
margin: 0 auto;
height: 579px;
width: 944px;
background-color: #73A8D7;
border: 0px solid #9cF;
border-radius: 0px;
	}
	
#hp_slider_outer.filler,
#hp_slider.filler{
height: 120px;	
}
	

#hp_map_con {
    border: 0px solid #C00;
    float: left;
    height: 430px;
	width: 685px;
    
    position: absolute;
    top: 125px;
    left: 15px;
    z-index: 99;

	background-image: url(images/map_nodots.png);
    
    background-repeat: no-repeat;
}

#hp_box_con {
    border: 0px solid #9cf;
    float: left;
    height: 340px;
	width: 230px;
    
    position: absolute;
    top: 130px;
    right: 0px;
    z-index: 98;
	background-color:rgba(255, 255, 255, 0.9);

}

	 a.town {
   display:block;
   position: absolute;
   z-index: 99;	
   text-transform: uppercase; 
   font-size: 15px;
   font-weight: bold;
   color: #666;
   text-decoration: none;
	 }
	 
	    a.town span{
		border: 0px solid #FA9; 
		width: 50px;
		height: 75px;
		display: none; 
		background-image: url(images/map_pindrop.png);
		margin: -75px auto 0px auto;
		
	   }
	 
	  a.town:hover,
	  a.town.active {
     color: #F3913E;
	display: block; 
	  }
	  
    a.town:hover span,
	a.town.active span{
		display: block;
		z-index: 100; 
	   }
		
		
		.box {
    display: none;
	   position: absolute;
	   right: -235px;
	   top: 20px;
   z-index: 99;
  
   width: 205px;
   height: 320px;
   border: 0px solid #C00;
}

		.box.default,
		.box.active{
    display: block;
}

.box strong{
	font-size: 15px;
	float: left;
	width: 100%;
	text-transform: uppercase;
	letter-spacing: 0px;
	text-align:left;
	margin: 0px 0px 12px 0px;
}

.box p {
font-size: 13px;
margin: 0px 0px 7px 0px;	
}

/* Slider */

 a.town.bathurst{
	/* 
    top: 192px;	
    left: 489px; 
	*/ 
	top: 44.65%;	
    left: 71.38%; 
 }
 a.town.blayney{
	 /*
    top: 210px;	
    left: 446px; 
	*/ 
    top: 48.83%;	
    left: 65.10%; 
 }
 a.town.canowindra{
	 /*
    top: 214px;	
    left: 330px;
	*/  
    top: 49.76%;	
    left: 48.17%;
 }
 a.town.condobolin{
	
    top: 33.25%;	
    left: 16.78%; 
	  
 }
 a.town.cowra{
	 /*
    top: 254px;	
    left: 359px;
	*/ 
	top: 59.06%;	
    left: 52.40%; 
 }
 a.town.forbes{
	 /*
    top: 188px;	
    left: 260px;
	*/ 
	top: 43.72%;	
    left: 37.95%; 
 }
 a.town.grenfell{
	 /*
    top: 264px;	
    left: 272px;
	*/ 
	top: 61.39%;
	left: 39.7%;
	 
 }
 a.town.lake-cargelligo{
	top: 43.35%; 
	left: 9.48%; 
 }
 a.town.lithgow{
	 /*
    top: 203px;	
    left: 568px;
	*/
	top: 47.20%;	
    left: 82.91%;    
 }
 a.town.molong{
	 /*
    top: 142px;	
    left: 370px;
	*/ 
	top: 33.02%;	
    left: 54.01%;  
 }
 
  a.town.oberon {
	  /*
    top: 235px;	
    left: 534px; 
	*/
	    top: 54.65%;	
    left: 77.95%; 
 }

 a.town.orange{
	 /*
    top: 172px;	
    left: 412px; 
	*/
	top: 40%;	
    left: 60.14% 
 }
 a.town.parkes{
	 /*
    top: 149px;	
    left: 288px;  
	*/
	    top: 34.65%;	
    left: 42.04%; 
 }
 a.town.young{
	 /*
    top: 325px;	
    left: 307px;  
	*/
	top: 75.58%;	
    left: 44.81%;
 }


 

 


#hp_logos_con {

	   position: absolute;
	   right: 0px;
	   top: 480px;
   z-index: 99;
  
   width: 350px;
   height: 60px;
   border: 0px solid #C00;	
}

#hp_logos_con a.centroc{
	float: left;
   width: 90px;
   height: 70px;
   background-image: url(images/centroc_logo.png);
   background-repeat: no-repeat;
   text-indent: -9999px;
   border: 0px solid #0F0;
   margin: -10px 0px 0px 0px;
}

#hp_logos_con a.tourism{
	float: right;
   width: 230px;
   height: 60px;
   background-image: url(images/CNSW_tourism_logo.png);
   background-repeat: no-repeat;
   text-indent: -9999px;
}

.flex-control-nav {
  width: 250px !important;
  height: 1px;
  position: absolute;
  top: 535px;
  right: 5px;
  text-align: right;
   border: 0px solid #0F0;	
   list-style: none;
}



/*
.flex-control-nav{
	position: absolute;
	   right: 0px;
	   top: 540px;
   z-index: 99;
  
   width: 250px;
   height: 60px;
   border: 1px solid #0F0;	
   text-align: right;
}
*/


.flex-control-nav li {
  margin: 0 6px;
  display: inline-block;
  zoom: 1;
  *display: inline;
}
.flex-control-paging li a {
  width: 19px;
  height: 19px;
  display: block;
  background: #FFF;
  /*background: rgba(255, 255, 255, 0.5);*/
  cursor: pointer;

  -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  font-size: 0px;
  line-height: 12px;
}
.flex-control-paging li a:hover {
  background: #9F4997;
  background: rgba(159, 73, 151, 0.7);
}
.flex-control-paging li a.flex-active {
  background: #9F4997;
  background: rgba(159, 73, 151, 0.9);
  cursor: default;
}


/* Content */

#content-outer {
width: 100%;
padding: 0px 0px 0px 0px;

}




#content {

margin: 0 auto;

width: 944px;

border-bottom: 1px solid #E6E4DF;
background-color: #E6E4DF;
}



/*
#content img.wp-post-image{
float: left;
border: 5px solid #FFF;
border-radius: 5px;
 box-shadow:2px 2px 4px 4px #C9C9C9;
 -webkit-box-shadow:2px 2px 4px 4px #C9C9C9;
 -moz-box-shadow:2px 2px 4px 4px #C9C9C9;	
 margin: 0px 20px 0px 0px;
}
*/

#content  #content_col {
	float: left;
width: 650px;
border-right: 2px solid #FFF;
margin: 0px 0px 0px 0px;
padding: 0px 20px 0px 20px;
 box-sizing: border-box;
}


#content h1 {
	font-size: 24px;
	color: #333333;
text-transform: uppercase;	
font-weight: normal;
 margin: 0px 0px 15px 0px;
}


#content h2 {
	font-size: 34px;
	color: #377DBC;
text-transform: uppercase;	
font-weight: 500;
 margin: 15px 0px 15px 0px;
}

#content h3 {
	font-size: 20px;
	color: #000;

font-weight: bold;
margin: 0px 0px 15px 0px;
}


#accordion {
margin-top: 25px;	
}

#accordion h3{
color: #999;
font-weight: normal;	
font-size: 25px;
border-bottom: 1px solid #FFF;
background-image: url(images/DropDown_Arrow.png);
background-position: right;
background-repeat: no-repeat;
margin-bottom: 0px;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 25px;
text-transform: uppercase;
}

#accordion h3.ui-state-hover
{
color: #9F4997;	
cursor: pointer;
}

#accordion h3.ui-state-active
{
color: #9F4997;	
background-image: url(images/DropDown_Arrow_up.png);
}

#accordion .ui-accordion-content {
background-color: #FFF;	
padding: 20px 20px 5px 20px;
}

#accordion .ui-accordion-content h4{
color: #9F4997;
font-weight: normal;	
font-size: 22px;
border-bottom: 0px solid #FFF;
margin-bottom: 0px;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 0px;
text-transform: uppercase;
}


ul#accordion_stories_grid{
float: left;
width: 100%;
list-style-type: none;
padding: 0px;
margin: 0px 0px 0px 0px !important;
}

#accordion_stories_grid li{
float: left;
width: 47%;
margin: 0px 15px 20px 0px;
background-color: #E6E4DF;
height: 420px;
box-sizing: border-box;	
}

#accordion_stories_grid li:nth-child(3n+3){
    clear: left;

}


#accordion_stories_grid li img{
width: 100%;	
}

#accordion_stories_grid li #intro {
padding: 0px 15px 0px 15px;
box-sizing: border-box;	
}

#accordion_stories_grid li h4 {
font-weight: normal;
font-size: 18px;	
text-transform: uppercase;
margin-top: 10px;
}

#accordion_stories_grid li p {
	float: left;
margin-top: 10px !important;	
margin-bottom: 10px !important;
}

#accordion_stories_grid li p a{
color: #333;
}

#accordion_stories_grid li:nth-child(2n+2) {  
  margin-right: 0px;
}

#content iframe {
border: 0px solid #0F0;
width: 100%;
height: 315px;	
}


#content  #sidebar_col
 {
float: right;
width: 290px;
border: 0px solid #C00;
margin: 0px 0px 0px 0px;
 box-sizing: border-box;
 padding: 15px 15px 0px 15px;
}

.sidebar_item {
float: left;
width: 260px;
margin: 0px 0px 15px 0px;
}

.sidebar_item #purple_box{
width: 100%;
min-height: 100px;
background-color: #9F4997;
padding: 10px 20px 20px 20px;
box-sizing: border-box;
color: #FFF;	
}

.sidebar_item #purple_box #phone_icon {
width: 60px;
height: 60px;
border: 0px solid #FFF;
margin: 0px auto 15px auto;
background-image: url(images/icon_phone.png);	
}

.sidebar_item #purple_box strong{
text-transform: uppercase;
font-size: 20px;	
}

.sidebar_item #purple_box p{
margin: 0px 0px 15px 0px;
}

.sidebar_item #purple_box p a{
color: #FFF;	
}

.sidebar_item form{
float: left;
width: 100%;
background-color: #FFF;	
height: 45px;
margin: 0px;
padding: 0px;
}

input#s {
float: left;
width: 200px;
border: 0px solid #CCC;
height: 45px;	
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
color: #666;
font-size: 16px;
margin: 0px 0px 0px 10px;
}

input#searchsubmit {
float: left;
width: 44px;
height: 45px;
border: none;
background-image: url(images/Search_MagnifyingGlass.png);
margin:	 0px 0px 0px 0px;
text-indent: -9999px;
background-color: #FFF;
}

input#searchsubmit:hover {
cursor: pointer;	
}

#advert_slider ol.flex-control-nav {
	border: 0px solid #C00;
	position: absolute;
top: 440px !important;
width: 260px; !important	
}

#advert_slider {
border: 0px solid #C00;
padding: 0px 0px 50px 0px;
height: 430px;	
background-color: transparent;
}

#content #content_col p{
font-size: 15px;
color: #362f2d;
margin: 0px 0px 25px 0px;
line-height: 22px;
}

#content #content_col ul{
font-size: 15px;
color: #362f2d;
margin: 0px 0px 25px 65px;
line-height: 22px;
}

#content #content_col img.alignleft{
float: left; 	
margin: 8px 15px 15px 0px;	
}




#content #content_col img.alignright {
float: right;
margin: 8px 0px 15px 15px;
}


#useful_link_con {
border: 0px solid #C00;
background-color: #F3913E;
width: 100%;
height: 35px;
margin: 0px 0px 5px 0px;	
}

#useful_link_title {
float: left; 
width: 160px;
background-color: #377DBC;
height: 35px;	
}

#useful_link_title a{
	float: left; 
color: #FFF;
text-decoration: none;	
height: 35px;
width: 160px;
box-sizing: border-box;
padding: 6px 0px 0px 20px;
text-transform: uppercase;
font-weight: bold;
font-size: 18px;
}

#newsticker_con{
float: left; 
width: 775px; 
margin: 0px 0px 0px 0px;
}




#footer-outer {
	width: 100%;
	

	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

#pre_footer {

	margin: 0 auto;

background-color: #3D3E7F;
width: 944px;
border: 0px solid #000;
color: #FFF;
font-size: 12px;
height: 650px;

}

#pre_footer h4{
font-size: 18px;
text-transform: uppercase;
color: #F3913E;	
font-weight: normal;
margin: 15px 0px 5px 0px;
}

#pre_footer #footer_col_1{
float: left;
width: 444px;
/*background-color: #CF0;*/	
min-height: 465px;
}


#pre_footer #footer_col_1 #stories_con{
float: left;
width: 414px;
margin: 0px 0px 0px 20px;
/*background-color: #0F0;*/
}

ul#stories_grid {
float: left;
list-style-type: none;
padding: 0px;
margin: 0px;
width: 100%;	
}

ul#stories_grid li{
float: left;
width: 130px;
height: 150px;
margin: 0px 10px 10px 0px;
position: relative;
overflow: hidden;
}

ul#stories_grid li:nth-child(3n+3) {  
  margin-right: 0px;
}

ul#stories_grid li a span {
position: absolute;
height: 30px;
width: 100%;
bottom: -30px;
left: 0px;
background-color: rgba(0,0,0,0.7);
z-index: 9;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
	
	box-sizing: border-box;
	padding: 5px 0px 0px 7px;
	color: #FFF;
	font-size: 14px;
}

ul#stories_grid li a:hover span {

bottom: 0px;	
}



#pre_footer #footer_col_2{
float: left;
width: 254px;	
/*background-color: #0F0;*/
min-height: 465px;
}

#pre_footer #footer_col_3{
float: left;
width: 230px;
/*background-color: #FF0;*/	
min-height: 465px;
}

#pre_footer #footer_col_3 #locations {
float: left;
width: 100%;
margin: 0px 0px 20px 0px;
padding: 0px;
list-style-type: none;	
}

#pre_footer #footer_col_3 #locations li{
float: left;
border-bottom: 1px solid #FFF;
width: 100%;	
}

#pre_footer #footer_col_3 #locations li a{
float: left;
color: #FFF;
font-weight: 15px;
text-decoration: none;	
text-transform: uppercase;
width: 100%;
padding: 5px 0px 5px 5px;
box-sizing: border-box;
font-weight: bold;
}

#footer {

	margin: 0 auto;

background-color: #E6E4DF;
width: 944px;
border: 0px solid #000;
height: 290px;
padding: 25px 25px 15px 25px;
box-sizing: border-box;
}

#footer h4{
	float: left;
font-size: 16px;
text-transform: uppercase;
color: #3D3E7F;	
font-weight: normal;
margin: 0px 0px 5px 0px;
}

#footer #logo_grid {
float: left;
width: 100%;
margin: 25px 0px 0px 0px;
padding: 0px 0px 0px 0px;	
list-style-type: none;
}

#footer #logo_grid li a{
float: left;
height: 75px;
width: 75px;
margin: 0px 13px 25px 13px;
padding: 0px 0px 0px 0px;	
list-style-type: none;

text-indent: -9999px;
}

#footer #logo_grid li#newcrest a{
width: 220px;	
height: 85px;
margin-top: -10px;
margin-left: 0px;
background-image: url(images/logo_newcrest.png);
}

#footer #logo_grid li#cabonne a{
width: 100px;	
height: 75px;
background-image: url(images/logo_cabonne.png);	
}

#footer #logo_grid li#orange a{
width: 100px;	
height: 75px;
background-image: url(images/logo_orange.png);	
}

#footer #logo_grid li#blayney a{
width: 140px;	
height: 75px;
background-image: url(images/logo_blayney.png);	
}

#footer #logo_grid li#lithgow a{
width: 100px;	
height: 75px;
background-image: url(images/logo_lithgow.png);	
}

#footer #logo_grid li#oberon a{
width: 100px;	
height: 75px;
background-image: url(images/logo_oberon.png);
margin-right: 0px;	
}

#footer #logo_grid li#lachlan a{
width: 75px;	
height: 75px;
background-image: url(images/logo_lachlan.png);
margin-left: 0px;
margin-right: 15px;		
}

#footer #logo_grid li#young a{
width: 75px;	
height: 75px;
background-image: url(images/logo_young.png);
margin-left: 15px;
margin-right: 15px;	
}

#footer #logo_grid li#forbes a{
width: 100px;	
height: 75px;
background-image: url(images/logo_forbes.png);
margin-left: 15px;
margin-right: 15px;	
}

#footer #logo_grid li#parkes a{
width: 75px;	
height: 75px;
background-image: url(images/logo_parkes.png);
margin-left: 15px;
margin-right: 15px;	
}


#footer #logo_grid li#grenfell a{
width: 75px;	
height: 75px;
background-image: url(images/logo_grenfell.png);
margin-left: 15px;
margin-right: 15px;	
}

#footer #logo_grid li#bathurst a{
width: 160px;	
height: 75px;
background-image: url(images/logo_bathurst.png);
margin-left: 15px;
margin-right: 15px;	
}

#footer #logo_grid li#cowra a{
width: 150px;	
height: 75px;
background-image: url(images/logo_cowra.png);
margin-left: 15px;
margin-right: 0px;	
}

#aknowledgements {
	margin: 0 auto;

background-color: #3D3E7F;
width: 944px;
border: 0px solid #000;
height: 30px;
padding: 2px 25px 0px 25px;
box-sizing: border-box;	
}

#aknowledgements a{
color: #FFF;
text-decoration: none;
font-size: 12px;	
}

#aknowledgements a:hover{
color: #F3913E;
}


@media screen and (min-width: 984px) {  /* This is style when it's fullscreen */

.nav-collapse ul {
	display: block;
width: 933px;
margin: 92px 0px 0px 260px;
padding: 0px;
list-style-type: none;
border: 0px solid #9cf;
z-index: 9px;
}

.nav-collapse ul li{
float: left;
margin: 0px 0px 0px 17px;
padding: 0px;
text-align: center;
}

.nav-collapse ul li a{
color: #666;
text-decoration: none;
text-transform: uppercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
font-weight: bold;
}

.nav-collapse ul li a:hover{
color: #daa520;
}

.nav-collapse ul li.current-menu-item a{
color: #daa520;
}


.nav-collapse ul li a span{
	display: block;
clear: both;
text-transform: none;

font-family: ff-tisa-web-pro;
font-size: 12px;
font-weight: 400;
font-style: italic;
}

.nav-collapse ul li:first-child {
   border: 0px solid #9cf;
   margin-left: 0px;
}






}

/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 960px or less  964 */
@media screen and (max-width: 984px) {

.width-value {
position: fixed;
bottom: 0px;
background-color: yellow;
border: 0px solid #C00;
width: 100px;
}

#header_outer {
height: 100px;	
}

#header {
position: relative;
margin: 0 auto;
height: 100px;
width: 768px;
border: 0px solid #0F0;

	}

	


#header h1{
display: block;
position: absolute;
top: 5px;
left: 10px;
width: 255px;
height: 95px;
border: 0px solid #0F0;
z-index:1;
	}

	#header h1 a{
display: block;

width: 255px;
height: 95px;
border: 0px solid #0F0;
background-image: url(images/BeyondtheRange_logo.png);

    background-repeat: no-repeat;
text-indent: -9000px;
z-index: 0;

	}
	


#header #tagline{
display: block;
position: absolute;
top: 20px;
right: 5px;
width: 460px;
}
	
	

#hp_slider_outer {
	display: block;
	width: 100%;
	
	border: 0px solid #9cf;
    margin-top: 0px;
	height: 470px;
}

#hp_slider {
width: 768px;	
height: auto;
}

#hp_slider_outer.filler,
#hp_slider.filler{
height: 100px;	
}

#hp_map_con {
    border: 0px solid #C00;
    float: left;
	width: 530px;
    height: 332px;

	
    
    position: absolute;
    top: 110px;
    left: 5px;
    z-index: 99;

	background-image: url(images/map_nodots.png);
	background-size: 530px 332px;  
    background-repeat: no-repeat;
}



	 a.town {
   display:block;
   position: absolute;
   z-index: 99;	
   text-transform: uppercase; 
   font-size: 13px;
   line-height: 13px;
   font-weight: bold;
   color: #666;
   text-decoration: none;
	 }
	 
	 
#hp_box_con{
top: 110px;	
height: 300px;
}
	 
	 		.box {
        top: 10px;
	   right: -225px;
	   }
	   
.box p {
font-size: 13px;	
}
	   #hp_logos_con {
		top: 410px;   
	   }
	   

.flex-control-nav {
    border: 0px solid #0f0;
    position: absolute;
    left: 5px;
    text-align: left;
    top: 435px;
    width: 250px;
}	   

#content {
margin: 0 auto;
min-height: 400px;
width: 768px;
border: 0px solid #F90;
border-bottom: 1px solid #E6E4DF;
}


#content #hp_col_wide {
	display: block;
	float: left;
border: 0px solid #C00;	
width: 750px;
margin: 0px 0px 0px 4px;
}

#content #hp_col_wide a.read_more {
margin: -10px 0px 0px -20px;
	
}



#content #hp_col_1 {
	float: left;
	width: 750px;
	border-right: 0px solid #333;
	padding: 0px 0px 0px 0px;
	margin: 15px 0px 20px 4px
}

#content #hp_col_1 img.wp-post-image{
width: 750px;
height: 149px;
float: left;
}

#content #hp_col_1 ul{
	    -webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;

}
#content #hp_col_2 ul,
#content #hp_col_3 ul {
	    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;

}

#content #hp_col_1 ul li,
#content #hp_col_2 ul li,
#content #hp_col_3 ul li{
margin: 0px 0px 7px 0px;	
}



#content #hp_col_2 {
	float: left;
	width: 364px;
	border-right: 0px solid #333;
	padding: 0px 10px 0px 0px;
	margin: 0px 0px 0px 4px
}

#content #hp_col_2 img.wp-post-image,
#content #hp_col_3 img.wp-post-image{
width: 354px;	
}

#content #hp_col_3 {
	float: left;
	width: 370px;
	border-right: 0px solid #333;
	padding: 0px 0px 0px 10px;
}







#content  #content_col {
	float: left;
width: 490px;
border-right: 2px solid #FFF;
margin: 0px 0px 0px 0px;
padding: 0px 20px 0px 20px;
 box-sizing: border-box;
}

#content iframe {
border: 0px solid #0F0;
width: 100%;
height: 230px;	
}


#content  #sidebar_col
 {
float: right;
width: 275px;
border: 0px solid #C00;
margin: 0px 0px 0px 0px;
 box-sizing: border-box;
 padding: 15px 15px 0px 15px;
}

.sidebar_item {
float: left;
width: 245px;
margin: 0px 0px 15px 0px;
}


.sidebar_item form input#s {
float: left;
width: 180px;
border: 0px solid #CCC;
height: 45px;	
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
color: #666;
font-size: 16px;
margin: 0px 0px 0px 10px;
}



#advert_slider ol.flex-control-nav {
	border: 0px solid #C00;
	position: absolute;
top: 400px !important;	
right: 10px !important;
text-align: right;

width: 260px; !important
}


#newsticker_con{
float: left; 
width: 600px; 
margin: 0px 0px 0px 0px;
}

#content #content_col #prod_info{
float: left;
width: 260px;
border: 0px solid #9CF;	
}

#content #content_col #prod_form{
float: right;	
width: 220px;
border: 0px solid #9CF;	
}



#pre_footer {

	margin: 0 auto;
	position: relative;
background-color: #3D3E7F;
width: 768px;
border: 0px solid #000;
color: #FFF;
font-size: 12px;
min-height: 610px !important;

}

#pre_footer #footer_col_1{
float: left;
width: 269px;
}

#pre_footer #footer_col_1 #stories_con{
float: left;
width: 249px;
margin: 0px 0px 0px 20px;

}

ul#stories_grid {
float: left;
list-style-type: none;
padding: 0px;
margin: 0px;
width: 100%;	
}

ul#stories_grid li{
float: left;
width: 119px;
height: 137px;
margin: 0px 10px 10px 0px;
position: relative;
overflow: hidden;
}

ul#stories_grid li{
width: 119px;
height: 137px;	
}

ul#stories_grid li:nth-child(3n+3) {  
  margin-right: 10px;
}

ul#stories_grid li:nth-child(2n+2) {  
  margin-right: 0px;
}


ul#stories_grid li:nth-child(9n+9) {  
 display: none;
}


#pre_footer #footer_col_2{
float: left;
width: 254px;	

}

#pre_footer #footer_col_3{
float: left;
width: 244px;

}

#footer {
	margin: 0 auto;
	height: 380px;
color: white;
width: 768px;
border: 0px solid #000;
}

#footer #logo_grid li#cabonne a{
margin-left: 0px;
margin-right: 0px;	
}

#footer #logo_grid li#orange a{
margin-left: 0px;
margin-right: 0px;	
}

#footer #logo_grid li#blayney a{
margin-left: 0px;
margin-right: 0px;	
}

#footer #logo_grid li#lithgow a{
	margin-left: 0px;
margin-right: 0px;	
}
#footer #logo_grid li#oberon a{
margin-right: 26px;	
}

#aknowledgements {

width: 768px;


}


/* for 768px or less  768 + REPONSIVE NAV*/
@media screen and (max-width: 760px) {

.width-value {
position: fixed;
bottom: 0px;
background-color: orange;
border: 0px solid #C00;
width: 100px;
}


#header_outer {
height: 75px;	
}




#header {
position: relative;
margin: 0 auto;
height: 75px;
width: 640px;
border: 0px solid #0F0;

	}



	
#header h1{
display: block;
position: absolute;
top: 5px;
left: 20px;
width: 173px;
height: 65px;
border: 0px solid #0F0;

	}

	#header h1 a{
display: block;

width: 173px;
height: 65px;
border: 0px solid #0F0;
background-image: url(images/BeyondtheRange_logo.png);
background-size: 173px 65px;
    background-repeat: no-repeat;
text-indent: -9000px;
z-index: 0;
	}
	
		#header #tagline{
display: block;
position: absolute;
top: 10px;
right: 20px;
width: 390px;
height: 75px;
border: 0px solid #0F0;
text-align: left;
font-size: 20px;
line-height: 20px;
color: #FFF;
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
letter-spacing: 1px;
	}
	#header #tagline div{
		text-align: right;
		font-weight: 500;
		font-size: 40px;
		line-height: 40px;
		letter-spacing: 1px;
	}
	
#header #tagline div.small{
	font-size: 35px;	
	}			

#hp_slider_outer {
height: 392px !important;	
}

#hp_slider {
position: relative;
margin: 0 auto;
height: 392px !important;
width: 640px;

	}

/*
#hp_map_con {
    border: 1px solid #C00;
    float: left;
   
	width: 494px;
	 height: 310px;
    position: absolute;
    top: 85px;
    left: 5px;
    z-index: 99;
    background-image: url(images/map_nodots.png);
	background-size: 494px 310px;
    background-repeat: no-repeat;
}
*/

#hp_slider_outer.filler,
#hp_slider.filler{
height: 75px !important;	
}

#hp_map_con {
    border: 0px solid #C00;
    float: left;
	width: 450px;
   height: 282px;
	
    
    position: absolute;
    top: 75px;
    left: 0px;
    z-index: 99;

	background-image: url(images/map_nodots.png);
	background-size: 450px 282px;  
    background-repeat: no-repeat;
}



	 a.town {
   display:block;
   position: absolute;
   z-index: 99;	
   text-transform: uppercase; 
   font-size: 12px;
   line-height: 12px;
   font-weight: bold;
   color: #666;
   text-decoration: none;
	 }


#hp_box_con {
 display: none;
}


	 
.box {
	width: 195px;
right: -190px;	
top: 0px;
background-color: #FFF;
padding: 0px 0px 0px 5px;
height: 250px;
}

.default {
font-size: 12px;	
}

.box p{
font-size: 12px;	
}

#hp_logos_con {
    top: 325px;
}


.flex-control-nav {
    border: 0px solid #0f0;
    position: absolute;
    left: 5px;
    text-align: left;
    top: 355px;
    width: 250px;
}	   




#content {
margin: 0 auto;
width: 640px;
border: 0px solid #F90;
border-bottom: 1px solid #E6E4DF;
}






#content  #content_col { /*Orange*/
	float: left;
width: 380px;
border-right: 2px solid #FFF;
margin: 0px 0px 0px 0px;
padding: 0px 20px 0px 20px;
 box-sizing: border-box;
}


#content iframe {
border: 0px solid #0F0;
width: 100%;
height: 169px;	
}

#content  #sidebar_col

{
float: right;
width: 255px;
border: 0px solid #C00;
margin: 0px 0px 0px 0px;
 box-sizing: border-box;
 padding: 15px 15px 0px 15px;
}


.sidebar_item {
float: left;
width: 225px;
margin: 0px 0px 15px 0px;
}


.sidebar_item form input#s {
float: left;
width: 160px;
border: 0px solid #CCC;
height: 45px;	
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
color: #666;
font-size: 16px;
margin: 0px 0px 0px 10px;
}


#advert_slider ol.flex-control-nav {
	border: 0px solid #C00;
	position: absolute;
top: 380px !important;	
right: 0px !important;
text-align: right;
width: 225px !important;
}

#advert_slider ol.flex-control-nav li{
margin: 0px 0px 0px 5px !important;
}

#newsticker_con{
float: left; 
width: 480px; 
margin: 0px 0px 0px 0px;
}



#content #content_col #prod_info{
float: left;
width: 100%;
border: 0px solid #9CF;	
}

#content #content_col #prod_form{
float: left;	
width: 100%;
border: 0px solid #9CF;	
}





#footer {
	margin: 0 auto;
	height: 380px;
color: white;
width: 640px;
border: 0px solid #000;
}



#pre_footer {

	margin: 0 auto;
	position: relative;

width: 640px;
border: 0px solid #000;
color: #FFF;
font-size: 12px;
min-height: 960px !important;

}

#pre_footer #footer_col_1{
float: left;
width: 640px;

min-height: 320px;
}


#pre_footer #footer_col_1 #stories_con{
float: left;
width: 600px;
margin: 0px 0px 0px 20px;
}

ul#stories_grid {
float: left;
list-style-type: none;
padding: 0px;
margin: 0px;
width: 100%;	
}

ul#stories_grid li{
float: left;
width: 112px;
height: 129px;
margin: 0px 10px 10px 0px;
position: relative;
overflow: hidden;
}

ul#stories_grid li img{
width: 100%;
height: 100%;	
}

ul#stories_grid li:nth-child(3n+3) {  
  margin-right: 10px;
}

ul#stories_grid li:nth-child(2n+2) {  
  margin-right: 10px;
}

ul#stories_grid li:nth-child(5n+5) {  
  margin-right: 0px;
}

ul#stories_grid li:nth-child(9n+9) {  
display: block;
}

#pre_footer #footer_col_2{
float: left;
width: 320px;	
min-height: 465px;
margin-left: 20px;
}

#pre_footer #footer_col_3{
float: left;
width: 300px;

min-height: 465px;
}

#aknowledgements {

width: 640px;


}

}



/* for 640px or less  640 */
@media screen and (max-width: 657px) {

.width-value {
position: fixed;
bottom: 0px;
background-color: red;
border: 0px solid #C00;
width: 100px;
}
/* 480 */

#header_outer {
height: 80px;	
}

#header {
width: 480px;
height: 80px;	
}


#header h1{
display: block;
position: absolute;
top: 10px;
left: 10px;
width: 150px;
height: 56px;
border: 0px solid #0F0;

	}

	#header h1 a{
display: block;

width: 150px;
height: 56px;
border: 0px solid #0F0;
background-image: url(images/BeyondtheRange_logo.png);
background-size: 150px 56px;

    background-repeat: no-repeat;
text-indent: -9000px;
z-index: 0;
	}
	
		#header #tagline{
display: block;
position: absolute;
top: 10px;
right: 10px;
width: 300px;
height: 56px;
border: 0px solid #0F0;
text-align: left;
font-size: 16px;
line-height: 16px;
color: #FFF;
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
letter-spacing: 1px;
	}
	#header #tagline div{
		text-align: right;
		font-weight: 500;
		font-size: 30px;
		line-height: 30px;
		letter-spacing: 1px;
	}
	
	#header #tagline div.small{
	font-size: 25px;	
	}
	
	
#hp_slider_outer {
height: 425px !important;	
}

#hp_slider {
position: relative;
margin: 0 auto;
height: 155px !important;
width: 480px;
background-image: url(images/BTR_Home_Sliders_3.jpg);
background-image: url(images/single_header_image.jpg);
	}

#hp_map_con {
	width: 280px;
background-image: none;	
}

.box {
	top: 0px;
right: -200px;
width: 235px;
height: 290px;	
}


	 a.town {
   float: left;
   width: 240px;
   position: static;
   top: 0px;
   left: 0px;
   z-index: 99;	
   text-transform: uppercase; 
   font-size: 14px;
   line-height: 14px;
   font-weight: bold;
   color: #666;
   text-decoration: none;
   background-color: #9F4997;
   padding: 5px;
   box-sizing: border-box;
   border-bottom: 1px solid #FFF;
   color: #FFF;
	 }
	 
	  a.town:hover {
	background-color: #F3913E;
	color: #FFF;	  
	  }

 a.town span {
background-image: none;	 
 }

#hp_logos_con {
width: 240px;
border-bottom: 1px solid #FFF;	
background-color: #3D3E7F;
top: 364px;
}

#hp_logos_con a.tourism{
		margin-top: 10px;
		margin-right: 5px;
width: 150px;
background-size: 150px 39px;
}

#hp_logos_con a.centroc{
	margin-top: 0px;
	margin-left: 5px;
width: 77px;
background-size: 77px 60px;
}

ul.slides{
display: none;
}

#content-outer {
width: 100%;
padding: 0px 0px 0px 0px;

}


#content {
margin: 0 auto;
min-height: 400px;
width: 480px;
border: 0px solid #F90;
border-bottom: 1px solid #E6E4DF;
}


#content #hp_col_wide {
    border: 0 solid #c00;
    display: block;
    float: left;
    margin: 0 0 0 4px;
    width: 480px;
}




#content #hp_col_wide img.wp-post-image {
display: none;
}

#content #hp_col_1 {
width: 480px;	
}
#content #hp_col_1 ul {
	    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;

}

#content #hp_col_1 img.wp-post-image {
    float: left;
	 width: 465px;
    height: 109px;
   
}


#content #hp_col_2 {
    border-right: 0 solid #333;
    float: left;
    margin: 0 0 0 4px;
    padding: 0 10px 0 0;
    width: 222px;
}


#content #hp_col_3 {
    border-right: 0 solid #333;
    float: left;
    padding: 0 0 0 10px;
    width: 222px;
}


#content #hp_col_2 img.wp-post-image, 
#content #hp_col_3 img.wp-post-image {
    width: 222px;
}

#content #hp_col_2 ul,
#content #hp_col_3 ul {
	    -webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
}





#content  #content_col {
	float: left;
width: 480px;
border: 0px solid #C00;
margin: 0px 10px 0px 0px;
}



#content iframe {
border: 0px solid #0F0;
width: 100%;
height: 225px;	
}


#content  #sidebar_col
 {
float: right;
width: 480px;
border: 0px solid #C00;
margin: 0px 0px 0px 0px;
 box-sizing: border-box;
 padding: 15px 15px 40px 15px;
}

.sidebar_item {
float: left;
width: 260px;
margin: 0px 95px 15px 95px;
}

.sidebar_item form{
float: left;
width: 100%;
background-color: #FFF;	
height: 45px;
margin: 0px;
padding: 0px;
}

.sidebar_item form input#s {
float: left;
width: 205px;
border: 0px solid #CCC;
height: 45px;	
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
color: #666;
font-size: 16px;
margin: 0px 0px 0px 10px;
}

input#searchsubmit {
float: left;
width: 44px;
height: 45px;
border: none;
background-image: url(images/Search_MagnifyingGlass.png);
margin:	 0px 0px 0px 0px;
text-indent: -9999px;
background-color: #FFF;
}

input#searchsubmit:hover {
cursor: pointer;	
}

#advert_slider ul.slides {
display: block;	
}

#advert_slider ol.flex-control-nav {
	border: 0px solid #C00;
	position: absolute;
top: 440px !important;	
}



#newsticker_con{
float: left; 
width: 320px; 
margin: 0px 0px 0px 0px;
}


#pre_footer {

	margin: 0 auto;
	position: relative;
background-color: #3D3E7F;
width: 480px;
border: 0px solid #000;
color: #FFF;
font-size: 12px;
min-height: 1160px !important;

}

#pre_footer #footer_col_1{
float: left;
width: 480px;

min-height: 465px;
}


#pre_footer #footer_col_1 #stories_con{
float: left;
width: 440px;
margin: 0px 0px 0px 20px;

}

ul#stories_grid {
float: left;
list-style-type: none;
padding: 0px;
margin: 0px;
width: 100%;	
}

ul#stories_grid li{
float: left;
width: 130px;
height: 150px;
margin: 0px 10px 10px 0px;
position: relative;
overflow: hidden;
}

ul#stories_grid li img{
width: 100%;
height: 100%;	
}

ul#stories_grid li:nth-child(3n+3) {  
  margin-right: 0px;
}

ul#stories_grid li:nth-child(2n+2) {  
  margin-right: 10px;
}

ul#stories_grid li:nth-child(5n+5) {  
  margin-right: 10px;
}


#pre_footer #footer_col_2{
float: left;
width: 250px;	

min-height: 465px;
}

#pre_footer #footer_col_3{
float: left;
width: 210px;

min-height: 465px;
}

#footer {
	margin: 0 auto;
	height: 565px;
color: white;
width: 480px;
border: 0px solid #000;
}

#aknowledgements {
width: 480px;
}



}

/* for 640px or less  640 */
@media screen and (max-width: 497px) {  /* kicks in at 463 */

.width-value {
position: fixed;
bottom: 0px;
background-color: purple;
border: 0px solid #C00;
width: 100%;
}
/* 320 */

#header_outer {
height: 95px;	
}

#header {
width: 320px;
height: 95px;	
}



#header h1{
display: block;
position: absolute;
top: 5px;
left: 85px;
width: 150px;
height: 56px;
border: 0px solid #0F0;
	}

	#header h1 a{
display: block;

width: 150px;
height: 56px;
border: 0px solid #0F0;
background-image: url(images/BeyondtheRange_logo.png);
background-size: 150px 56px;

    background-repeat: no-repeat;
text-indent: -9000px;
z-index: 0;
	}
	
		#header #tagline{
display: block;
position: absolute;
top: 60px;
right: 0px;
width: 320px;
height: 80px;
border: 0px solid #0F0;
text-align: center;
font-size: 14px;
line-height: 14px;
color: #FFF;
font-family: 'Century Gothic', Helvetica, Arial, Sans-Serif;
letter-spacing: 1px;
	}
	#header #tagline div{
		text-align: center;
		font-weight: bold;
		font-size: 16px;
		line-height: 20px;
		letter-spacing: 1px;
	}
	


#hp_slider_outer {
height: 505px !important;	
}

#hp_slider {
position: relative;
margin: 0 auto;
height: 505px !important;
width: 320px;

	}


#hp_map_con {
	width: 280px;
background-image: none;	
top: 97px;
}

a.town{
width: 160px;	
}

.box {
right: -40px;
width: 155px;
height: 350px;	
}

#hp_logos_con{
top: 445px;
width: 320px;	
}

#hp_logos_con a.tourism{
		margin-top: 10px;
		margin-right: 15px;

}

#hp_logos_con a.centroc{
	margin-top: 0px;
	margin-left: 30px;

}
	

#content {
margin: 0 auto;
min-height: 400px;
width: 320px;
border: 0px solid #F90;
border-bottom: 1px solid #E6E4DF;
}



#content  #content_col {
	float: left;
width: 320px;
border: 0px solid #C00;
margin: 0px 10px 0px 0px;
}


#content iframe {
border: 0px solid #0F0;
width: 100%;
height: 135px;	
}

#accordion_stories_grid li{
float: left;
width: 100%;
margin: 0px 0px 0px 0px;
background-color: #E6E4DF;	
}

#content  #sidebar_col
 {

width: 320px;

}

.sidebar_item {
float: left;
width: 260px;
margin: 0px 15px 15px 15px;
}

#useful_link_con{
height: 70px;	
}

#useful_link_con #useful_link_title,
#useful_link_con #newsticker_con{
width: 320px;	
}


#pre_footer {
	
	margin: 0 auto;
	height: 1620px;
color: white;
width: 320px;
border: 0px solid #000;
}

#pre_footer #footer_col_1 {
float: left;
width: 320px;
min-height: 350px;
}



#pre_footer #footer_col_1 #stories_con{
float: left;
width: 290px;
margin: 0px 0px 0px 20px;

}

ul#stories_grid {
float: left;
list-style-type: none;
padding: 0px;
margin: 0px;
width: 100%;	
}

ul#stories_grid li{
float: left;
width: 90px;
height: 104px;
margin: 0px 5px 5px 0px;
position: relative;
overflow: hidden;
}

ul#stories_grid li img{
width: 100%;
height: 100%;	
}

ul#stories_grid li:nth-child(3n+3) {  
  margin-right: 0px;
}

ul#stories_grid li:nth-child(2n+2) {  
  margin-right: 5px;
}

ul#stories_grid li:nth-child(5n+5) {  
  margin-right: 5px;
}

#pre_footer #footer_col_2 {
float: left;
width: 320px;
}

#pre_footer #footer_col_3 {
float: left;
width: 280px;
margin-left: 20px
}


#footer {
	
	margin: 0 auto;
	height: 900px;
color: white;
width: 320px;
border: 0px solid #000;
}

#footer #logo_grid li#orange a{
margin-left: 13px;
margin-right: 0px;	
}

#aknowledgements {

width: 320px;


}


}

@media screen and (max-width: 337px) {  /* 320px +  17px */

.width-value {
position: fixed;
bottom: 0px;
background-color: green;
border: 0px solid #C00;
width: 100%;
}

#hp_slider_outer {
	display: block;
	border: 0px solid #0f0;
}



#footer {
	margin: 0 auto;
	height: 70px;
color: white;
width: 320px;
border: 0px solid #000;
}






}







.js .nav-collapse {
  clip: rect(0 0 0 0);
  max-height: 0;
  position: absolute;
  display: block;
  overflow: hidden;
  zoom: 1;
  z-index: 2;
}

.nav-collapse.opened {
  max-height: 9999px;
}

.disable-pointer-events {
  pointer-events: none !important;
}

.nav-toggle {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

@media screen and (min-width: 760px) {
  .js .nav-collapse {
    position: relative;
	z-index: 2;
  }
  .js .nav-collapse.closed {
    max-height: none;
  }
  .nav-toggle {
    display: none;
  }
}


@font-face {
  font-family: "responsivenav";
  src:url("icons/responsivenav.eot");
  src:url("icons/responsivenav.eot?#iefix") format("embedded-opentype"),
    url("icons/responsivenav.ttf") format("truetype"),
    url("icons/responsivenav.woff") format("woff"),
    url("icons/responsivenav.svg#responsivenav") format("svg");
  font-weight: normal;
  font-style: normal;
}

.nav-toggle {
  position: fixed;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-decoration: none;
  text-indent: -999px;
  position: relative;
  overflow: hidden;
  width: 70px;
  height: 55px;
  float: right;
  border: 0px solid #0F0;
}

.nav-toggle:before {
  color: #000; /* Edit this to change the icon color */
  font-family: "responsivenav", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  font-size: 28px;
  text-transform: none;
  position: absolute;
  content: "≡";
  text-indent: 0;
  text-align: center;
  line-height: 55px;
  speak: none;
  width: 100%;
  top: 0;
  left: 0;
}

.nav-toggle.active::before {
  font-size: 24px;
  content:"x";
}