body {
 background-image: url("/refs/visalmaterials/refsbg.png");
  background-size: cover; 
}

.book{
  position:absolute;
  z-index:0;
  top:0vh;
  left:0vw;
}



.statement{
 
 Width:24vw;
 top:37vh;
 left:52vw;
 position:absolute;
 z-index:2;
 font-family: "corundum-text", serif;
font-weight: 400;
font-style: normal;
font-size:0.8vw;
}


.historysquare{
  position:absolute;
  width:11vw;
  -webkit-box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19); 
box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19);
  left:24vw;
  top:10vh;
  -moz-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);
}

.aidsquare{
  position:absolute;
  width:11vw;
  -webkit-box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19); 
box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19);
  left:37vw;
  top:10vh;
  -moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-o-transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
transform: rotate(-2deg);
  
}

.poetrysquare{
   position:absolute;
  width:11vw;
  -webkit-box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19); 
box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19);
  left:25vw;
  top:37vh;
  -moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-o-transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
transform: rotate(-2deg);
}

.filmsquare{
     position:absolute;
  width:11vw;
  -webkit-box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19); 
box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19);
  left:37vw;
  top:38vh;
  -moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-o-transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
transform: rotate(-2deg);
}

.foodsquare{
    position:absolute;
  width:11vw;
  -webkit-box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19); 
box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19);
  left:23vw;
  top:65vh;
  -moz-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);
}

.authorsquare{
     position:absolute;
  width:11vw;
  -webkit-box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19); 
box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19);
  left:36vw;
  top:65vh;
  -moz-transform: rotate(-1deg);
-webkit-transform: rotate(-1deg);
-o-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg);
}

.architecturesquare{
    position:absolute;
  width:11vw;
  -webkit-box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19); 
box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19);
  left:65vw;
  top:10vh;
  -moz-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);
}

.textilesquare{
     position:absolute;
  width:11vw;
  -webkit-box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19); 
box-shadow: 1px 5px 15px 5px rgba(0,0,0,0.19);
  left:53vw;
  top:10vh;
  -moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-o-transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
transform: rotate(-2deg);
}



.backbutton{
 position:absolute; 
}



.bookcontents1{
position:absolute;
top:10vh;
left:23vw;
width:25vw;
height:75vh;
 font-family: "corundum-text", serif;
font-weight: 400;
font-style: normal;
font-size:0.8vw;
}


.bookcontents2{
position:absolute;
top:10vh;
left:52vw;
width:25vw;
height:75vh;
 font-family: "corundum-text", serif;
font-weight: 400;
font-style: normal;
font-size:0.8vw; 
}