/**
 * @file
 * Positioning for a responsive layout. State_zen theme 
 * All overrides and DipNote specific are place here
 
 */

/* Max width of page is set to 1200px in Responsive.css.  
 * Changed for DipNote to remove the max-width. 
 * May need to replace with a max-width as theme has not been tested on larger screens
 * The margins are not changed, but have left them in case. */




/*@media all and (min-width: 481px) and (max-width: 740px) {
	
	#page {
  		margin-left: 2em;
  		margin-right: 2em;
  		max-width: none;
	}


	blockquote {
    	padding-left: 20px;
    	padding-bottom: 3px;
    	-webkit-margin-start: 40px;
   		-webkit-margin-end: 40px;
	}
	
	.featured {
		-webkit-box-sizing: border-box;
  		-moz-box-sizing: border-box;
  		box-sizing: border-box;
	}

	.featured .featured_text {
		padding: 5px;
		width: 38%;
		float: left;
	}
	
	.featured .featured_lg_img {
		padding: 5px;
		width: 62%;
		float: left;
	}
	
	.featured .featured_sm_imgs {
		padding: 0px 5px;
		width: 100%;
		float: left;
		margin-top: 0;
	}
	
	.splash_title_lg a {
		font-size: 1em;
    }
    
	.splash_title_sm a {
	    font-size: .9em;
    	line-height: 1;
   		height: 2em;
   }
   
		
	.live-bottom {
		width: 100%;
		display: table;
		margin: 0 auto;
	}
	
	.live-bottom .live1 {
		padding: 5px;
		width: 48%;
		float: left;
	}
	
	.live-bottom .live2 {
		padding: 5px;
		width: 48%;
		float: right;
	}

	.footer2_left {
		width:50%;
		float: left;
	}

	.footer2_right {
		width: 50%;
		float: right;
	}
	
	.footer {
		text-align: center;
	}
	
	.footer .blogroll {
		margin: 5px 10px;
		display: block;
		border-right: none;
	}
	
	#participate-page .panel-panel {
		width: 50%;
	}
}  end min 480 max 740 */

@media all and (min-width: 741px) {
	
/*	#page {
            margin-left: 1.5%;
            margin-right: 1.5%;
            max-width: none;
	}*/

	blockquote {
            padding-left: 20px;
            padding-bottom: 3px;
            -webkit-margin-start: 40px;
            -webkit-margin-end: 40px;
	}
	
	.featured {
		-webkit-box-sizing: border-box;
  		-moz-box-sizing: border-box;
  		box-sizing: border-box;
	}

	.featured .featured_text {
		padding: 5px;
		width: 21.95%;
		float: left;
		-webkit-box-sizing: border-box;
  		-moz-box-sizing: border-box;
  		box-sizing: border-box;
	}
	
	.featured .featured_lg_img {
		padding: 0px 5px; 
		width: 60%;
		float: left;
		-webkit-box-sizing: border-box;
  		-moz-box-sizing: border-box;
  		box-sizing: border-box;
	}
	
	.featured .featured_sm_imgs {
		width: 18.05%;
		float: left;
		-webkit-box-sizing: border-box;
  		-moz-box-sizing: border-box;
  		box-sizing: border-box;
	}
	
	.splash_title_lg a {
		font-size: 1.25em;
    }
    
	.card {
		width: 100%;
		display: table;
		margin: 0 auto;
		text-align: center;
	}
	
/* .media needs to change to a class it's here for testing purposes only */
	.cards .story_cards {
		padding: 5px;
		width: 33.33%;
/*		float: left;*/
		-webkit-box-sizing: border-box;
  		-moz-box-sizing: border-box;
  		box-sizing: border-box; /* 5 */
	}
	
	 .live-bottom {
		width: 100%;
		display: table;
		margin: 0 auto;
	}
	
	.live-bottom .live1 {
		padding: 5px;
		width: 48%;
		float: left;
	}
	
	.live-bottom .live2 {
		padding: 5px;
		width: 48%;
		float: right;
	}
	
	.footer2_left {
		width: 45%;
		float: left;
	}

  	.footer2_right {
		width: 25%;
		float: right;
  	}
  	
  	.footer .blogroll {
		display: inline;
		border-right: 1px solid #205493;
	}
} /* end min 741 */

@media all and (min-width: 741px) and (max-width: 1440px) {
    .admin-menu #at4-follow.at4-follow {
        position: absolute;
        top: 116px !important;
        right: -7px;
        z-index: -20;
    }
    
    .not-logged-in #at4-follow.at4-follow {
        position: absolute;
        top: -50 !important;
        right: 0;
        z-index: -10;
    }
    
    .not-logged-in .at4-follow-inner {
        top: 145px;
        left: 10px;
    }

}

@media all and (min-width: 1181px) and (max-width: 1440px) {
    
/*    #page {
        margin-left: auto;
        margin-right: auto;
        max-width: 1440px;
    }*/
        
    .admin-menu #at4-follow.at4-follow {
        position: absolute;
        top: 116px !important;
        right: 109px;
    }
    
    .not-logged-in .at4-follow-inner {
        position: relative;
        top: 93px;
        right: 109px;
    }
}




@media (min-width: 1441px) {
    
    #page {
        margin-left: auto;
        margin-right: auto;
        max-width: 1440px;
    }
        
    .admin-menu #at4-follow.at4-follow {
        position: absolute;
        top: 116px !important;
        right: 109px;
    }
    
    .not-logged-in .at4-follow-inner {
        position: relative;
        top: 93px;
        right: 109px;
    }
    
    #block-views-state-front-page-block-3 {
        width: 24.25%; 
    }
    
}