/* (100/screensize)*960 = % */


@media screen and (max-width: 1920px)  {
  	.lof-container::after {
		content: url(images/header-image-shadow.png);
		left: 420px;
		position: relative;
		top: -2px;
	}
  
  	/*
  	#legend-title {
		position: absolute;
		top: 0px;
		left: 730px;
	}
  
  	#role-legend-container {
		left: 680px;
		position: absolute;
		top: 130px;
	}*/
}

@media screen and (max-width: 1400px)  {
	#header {
		border-bottom:2px solid #f0bc7a;
  	}
  
  	.lof-container::after {
		content: url(images/header-image-shadow.png);
		left: 140px;
		position: relative;
		top: -2px;
	}
}

@media screen and (max-width: 1024px)  {
	#header {
		/*border-bottom:2px solid red;*/
  	}
  
  	#legend-title {
		left:360px;
  	}
  
  	#role-legend-container {
		left:300px;
  	}
}


@media screen and (max-width: 850px) {
  
  	/******* STAFF PAGE *******/ 
  	
	#team-content {
		width:100%;
	}

	#elements-container {
		width:100%;
	}

	#elements {
		margin:0 auto;
		width:530px;
		margin-top:200px;
	}

	#legend-title {
		position:static;
		margin-bottom:40px;
		margin-left:10px;
		margin-top:40px;
	}
  
  	#staff-legend {
		left:15.5%;
  	}
	
  	#legend-title h1 {
		line-height:1em;
		margin-bottom:-.4em;
  	}

	#role-legend-container {
		position:static;
		margin-bottom:40px;
		margin-left:10px;
	}

	#connie, .blue-bg, .green-bg, .orange-bg, .purple-bg, .grey-bg {
		width:260px;
	}

	#elements .member, #elements .fifth, #elements .sixth {
		margin-bottom:20px;
		width:260px;
	}

	.connie-bio {
		margin-top:160px;
		left:0;
	}	

	.bio_fifth, .bio_sixth {

		left:0;
		/*
		margin-top:146px;
		
		*/
	}

	.bio, .connie-bio, .bio_fifth, .bio_sixth {
		display:block !important;
		width:260px;
		height:145px;
		top:0;
	}

	#row-0, #row-1, #row-2, #row-3 {
		position:static;
		height:auto;
	}

	.fifth, .sixth {
		position:static;
		top:0;
		left:-10px;
	}

	#connie, #row-0 .member, #row-1 .member, #row-2 .member, #row-3 .member {
		float:left;
		position:static !important;
		width:260px;
	}

	
  
  
  	/******* COMMON CLASSES *******/ 
	.section { width:100%; } 
  	.reports li.third-li { margin-left:0;}
  	.reports li.third-li, .reports li.fourth-li { margin-top:40px; }
  
  
  	/************ HEADER **********/ 
	#header { 
		/*border-bottom:2px solid pink; */
		margin:0 20px 0 20px;
		width:auto;
  		/*width:770px;*/
  	}
  
  	/*
  	#header select {
		display:inline;
		float:right;
  	}*/
  
  	.mobile nav ul {
		display:none;
  	}
  
  	#header .mobile-nav {
		display:inline;
		float:right;
		width:120px;
  	}
  	
  	#nav-main {
		display:none;
		margin:0 0 0 0; 
		/*margin:40px -30px 0 0px;*/
  	}
  	
  
  
  	/************ HOME ************/ 
  	.badges { width:100%; }
  	.badges li:last-child { margin-left:0; }
  	.separator-left, .separator-right { display:none; }
  	.sponsors-cage { background-image:none; }
  	.sponsors-cage .amelia { margin-left:10px; }
  	.scfg-info .address { display:none; }
  
  
  	/*********** CONTENT **********/
  
  	#tabs div img {
		display:none;
  	}
  
  	.ui-tabs .ui-tabs-nav li {
		width:100px;
  	}
  
  	#tabs {
		margin-left:30px;
		width:480px;
  	}
  
  	.daily-info {
		margin:0 auto;
		width:500px;
  	}
  
  	.news, .events, .social, .volunteer {
		border:0;		
  	}
  
  	.news, .events {
		border-bottom:2px dotted #ded9d6;
  	}
  
  	.news, .social {
		margin-right:10px;
  	}
  
  	.sponsor-showcase {
		display:none;
  	}
  
  	.volunteer li {
		padding:0 36px 10px 25px;
  	}
    
  	.type-page {
		/*margin:0 20px 0 20px;*/
		margin:0 20px 0 20px;
  	}
  
  	.overview-image, .top-image {
		height:155px;
		margin-bottom:20px;
		/*margin:0;*/
		/*margin:15px 20px 0px 20px;*/
  	}
  
  	.overview-image::after {
		display:none;
  	}
  
  	.section-mq {
		/*width:90%;*/
 	}
  
  	.page-header-template-title {
		width:120%;
  	}
  
  	.header-page-side {
		border-left:0;
		padding-left:0;
  	}
  
  	.mission-side, .board-at-glance {
		display:none;
  	}
  
  	.mission {
		width:auto;
  	}
  
  	.mission p {
		margin:40px 40px 30px 60px;
  	}
  
  
  	.mission-content {
		margin:0 20px 0 20px;
		width:auto
  	}
  
  	.reports {
		width:470px;
  	}
  
  	.sidebar {
		display:none;
  	}
  
  	/************ FOOTER **********/
  
  	.copyright {
		margin-left:40px;
  	}
  
  	.address {
		display:none;
  	}
  
  	#footerButton {
		display:none;
  	}
  
  	/*********** HEADER PAGE CONTENT **********/ 
  
  	.header-page-content {
		margin-right:0;
		width:auto;
  	} 
  
  	.header-page-side {
		width:100%;
  	}
  
  	.agenda-calendar {
		float:left;
		margin:0 0 0 20px;
		width:300px;
  	}
  
  	#contact-form, #contact-table {
		width:100%;
  	}
  
  	#contact-table ul {
		float:left;
		width:280px;
  	}
  
  	.extensions {
		border-top:none;
		padding-top:0;
  	}
  
 	.network-for-good {
		margin:0 0 0 20px;
  	}
  
  	.testimonials, .great-non-profits, .network-for-good, .vol {
		float:left;
		width:280px;
  	}
  
  	.social-media-links {
		display:none;
  	}
  
  	.top-image img, .overview-image img, .donation-top-image, .tab-image {
		display:none;
  	}
  
  	.programs-top-text, .volunteer-top-text, .donation-top-text, .sites-top-text, .collab-top-text {
		height:155px;
		margin:0 20px 0 20px;
		width:auto;
  	}
  	
  	.sites-top-text {
		width:100%;
  	}
  
  	.sites-top-text p {
		margin:45px 20px 0 20px;
  	}
  
  	.donation-top-text {
		height:190px;
  	}
  
  	.header-page-side {
		margin-top:20px;
  	}
  
  	.board-members {
		width:auto;
  	}
  
  	.tab-image {
		display:none;
  	}
  
  	.chapter-about {
		width:100%;
  	}
  
  	.board-container {
		/*margin:0 20px 0 20px;*/
  	}
  	
  	#staff-legend {
		top:0px;
  	}
  
  	.contact-us-img, .wwus-img, .sites-img {
		display:none;
  	}
  	
  	.colleges .fb_iframe_widget iframe {
		display:none;
  	}
  
  	.blog-page-content {
		float:none;
		margin:0 20px 0 20px;
		width:auto;
  	}
  
  	.blog-sidebar {
		display:none;
  	}
  
  	.lined-item-content {
		margin:0 20px 0 20px;
		width:auto;
  	}
  
  	.catalyst-speakers {
		width:auto;
  	}
  
  	.catalyst-speakers > li {
		display:none;
  	}
  
  	.catalyst-sponsors {
		margin-top:40px;
		width:auto;
  	}
  
  	.catalyst-sponsors li {
		float:left;
  	}
  
  	.speakers-mobile {
		display:block;
  	}
  
  	.speaker-bio {
		font-size:1em;
		line-height:1.7em;
  	}	
  
  	.gform_wrapper .top_label input.medium, .gform_wrapper .top_label select.medium {
		width:60% !important;
		-webkit-appearance: none;
  	}
  
  	.gform_wrapper .top_label input.large, .gform_wrapper .top_label select.large, .gform_wrapper .top_label textarea.textarea {
		width:85% !important;
		-webkit-appearance: none;
  	}
  
  	.overlay-container { 
		position:static;
  	}
  
  	.img-overlay {
		left:50%;
		margin-left:-120px;
  	}
  
  	
  
  	.pic-details {
		left:50%;
		margin-left:-120px;
  	}
  
  	.lof-navigator-outer {
		display:none;
  	}
  
  	.lof-main-outer .lof-next, .lof-main-outer .lof-previous{
		display:none !important;
  	}
  
  	.press-page {
		margin:0 20px 0 20px;
  	}
  
  	.section-auto {
		width:auto;
  	}
  
  	.newsletter-social-bar {
		display:none;
  	}
  
  	.blog-post {
		width:100% !important;
  	}	
}



@media screen and (max-width: 650px) {
  
	#header {
		/*border-bottom:2px solid yellow;*/
  	}
  
  	#header select {
		display:inline;
		float:right;
  	}
  
  	.donate-now {
		display:none;
  	}
  
  	#search-bar {
		display:none;
  	}
  
  	#nav-main {
		display:none;
  	}
  
  	#elements {
		margin:0 auto;
		width:260px;
		margin-top:260px;
	}

	.bio_fifth, .bio_sixth {
		margin-top:0;
	}
  
  	.molecule {
		width:219px;
  	}
  
  	.molecule li {
		float:none;
		height:252px;
		margin-left:0;
		width:219px;
	}
  
  	.inner-hex {
		position: relative;
		left:0;
		top:0;
	}
  
  	.mission {
		margin-top:100px;
  	}
  
  
  	/*********** HEADER PAGE CONTENT **********/ 
	
  	.type-page {
		/*margin:-15px 20px 130px 20px;*/
  	}
  
  	.mission p {
		margin-top:-70px;
  	}
  
  	.header-page-side {
		display:none;
  	}
  	
  	.programs-top-text, .volunteer-top-text, .donation-top-text, .sites-top-text, .collab-top-text {
  		display:none;
	
		height:auto;
		padding-bottom:15px;
  	}
  
  	 .overview-image::after, .top-image::after {
		display:none;
  	}
  
  	.agenda-calendar {
		margin:20px 0 0 0;
  	}
  
  	.amount-desc {
		display:none;
  	}
  
  	.donate-amounts div {
		margin-top:40px;
  	}
  
  	.donate-amounts {
		margin:-40px auto 60px auto;
		width:110px;
	}
  
  	.checks-method {
		display:none;
  	}
  
  	.donate-step-1, .donate-step-2, .donate-step-3 {
		margin:40px auto;
		width:280px;
  	}
  
  	.steps {
		width:230px;
  	}
  
  	.year {
		width:308px;
  	}
  
  	#awards-case .year li {
		float:none;
		margin-left:0;
 	}
  
  	.one-in-row {
		margin-left: 0 !important;
	}
  
  	.board-container {
		/*margin-top:-10px;*/
  	}
  
  	#container {
		/*margin-top:-30px;*/
  	}
  
  	.other-sponsors-2 {
		margin-left:0;
		padding:0;
  	}
  
  	.overview-image, .top-image {
		display:none;
  	}
  
  	.catalyst-speakers > li {
		display:none;
  	}
  
  	.catalyst-details {
		border:0;
		margin-left:20px;
		padding-left:0;
  	}
  
  	.line-one {
		font-size:1.9em;
  	}
  
  	.line-two {
		font-size:1.4em;
  	}
  
  	.catalyst-title {
		line-height:1.4em;
  	}
  
  	.site-info {
		margin:0 auto;
		margin-bottom:20px; 
		float:none;
  	}
  
  	.molecule {
		display:none;
  	}
  
  	.ambassador-mobile {
		display:block;
		margin:0 auto;
		width:219px;
  	}
  
  	.lof-main-outer .lof-next, .lof-main-outer .lof-previous{
		display:none !important;
  	}
  
  	.error-404 {
		margin-bottom:16%;
  	}
  
  	.pic-details {
		left:30%;
  	}
  
  	.placeholder-donate-button-650 {
		margin:-55px 0 0 55px;
 		display:block; 
	}	
  
  	#googleDonate, #paypalDonate {
		margin:-59px 0 0 40px;
  	}
  
  	#placeholder-donate-button, .donate-button-main {
		display:none;
  	}
  
  	.donate-button-650 {
		display:block;
  	}
}


@media screen and (max-width: 480px) {
  	/******* COMMON CLASSES *******/ 
	/*.section { width:245px; }*/
  
  
	#header {
		/*border-bottom:2px solid #f0bc7a;*/
  	}
  
  	/************ HOME ************/
  	.daily-info li { margin-bottom:15px; }
  	.badges li { margin:0 0 15px 0; }
  
  	/*********** CONTENT **********/ 
  
  	.section-mq {
		/*margin-top:60px;*/
  	}
  
  	.network-for-good {
		margin:20px 0 0 0;
  	}
  
  	.reports {
		margin:0 auto;
		margin-top:30px;
		width:219px;
  	}
  
  	.reports li {
		margin:0 0 40px 0;
  	}
  
  	.reports li.third-li, .reports li.fourth-li {
		margin-top:0;
  	}
  
  	#tabs {
		display:none;
  	}
  
  	.daily-info {
		width:243px;
  	}
  
  	.from-the-blog {
		float:none;
		margin:0 auto;
  	}
  
  	.social {
		border-bottom:2px dotted #ded9d6;
  	}
  
  	#legend-title h1 {
		line-height:1.2em;
  	}
  
  	#elements-container {
		margin-top:-40px;
  	}
  	
  	.donate-method {
		margin:0 auto;
		width:90px;
  	}
  
  	.donate-method div {
		float:none;
		margin:0;
  	}
  
  	#sites .ui-tabs-nav {
		margin:0;
		margin-bottom:30px;
		width:300px;
  	}
  	.colleges-unis .ui-tabs-nav {
		width:330px !important;
  	}
  
  	#elements {
		margin-top:430px;
  	}
  
  	.blog-posts li div {
		margin-left:70px;
  	}
  
  	.blog-post-time {
		float:left;
		font-size:1em;
		line-height:1em;
		margin-left:0;
		width:30px;
	}
  
  	.catalyst-details {
		margin-top:7tpx;
		margin-left:0;
  	}
  
  	.error-404 {
		font-size:12em;
  	}
  
  	#sites #tab-1, #sites #tab-2, #sites #tab-3 {
		margin-top:60px;
  	}
  
  	.pic-details {
		left:25%;
  	}
  
}


@media screen and (max-width: 320px) {
 	#header {
		/*border-bottom:2px solid blue;*/
  	} 
  
  	#header .mobile-nav {
		width:100px;
  	}
  
  	.donate-step-1, .donate-step-2, .donate-step-3 {
		margin:40px auto;
		width:220px;
  	}
  
  	.steps {
		left:10px;
		padding-right:10px;
		width:200px;
  	}
  
  	.donate-method {
		margin:0 auto;
		width:110px;
  	}
  
  	.donate-method div {
		margin-top:20px;
  	}
  
  	#legend-title h1 {
		margin-left:-30px;
  	}
  
  	#awards-case {
		margin-left:-15px;
  	}
  
  	.site-info {
		width:195px;
  	}
  
  	#sites .ui-tabs-nav {
		margin-bottom:40px;
		width:240px;
  	}
  
  	#sites #tab-1, #sites #tab-2, #sites #tab-3 {
		margin-top:120px;
  	}
  
  	.colleges-unis .ui-tabs-nav {
		margin-bottom:40px !important; 
		width:200px !important;
  	}
  
  	.colleges-unis #tab-1, .colleges-unis #tab-2, .colleges-unis #tab-3 {
		margin-top:40px !important;
  	}
  
  	.pic-details {
		left:16.1%;
  	}
  
  	.placeholder-donate-button-650 {
		margin:-52px 0 0 23px;
	}
  
  	#googleDonate, #paypalDonate {
		margin:-59px 0 0 8px;
  	}
}

