/*======= index.html =======*/

#page1 .row-1 .col-1 {width: 239px; padding: 0 9px 0 0;}
#page1 .row-1 .col-2 {width: 238px; padding: 0 9px 0 0;}
#page1 .row-1 .col-3 {width: 238px; padding: 0 9px 0 0;}
#page1 .row-1 .col-4 {width: 238px;}

#page1 .row-2 .col-1 {
	width: 400px;
	padding: 0 50px 0 20px;
}
#page1 .row-2 .col-2 {
	width: 400px;
	padding: 0 30px 0 20px;
	color: #696969;
}
#page1 .row-2 .col-3 {width: 257px; padding: 27px 0 0 0;}

#page1 .row-3 .col-1 {width: 226px; padding: 0 20px 0 0;}
#page1 .row-3 .col-2 {width: 227px; padding: 0 20px 0 0;}
#page1 .row-3 .col-3 {width: 210px; padding: 0 20px 0 0;}
#page1 .row-3 .col-4 {width: 257px;}

/*======= index-1.html =======*/

#page2 .row-1 .col-1 {width: 396px; padding: 0 97px 0 0;}
#page2 .row-1 .col-2 {width: 487px;}

#page2 .row-2 .col-1 {
	width: 288px;
	padding: 0 60px 0 0;
}
#page2 .row-2 .col-2 {
	width: 278px;
	padding: 0 60px 0 0;
}
#page2 .row-2 .col-3 {
	width: 280px;
}

#page2 .row-3 .col-1 {width: 673px; padding: 0 50px 0 0;}
#page2 .row-3 .col-2 {width: 257px;}

/*======= index-2.html =======*/

#page3 .row-2 .col-1 {width: 288px; padding: 0 77px 0 0;}
#page3 .row-2 .col-2 {width: 278px; padding: 0 52px 0 0;}
#page3 .row-2 .col-3 {
	width: 284px;
	padding: 0px 0 0 0;
}

#page3 .row-3 .col-1 {width: 280px; padding: 0 85px 0 0;}
#page3 .row-3 .col-2 {width: 615px;}

/*======= index-3.html =======*/

#page4 .row-1 .col-1 {width: 396px; padding: 0 97px 0 0;}
#page4 .row-1 .col-2 {width: 487px;}

#page4 .row-3 .col-1 {width: 385px; padding: 0 108px 0 0;}
#page4 .row-3 .col-2 {width: 487px;}

/*======= index-4.html =======*/

#page5 .row-1 .col-1 {width: 285px; padding: 0 80px 0 0;}
#page5 .row-1 .col-2 {width: 615px;}

#page5 .row-2 .col-1 {width: 288px; padding: 0 77px 0 0;}
#page5 .row-2 .col-2 {width: 615px;}

#page5 .row-3 .col-1 {width: 211px; padding: 0 44px 0 0;}
#page5 .row-3 .col-2 {width: 211px; padding: 0 48px 0 0;}
#page5 .row-3 .col-3 {width: 211px; padding: 0 44px 0 0;}
#page5 .row-3 .col-4 {width: 211px;}
<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */

}

</style>
