Learning Css

@charset "utf-8"; /* CSS Document for Nebraska Marine Service */ body { margin: 0; padding: 0; background:url(../images/site-bg.jpg) left top repeat-x #e8e8e8; font-family: Arial, Georgia, Geneva, Verdana, sans-serif; } .logo { font-weight: bold; font-size: 38px; color: #3297CA; text-shadow: #858585 2px 2px 1px; padding: 10px; } .main{ width: 825px; background-color: white; margin: 10px auto; position: middle; padding-top: 20px; padding-bottom: 20px; border-radius: 50px; -moz-border-radius: 50px; -webkit-border-radius: 50px; -o-border-radius: 50px; -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); box-shadow: 0px 1px 3px rgba(0,0,0,0.5); } .service-box { float: left; width: 375px; background-color:#CCCCFF; margin-left:9px; margin-top:9px; margin-bottom:9px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); box-shadow: 0px 1px 3px rgba(0,0,0,0.5); } .service-text{ padding-left:1em; padding-top:1em; padding-bottom:1em; } .contact-box { float: left; width: 275px; background-color:#e8e8e8; margin-left:9px; margin-top:9px; margin-bottom:9px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); box-shadow: 0px 1px 3px rgba(0,0,0,0.5); } .footer-text { text-align: center; Font-size: 10px; } .gallery-box { float: left; width: 775px; background-color:#240A66; margin-left:9px; margin-top:9px; margin-bottom:9px; color: white; text-align: center; font-weight: bold; font-size: 12px; color: white; text-shadow: #858585 2px 2px 1px; padding: 10px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); box-shadow: 0px 1px 3px rgba(0,0,0,0.5); } .gallery-images img { margin: 5px 5px 5px 5px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.5); box-shadow: 0px 1px 3px rgba(0,0,0,0.5); } /* Set general thumbnail styles */ #col-1 /*{ position: absolute; top: 0; left: 0; } /*place the column on the page*/ li { margin: 10px; list-style-type:none; } /*remove bullets from the list elements*/ img { border: none; } /*set images to have no borders*/ /* MouseOut state (default) - create and position a space for the larger images and hide them*/ #col-1 a img.hid { width: 700px; height:470px; position: absolute; top: 10px; left: 282px; text-align:center; visibility: hidden; } /* MouseOver state (hover)- reveal larger picture */ #col-1 a:hover { background: black; } #col-1 a:hover img.hid { visibility:visible; }