guenes.. good job… Im glad you were able to figure it out… I was sure i missed something…
site looks great…heres a couple small css stuff you might like.. unless noted find and replace. in css file dont add in my little notes..that have the asterisks…
#slides {
margin: 0 auto;
overflow: hidden;
box-shadow: 2px 3px 30px 5px rgba(3, 3, 3, 0.66);
-webkit-box-shadow: 2px 3px 30px 5px rgba(3, 3, 3, 0.66);
-moz-box-shadow: 2px 3px 30px 5px rgba(3, 3, 3, 0.66);
transition: box-shadow .3s;
-moz-transition: -moz-box-shadow 0.3s;
-webkit-transition: -webkit-box-shadow 0.3s;
}
***need to ad next***
#slides:hover {
position: relative;
box-shadow: 0px 0px 25px 12px rgba(9, 7, 7, 0.83);
-webkit-box-shadow: box-shadow: 0px 0px 25px 12px rgba(9, 7, 7, 0.83);
-moz-box-shadow: box-shadow: 0px 0px 25px 12px rgba(9, 7, 7, 0.83);
}
***long one***
#slider {
position: relative;
height: 410px;
padding: 30px 0 30px 0;
margin-bottom: 20px;
-moz-box-shadow: 0px 0px 20px #070404;
-webkit-box-shadow: 0px 0px 20px #070404;
box-shadow: inset 0px -3px 20px #070404;
border-bottom: 1px solid rgba(221, 221, 221, 0.3);
background -image: -moz-linear-gradient(top, rgba(22,22,22,0.3) 0%, rgba(195,195,195,0.3) 25%, rgba(229,229,229,0.32) 30%, rgba(238,238,238,0.35) 37%, rgba(246,246,246,0.37) 43%, rgba(255,255,255,0.4) 50%, rgba(246,246,246,0.37) 57%, rgba(236,236,236,0.35) 65%, rgba(229,229,229,0.32) 70%, rgba(191,191,191,0.3) 75%, rgba(2,2,2,0.3) 100%); /* FF3.6+ */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(22,22,22,0.3)), color-stop(25%,rgba(195,195,195,0.3)), color-stop(30%,rgba(229,229,229,0.32)), color-stop(37%,rgba(238,238,238,0.35)), color-stop(43%,rgba(246,246,246,0.37)), color-stop(50%,rgba(255,255,255,0.4)), color-stop(57%,rgba(246,246,246,0.37)), color-stop(65%,rgba(236,236,236,0.35)), color-stop(70%,rgba(229,229,229,0.32)), color-stop(75%,rgba(191,191,191,0.3)), color-stop(100%,rgba(2,2,2,0.3))); /* Chrome,Safari4+ */
background-image: -webkit-linear-gradient(top, rgba(22,22,22,0.3) 0%,rgba(195,195,195,0.3) 25%,rgba(229,229,229,0.32) 30%,rgba(238,238,238,0.35) 37%,rgba(246,246,246,0.37) 43%,rgba(255,255,255,0.4) 50%,rgba(246,246,246,0.37) 57%,rgba(236,236,236,0.35) 65%,rgba(229,229,229,0.32) 70%,rgba(191,191,191,0.3) 75%,rgba(2,2,2,0.3) 100%); /* Chrome10+,Safari5.1+ */
background-image: -o-linear-gradient(top, rgba(22,22,22,0.3) 0%,rgba(195,195,195,0.3) 25%,rgba(229,229,229,0.32) 30%,rgba(238,238,238,0.35) 37%,rgba(246,246,246,0.37) 43%,rgba(255,255,255,0.4) 50%,rgba(246,246,246,0.37) 57%,rgba(236,236,236,0.35) 65%,rgba(229,229,229,0.32) 70%,rgba(191,191,191,0.3) 75%,rgba(2,2,2,0.3) 100%); /* Opera 11.10+ */
background-image: -ms-linear-gradient(top, rgba(22,22,22,0.3) 0%,rgba(195,195,195,0.3) 25%,rgba(229,229,229,0.32) 30%,rgba(238,238,238,0.35) 37%,rgba(246,246,246,0.37) 43%,rgba(255,255,255,0.4) 50%,rgba(246,246,246,0.37) 57%,rgba(236,236,236,0.35) 65%,rgba(229,229,229,0.32) 70%,rgba(191,191,191,0.3) 75%,rgba(2,2,2,0.3) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(22,22,22,0.3) 0%,rgba(195,195,195,0.3) 25%,rgba(229,229,229,0.32) 30%,rgba(238,238,238,0.35) 37%,rgba(246,246,246,0.37) 43%,rgba(255,255,255,0.4) 50%,rgba(246,246,246,0.37) 57%,rgba(236,236,236,0.35) 65%,rgba(229,229,229,0.32) 70%,rgba(191,191,191,0.3) 75%,rgba(2,2,2,0.3) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#4d161616′, endColorstr=’#4d020202′,GradientType=0 ); /* IE6-9 */
}
.nav ul li a {
display: inline-block;
padding: 5px 0;
color: #E2D0CF;
text-decoration: none;
text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.92);
transition: text-shadow .4s ease-in-out;
-webkit-transition: text-shadow .4s;
-moz-webkit-transition: text-shadow .4s;
}
***need to add this one..**
#primary-nav ul li a:hover {
text-shadow: 2px 2px 1px black,0px -4px 50px rgba(235, 235, 235, 1), -3px 1px 30px rgba(235, 235, 235, 0.96), 0px 4px 30px rgba(236, 236, 236, 0.97);
transition: text-shadow .4s;
-webkit-transition: text-shadow .4s;
-moz-transition:text-shadow .4s;
color: white;
}
#header img {
top: 0px;
left: 0px;
height: 100%;
width: 100%;
z-index: 1;
position: relative;
max-width: 100%;
box-shadow: 0px 0px 14px 3px rgba(0, 0, 0, 0.86);
-moz-box-shadow:0px 0px 14px 3px rgba(0, 0, 0, 0.86);
-webkit-box-shadow:0px 0px 14px 3px rgba(0, 0, 0, 0.86);
border-bottom: 1px solid rgba(204, 204, 204, 0.25);
}