body{
    margin:0;
	background-image:url(novel_images/mytreeop.png );
	background-size:100%;
	font-family: 'Poppins', sans-serif;
	background-repeat:none;

}

.note{
	display:block;
	text-align:left;
	font-family: 'Poppins', sans-serif;
	font-size:16pt;
	margin:10px;
	color:#1D4431;
    width:700px;
    height:900px;
    margin-left: 550px;
    

}	
p{
    
 font-family: 'Poppins', sans-serif; 
    padding:30px;
}
h2{
    font-family: 'Poppins', sans-serif; 
}
.header{
	position:relative;
	align-items: center;
	font-family:'Mountains of Christmas', cursive;
	font-size:38pt;
	height:300px;
	width:100%;
    text-align: center;
    color:#1D4431;
   
}
.plain_box1{
	position:absolute;
	top:375px;
	left:1000px;
	padding:25px;
	transform: translate(-50%,-50%);
	width:450px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
}
.plain_message1 {
position:absolute;
padding-left:25px;
padding-right:25px;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;

}


.box1{
	position:absolute;
    padding-left:35px;
    padding-right:35px;
	top:630px;
	left:1300px;
	transform: translate(-50%,-50%);
	width:300px;
	height:225px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;	
}
.box1:hover{
	height:820px;
	width:660px;
	background-image:url(novel_images/harley_door.png);
	z-index:102;
}

.box1:hover .box1_message{
	opacity: 0;
	
}

.box1_message {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
padding-left:25px;
padding-right:25px;
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;

}
.plain_box2{
	position:absolute;
	top:870px;
	left:1500px;
	padding:10px;
	transform: translate(-50%,-50%);
	width:500px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
}
.plain_message2 {
position:absolute;
padding-left:25px;
padding-right:25px;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;

}


.plain_box3{
	position:absolute;
	top:1120px;
	left:1950px;
    padding:25px;
	transform: translate(-50%,-50%);
	width:500px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
}
.plain_message3 {
position:absolute;
padding-left:20px;
padding-right:20px;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;

}
.box2{
	position:absolute;
    padding:30px;
	top:1370px;
	left:1450px;
	transform: translate(-50%,-50%);
	width:300px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    
	
	
}
.box2:hover{
	height:860px;
	width:860px;
	background-image:url(novel_images/harley_car.png);
	z-index:103;
}

.box2:hover .box2_message{
	opacity: 0;
	
}

.box2_message {
position:absolute;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;
padding:10px;

}

.plain_box4{
	position:absolute;
	top:1600px;
	left:1000px;
	padding:10px;
	transform: translate(-50%,-50%);
	width:450px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
}
.plain_message4 {
position:absolute;
top:50%;
left:50%;
    padding-left:25px;
padding-right:25px;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;

}


.plain_box5{
	position:absolute;
	top:1860px;
	left:1300px;
	padding:10px;
	transform: translate(-50%,-50%);
	width:450px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
}

.plain_message5 {
position:absolute;
    padding-left:25px;
padding-right:25px;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;

}


.treebox {
position:absolute;
background-size:100%;
    background-repeat: repeat-y;
background-image:url(novel_images/treeredo.jpg);
width:100%;
height:2500px;
top:2000px;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
}

.ohmy{
	text-align:center;
	font-size:18pt;
	font-family: 'Poppins', sans-serif;
	border:2px solid #1D4431;
	background-color: maroon;
	border-radius: 5px;
    height:200px;
    width:550px;
    padding:10px;
	margin-left:20px;
}



.home{
	position:absolute;	
	left:2310px;
	top:1650px;
	
}
.home:hover{
    transform: scale(1.5);
    border:1px solid maroon;
    
}
.friend2{
	position:relative;
	margin-left:100px;
	z-index:200;
	margin-top:2550px;	
}
.friend2:hover{
    border:1px solid maroon;
    transform: scale(1.5);
}
.grandmas{
  position:relative;
    margin-left:500px;
	z-index:200;
	margin-top:990px;	  
}
.grandmas:hover{
    transform: scale(1.5);
    border:1px solid maroon;
    
}
.button{
	position: relative;
	top:2240px;	
	z-index:101;
    
    
}


.button {
	box-shadow: 0px 0px 0px 2px #3dc21b;
	background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%);
	background-color:#44c767;
	border-radius:10px;
	border:1px solid #18ab29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Trebuchet MS;
	font-size:19px;
	padding:12px 37px;
	text-decoration:none;
	text-shadow:0px 1px 0px #225c1a;
	margin:10px;
}
.button2{
	position: relative;
	top:100px;	
	z-index:101;
}


.button2 {
	box-shadow: 0px 0px 0px 2px #3dc21b;
	background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%);
	background-color:#44c767;
	border-radius:10px;
	border:1px solid #18ab29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Trebuchet MS;
	font-size:19px;
	padding:12px 37px;
	text-decoration:none;
	text-shadow:0px 1px 0px #225c1a;
	margin:10px;
}

.footer{
	position: relative;
    text-align: center;
    background: #ddd;
    opacity:0.2;
	height:70px;
	width:100%;
	top:2300px;
	
}



.plain_message2 {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
    padding:20px;

}

.plain_message3 {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
    padding:20px;

}


.plain_message4 {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
    line-height: 1.5em;
    padding:20px;

}



.message {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;
    padding:20px;
}

.speak{
	position:absolute;
	top:475px;
	left:1000px;
	transform: translate(-50%,-50%);
	width:200px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    padding:50px;
}
.speak:hover{
	height:550px;
	width:550px;
	background-image:url(novel_images/coat_line_work.png);
	z-index:102;
}

.speak:hover .speakmessage{
	opacity: 0;
	
}

.speakmessage {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
    line-height: 1.5em;
    padding:20px;

}

.gma1{
	position:absolute;
	top:770px;
	left:1300px;
	padding:10px;
	transform: translate(-50%,-50%);
	width:450px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    padding:20px;
	
}
.gma_message1 {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
    line-height: 1.5em;
    padding:20px;

}
.gma11{
	position:absolute;
	top:800px;
	left:1300px;
	padding:10px;
	transform: translate(-50%,-50%);
	width:450px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    padding:20px;
	
}
.gma_message11 {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
    line-height: 1.5em;
    padding:20px;

}
.gma2{
	position:absolute;
	top:970px;
	left:1500px;
	padding:10px;
	transform: translate(-50%,-50%);
	width:500px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    padding:20px;
	
}
.gma_message2 {
position:absolute;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;
padding:20px;

}
.gma3{
	position:absolute;
	top:920px;
	left:1900px;
	transform: translate(-50%,-50%);
	width:300px;
	height:200px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    padding:60px;
	
}
.gma_message3 {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;
padding:20px;

}

.gma13{
	position:absolute;
	top:1220px;
	left:1900px;
	transform: translate(-50%,-50%);
	width:300px;
	height:400px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    padding:60px;
	
}
.gma_message13 {
position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;
padding:20px;

}
.gma44{
	position:absolute;
    padding:30px;
	top:1550px;
	left:1200px;
	transform: translate(-50%,-50%);
	width:400px;
	height:300px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
	
}
.gma44:hover{
	height:940px;
	width:940px;
	background-image:url(novel_images/harley_laying_infront_tree.png);
	z-index:103;
}

.gma44:hover .gma44_message{
	opacity: 0;
	
}
.gma44_message {
position:absolute;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
padding:20px;
line-height: 1.5em;
}

.gma4{
	position:absolute;
    padding:30px;
	top:1550px;
	left:1000px;
	transform: translate(-50%,-50%);
	width:400px;
	height:300px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
	
}
.gma4:hover{
	height:940px;
	width:940px;
	background-image:url(novel_images/harley_laying_infront_tree.png);
	z-index:103;
}

.gma4:hover .gma4_message{
	opacity: 0;
	
}
.gma4_message {
position:absolute;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
padding:20px;
line-height: 1.5em;
}


.whereugo{
	position:absolute;
    padding:30px;
	top:970px;
	left:980px;
	width:200px;
	height:100px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;

	
	
}
.whereugomessage {
position:absolute;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
top:50%;
left:50%;
background-color: maroon;
    transform: translate(-50%, -50%);
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
padding:10px;
line-height: 1.5em;
}

.over_here{
    
    position:absolute;
	top:1395px;
	left:1350px;
	transform: translate(-50%,-50%);
	width:400px;
	height:300px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    padding:60px;
}
.over_here_message{
 position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;
padding:20px;   
    
}



.decorate{
    
    position:absolute;
	top:1840px;
	left:1900px;
	transform: translate(-50%,-50%);
	width:400px;
	height:300px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    padding:60px;
}
.decorate_message{
 position:absolute;
top:50%;
left:50%;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;
padding:20px;   
    
}

.home2{
	position:absolute;
    padding:30px;
	top:2260px;
	left:1400px;
	transform: translate(-50%,-50%);
	width:400px;
	height:300px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
	
}
.home2:hover{
	height:900px;
	width:600px;
	background-image:url(novel_images/harley_laying_infront_tree.png);
	z-index:103;
}

.home2:hover .home2_message{
	opacity: 0;
	
}
.home2_message {
position:absolute;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
font-family: 'Poppins', sans-serif;
text-align: center;
padding:20px;
line-height: 1.5em;
}

.plain_box10{
	position:absolute;
    
	top:450px;
	left:480px;
	padding:20px;
	transform: translate(-50%,-50%);
	width:400px;
	height:300px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
}
.plain_message10 {
position:absolute;
padding:30px;
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;

}



.box10{
	position:absolute;
	top:640px;
	left:980px;
	transform: translate(-50%,-50%);
	width:500px;
	height:300px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
	
}

.message {
position:absolute;
top:50%;
padding:30px;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
font-family: 'Poppins', sans-serif;
text-align: center;
    line-height: 1.5em;


}

.box10:hover{
	height:850px;
	width:700px;
	background-image:url(novel_images/harley_car.png);
	z-index:102;
}

.box10:hover .message{
	opacity: 0;
	
}
.where_is_it{
	position:absolute;
	top:990px;
	left:1500px;
	padding:10px;
	transform: translate(-50%,-50%);
	width:500px;
	height:400px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
	
}
.where_is_it_message {
position:absolute;
padding:30px;
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
font-family: 'Poppins', sans-serif;
text-align: center;
line-height: 1.5em;

}

.okay{
	position:absolute;
	top:1445px;
	left:1000px;
	transform: translate(-50%,-50%);
	width:600px;
	height:450px;
	border:2px solid #1D4431;
	background-color: #627858;
	border-radius: 5px;
	transition: width 2s, height 2s, border-radius 2s;
    
	
	
}

.okay_message {
position:absolute;
top:50%;
 padding:30px;
left:50%;
transform: translate(-50%, -50%);
background-color: maroon;
font-size:14pt;
border:2px solid #1D4431; 
border-radius: 5px;
box-shadow: -19px 23px 40px -23px rgba(87,87,87,1);
font-family: 'Poppins', sans-serif;
text-align: center;
padding:20px;
line-height: 1.5em;

}

.okay:hover{
	height:850px;
	width:700px;
	background-image:url(novel_images/harley_smile.png);
	z-index:102;
}

.okay:hover .okay_message{
	opacity: 0;
	
}