/************************************************************************************
MEDIA RESPONSIVE 768
*************************************************************************************/

@media screen and (min-width: 740px) and (max-width: 800px) {

	@viewport { width: device-width; zoom: 1.0; }	
	@-ms-viewport { width: 768px; }
	@-o-viewport { width: 768px; }

	body {
		width: 760px;
		align: left;
	}

	body #nav li:nth-child(1), body #nav li:nth-child(8) {
		display: none;
	}

	body #nav ul {
		z-index: 10;
	}

	body #nav ul li:first-child, body #nav ul li:last-child {
		display: block;
	}
	
	body #nav {
		margin-left: 0;
		padding-left: 15px;
	}
	
	body #logo, body #logo-statistics, body #logo-dangerous, body #logo-blog, body #logo-legislating, body #logo-victim, body #logo-safe {
		background: none;
		width: 760px;
	}
	
	body #graybackground, body #header, body #navigation, body #content, body #header {
		width: 760px;
	}	
	
	body #nav {
		width: 740px;
		}

	body .about img {
		position: absolute;
		top: 59px;
		left: -130px;
	}
	
	.logoimg { 
		float: left; 
		padding-left: 30px; 
		padding-top: 25px; 
		width: 268px; 
	}

	.logodesc {
		padding-left: 45px;
	}

	.graybackground1 {
		width: auto;
		}

	.graybackground2, #sidebar {
		display: none;
		}
		
	.graybackground3 {
		float: left;
		width: auto;
		margin-left: 5px;
		}

	.search-box {
	background: #d3d3d3;
	}
	
	#content #leftcol {
		clear: left;
		width: 650px;
		padding: 0;
		margin: 0 0 0 30px;
	}
	
	#content #breadcrumb {
		position: relative;
		top: 0; left: -30px;
		width: 90%;
	}

	body #footer {
		width: 760px;
		align: left;
	}	
	
	body #footer .right {
		clear: both;
		float: left;
		margin-top: 15px;
	}	
	
	#footer p.socialrow, #footer p.subscribe {
		float: left;
	}

}

/************************************************************************************
MEDIA RESPONSIVE 480
*************************************************************************************/

@media screen and (min-width: 400px) and (max-width: 530px) {

	@viewport { width: device-width; zoom: 1.0; }	
	@-ms-viewport { width: 480px; }
	@-o-viewport { width: 480px; }
	

	body {
		width: 460px;
		overflow-x: hidden;
		box-shadow: 0 0 6px 4px #d5d5d5;
		}	

	body div object, #leftcol .header img {
		display:none;
	}	
	
	p, hr, h1, h2, h2.bar, h3, h4, h4.blogdate table {
		width: 420px;
		}
	
	#leftcol p.small, #leftcol a.bodylinksmallbold:link, #leftcol a.bodylinksmallbold:hover, #leftcol a.bodylinksmallbold:visited {
		font-size: 14px;
	}	
	
	#leftcol #orange a:link, #leftcol #orange a:hover, #leftcol #orange a:visited {
		font-size: 14px;
		line-height: 30px;
	}
	
	#leftcol h1 {
		width: 95%;
		padding-right: 0;
		}
	
	body #headerwrapper {
		width: 460px;
		background: url(img/background-masthead-2.png) repeat-x;
	}
	
	body #graybackground, body #navigation, body #header {
		width: 460px;
	}
	
	.graybackground1, .graybackground3 {
		width: auto;
	}
	
	.graybackground3 {
		padding-right: 8px;
	}
	
	.search-box {
		width: 120px;
	}
			
	.logoimg { 
		position: absolute;
		left: 5px; top: 12px;
		padding-left: 10px;
	}

	body #logo, body #logo-statistics, body #logo-dangerous, body #logo-blog, body #logo-legislating, body #logo-victim, body #logo-safe {
		background: none;
		width: 460px;
	}

	body .about img {
		float: right;
		position: absolute;
		top: 211px;
		left: -130px;
	}

	ul, ul.list {
		width: 95%;
		}
		
	#subnav, .graybackground2, #sidebar, .logodesc, #leftcol .morenews {
		display: none;
	}
	
	body #nav {
		list-style: none;
		float: left;
		width: 460px;
		height: auto;
		margin-top: 90px;
		margin-left: -5px;
		padding-top: 0;
		padding-left: 0;
		background: url(img/gray-ruler.gif) repeat-x bottom;
		padding-bottom: 15px;
	}
	
	body #nav ul {
		z-index: 10;
	}	

	body #nav li:nth-child(-n+11) {
		padding-left: 10px;
		margin-right: 0;
		padding-right: 0;
		width: 104px;
		border-top: 1px solid #e7e7e7;
	}

	body #nav li:nth-child(2) {
		background: none;
	}

	body #nav li:nth-child(8) {
		display: block;
	}

	body #nav li a {
		font-size: 1.1em;
	}

				/*--- dropdown ---*/
			
	
				#nav ul li:nth-child(-n+14) {
					display: block;
					border-top: 0;
					width: 145px;
					padding: 5px 0 0 0;
				}
			
				body #nav li:hover ul { 
					display: block;
					width: 145px;
					position: relative;
					left: 0;
					top: 8px;
					padding: 0;
					margin: 0;
				}
				
				#nav ul ul, #nav ul ul li, #nav li:hover ul ul, #nav li:hover ul ul ul {
					display: none;
				}
				
				body #nav ul li a {
					font-size: 14px;
				}
				
				/*--- dropdown ---*/
	
	body #content {
		width: 420px;
		margin-bottom: 0;
		padding-bottom: 0;
		padding: 0 10px 0 10px;
	}
	
	#content #breadcrumb {
		width: 420px;
		position: relative;
		top: -10px; left: -60px;
	}
		
	#content #leftcol {
		clear: left;
		width: 420px;
		padding: 0;
		margin: 0;
	}
	
	#leftcol h1 {
		padding-top: 0;
		margin-top: 0;
	}
	
	body #leftcol h2, body #leftcol h2.bar {
		width: auto;
		padding-right: 15px;
	}
	
	#leftcol p.star {
		text-indent: 23px;
		vertical-align: top;
		background: url(img/star-icon.gif) no-repeat 0 0;
	}	
	
	#leftcol .quotebox-about p {
    	line-height: 18px;
    	width: auto;
    	padding-right: 30px;
	}
	
	#leftcol ol li {
		width: 113%;
	}	
	
	#leftcol .colLeft ul.multiCol li {
		width: 350px;
		padding-right: 0;
		margin-right: 0;
	}

	#leftcol .colRight ul.multiCol li {
		width: 350px;
		padding-right: 0;
		margin-right: 0;
	}

	#leftcol .colRight ul.list li {
		width: 350px;
	}

	#leftcol .colLeft ul.list li {
		width: 350px;
	}
	

	#leftcol ul.list li, #leftcol #recentposts li {
		padding: 2px 0 10px 30px;
	}	
	

	#leftcol .colLeft {
		border: none;
	}
	
	#leftcol .colRight {
		clear: left;
		float: left;
		padding-left: 0;
	}

	.colLeft-color {
		width: 100%;
		border-right: 0;
	}

	#leftcol #grayquote p {
		width: 395px;
		padding-right: 0;
	}

	#leftcol #greenquote p {
		width: 395px;
		padding-right: 0;
	}
				
	#leftcol .contact-email-2 {
		position: relative;
		top: 0; 
		left: 0;
		margin-bottom: 15px;
	}
	
	#leftcol .contact-email-1 {
		display: none;
	}

	#leftcol p.box {
		width: 97%;
	}
	
	#leftcol blockquote p {
    	width: 380px;
	}

	#leftcol blockquote {
		margin-left: 20px;
	}
	
	#leftcol #chart {
		width: 420px;
	}

	#chart td, #chart td a:link, #chart td a:visited, #chart td a:hover {
		font-size: 14px;
	}
		
	#leftcol #chart th:nth-child(6), #leftcol #chart th:nth-child(7) {
		display: none;
	}
		
	#leftcol #chart td:nth-child(6), #leftcol #chart td:nth-child(7) {
		display: none;
	}

	#leftcol #button .extended {
		width: 180px;
   		position: relative;
    	top: -25px;
    	left: 210px;
	}
	
	#leftcol #recentposts {
		width: 460px;
	}

	#leftcol .photoboxRight {
		float: left;
		width: 90%;
	}

	#leftcol .photoboxLeft {
		float: left;
		width: 90%;
	}
	
	#leftcol .photobox-home-description {
		width: 100%;
		padding-bottom: 10px;
	}
	
	#leftcol p.photobox {
		width: 380px;
		font-size: 14px;
		line-height: 18px;
	}
		
	#leftcol .photoboxFeature {
		width: 380px;
	}

	#leftcol .photoboxFeature img {
		max-width: 360px;
		max-height: 133px;
		padding-bottom: 10px;
	}

	#leftcol a.bodylinksmall:link, #leftcol a.bodylinksmall:hover, #leftcol a.bodylinksmall:visited, #photobox .watch a:link, #photobox .watch a:hover, #photobox .watch a:visited, #photobox .read a:link, #photobox .read a:hover, #photobox .read a:visited {
		font-size: 14px;
	}	

	#leftcol .photo th:nth-child(3), #leftcol .photo th:nth-child(5) {
		display: none;
	}
		
	#leftcol .photo td:nth-child(3), #leftcol .photo td:nth-child(5) {
		display: none;
	}

	#leftcol .photo {
		width: 290px;
	}
			
	#leftcol .photo td {
		width: 290px;
		text-align: left;
	}	
	
	#leftcol #blog {
		margin-bottom: -30px;
		padding-bottom: 0;
		padding-right: 10px;
	}
		
	#leftcol h2.blogtitle {
		padding-right: 20px;
	}

	#leftcol #blog img {
		max-width: 420px;
		height: auto;
	}

	#leftcol table#fatal-chart {
		display: none;
	}

	#leftcol table.statchart th, #leftcol table.statchart td {
		clear: both;
		float: left;
		font-size: 14px;
		width: 90%;
	}	
	
	#leftcol table.statchart td {
		border-bottom: #dfd8bd solid 1px;
		padding-bottom: 6px;
		margin-bottom: 6px;
	}	

	#content #leftcol #blog blockquote {
		margin-left: 20px;
		padding-left: 0;
		width: 380px;
	}

	#blog #blog-comments {
		width: 395px;
		margin-bottom: 25px;
	}

	#blog #blog-comments p {
		width: 395px;
	}
	
	#blog #blog-ads, #blog #blognavbox {
		display: none;
	}
	
	body #leftcol #button-state-map {
		margin-top: -35px;
	}

	body h4.blogdate {
		padding-top: 10px;
	}

	#leftcol #footnote, #leftcol footnote ol li, #leftcol #footnote a:link, #leftcol #footnote a:hover, #leftcol #footnote a:visited  {
		font-size: 14px;
		line-height: 1.3em;
	}

   #footerwrapper {
		width: 420px;
   		padding-top: 20px;
   		padding-bottom: 0;
   		height: auto;
   		background: none;
   		border-top: #cccccc 2px solid;
   		margin: 20px 20px;
   	}

	#footerwrapper #footer {
		width: 95%;
		padding-top: 0;
		padding-left: 0;
	}
	
	#footer .footermenu { 
		width: 425px;
		margin-top: -20px;
		margin-left: -5px;
	}

  #footer .footermenu ul { 
		width: 100%;
		margin-bottom: 0;
	} 	

   #footer .footermenu ul li a { 
		padding: 3px;
		float: left;
		width: 90%;
		padding: 15px 0 15px 0;
		border-bottom: 1px solid #cccccc;
		border-right: none;
	} 

	#footer .copyrightmenu { 
		width: 100%;
		height: 35px;
	}
	
  #footer .copyrightmenu, #footer p.copyright:last-child, p.modified { 
		display: none;
	}	
	
	#footer p.copyright {
		padding: 0 0 20px 0;
		clear: left;
		margin-top: 0;
		line-height: 30px;
		font-size: 14px;
		width: 90%;
	}

	#footer p.copyright a:link, #footer p.copyright a:visited, #footer p.copyright a:hover {
		font-size: 14px;
	}	

	#footer p.socialrow, #footer #subscribe-footer, #footer p.modified {
		float: left;
	}
	
	#subscribe-footer {
		margin-top: 10px;
	}	

	#subscribe-footer a:link, #subscribe-footer a:visited, #subscribe-footer a:hover {
		font-size: 14px;
	}	
	
	body #footer .right {
		margin: 0;
		clear: both;
		float: left;
		width: 70%;
	}	
}


/************************************************************************************
MEDIA RESPONSIVE SMALLEST 320 and BELOW
*************************************************************************************/

@media screen and (min-width: 280px) and (max-width: 399px) {

	@viewport { width: 320px; }
	@-ms-viewport { width: 320px; }
	@-o-viewport { width: 320px; }
	
	body {
		width: 300px;
		box-shadow: 0 0 6px 4px #d5d5d5;
		}	
		
	body div object, #leftcol .header img {
		display:none;
	}		
	
	p, hr, h1, h2, h2.bar, h3, h4, h4.blogdate table {
		width: 270px;
		}
	
	#leftcol p.small, #leftcol a.bodylinksmallbold:link, #leftcol a.bodylinksmallbold:hover, #leftcol a.bodylinksmallbold:visited {
		font-size: 14px;
	}	
	
	#leftcol #orange a:link, #leftcol #orange a:hover, #leftcol #orange a:visited {
		font-size: 14px;
		line-height: 30px;
	}
	
	#leftcol h1 {
		width: 95%;
		padding-right: 0;
		}

	body #headerwrapper {
		width: 300px;
		background: url(img/background-masthead-2.png) repeat-x;
	}
	
	body #graybackground, body #navigation, body #header {
		width: 300px;
	}
	
	body .graybackground1, body .graybackground2, body .about img {
		display: none;
	}

	.logoimg { 
		position: absolute;
		left: 5px; top: 12px;
		padding-left: 10px;
	}

	body #logo, body #logo-statistics, body #logo-dangerous, body #logo-blog, body #logo-legislating, body #logo-victim, body #logo-safe {
		background: none;
		width: 300px;
	}

	ul, ul.list {
		width: 95%;
		}
		
	#subnav, .graybackground2, #sidebar, .logodesc, #leftcol .morenews, .about {
		display: none;
	}
	
	.graybackground3 {
		padding-right: 8px;
	}

	body #nav {
		list-style: none;
		float: left;
		width: 300px;
		height: auto;
		margin-top: 90px;
		margin-left: -5px;
		padding-top: 0;
		padding-left: 0;
		background: url(img/gray-ruler.gif) repeat-x bottom;
		padding-bottom: 15px;
	}
	
	body #nav ul {
		z-index: 10;
	}	

	body #nav li:nth-child(-n+11) {
		margin-right: 0;
		padding-right: 0;
		width: 100px;
		border-top: 1px solid #e7e7e7;
	}

	body #nav li:nth-child(2) {
		background: none;
	}
	
	body #nav li:first-child, body #nav li:last-child {
		display: none;
	}
	
	body #nav li a {
		font-size: 14px;
	}

			/*--- dropdown ---*/
		
		
			#nav ul li:nth-child(-n+14) {
				display: block;
				width: 145px;
				border-top: 0;
				padding: 5px 0 0 0;
			}
		
			body #nav li:hover ul { 
				display: block;
				width: 145px;
				position: relative;
				left: 0;
				top: 8px;
				padding: 0;
				margin: 0;
			}
			
			#nav ul ul, #nav ul ul li, #nav li:hover ul ul, #nav li:hover ul ul ul {
				display: none;
			}
			
			/*--- end ---*/			
	
	body #content {
		width: 94%;
		margin-bottom: 0;
		padding-bottom: 0;
		padding: 0 10px 0 10px;
	}
	
	#content #breadcrumb {
		width: 300px;
		position: relative;
		top: -10px; left: -60px;
	}
		
	#content #leftcol {
		clear: left;
		width: 270px;
		padding-left: 5px;
		margin: 0;
	}
	
	#leftcol h1 {
		padding-top: 0;
		margin-top: 0;
	}
	
	body #leftcol h2, body #leftcol h2.bar {
		width: auto;
		padding-right: 15px;
	}
	
	#leftcol p.star {
		text-indent: 23px;
		vertical-align: top;
		background: url(img/star-icon.gif) no-repeat 0 0;
	}	
	
	#leftcol .quotebox-about p {
    	line-height: 18px;
    	width: auto;
    	padding-right: 30px;
	}
	
	#leftcol ol li {
		width: 113%;
	}	
	
	#leftcol .colLeft ul.multiCol li {
		width: 230px;
		padding-right: 0;
		margin-right: 0;
	}

	#leftcol .colRight ul.multiCol li {
		width: 230px;
		padding-right: 0;
		margin-right: 0;
	}

	#leftcol .colRight ul.list li {
		width: 250px;
	}

	#leftcol .colLeft ul.list li {
		width: 250px;
	}
	
	#leftcol ul.list li, #leftcol #recentposts li {
		padding: 2px 0 10px 30px;
	}
	
	#leftcol .colLeft {
		border: none;
	}
	
	#leftcol .colRight {
		clear: left;
		float: left;
		padding-left: 0;
	}

	.colLeft-color {
		width: 100%;
		border-right: 0;
	}

	#leftcol #grayquote p {
		width: 250px;
		padding-right: 0;
	}

	#leftcol #greenquote p {
		width: 250px;
		padding-right: 0;
	}
				
	#leftcol .contact-email-2 {
		position: relative;
		top: 0; left: 140px;
		margin-bottom: 15px;
	}
	
	#leftcol .contact-email-1 {
		display: none;
	}

	#leftcol p.box {
		width: 97%;
	}
	
	#leftcol blockquote p {
    	width: 230px;
	}

	#leftcol blockquote {
		margin-left: 20px;
	}
	
	#leftcol #chart {
		width: 280px;
	}		

	#chart td, #chart td a:link, #chart td a:visited, #chart td a:hover {
		font-size: 14px;
	}
	
	#leftcol #chart th:nth-child(3), #leftcol #chart th:nth-child(4), #leftcol #chart th:nth-child(6),  #leftcol #chart th:nth-child(7)  {
		display: none;
	}
		
	#leftcol #chart td:nth-child(3), #leftcol #chart td:nth-child(4), #leftcol #chart td:nth-child(6),  #leftcol #chart td:nth-child(7) {
		display: none;
	}

	#leftcol #button .extended {
		display: none;
	}

	#leftcol #recentposts {
		width: 280px;
	}

	#leftcol .photoboxRight {
		float: left;
		width: 250px;
	}

	#leftcol .photoboxLeft {
		float: left;
		width: 250px;
	}
	
	#leftcol .photobox-home-description {
		width: 97%;
		float: left;
		padding-bottom: 10px;
	}
	
	#leftcol p.photobox {
		width: 260px;
		font-size: 14px;
		line-height: 18px;
	}
		
	#leftcol .photoboxFeature {
		display: none;
	}		
	
	#leftcol a.bodylinksmall:link, #leftcol a.bodylinksmall:hover, #leftcol a.bodylinksmall:visited, #photobox .watch a:link, #photobox .watch a:hover, #photobox .watch a:visited {
		font-size: 14px;
	}
	
	#leftcol #photobox .read a:link {
		display: none;
	}
	
	#photobox ul li {
		width: 260px;
	}	
	
	#leftcol .photo th:nth-child(3), #leftcol .photo th:nth-child(4), #leftcol .photo th:nth-child(5) 	{
		display: none;
	}
		
	#leftcol .photo td:nth-child(3), #leftcol .photo td:nth-child(4), #leftcol .photo td:nth-child(5) {
		display: none;
	}
	
	#leftcol .photo {
		width: 290px;
	}
			
	#leftcol .photo td {
		width: 290px;
		text-align: left;
	}
	
	#leftcol .donation {
		margin-left: -15px;
	}
	
	#leftcol #brochure div {
		clear: left;
		float: left;
		}

	#leftcol .quotebox-about, #leftcol .quotebox-dax, #leftcol .quotebox {
		float: left;
		margin-left: 0;
		width: 250px;
	}
	
	#leftcol .media-remove {
		display: none;
	}


	#leftcol #blog {
		margin-bottom: -30px;
		padding-bottom: 0;
		padding-right: 10px;
	}
		
	#leftcol h2.blogtitle {
		padding-right: 20px;
	}

	#leftcol #blog img {
		max-width: 280px;
		height: auto;
	}

	#leftcol table#fatal-chart {
		display: none;
	}
	
	#leftcol table.statchart th, #leftcol table.statchart td {
		clear: both;
		float: left;
		font-size: 14px;
		width: 90%;
	}	
	
	#leftcol table.statchart td {
		border-bottom: #dfd8bd solid 1px;
		padding-bottom: 6px;
		margin-bottom: 6px;
	}	
	
	#content #leftcol #blog blockquote {
		width: 230px;
	}

	#blog #blog-comments {
		width: 250px;
		margin-bottom: 25px;
	}

	#blog #blog-comments p {
		width: 250px;
	}
	
	#blog #blog-ads, #blog #blognavbox {
		display: none;
	}
	
	body #leftcol #button-state-map {
		margin-top: -90px;
	}

	body h4.blogdate {
		padding-top: 10px;
	}

	#leftcol #footnote  {
		padding-left: 10px;
	}
	
	#leftcol #footnote, #leftcol footnote ol li, #leftcol #footnote a:link, #leftcol #footnote a:hover, #leftcol #footnote a:visited  {
		font-size: 14px;
		line-height: 1.3em;
	}
	
   #footerwrapper {
		width: 280px;
   		margin: 10px 10px;
   		height: auto;
   		background: none;
   		border-top: #cccccc 2px solid;
   	}

	#footerwrapper #footer {
		width: 100%;
		padding-top: 0;
		padding-left: 0;
		margin-top: 0;
	}
	
	#footer .footermenu { 
		width: 300px;
		margin-top: 0;
		margin-left: 0;
	}

  #footer .footermenu ul { 
		width: 100%;
		margin-bottom: 0;
	} 	

   #footer .footermenu ul li a { 
		padding: 3px;
		float: left;
		width: 90%;
		padding: 15px 0 15px 0;
		border-bottom: 1px solid #cccccc;
		border-right: none;
	} 

	#footer .copyrightmenu { 
		width: 100%;
		height: 35px;
		padding-left: 10px;
	}
	
  #footer .copyrightmenu, #footer p.copyright:last-child, p.modified { 
		display: none;
	}	
	
	#footer p.copyright {
		padding: 0 0 20px 5px;
		clear: left;
		margin-top: 0;
		line-height: 30px;
		font-size: 14px;
	}

	#footer p.copyright a:link, #footer p.copyright a:visited, #footer p.copyright a:hover {
		font-size: 14px;
	}	

	#footer p.socialrow, #footer #subscribe-footer, #footer p.modified {
		float: left;
		width: auto;
	}
	
	#subscribe-footer {
		margin-top: 10px;
	}	

	#subscribe-footer a:link, #subscribe-footer a:visited, #subscribe-footer a:hover {
		font-size: 14px;
	}	
	
	body #footer .right {
		margin-top: 0;
		margin-left: 0;
		clear: both;
		float: left;
		width: 70%;
	}	



}	

