BamBamm

Screw it, I guess I have to pay someone. Thanks for letting me know.

I am trying to center my images with a background object. http://www.appleblossomentertainment.com What is it I need to do? #tooplate_middle { clear: both; width: 880px; height: 240px; padding: 50px; overflow: hidden; background: url(../images/middle.png);}#mid_title { font-size: 30px; line-height: 38px; font-weight: 400; color: #fff; margin-bottom: 20px; }@import url(http://fonts.googleapis.com/css?family=Varela+Round);html,body { background: #333 url("http://codepen.io/images/classy_fabric.png");}.slides { padding: 0; width: 609px; height: 220px; display: block; margin: 0 auto; position: relative;}.slides * { user-select: none; -ms-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }.slides input { display: none;}.slide-container { display: block;}.slide { top: 0; opacity: 0; width: 609px; height: 220px; display: block; position: absolute; transform: scale(0); transition: all .7s ease-in-out;}.slide img { width: 100%; height: 100%;}.nav label { width: 200px; height: 100%; display: none; position: absolute; opacity: 0; z-index: 9; cursor: pointer; transition: opacity .2s; color: #FFF; font-size: 156pt; text-align: center; line-height: 380px; font-family: "Varela Round", sans-serif; background-color: rgba(255, 255, 255, .3); text-shadow: 0px 0px 15px rgb(119, 119, 119);}.slide:hover + .nav label { opacity: 0.5;}.nav label:hover { opacity: 1;}.nav .next { right: 0;}input:checked + .slide-container .slide { opacity: 1; transform: scale(1); transition: opacity 1s ease-in-out;}input:checked + .slide-container .nav label { display: block;}.nav-dots { width: 100%; bottom: 9px; height: 11px; display: block; position: absolute; text-align: center;}.nav-dots .nav-dot { top: -5px; width: 11px; height: 11px; margin: 0 4px; position: relative; border-radius: 100%; display: inline-block; background-color: rgba(0, 0, 0, 0.6);}.nav-dots .nav-dot:hover { cursor: pointer; background-color: rgba(0, 0, 0, 0.8);}input#img-1:checked ~ .nav-dots label#img-dot-1,input#img-2:checked ~ .nav-dots label#img-dot-2,input#img-3:checked ~ .nav-dots label#img-dot-3,input#img-4:checked ~ .nav-dots label#img-dot-4,input#img-5:checked ~ .nav-dots label#img-dot-5,input#img-6:checked ~ .nav-dots label#img-dot-6 { background: rgba(0, 0, 0, 0.8);}#mid_left { float:left; width:400px; }#mid_slider { position:relative; float: right; width: 440px; height: 220px; }#tooplate_middle img { float: right; margin-left: 60px; }#mid_left p { margin-bottom: 30px; color: #fff; } The image slider I wanted was more like the one at http://www.eaglegunusa.com/, but I couldn't find code on the net for it.