/* LESS VARS */
/* =============================================================================
   Webfonts Hoefler
   ========================================================================== */
/*
.font-text{
    font-family: "Hoefler Text A", "Hoefler Text B";
    font-style: normal;
    font-weight: 400;
}
.font-text-ital{
    font-family: "Hoefler Text A", "Hoefler Text B";
    font-style: italic;
    font-weight: 400;
}
.font-text-bold{
    font-family: "Hoefler Text A", "Hoefler Text B";
    font-style: normal;
    font-weight: 700;
}
.font-text-bold-ital{
    font-family: "Hoefler Text A", "Hoefler Text B";
    font-style: italic;
    font-weight: 700;
}


.font-sans-text{
    font-family: "Gotham SSm A", "Gotham SSm B";
    font-style: normal;
    font-weight: 400;
}
.font-sans-text-ital{
    font-family: "Gotham SSm A", "Gotham SSm B";
    font-style: italic;
    font-weight: 400;
}

.font-sans{
    font-family: "Gotham SSm A", "Gotham SSm B";
    font-style: normal;
    font-weight: 700;
}
.font-sans-ital{
    font-family: "Gotham SSm A", "Gotham SSm B";
    font-style: italic;
    font-weight: 700;
}
.font-sans-bold{
    font-family: "Gotham SSm A", "Gotham SSm B";
    font-style: normal;
    font-weight: 800;
}

.font-sans-bold-ital{
    font-family: "Gotham SSm A", "Gotham SSm B";
    font-style: italic;
    font-weight: 800;
}

.font-sans-condensed-black {
	font-family: "Gotham XNarrow A", "Gotham XNarrow B";
	font-style: normal;
	font-weight: 900;
}
*/
/* =============================================================================
   Webfonts Adobe
   ========================================================================== */
.font-text {
  font-family: "linotype-sabon", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.font-text-ital {
  font-family: "linotype-sabon", sans-serif;
  font-weight: 400;
  font-style: italic;
}
.font-text-bold {
  font-family: "linotype-sabon", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.font-text-bold-ital {
  font-family: "linotype-sabon", sans-serif;
  font-weight: 700;
  font-style: italic;
}
.font-sans-text {
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 400;
}
.font-sans-text-ital {
  font-family: "proxima-nova", sans-serif;
  font-style: italic;
  font-weight: 400;
}
.font-sans {
  font-family: "proxima-nova", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.font-sans-ital {
  font-family: "proxima-nova", sans-serif;
  font-weight: 700;
  font-style: italic;
}
.font-sans-bold {
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: normal;
}
.font-sans-bold-ital {
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: italic;
}
.font-sans-condensed-black {
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 900;
  font-style: normal;
}
/*
@font-face {
    font-family: 'font_serif';
    src: url('../webfonts/v3/centri.woff') format('woff'),
         url('../webfonts/v3/centri.woff2') format('woff2'),
         url('../webfonts/v3/centri.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'font_med_sans';
    src: url('../webfonts/v3/markweb-heavy.woff') format('woff'),
         url('../webfonts/v3/markweb-heavy.woff') format('woff'),
         url('../webfonts/v3/markweb-heavy.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'font_bold_sans';
    src: url('../webfonts/v3/markweb-black.woff') format('woff'),
         url('../webfonts/v3/markweb-black.woff') format('woff'),
         url('../webfonts/v3/markweb-black.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
*/
@font-face {
  font-family: 'font_condensed';
  src: url('https://bikepacking.com/wp-content/themes/pedalingnowhere/webfonts/v3/norwester.woff') format('woff'), url('https://bikepacking.com/wp-content/themes/pedalingnowhere/webfonts/v3/norwester.woff') format('woff2'), url('https://bikepacking.com/wp-content/themes/pedalingnowhere/webfonts/v3/norwester.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'ss_standard';
  src: url('https://bikepacking.com/wp-content/themes/pedalingnowhere/webfonts/v3/ss-standard.woff') format('woff'), url('https://bikepacking.com/wp-content/themes/pedalingnowhere/webfonts/v3/ss-standard.woff2') format('woff2'), url('https://bikepacking.com/wp-content/themes/pedalingnowhere/webfonts/v3/ss-standard.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
.full-width {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  box-sizing: border-box;
}
.not-full-width {
  width: auto;
  position: relative;
  left: auto;
  right: auto;
  margin: 0;
}
.topo-bg {
  background: url(https://bikepacking.com/wp-content/themes/pedalingnowhere/img/v4/topo-bg-5-black.png) top center repeat-y;
  background-size: 1480px;
}
.topo-bg-lt {
  background: url(https://bikepacking.com/wp-content/themes/pedalingnowhere/img/v4/topo-bg-3-black.png) top center repeat-y;
  background-size: 1480px;
}
.topo-bg-wt {
  background: url(https://bikepacking.com/wp-content/themes/pedalingnowhere/img/v4/topo-bg-5-white.png) top center repeat-y;
  background-size: 1480px;
}
.clear {
  content: "";
  display: table;
  clear: both;
}
.ulreset {
  padding: 0;
  margin: 0;
  list-style-type: none;
}
/*
body {
	.fluid-type(font-size, 600px, 900px, 12px, 28px);
}
pre {overflow: auto;}

*/
.master_excerpt {
  width: auto;
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: normal;
  color: #1A1C18;
  font-size: 16px;
  line-height: 1.8em;
}
.master_excerpt a,
.master_excerpt a:visited {
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: normal;
  color: #1A1C18;
  box-shadow: 0px 1.5px 0px #a9b69c;
  text-decoration: none;
}
.master_excerpt a:hover,
.master_excerpt a:visited:hover {
  color: #1A1C18;
  box-shadow: 0px 1.5px 0px #1A1C18;
}
select {
  margin: 0 0 5% 0 !important;
  padding: 5px 35px 5px 10px !important;
  background-color: #e9e2c6 !important;
}
#main {
  width: 100%;
  padding: 0px;
  margin: 0;
}
div.banner div.outline h3 {
  background: #e9e2c6;
}
#outer {
  background-color: #e9e2c6;
}
h1 span,
.section h2 span {
  display: block;
}
.wide div.banner-sidebar {
  background-color: #e9e2c6;
}
.accordion > div,
#main .content,
div.section {
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16.5px;
  line-height: 1.75em;
  color: #1A1C18;
}
div.section > div > h2,
div.section h3 {
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 900;
  font-style: normal;
  letter-spacing: 2px;
  color: #390305;
  font-size: 28px;
  line-height: 28px;
  border-bottom: none;
  margin-bottom: 10px;
  padding: 0px 0px 8px 0px;
}
div.section h3 {
  font-size: 23px;
  line-height: 23px;
  margin: 20px 0 0px 0;
}
p.imgl {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  box-sizing: border-box;
}
p.imgl img {
  width: 100%;
  max-width: 1100px;
  height: auto;
  margin: 0 auto;
  display: block;
  position: relative;
}
#main .content {
  padding-bottom: 30px;
}
#main .content img {
  width: 100%;
  max-width: 1200px;
  height: auto;
  margin: 0 auto;
}
#main .content h1 {
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 900;
  font-style: normal;
  letter-spacing: 2px;
  color: #390305;
  font-size: 31px;
  line-height: 31px;
  border-bottom: none;
  margin-bottom: 10px;
  padding: 0px 0px 8px 0px;
}
#main .content p {
  margin: 0 auto;
  max-width: 800px;
  padding: 0px 20px 20px 20px;
}
#main .content p.excerpt {
  width: auto;
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: normal;
  color: #1A1C18;
  line-height: 1.8em;
  font-size: 16px;
}
#main .content p.excerpt a,
#main .content p.excerpt a:visited {
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: normal;
  color: #1A1C18;
  box-shadow: 0px 1.5px 0px #a9b69c;
  text-decoration: none;
}
#main .content p.excerpt a:hover,
#main .content p.excerpt a:visited:hover {
  color: #1A1C18;
  box-shadow: 0px 1.5px 0px #1A1C18;
}
#main .content div.B101_logo {
  max-width: 220px;
  margin: 0 auto;
  padding: 0 0 20px 0;
}
#main .content div.B101_logo img {
  width: 100%;
  height: auto;
}
div.section {
  margin: 0;
  padding: 0;
}
.section > div {
  padding: 2% 6% 2% 6%;
  max-width: 1000px;
  margin: 0px auto;
}
.section > div > h2,
.section > div > h1 {
  border-bottom: none;
  margin-bottom: 10px;
  padding: 0px 0px 8px 0px;
  letter-spacing: 4px;
  text-align: center;
}
.section > div p.excerpt {
  width: auto;
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: normal;
  color: #1A1C18;
  line-height: 1.8em;
  font-size: 16px;
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}
.section > div p.excerpt a,
.section > div p.excerpt a:visited {
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: normal;
  color: #1A1C18;
  box-shadow: 0px 1.5px 0px #a9b69c;
  text-decoration: none;
}
.section > div p.excerpt a:hover,
.section > div p.excerpt a:visited:hover {
  color: #1A1C18;
  box-shadow: 0px 1.5px 0px #1A1C18;
}
.section > div.map {
  padding: 0;
  max-width: none;
}
.section > div iframe {
  margin: 0;
  padding: 0;
}
.accordion a,
.accordion a:visited,
div.section a,
div.section a:visited,
div.content > p a,
div.content > p a:visited {
  text-decoration: none;
  color: #1A1C18;
  box-shadow: inset 0 -2.5px 0 -1px #1A1C18;
  -webkit-transition: all 0.08s ease-out;
  transition: all 0.1s ease-out;
}
.accordion a:hover,
.accordion a:visited:hover,
div.section a:hover,
div.section a:visited:hover,
div.content > p a:hover,
div.content > p a:visited:hover {
  color: #D0CFCD;
  box-shadow: inset 0 -23px 0 -1px #1A1C18;
}
.accordion h2 {
  color: #c53936;
}
.accordion ul.arrow-list li,
ul.arrow-list li {
  font-size: 1em;
  font-size: 16.5px;
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 400;
}
div.section ul:not([class]),
div.section ul.twocol {
  padding-bottom: 30px;
}
div.section ul:not([class]) li,
div.section ul.twocol li {
  padding-bottom: 18px;
}
/*
.accordion > div ul.resource-list{
	padding:0;
}

.accordion > div ul.resource-list li{
	padding:0;
	margin:0;
	.font-sans;
	line-height:1.3em;
	font-size:12.5px;
	background:none;
}
*/
div.collective-cta {
  padding: 5% 5% 3% 5%;
  background-color: #f1ecda;
  max-width: 800px;
  margin: 0 auto;
  margin-bottom: 20px;
}
div.collective-cta:after {
  content: '';
  display: block;
  clear: both;
}
div.collective-cta img {
  width: 45%;
  padding: 0 20px 10px 0;
  float: left;
}
div.collective-cta p {
  color: #390305;
  font-size: 14px;
}
div.collective-cta p a,
div.collective-cta p a:visited {
  color: #390305;
  box-shadow: inset 0 -2.5px 0 -1px #390305;
  -webkit-transition: all 0.08s ease-out;
  transition: all 0.1s ease-out;
}
div.collective-cta p a:hover,
div.collective-cta p a:visited:hover {
  color: #e9e2c6;
  box-shadow: inset 0 -23px 0 -1px #390305;
}
.rect_btn {
  display: table;
  margin: 0 auto;
  padding: 10px 24px;
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: normal;
  font-size: 12px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
}
.rect_btn:hover {
  background-color: #1A1C18;
}
/*
ul.resource-list{
	text-align:center;
	.ulreset;
	//margin-bottom:8%;
	&::after {
		content: "";
		clear: both;
		display: table;
	}
	& li {
		background:none;
		-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
		display:inline-block;
		width:50%;
		padding:0px;
		margin:0;
    	text-align:center;
    	vertical-align:top;
    	margin-right: -4px;
    	& a{
    		box-shadow: none;
    		position:relative;
    		display:block;
    		margin:0;
    		padding:10px 10px;
    		& img {
	    		width:100%;
	    		height:auto;
	    		//padding:6px 12px;
	    		//margin-bottom:10px;
	    	}
	    	& p {
	    		.font-sans;
	    		padding:5px 0 0 0;
	    		& strong{
	    			.font-sans-bold;
	    		}
	    	}
    	}
    	& a:hover{
    		background-color:@white;
    		& div.bg{
    			opacity: 1;
    		}
    		
    		& p {
	    		color:@red;
	    	}
    	}
	}
}
*/
ul.resource-list {
  text-align: center;
  padding: 0;
  margin: 0;
  list-style-type: none;
  display: flex;
  flex-flow: wrap;
  justify-content: center;
  align-items: flex-start;
  padding-bottom: 3%;
}
ul.resource-list li {
  background: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  flex-basis: 50%;
  -ms-flex: auto;
  padding: 0px;
  margin: 0 0 10px 0;
  vertical-align: top;
}
ul.resource-list li > a,
ul.resource-list li > div {
  box-shadow: none;
  position: relative;
  display: block;
  margin: 0;
  padding: 10px 10px;
  color: #390305;
  -webkit-transition: all 0.08s ease-out;
  transition: all 0.1s ease-out;
}
ul.resource-list li > a img,
ul.resource-list li > div img {
  width: 100%;
  height: auto;
  /*
				-webkit-transition: all 0.1s ease-out;
				-moz-transition: all 0.1s ease-out;
				-ms-transition: all 0.1s ease-out;
				-o-transition: all 0.1s ease-out;
				transition: all 0.1s ease-out;
				*/
}
ul.resource-list li > a p,
ul.resource-list li > div p {
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  font-size: 14px;
  padding: 7px 0 0 0;
}
ul.resource-list li > a p strong,
ul.resource-list li > div p strong {
  font-family: "proxima-nova", sans-serif;
  font-weight: 800;
  font-style: italic;
}
ul.resource-list li > a p a,
ul.resource-list li > div p a {
  box-shadow: inset 0 -2.5px 0 -1px #c53936 !important;
  color: #c53936 !important;
}
ul.resource-list li > a p a:hover,
ul.resource-list li > div p a:hover {
  color: #e9e2c6 !important;
  box-shadow: inset 0 -23px 0 -1px #c53936 !important;
}
ul.resource-list li > p,
ul.resource-list li > div p:empty {
  display: none;
}
ul.resource-list li > a:hover {
  background-color: #F2F1EE;
}
ul.resource-list li > a:hover div.bg {
  opacity: 1;
}
ul.resource-list li > a:hover p {
  color: #c53936;
}
.accordion ul.resource-list a,
.accordion ul.resource-list a:visited,
div.section ul.resource-list a:visited,
div.section ul.resource-list a {
  box-shadow: none;
}
section {
  height: 100vh;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-attachment: fixed !important;
  overflow: hidden;
}
ul.B101_nav {
  display: none;
  padding: 0;
  margin: 0;
  list-style-type: none;
  width: 500px;
  height: 150px;
  overflow: hidden;
  margin: 0 auto;
  margin-bottom: 20px;
  background: url(https://bikepacking.com/wp-content/themes/pedalingnowhere/img/bikepacking-101/v2023/nav-bg_5.png) no-repeat 0px 0px;
  background-size: 500px;
}
ul.B101_nav li {
  width: 100px;
  height: 150px;
  margin: 0;
  padding: 0;
  display: inline;
  float: left;
}
ul.B101_nav li a {
  display: block;
  width: 100px;
  height: 150px;
  padding-top: 70px;
  font-family: 'font_condensed';
  text-transform: uppercase;
  color: #a7a799;
  font-size: 14.5px;
  line-height: 19px;
  background: url(https://bikepacking.com/wp-content/themes/pedalingnowhere/img/bikepacking-101/v2023/nav-item-bg.png) no-repeat 0px 0px;
  background-size: 100px;
  -webkit-transition: color 0.1s ease-out;
  -moz-transition: color 0.1s ease-out;
  -ms-transition: color 0.1s ease-out;
  -o-transition: color 0.1s ease-out;
  transition: color 0.1s ease-out;
}
ul.B101_nav li a span {
  display: block;
}
ul.B101_nav li a:hover {
  background-position: 0px -150px;
  color: #c53936;
}
ul.B101_nav li a.active {
  background-position: 0px -300px;
  color: #390305;
}
.toggler > div:first-child {
  color: #390305;
}
.toggler > div:last-child {
  color: #c5b5a0;
}
.toggler.metric div:first-child {
  color: #c5b5a0;
}
.toggler.metric div:last-child {
  color: #390305;
}
input.toggle {
  background-color: #c5b5a0;
}
input.toggle::after {
  background-color: #e9e2c6;
}
div.data-table table {
  color: #390305;
}
div.data-table table td,
div.data-table table th {
  border: 1px solid #c5b5a0;
}
div.data-table table tr:nth-child(odd) {
  background-color: transparent;
}
div.data-table table tr:hover {
  background-color: #dad0b7;
}
div.data-table table th {
  background-color: #dad0b7;
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 14px;
  letter-spacing: 0.5px;
}
div.data-table table td:first-child {
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 14px;
  line-height: 16px;
  letter-spacing: 0.5px;
}
div.data-table table td:first-child span {
  display: inline-block;
  color: #e9e2c6;
  font-size: 18px;
  line-height: 18px;
  padding: 10px 8px;
  border-radius: 35px;
  margin-bottom: 3px;
}
/*
div.table-wrapper{
	overflow-x:auto;
	margin-bottom:5%;
}
div.table-wrapper table td div, div.table-wrapper table th div{
	&:first-child{
		display:block;
	}
	&:last-child{
		display:none;
	}
}
div.table-wrapper.metric table td div, div.table-wrapper.metric table th div{
	&:first-child{
		display:none;
	}
	&:last-child{
		display:block;
	}
}
table {
  .font-sans-text;
  font-size:15px;
  line-height:20px;
  border-collapse: collapse;
  width: 100%;
  min-width:500px;
  color: @brown;
}
table td, table th {
  border: 1px solid #c5b5a0;
  padding: 8px;
  vertical-align: middle;
}
table tr:hover{
	background-color: #dad0b7;
}
table tr:nth-child(even){
	//background-color:#dad0b7;
}
table th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #dad0b7;
  .font-sans-condensed-black;
  font-size:14px;
  letter-spacing: .5px;
  text-transform: uppercase;
  vertical-align: bottom;
  &:first-child{
  	
  }
}
table td:first-child {
  .font-sans-condensed-black;
  font-size:14px;
  line-height:16px;
  text-transform: uppercase;
  letter-spacing: .5px;
  & span{
	display:inline-block;
	color:@tan;
	font-size: 18px;
	line-height:18px;
	padding:10px 8px;
	border-radius: 35px;
	margin-bottom:3px;
  }
}
*/
@media only screen and (min-width: 600px) {
  div.collective-cta {
    padding: 2.5% 2.5% 2% 2.5%;
  }
  div.collective-cta img {
    width: 27%;
    padding: 0 30px 10px 0;
  }
}
@media only screen and (min-width: 768px) {
  #main .content {
    padding: 50px 0px 0px 0px;
  }
  /*
    ul.resource-list {
    	& li{
			width:25%;
			padding:0px;
	    	& img {
	    		
	    	}
	    	& h3 {
	    		
	    	}
		}
    }
    */
  .nav-select {
    display: none;
  }
  ul.B101_nav {
    display: block;
  }
  ul.resource-list li {
    flex-basis: 25%;
  }
}
@media only screen and (min-width: 1024px) {
  #main .content {
    padding: 50px 0px 0px 0px;
  }
}
@media only screen and (min-width: 1480px) {
  section {
    background-size: 1500px 1000px;
    -webkit-background-size: 1500px 1000px;
    -moz-background-size: 1500px 1000px;
    -o-background-size: 1500px 1000px;
  }
}