body {margin:0;
	padding:0;
	background-color:#7FFFD4;
	}

#buo{
width:100%;
}	
	
#header {
	padding:3.518%;
	width:93%;
	background-color:#F5DEB3;
	border-bottom:4px solid #8B4513;
	}
	
#nav {
margin-top:-2%;
width:100%;
float:right;
margin-right:10%;
z-index:-1;
}	
	
#nav .dun
{
text-align:right;
position:relative;
width:100%;
}

#nav .dun ul
{
list-style:none;
width:100%;
margin-top:2.2%;
}

#nav .dun ul li
{
font-family:Impact;
font-size:1.3em;
display:inline;
padding:1.5%;
background-color:#ffffff;
border-top-left-radius:10px;
border-top-right-radius:10px;
width:10%;
border-top:3px solid #8B4513;
border-left:3px solid #8B4513;
border-right:3px solid #8B4513;
}

a {
text-decoration:none;
color:black;
}
 
#body {
	width:57%;
	padding:16.75%;
	padding-bottom:2%;
	background-color:#e0ffff;
	margin-left:4.7%;
	border-left:4px solid #8B4513;
	border-right:4px solid #8B4513;
	}
	
#bg {
	width:159%;
	margin-top:-29.4%;
	margin-left:-29.5%;
	border-bottom:4px solid #8B4513;
}

#part {
	font-family:'Comic Sans MS';
	font-size:3em;
	margin-left:-25%;
	margin-top:1%;
}

#define {
	font-family:'Comic Sans MS';
	font-size:1.1em;
	margin-left:30%;
	margin-top:-52%;
	}
	
#define1 {
	font-family:'Comic Sans MS';
	font-size:1.1em;
	margin-left:30%;
	margin-top:-1%;
	}

#roots {
	font-family:'Comic Sans MS';
	font-size:1.7em;
	}

#rot {
	font-family:'Comic Sans MS';
	font-size:1.1em;
}

#stemss {
	text-align:center;
}

#pic {
	margin-left:-20%;
	margin-top:-2%;
}

#footer {
	width:91.9%;
	padding:4.04%;
	background-color:#9ACD32;
	border-top:4px solid #8B4513;
	background-image: url(footer.jpg);
	}
	
h1 {
	margin-left:-27%;
	margin-top:-27%;
	font-family:'Comic Sans MS';
	font-size:3em;
	}
	
#trees {
	font-family:'Comic Sans Ms';
	font-size:1.5em;
}

#treees {
	font-family:'Comic Sans Ms';
	font-size:1.6em;
}

#tres {
	font-family:'Comic Sans Ms';
	}

#deserts{
	font-family:'Comic Sans Ms';
	font-size:1.4em;
	}
	
#bodymed {
	width:57%;
	padding:16.75%;
	padding-bottom:60%;	
	background-color:#e0ffff;
	margin-left:4.7%;
	border-left:4px solid #8B4513;
	border-right:4px solid #8B4513;
	}
	
#title {
	font-family:'Comic Sans Ms';
	font-size:3em;
	margin-left:-26%;
	margin-top:-28%;
}

#def {
	font-family:'Comic Sans Ms';
	font-size:1.1em;
	margin-left:-26%;
	margin-top:-5%;
}

#uses {
	font-family:'Comic Sans Ms';
	font-size:100%;
}


#bodyfact {
	width:57%;
	padding:16.75%;
	padding-bottom:45%;
	background-color:#e0ffff;
	margin-left:4.7%;
	border-left:4px solid #8B4513;
	border-right:4px solid #8B4513;
	}

#about {
background-color:#1ebdbd;
width:90.5%;
padding-bottom:8%;
margin-left:4.7%;
border-left:4px solid #8B4513;
border-right:4px solid #8B4513;
}
	
#fb {
	float:left;
	margin-left:1%;
	margin-top:2%;
}

#fb2 {
	font-family:Comic Sans Ms;
	float:left;
	margin-left:1%;
	margin-top:3%;
	font-size:1.2em;
}

#twitter {
	float:left;
	margin-left:5%;
	margin-top:2.5%;
}

#twit {
	font-family:Comic Sans Ms;
	float:left;
	margin-left:1%;
	margin-top:3%;
	font-size:1.2em;	
}

#yahoo {
	float:left;
	margin-left:5%;
	margin-top:2.5%;
}

#yah {
	font-family:Comic Sans Ms;
	float:left;
	margin-left:1%;
	font-size:1.2em;
	margin-top:3%;
}
	
#ty,#me,#fa{
border-bottom:3px solid #8B4513;
}

#ho{
border-bottom:4px solid white;
}

#ho1,#me1,#fa1{
border-bottom:3px solid #8B4513;
}

#ty1{
border-bottom:4px solid white;
}

#ho2,#ty2,#fa2 {
border-bottom:3px solid #8B4513;
}

#me2 {
border-bottom:4px solid white;
}


.view1 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: -14.5%;
	margin-top: 1%;
	background: #DEB887;
   }
   
.view1 .mask1, .view1 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.view1 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view1 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
	margin-left:3.5%;	
    text-align: center;
}

.view1 img {
    transition: all 0.7s ease-in-out;
}
.view1 .mask1 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view1 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view1 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view1 a.info {
    transition: all 0.5s linear;
}
.view1:hover img { 
    opacity: 0;
}
.view1:hover .mask1 { 
    opacity: 1;
}                                                                            
.view1:hover h2,
.view1:hover p,
.view1:hover a.info{ 
    opacity: 1;
}

.view2 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 14.8%;
	margin-top: 1%;
	background: #DEB887;
   }
   
.view2 .mask2, .view2 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.view2 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view2 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
	margin-left:3%;
    text-align: center;
}

.view2 img {
    transition: all 0.7s ease-in-out;
}
.view2 .mask2 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view2 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view2 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view2 a.info {
    transition: all 0.5s linear;
}
.view2:hover img { 
    opacity: 0;
}
.view2:hover .mask2 { 
    opacity: 1;
}                                                                            
.view2:hover h2,
.view2:hover p,
.view2:hover a.info{ 
    opacity: 1;
}

.view3 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 44%;
	margin-top: 1%;
	background: #DEB887;
   }
   
.view3 .mask3, .view3 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.view3 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view3 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.view3 img {
    transition: all 0.7s ease-in-out;
}
.view3 .mask3 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view3 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view3 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view3 a.info {
    transition: all 0.5s linear;
}
.view3:hover img { 
    opacity: 0;
}
.view3:hover .mask3 { 
    opacity: 1;
}                                                                            
.view3:hover h2,
.view3:hover p,
.view3:hover a.info{ 
    opacity: 1;
}

.view4 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: -14.5%;
	margin-top: 21%;
	background: #DEB887;
   }
   
.view4 .mask4, .view4 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.view4 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view4 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;	
    text-align: center;
}

.view4 img {
    transition: all 0.7s ease-in-out;
}
.view4 .mask4 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view4 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view4 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view4 a.info {
    transition: all 0.5s linear;
}
.view4:hover img { 
    opacity: 0;
}
.view4:hover .mask4 { 
    opacity: 1;
}                                                                            
.view4:hover h2,
.view4:hover p,
.view4:hover a.info{ 
    opacity: 1;
}

.view5 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 14.8%;
	margin-top: 21%;
	background: #DEB887;
   }
   
.view5 .mask5, .view5 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

.view6 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 44%;
	margin-top: 21%;
	background: #DEB887;
   }
   
.view6 .mask6, .view6 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.view6 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view6 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;	
    text-align: center;
}

.view6 img {
    transition: all 0.7s ease-in-out;
}
.view6 .mask6 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view6 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view6 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view6 a.info {
    transition: all 0.5s linear;
}
.view6:hover img { 
    opacity: 0;
}
.view6:hover .mask6 { 
    opacity: 1;
}                                                                            
.view6:hover h2,
.view6:hover p,
.view6:hover a.info{ 
    opacity: 1;
}

 
.view5 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view5 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.view5 img {
    transition: all 0.7s ease-in-out;
}
.view5 .mask5 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view5 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view5 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view5 a.info {
    transition: all 0.5s linear;
}
.view5:hover img { 
    opacity: 0;
}
.view5:hover .mask5 { 
    opacity: 1;
}                                                                            
.view5:hover h2,
.view5:hover p,
.view5:hover a.info{ 
    opacity: 1;
}	

.view7 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: -14.5%;
	margin-top:41%;
	background: #DEB887;
   }
   
.view7 .mask7, .view7 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.view7 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view7 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;
    text-align: center;
}

.view7 img {
    transition: all 0.7s ease-in-out;
}
.view7 .mask7 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view7 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view7 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view7 a.info {
    transition: all 0.5s linear;
}
.view7:hover img { 
    opacity: 0;
}
.view7:hover .mask7 { 
    opacity: 1;
}                                                                            
.view7:hover h2,
.view7:hover p,
.view7:hover a.info{ 
    opacity: 1;
}

.view8 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 14.8%;
	margin-top: 41%;
	background: #DEB887;
   }
   
.view8 .mask8, .view8 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.view8 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view8 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;	
    text-align: center;
}

.view8 img {
    transition: all 0.7s ease-in-out;
}
.view8 .mask8 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view8 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view8 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view8 a.info {
    transition: all 0.5s linear;
}
.view8:hover img { 
    opacity: 0;
}
.view8:hover .mask8 { 
    opacity: 1;
}                                                                            
.view8:hover h2,
.view8:hover p,
.view8:hover a.info{ 
    opacity: 1;
}

.view9 {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 44%;
	margin-top: 41%;
	background: #DEB887;
   }
   
.view9 .mask9, .view9 .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.view9 h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.view9 p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;	
    text-align: center;
}

.view9 img {
    transition: all 0.7s ease-in-out;
}
.view9 .mask9 {
    transition: all 0.5s linear;
    opacity: 0;
}   
.view9 h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.view9 p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.view9 a.info {
    transition: all 0.5s linear;
}
.view9:hover img { 
    opacity: 0;
}
.view9:hover .mask9 { 
    opacity: 1;
}                                                                            
.view9:hover h2,
.view9:hover p,
.view9:hover a.info{ 
    opacity: 1;
}

.viewa {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: -14%;
	margin-top: -15%;
	background: #DEB887;
   }
   
.viewa .maska, .viewa .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.viewa h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewa p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.3em;
    position: relative;
    color: #fff;
	margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewa img {
    transition: all 0.7s ease-in-out;
}
.viewa .maska {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewa h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewa p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewa a.info {
    transition: all 0.5s linear;
}
.viewa:hover img { 
    opacity: 0;
}
.viewa:hover .maska { 
    opacity: 1;
}                                                                            
.viewa:hover h2,
.viewa:hover p,
.viewa:hover a.info{ 
    opacity: 1;
}

.viewb {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 15.5%;
	margin-top: -15%;
	background: #DEB887;
   }
   
.viewb .maskb, .viewb .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.viewb h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewb p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.3em;
    position: relative;
    color: #fff;
	margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewb img {
    transition: all 0.7s ease-in-out;
}
.viewb .maskb {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewb h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewb p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewb a.info {
    transition: all 0.5s linear;
}
.viewb:hover img { 
    opacity: 0;
}
.viewb:hover .maskb { 
    opacity: 1;
}                                                                            
.viewb:hover h2,
.viewb:hover p,
.viewb:hover a.info{ 
    opacity: 1;
}

.viewc {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 45%;
	margin-top: -15%;
	background: #DEB887;
   }
   
.viewc .maskc, .viewc .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.viewc h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewc p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewc img {
    transition: all 0.7s ease-in-out;
}
.viewc .maskc {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewc h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewc p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewc a.info {
    transition: all 0.5s linear;
}
.viewc:hover img { 
    opacity: 0;
}
.viewc:hover .maskc { 
    opacity: 1;
}                                                                            
.viewc:hover h2,
.viewc:hover p,
.viewc:hover a.info{ 
    opacity: 1;
}

.viewd {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: -14%;
	margin-top: 5%;
	background: #DEB887;
   }
   
.viewd .maskd, .viewd .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.viewd h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewd p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.3em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewd img {
    transition: all 0.7s ease-in-out;
}
.viewd .maskd {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewd h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewd p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewd a.info {
    transition: all 0.5s linear;
}
.viewd:hover img { 
    opacity: 0;
}
.viewd:hover .maskd { 
    opacity: 1;
}                                                                            
.viewd:hover h2,
.viewd:hover p,
.viewd:hover a.info{ 
    opacity: 1;
}

.viewe {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 15%;
	margin-top: 5%;
	background: #DEB887;
   }
   
.viewe .maske, .viewe .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

.viewf {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 45%;
	margin-top: 5%;
	background: #DEB887;
   }
   
.viewf .maskf, .viewf .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.viewf h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewf p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.3em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewf img {
    transition: all 0.7s ease-in-out;
}
.viewf .maskf {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewf h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewf p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewf a.info {
    transition: all 0.5s linear;
}
.viewf:hover img { 
    opacity: 0;
}
.viewf:hover .maskf { 
    opacity: 1;
}                                                                            
.viewf:hover h2,
.viewf:hover p,
.viewf:hover a.info{ 
    opacity: 1;
}

 
.viewe h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewe p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.3em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewe img {
    transition: all 0.7s ease-in-out;
}
.viewe .maske {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewe h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewe p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewe a.info {
    transition: all 0.5s linear;
}
.viewe:hover img { 
    opacity: 0;
}
.viewe:hover .maske { 
    opacity: 1;
}                                                                            
.viewe:hover h2,
.viewe:hover p,
.viewe:hover a.info{ 
    opacity: 1;
}	

.viewg {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: -14%;
	margin-top:25%;
	background: #DEB887;
   }
   
.viewg .maskg, .viewg .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.viewg h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewg p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.3em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewg img {
    transition: all 0.7s ease-in-out;
}
.viewg .maskg {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewg h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewg p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewg a.info {
    transition: all 0.5s linear;
}
.viewg:hover img { 
    opacity: 0;
}
.viewg:hover .maskg { 
    opacity: 1;
}                                                                            
.viewg:hover h2,
.viewg:hover p,
.viewg:hover a.info{ 
    opacity: 1;
}

.viewh {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 15%;
	margin-top: 25%;
	background: #DEB887;
   }
   
.viewh .maskh, .viewh .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.viewh h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewh p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.1em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewh img {
    transition: all 0.7s ease-in-out;
}
.viewh .maskh {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewh h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewh p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewh a.info {
    transition: all 0.5s linear;
}
.viewh:hover img { 
    opacity: 0;
}
.viewh:hover .maskh { 
    opacity: 1;
}                                                                            
.viewh:hover h2,
.viewh:hover p,
.viewh:hover a.info{ 
    opacity: 1;
}

.viewi {
    border: 10px solid #FFDAB9;
    overflow: hidden;
	position:absolute;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
	margin-left: 45%;
	margin-top: 25%;
	background: #DEB887;
   }
   
.viewi .maski, .viewi .content {
    width: 340px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}

 
.viewi h2 {
	font-family:Comic Sans MS;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
}
.viewi p {
    font-family:Comic Sans MS;
    font-style: italic;
    font-size: 1.3em;
    position: relative;
    color: #fff;
    margin-left:3%;	
	margin-right:8%;
    text-align: center;
}

.viewi img {
    transition: all 0.7s ease-in-out;
}
.viewi .maski {
    transition: all 0.5s linear;
    opacity: 0;
}   
.viewi h2{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    background: transparent;
    margin: 20px 40px 0px 40px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}
.viewi p {
    color: #333;
    opacity: 0;
    transition: all 0.5s linear;
}
.viewi a.info {
    transition: all 0.5s linear;
}
.viewi:hover img { 
    opacity: 0;
}
.viewi:hover .maski { 
    opacity: 1;
}                                                                            
.viewi:hover h2,
.viewi:hover p,
.viewi:hover a.info{ 
    opacity: 1;
}

#ho3,#ty3,#me3 {
border-bottom:3px solid #8B4513;
}

#fa3 {
border-bottom:4px solid white;
}