html
{background-image: url(../images/beach.jpg);
font-family: arial;}

#main
{width: 800px;
height: 680px;
margin: 0 auto;
z-index: -1;}

#menu
{width: 800px;
height: 50px;
margin: auto;
margin-top: 114px;
position: absolute;
z-index: 1;
background-image: url(../images/menu.png);
border-radius: 10px;
font-family: arial;}

#menu #ul
{width: 544px;
height: 50px;
z-index: 4;
position: relative;
float: right;
font-family: arial;}

#menu #ul ul
{list-style-type: none;
font-family: arial;}

#menu #ul ul li
{width: 126px;
float: left;
height: 25px;
z-index: 1000;
font-family: arial;}

#menu #ul ul li a
{text-decoration: none;
color: black;
font-family: arial;}

#menu .current, a:hover
{font-weight: bold;
font-family: arial;}

#circle
{width: 300px;
height: 240px;
margin-top: 0px;
margin-left: 30px;
position: absolute;
z-index: 3;
background-image: url(../images/circle2.png);}

#content
{width: 800px;
height: 500px;
margin: auto;
margin-top: 175px;
position: absolute;
z-index: 0;
background-color: black;
border-radius: 30px;
opacity: .93;
color: white;
font-family: arial;}

#inner
{width: 700px;
height: 400px;
margin: auto;
margin-top: 75px;
font-size: 1.1em;
font-family: arial;}

/*INDEX*/
#photo
{width: 250px;
height: 250px;
float: right;
padding: 20px;
font-family: arial;}

/*CONTACT*/
#bottom
{width: 700px;
height: 200px;
margin: auto;
font-family: arial;}

#bottom #left
{width: 200px;
height: 140px;
margin: 40px;
float: left;
border-right: solid;
font-family: arial;}

#bottom #right
{width: 300px;
height: 140px;
margin-top: 40px;
float: left;
font-family: arial;}

#bottom #right p
{float: left;
font-family: arial;}

#shell
{float: right;
margin-top: 50px;
font-family: arial;}

/*PHOTOS*/

ul.galllery
{list-style: none;
margin: auto;
font-family: arial;}

ul.galllery li a
{float: left;
-moz-box-shadow: 0px 2px 15px #333;
-webkit-box-shadow: 0px 2px 15px #333;
background: #eee;
padding: 10px 10px 25px 10px;
background: #fff;
border: 1px solid #eee;
position: relative;
margin: 10px;
margin-top: 130px;
font-family: arial;}

.galllery #left
{z-index: 9;
-webkit-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
font-family: arial;}

.galllery #left p
{position: absolute;
margin-top:330px;
margin-left:47px;
font-family: arial;}

.galllery #middle
{z-index: 10;
font-family: arial;}

.galllery #middle p
{position: absolute;
margin-top:320px;
margin-left:317px;
text-align: center;
font-family: arial;}

.galllery #right
{z-index: 8;
-webkit-transform: rotate(7deg);
-moz-transform: rotate(7deg);
font-family: arial;}

.galllery #right p
{position: absolute;
margin-top:330px;
margin-left:547px;
font-family: arial;}

.galllery #left li a:hover, .galllery #middle li a:hover, .galllery #right li a:hover
{z-index: 11;
-moz-box-shadow: 3px 5px 15px #333;
-webkit-box-shadow: 3px 5px 15px #333;
font-family: arial;}

#p1l, #p2l, #p3l, #p4l, #p1r, #p3r, #p4r, #p1m, #p3m, #p4m

{margin-top: 80px;
padding: 10px;
padding-right: 0px;
position: relative;
font-family: arial;}

#p5l, #p5r, #p2r, #p5m, #p2m /* Verticallly Talll Picture */
{margin-top: 80px;
margin-left: 125px;
padding: 10px;
padding-right: 0px;
position: relative;}

#all:hover, #all1:hover, #all2:hover, #all3:hover, #all4:hover, #all5:hover, #alr:hover, #alr1:hover, #alr2:hover, #alr3:hover, #alr4:hover, #alr5:hover, #alm:hover, #alm1:hover, #alm2:hover, #alm3:hover, #alm4:hover, #alm5:hover
{background-image: url(../images/alh.png);
font-family: arial;}

#arl:hover, #arl1:hover, #arl2:hover, #arl3:hover, #arl4:hover, #arl5:hover, #arr:hover, #arr1:hover, #arr2:hover, #arr3:hover, #arr4:hover, #arr5:hover, #arm:hover, #arm1:hover, #arm2:hover, #arm3:hover, #arm4:hover, #arm5:hover
{background-image: url(../images/arh.png);
font-family: arial;}

#arl, #arl1, #arl2, #arl3, #arl4, #arl5, #arr, #arr1, #arr2, #arr3, #arr4, #arr5,  #arm, #arm1, #arm2, #arm3, #arm4, #arm5
{float: right;
margin-top: 225px;
width: 30px;
height: 60px;
background-image: url(../images/ar.png);
font-family: arial;}

#all, #all1, #all2, #all3, #all4, #all5, #alr, #alr1, #alr2, #alr3, #alr4, #alr5,  #alm, #alm1, #alm2, #alm3, #alm4, #alm5
{float: left;
margin-top: 225px;
margin-left: 80px;
position: relative;
width: 30px;
height: 60px;
background-image: url(../images/al.png);}

#pleft
{float: left;
width: 660px;
font-family: arial;}

#x
{width: 30px;
background-image: url(../images/x.png);
float: right;
margin-top: 95px;
margin-right: 100px;
height: 30px;}

#x:hover
{background-image: url(../images/xh.png);}

/* LINKS */

#l
{width: 560px;
padding-top: 90px;
position: relative;
height: 330px;
margin: auto;}

#l a
{font-family: arial;
color: white;
text-decoration: none;
font-size: 30;
text-align: center;
float: left;}

#l img
{float: left;
padding-right: 30px;}

#l1, #l2, #l3
{width: 672px;
height: 80px;
border: solid black;
margin-top: 20px;}