/* 
first, I removed all your background images because we
can use background colors instead.
Your old site graphics had a dropshadow but we can code those using css too
*/

body { 
	background: none !important;
	background-color: #afb1b4 !important;
	}

.content2 { 
	background: none; 
	background-color: #fff; 
	padding: 0;
 	border-radius: 0 0 25px 25px;
 	-webkit-box-shadow: 0px 0px 23px -2px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 23px -2px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 23px -2px rgba(0,0,0,0.5); 
	}

.header { 
 	background-image: none;
 	background-color: red;
 	border-radius: 25px 25px 0 0px;
 	-webkit-box-shadow: 0px 0px 23px -2px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 23px -2px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 23px -2px rgba(0,0,0,0.5);
 	 }


/* minor tweaks to your headlines so they wrap correctly */

h1 { 
	padding: 20px 0; line-height: 1.25
	}

#col-right h2 {
   line-height: 1.25;
  } 


/* since I got rid of tables, I need to use floats to position your menu */

#menu5 {
	width: 200px;
	float: left !important; 
	margin-top: 50px;
}


/* remove all the hard coded widths to make all your divs relative widths */
.container,
.wrapper,
.header,
.content2,
#col-right { width: auto; }

/* only the wrapper has a fixed width. We can change that easily on small devices */
.wrapper { 
	width: 800px;
	margin: 0;
	margin-left: 250px;
 }
 
/* this is the div that holds your text and content */
#col-right {
    float: none;
    width: 90%;
    margin: 0 auto;
    padding: 0px;
    padding: 40px 0 40px 0;
}

/* remove the fixed width on this too */
.footer-text { margin-top: 40px;  width: auto;}

/* make that youtube video responsive */

.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

/* this is the responsive portion of the stylesheet. If a device is smaller than 1024 pixels, your site scales to fit the browser */

@media screen and (max-width: 1024px) {
	#menu5 { 
		width: auto; 
		float: none !important;
		text-align: center;
		margin-top: 20px;
		border-radius: 0 0 25px 25px;
		}	
	.wrapper { 
		width: auto; 
		margin-left: 0;
		padding: 10px;
		}
	.header { display: none; }

}