/* ============= */
/* Media Queries */
/* ============= */

@media (max-width: 1024px) {

	/* Home Page */
	.container {
    width: 900px;
	}
	#landing {
    background-position: 42% -100px;
	}
	.video-wrap {
    width: 550px;
  }
  .video-wrap iframe {
    width: 550px;
    height: 340px;
  }
  .bx-wrapper {
    width: 550px;
	}

	/* Dashboard Page */
	.span6 {
		width: 47%;
	}
	.instagram li {
    width: 20%;
  }
  #thanks .join-twitter a {
  	padding: 20px 60px;
  }
  .join-button a span {
    right: 58px;
  }

}

@media (max-width: 979px) {
	.mobile {
		display: block;
	}

	/* Home Page */
	.container {
    width: 750px;
	}
	.pattern, .intro-text, .learn-how, #bx-pager, #bx-more, .support-link, .subscribe-link, .share-video span, ul.nav {
		display: none;
	}
	.nav {
    top: 10px;
    right: 0px;
	}
	#landing {
    background-position: 100% 20%;
    height: 800px;
	}
	.landing-content {
    top: 20px;
  }
  .water-logo {
    width: 140px;
    height: 48px;
    background-size: 100%;
  }
	.video-wrap {
    width: 716px;
    float: none;
  }
  .video-wrap iframe {
    width: 716px;
    height: 340px;
  }
  .btn-wrap {
    width: 100%;
    float: none;
	}
  .support-link-mobile {
  	margin: 30px 0;
  	display: block;
  }
  .donate-link {
  	width: 45%;
  	float: right;
  }
  #learn-section { display:none; }
  .share-video {
    font-size: 220%;
    width: 100%;
    margin-top: 0px;
	}
	#share-section {
    width: 45%;
	}
	.social-btns {
    top: 74px;
   	left: 20.2%;
  }
  .bx-wrapper {
    width: 714px;
	}
	.thumbs-heading {
		max-width: 724px;
	}
	div.checkboxField:not(#foo) > input[type='checkbox'] {
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=10);
    opacity: 1;
    vertical-align: top;
  }
  div.checkboxField:not(#foo) > input[type='checkbox'] + label {
    margin-left: 0px;
    padding-left: 4px;
    width: 200px;
    height: 24px;
    background: none;
  }
  #settings-form .checkboxField { margin: 24px 0 14px; }

	/* Dashboard Page */
	.span6 { width: 100%; margin: 0 0 20px; float: none; }
	.thanks-text h1 {
		font-weight: 600;
		font-size: 102px;
		line-height: 102px;
		text-transform: uppercase;
		margin: 112px 0px 0 0;
		width: 355px;
		float: right;
	}
	.toilet-frame {
		margin-top: 0;
		width: 50%;
	}
  #thanks .join-twitter a {
  	padding: 20px 5%;
  	width: 50%;
  	margin-left: 20%;
  	text-align: center;
  }
  #thanks .join-button a span { right: 48px; }

  /* Alerts */
  #ajax-form .control-label { font-size: 100%; }

	/* Sign In */
	.signin .span3 { display: none; }
	.signin .span6 { width: 60%; margin-left: 20%; }
	.signin .offset3 { margin-left: 0; }
	.signin .row-fluid .offset3:first-child { margin-left: 20%; }

	/* Footer */
	.signin #footer-base .span6 { margin-left: 2.127659574468085%; float: left; width: 48.93617021276595%; }
	.signin #footer-base .span6:first-child { margin-left: 0; }
  .alert-text { margin-left: 240px; }

  /* Video Page */
  .video .donate-link {
    width: 45%;
    float: none;
    margin-left: 27.5%;
  }

  .video-landing-full .video-wrap {
    float: none;
    padding: 18px 2.1%;
    width: 95.8%;
  }

  .video-landing-full .video-wrap iframe, .video iframe {
      width: 100%;
      height: 430px;
  }
  iframe { max-height: 470px !important; }
}

@media (max-width: 767px) {
	/* Home Page */
	.container {
    width: 463px;
	}

	#landing {
    background-position: center 20%;
    height: 800px;
  }

	.video-wrap, .video-landing-full .video-wrap {
    width: 429px;
    float: none;
  }
  .video-wrap iframe, .video-landing-full .video-wrap iframe {
    width: 429px;
    height: 240px;
  }

  #settings-form .fieldWrapper {
    margin: 10px 0;
    width: 50%;
  }

  #user-ribbon h2 {
    padding-bottom: 15px;
  }

  #user-ribbon h4 {
    font-size: 140%;
  }

  .bx-wrapper {
    width: 427px;
  }

  .alert-text {
    margin-left: 120px;
  }

  .input-append {
    margin-top: 4px;
  }

  .thanks-text h1 {
    margin: 0 0 20px;
    width: 100%;
    float: none;
    text-align: center;
  }

  .toilet-frame {
    margin-left: 25%;
  }

  .join-button a {
    padding: 20px 40px;
  }

  .signin .row-fluid .offset3:first-child {
    margin-left: 0;
  }

  .signin #footer-base .span6 {
    margin-left: 0;
    float: none;
    width: 100%;
  }

  #thanks .join-twitter a {
    width: 90%;
    margin-left: 0;
    text-align: center;
  }

  #thanks .join-twitter a span {
    top: 7px;
  }

  .social-btns {
    top: 74px;
    left: 0;
    width: 300px;
  }

  .responsive-nav li a {
    width: 80%;
    margin: 10px 0%;
    font-size: 100%;
  }

  #video-main, #video-thumbs {
    padding: 60px 0
  }

  .row-fluid .span6 {
    width: 100%;
    margin: 0;
    padding: 0;
    float: none;
  }

}

@media (max-width: 480px) {
	.container {
    width: 300px;
	}

  .video-wrap, .video-landing-full .video-wrap {
    width: 300px;
    float: none;
    padding: 0;
    height: 168px;
  }

  .video-wrap iframe, .video-landing-full .video-wrap iframe {
    width: 300px;
    height: 168px;
    margin: 0;
  }

  .slider-bg {
    padding: 0;
  }

  .bx-wrapper {
    width: 300px;
  }

  #landing {
    background-position: center 40%;
    height: 800px;
  }

  .landing-content h1 {
    font-weight: 600;
    font-size: 77px;
  }

  .landing-content .title-span {
    font-size: 50px;
    line-height: 14px;
  }

  .med-btn {
    font-size: 186%;
  }

  #share-section, .donate-link {
    width: 40%;
  }

  .join-button a {
    font-size: 18px;
	}

  .join-button a span {
    top: 10px;
    right: 48px;
  }

  a.close {
    top: 32px;
  }

  .thanks-text h1 {
    font-size: 83px;
  }

  .toilet-frame {
    margin-left: 10%;
    width: 80%;
  }

  #thanks .join-button a span {
    right: 19px;
    top: 12px;
  }

  .next-button {
    font-size: 20px;
  }

  .instagram li {
    width: 50%;
  }

  #user-ribbon .span9 {
    width: 100%;
    text-align: center;
    margin: 0;
  }

  #user-img {
    margin: 50px 0 10px 75px;
  }

  #user-ribbon h4 {
    line-height: 40px;
  }

  #user-ribbon h4:last-child {
    padding-top: 0;
  }

  #settings-form .fieldWrapper {
    width: 100%;
  }

  .alert-text {
    margin-left: 38px;
  }

  /* Video Page */

  .video-logo {
    position: absolute;
    top: 20px;
    width: 133px;
    height: auto;
  }

  .video .donate-link {
    width: 100%;
    margin-left: 0;
    padding-left: 0;
    padding-right: 0;
  }

}