body {

      background-image:url(fon.jpg);
background-position:7px 0%;

      background-repeat:no-repeat;
  

      }
.front{
transition: all .8s;
position: absolute;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.front:hover{
box-shadow: 0 0 10px #99FF33;
}

.back{
width: 107px;
height: 74px;
display: inline-block;
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background: #66FF33;
transition: all .8s;
}
   
.item > div:hover .front{
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}
   
.item > div:hover .back{
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
} 

.backX{
width: 82px;
height: 128px;
display: inline-block;
-webkit-transform: rotateX(180deg);
transform: rotateX(180deg);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background: #66FF33;
transition: all .8s;
}
   
.itemX > div:hover .front{
-webkit-transform: rotateX(180deg);
transform: rotateX(180deg);
}
   
.itemX > div:hover .backX{
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
} 



#thumbs { padding-top: 5px; overflow: hidden; }
#thumbs img, #largeImage {
    
    cursor: pointer;
    box-shadow: 0 0 7px rgba(196, 166, 105, .7);
}
#thumbs img {
    float: center;
    margin-right: 3px;
}

#thumbs2 { padding-top: 5px; overflow: hidden; }
#thumbs2 img, #largeImage2 {
    
    cursor: pointer;
    box-shadow: 0 0 7px rgba(199, 195, 232, .7);
}
#thumbs2 img {
    float: center;
    margin-right: 3px;
}

#description {
    background: black;
    color: white;
    position: absolute;
    bottom: 0;
    padding: 10px 20px;
    width: 525px;
    margin: 5px;
}
#panel { position: relative; }

nav ul {
margin: 0px 0px 0px;
padding: 0px;
}

nav ul li ul{
width: 150px;
margin: 0px;
}

nav ul {
list-style: none;
position: relative;
z-index: 777;
text-align: center;
}
nav ul ul {
display: none;
}


nav ul li:hover > ul {
display: block;
}
nav ul li:hover > ul ul{
display: block;
}


nav ul li {
float:left;
}


nav ul li:hover {
background: linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -moz-linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -webkit-linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -o-linear-gradient(top, #4f5964 0%? #5f6975 40%);
}

nav ul li:hover a {
color: #800000;
font-family: Monotype Corsiva;
font-size: 20px;
}

nav ul li a {

text-decoration: none;
}

nav ul ul {
background: #fff;
border-radius: 0px;
padding: 0;
position: absolute;
top: 0%;
left: 85%;
}



nav ul ul li {
float: none;
border-top: 0px solid #5b727c;
border-bottom: 1px solid #575f6a;
position: relative;
}

nav ul ul li {
padding: 8px 10px;
color: #fff;
}
nav ul ul li a:hover {
background: #808080;
padding: 3px 15px;
color: #fff;
}




nav2 ul {
margin: 0px 0px 0px;
padding: 0px;
}

nav2 ul li ul{
width: 200px;
margin: 0px;
}

nav2 ul {
list-style: none;
position: relative;
z-index: 777;
text-align: center;
}
nav2 ul ul {
display: none;
}


nav2 ul li:hover > ul {
display: block;
}
nav2 ul li:hover > ul ul{
display: block;
}


nav2 ul li {
float:left;
}


nav2 ul li:hover {
background: linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -moz-linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -webkit-linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -o-linear-gradient(top, #4f5964 0%? #5f6975 40%);
}

nav2 ul li:hover a {
color: #800000;
font-family: Monotype Corsiva;
font-size: 20px;
}

nav2 ul li a {

text-decoration: none;
}

nav2 ul ul {
background: #fff;
border-radius: 0px;
padding: 0;
position: absolute;
top: 0%;
right: 100%;
}



nav2 ul ul li {
float: none;
border-top: 0px solid #5b727c;
border-bottom: 1px solid #575f6a;
position: relative;
}

nav2 ul ul li {
padding: 8px 10px;
color: #fff;
}
nav2 ul ul li a:hover {
background: #808080;
padding: 3px 15px;
color: #fff;
}

nav3 ul {
margin: 0px 0px 0px;
padding: 0px;
}

nav3 ul li ul{
width: 200px;
margin: 0px;
}

nav3 ul {
list-style: none;
position: relative;
z-index: 777;
text-align: center;
}
nav3 ul ul {
display: none;
}


nav3 ul li:hover > ul {
display: block;
}
nav3 ul li:hover > ul ul{
display: block;
}


nav3 ul li {
float:left;
}


nav3 ul li:hover {
background: linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -moz-linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -webkit-linear-gradient(top, #4f5964 0%? #5f6975 40%);
background: -o-linear-gradient(top, #4f5964 0%? #5f6975 40%);
}

nav3 ul li:hover a {
color: #800000;
font-family: Monotype Corsiva;
font-size: 20px;
}

nav3 ul li a {

text-decoration: none;
}

nav3 ul ul {
background: #fff;
border-radius: 0px;
padding: 0;
position: absolute;
top: 0%;
left: 85%;
}



nav3 ul ul li {
float: none;
border-top: 0px solid #5b727c;
border-bottom: 1px solid #575f6a;
position: relative;
}

nav3 ul ul li {
padding: 8px 10px;
color: #fff;
}
nav3 ul ul li a:hover {
background: #808080;
padding: 3px 15px;
color: #fff;
}