/* adjust the fixed nav briefly before transition to responsive nav */
@media all and (min-width:40em) and (max-width:55em){

header div.navWrapper nav.navMain.fixed ul {
	background-size: 4em;
	background-position: .9em .9em;
}

/* end @media*/}


/* responsive nav for small and medium screens common  */
@media all and (min-width:5em) and (max-width:45em){
	
body {
	font-size: 1em;
}
.widthController {
width:100%;
}
header {
	height:2.8em;
	margin:0;
}
header div.logo {
	display: none;
}
header p {
	display:none;
}
header div.navWrapper {
	position: fixed;
	top:0;
	left:0;
	width:100%;
	height:3.6em;
	font-size: 1.3em;
}
header div.navWrapper nav.navMain {
	position: relative;
	width:100%;
	height:1em;
}
header div.navWrapper nav.navMain.fixed ul {
	display:none;
	position: inherit;
	top:0;
	left:0;
	background-image: none;
}
header div.navWrapper nav.navMain.fixed ul li:first-child {
	margin-top:1em;
}
header div.navWrapper label.responsiveNavActivator {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.5em;
	line-height: 2.3em;
	height:2.4em;
	display:block;
	box-sizing: border-box;
	width:100%;
	cursor: pointer;
	text-transform: uppercase;
	text-align: right;
	padding:0;
	padding-right:.7em;
	margin:0;
	margin-bottom:-.8em;
	color:rgba(255,255,255,.8);
	background-color: #a0b91e;
	background-image: url('../images/logo-pivot-small1.png');
	background-repeat: no-repeat;
	background-position: .3em 40%;
}
header div.navWrapper label.responsiveNavActivator:hover {
		color:#ffffff;
}
header div.navWrapper > nav > ul {
	position: static;
	display: none;
}
header div.navWrapper nav.navMain ul {
	width:100%;
	background-color:#a0b91e;
	box-sizing: border-box;
	border-radius:0;
	margin:0;
	margin-top:1em;
}
header div.navWrapper nav.navMain ul li {
	display: block;
	box-sizing: border-box;
	text-align: left;
	margin:0;
	padding:0;
	border-top:1px solid rgba(255,255,255,.5);
}
header div.navWrapper nav.navMain ul li a {
	display: block;
	padding: 1em 1em;
	color:rgba(255, 255, 255, .5);
}
header div.navWrapper nav.navMain ul li:last-child a {
	padding-bottom:1em;
}
header div.navWrapper nav.navMain ul li a:active {
	background: #889d19;
}

/* end @media*/}







/* small screens  */

@media all and (min-width:5em)
and (max-width:30em){

article,
div.search,
div.challengePage,
.item-page,
.itemView,
.itemListView,
.itemHome {
	padding:1.5em;
}
footer {
	height:10em;
}
form.searchBox  {
	font-size: 1em;
}


/* home intro article  */

article h1,
div.search h1,
div.challengePage h1,
.item-page h1,
.itemView h1,
.itemListView h1 {
	margin-top:1.2em;
	margin-bottom:.4em;
}
article.itemHome h1 {
	font-size: 1.4em;
	line-height: 110%;
	font-weight: 700;
	letter-spacing: normal;
	margin-top:0;
	margin-bottom:.3em;
}
article.itemHome p {
	margin-bottom:0;
}
article.itemHome.bgIconBlue {
	background-image:none;
	background-repeat: no-repeat;
	background-position: -130% 40%;
}

/* structure */

.wrapperBlue {
	padding:1.2em;
}
.columnWide {
	width:100%;
	float:none;
	padding:0;
}
.columnNarrow {
	float:none;
	width:100%;
}
aside {
	background: rgba(220,220,220,.5);
	padding:1em;
	border-radius: 1em;
	margin-bottom:1em;
	font-size: .8em;
}
a.button.contribute {
	display:block;
	text-align: center;
	margin:2em 0em;
	border-radius: 20em;
	padding:.7em .8em;
}
.challengeFinder h1 {
	font-size: 2.6em;
	font-weight: 300;
	letter-spacing: -.07em;
	line-height: 100%;
	margin-top:1em;
}
.challengeFinder p {
	font-size: 1.4em;
	margin-bottom:1em;
}


/* widget that controls the challenge finder */
.challengeSelector {
}
.challengeSelector form label {
	display:block;
	font-size: 1.2em;
	font-weight: 800;
	margin-bottom:.3em;
	color:#009bf0;	
}
.challengeSelector form select {
 	width:100%;
 	margin-bottom:1em;
 	font-size: 1.2em;
}

/* Start Over - Button */

.buttonReset {
	position: relative;
	margin:.5em 0 1em 0;
}
.buttonReset > input.reset_button {
	float:none;
	margin-bottom:1em;
}
.buttonReset p {
	font-size: 1.4em;
	position: relative;
	margin:0;
	margin-top:.5em
}


/* Challenge list */

.challengeList > div > ul li {
	position: relative;
	display: block;
	font-size: 1.1em;
	font-weight: 700;
	line-height: 110%;
	width:100%;
	padding:.9em 0 0 0;
	margin-bottom:1em;
	color:#cccccc;
	background-color:none;
	background: none;
	border-radius:0;
	border:none;
	border-top:1px solid #cccccc;
}
.challengeList > div > ul li:last-child {
	padding-bottom:.9em;
	border-bottom:1px solid #cccccc;

}
.challengeList > div > ul li:hover {
	background-color: none;
	background: none;
}

.challengeList > div > ul li > a {
	display: block;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	color:#009bf0;
	padding-left: 0;
	text-decoration: underline;
	background-color: none;
}
.challengeList > div > ul li > a:after {
	display: none;
}
.challengeList > div > ul li.itemFeatured a:before{
	display:none;
}
.challengeList > div > ul li img.moduleItemImage {
	display: none;
}


/* challenge pages ***********************************************************************/

div.challengePage h1 {
	font-size:1.5em;
	line-height: 120%;
	letter-spacing: -.01em;
	margin-top:.5em;
	margin-bottom:.3em;
	white-space: normal;
}
div.challengePage h1 img {
	display:none;
}


/* video box  */
div.challengePage div.itemVideoBlock div.itemVideoEmbedded iframe {
	height:10em;
}

/*  back to top */
.itemBackToTop {
display: none;
}


/* end @media*/}




@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : portrait) { 
    //iPhone 6 Portrait
}


@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : landscape) { 


.challengeSelector form label {
	display:block;
	font-size: 1.2em;
	font-weight: 800;
	margin-bottom:.3em;
	color:#009bf0;	
}
.challengeSelector form select {
 	width:100%;
 	margin-bottom:1em;
 	font-size: 1.2em;
}


/* end @media*/}



/* iphone 6 landscape */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : portrait) { 

.challengeSelector form label {
	display:block;
	font-size: 1.2em;
	font-weight: 800;
	margin-bottom:.3em;
	color:#009bf0;	
}
.challengeSelector form select {
 	width:100%;
 	margin-bottom:1em;
 	font-size: 1.2em;
}

/* end @media*/}

/* iphone 6 landscape */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : portrait) { 
.challengeSelector form label {
	display:block;
	font-size: 1.2em;
	font-weight: 800;
	margin-bottom:.3em;
	color:#009bf0;	
}
.challengeSelector form select {
 	width:100%;
 	margin-bottom:1em;
 	font-size: 1.2em;
}
/* end @media*/}


/* iphone 6+ landscape */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : landscape) { 
.challengeSelector form label {
	display:block;
	font-size: 1.2em;
	font-weight: 800;
	margin-bottom:.3em;
	color:#009bf0;	
}
.challengeSelector form select {
 	width:100%;
 	margin-bottom:1em;
 	font-size: 1.2em;
}
/* end @media*/}



/* iphone 5 landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (orientation: landscape) {

.challengeSelector form label {
	display:block;
	font-size: 1.2em;
	font-weight: 800;
	margin-bottom:.3em;
	color:#009bf0;	
}
.challengeSelector form select {
 	width:100%;
 	margin-bottom:1em;
 	font-size: 1.2em;
}

/* end @media*/}



/* super wide window */
@media all and (min-width: 140em) and (max-width: 2000em) {

body {
	font-size: 1.5em;
}
.widthController {
	max-width:50em;
}

/* end @media*/}









/* for higher resolutions (android and retina) */
@media screen and (-webkit-min-device-pixel-ratio: 1.5), screen and (max--moz-device-pixel-ratio: 1.5) {


/* end @media*/}