@charset "utf-8";
/* ROLLOVER CSS Document */


/*Projects listed alphabeticaly*/



/*START 01 gothic ROLLOVER*/

a.rollovergothic01 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_01.gif"); /* image sprite */
	}

a.rollovergothic01:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 01 gothic ROLLOVER*/

/*START 02 gothic ROLLOVER*/

a.rollovergothic02 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_02.gif"); /* image sprite */
	}

a.rollovergothic02:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 02 gothic ROLLOVER*/

/*START 03 gothic ROLLOVER*/

a.rollovergothic03 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_03.gif"); /* image sprite */
	}

a.rollovergothic03:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 03 gothic ROLLOVER*/

/*START 04 gothic ROLLOVER*/

a.rollovergothic04 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_04.gif"); /* image sprite */
	}

a.rollovergothic04:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 04 gothic ROLLOVER*/

/*START 05 gothic ROLLOVER*/

a.rollovergothic05 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_05.gif"); /* image sprite */
	}

a.rollovergothic05:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 05 gothic ROLLOVER*/

/*START 06 gothic ROLLOVER*/

a.rollovergothic06 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_06.gif"); /* image sprite */
	}

a.rollovergothic06:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 06 gothic ROLLOVER*/

/*START 07 gothic ROLLOVER*/

a.rollovergothic07 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_07.gif"); /* image sprite */
	}

a.rollovergothic07:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 07 gothic ROLLOVER*/

/*START 08 gothic ROLLOVER*/

a.rollovergothic08 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_08.gif"); /* image sprite */
	}

a.rollovergothic08:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 08 gothic ROLLOVER*/


/*START 09 gothic ROLLOVER*/

a.rollovergothic09 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_09.gif"); /* image sprite */
	}

a.rollovergothic09:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 09 gothic ROLLOVER*/

/*START 10 gothic ROLLOVER*/

a.rollovergothic10 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_10.gif"); /* image sprite */
	}

a.rollovergothic10:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 10 gothic ROLLOVER*/

/*START 11 gothic ROLLOVER*/

a.rollovergothic11 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_11.gif"); /* image sprite */
	}

a.rollovergothic11:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 11 gothic ROLLOVER*/

/*START 12 gothic ROLLOVER*/

a.rollovergothic12 {
	display: inline-block;
	width: 300px;	/*The width and height values in a.rollover are the size of the original image*/
	height: 300px;
	text-decoration: none;
	background: url("../sprite/sprite_gothic_12.gif"); /* image sprite */
	}

a.rollovergothic12:hover {
	background-position: -300px 0; /*The value of background-position is that of the original image width – since we are literally moving from one part of the image sprite to another.*/
	}

.displace { /*included a <span> tag with a text alternative to the image and displaced it off the side of the visible screen so that screenreaders will read it and in the event of no CSS support a text link will be shown instead.*/
	position: absolute;
	left: -5000px;
	}
/*END 12 gothic ROLLOVER*/