@charset "UTF-8";

/* CSS Document */

body {
	background-color: hsla(0,0%,100%,1.00);
	font-family: 'Nunito', sans-serif;
	font-style: normal;
	font-weight: 400;
	background-size: 37% auto;
	background-repeat: repeat;
	background-position: 65% 0%;
	background-image: url(../images/halftonepattern.jpg);
}

body2 {
	font-family: 'Nunito', sans-serif;
	font-style: normal;
	font-weight: 400;
	background-size: 12% auto;
	background-repeat: repeat-y;
	background-position: 12% 35%;
	background-image: url(../images/halftonepattern.jpg);
	background-attachment: fixed;
}

.example1 h3 {
	position: absolute;
	width: 100%;
	height: 100%;
	margin-top: 42px;
	margin-right: 42px;
	margin-left: 42px;
	margin-bottom: 42px;
	line-height: 50px;
	text-align: left;
	/* Starting position */
	-moz-transform: translateX(100%);
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
	/* Apply animation to this element */	
	-moz-animation: example1 15s linear infinite;
	-webkit-animation: example1 15s linear infinite;
	animation: example1 15s linear infinite;
	font-family: 'Work Sans', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: small;
	padding-top: 169px;
	color: hsla(0,0%,100%,1.00);
	opacity: 1;
	z-index: 7;
}
/* Move it (define the animation) */
@-moz-keyframes example1 {
 0%   { -moz-transform: translateX(100%); }
 100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes example1 {
 0%   { -webkit-transform: translateX(100%); }
 100% { -webkit-transform: translateX(-100%); }
}
@keyframes example1 {
 0%   { 
 -moz-transform: translateX(100%); /* Firefox bug fix */
 -webkit-transform: translateX(100%); /* Firefox bug fix */
 transform: translateX(100%); 		
 }
 100% { 
 -moz-transform: translateX(-100%); /* Firefox bug fix */
 -webkit-transform: translateX(-100%); /* Firefox bug fix */
 transform: translateX(-100%); 
 }
}
.example2 h3 {
	position: absolute;
	width: 226%;
	height: 9%;
	line-height: 50px;
	text-align: left;
	/* Starting position */
	-moz-transform: translateX(-100%);
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
	/* Apply animation to this element */	
	-moz-animation: example2 15s linear infinite;
	-webkit-animation: example2 15s linear infinite;
	animation: example2 15s linear infinite;
	padding-top: 22px;
	text-indent: 24px;
	color: hsla(0,0%,100%,1.00);
	background-repeat: repeat-x;
	top: 53%;
	background-color: hsla(0,0%,0%,1.00);
	z-index: 26;
	font-size: 16px;
}
.example2 {
	z-index: 139;
}
#palace {
}
/* Move it (define the animation) */
@-moz-keyframes example2 {
 0%   { -moz-transform: translateX(-100%); }
 100% { -moz-transform: translateX(100%); }
}
@-webkit-keyframes example2 {
 0%   { -webkit-transform: translateX(-100%); }
 100% { -webkit-transform: translateX(100%); }
}
@keyframes example2 {
 0%   { 
 -moz-transform: translateX(-100%); /* Firefox bug fix */
 -webkit-transform: translateX(-100%); /* Firefox bug fix */
 transform: translateX(-100%); 		
 }
 100% { 
 -moz-transform: translateX(100%); /* Firefox bug fix */
 -webkit-transform: translateX(100%); /* Firefox bug fix */
 transform: translateX(100%); 
 }
}
.example3 h3 {
	position: absolute;
	width: 100%;
	height: 100%;
	margin: 0;
	line-height: 50px;
	text-align: center;
	/* Starting position */
	-moz-transform: translateY(-100%);
	-webkit-transform: translateY(-100%);
	transform: translateY(-100%);
	/* Apply animation to this element */	
	-moz-animation: example3 15s linear;
	-webkit-animation: example3 15s linear;
	animation: example3 15s linear;
	color: hsla(0,0%,100%,1.00);
	font-style: oblique;
	background-image: url(url);
}
.example3 {
	height: 50px;
	position: relative;
	background-color: hsla(0,0%,0%,1.00);
}
/* Move it (define the animation) */
@-moz-keyframes example3 {
 0%   { -moz-transform: translateY(-100%); }
 100% { -moz-transform: translateY(100%); }
}
@-webkit-keyframes example3 {
 0%   { -webkit-transform: translateY(-100%); }
 100% { -webkit-transform: translateY(100%); }
}
@keyframes example3 {
 0%   { 
 -moz-transform: translateY(-100%); /* Firefox bug fix */
 -webkit-transform: translateY(-100%); /* Firefox bug fix */
 transform: translateY(-100%); 		
 }
 100% { 
 -moz-transform: translateY(100%); /* Firefox bug fix */
 -webkit-transform: translateY(100%); /* Firefox bug fix */
 transform: translateY(100%); 
 }
}

.example4 {
	font-family: 'Nunito', sans-serif;
	height: 124px;
	overflow: hidden;
	position: relative;
	background-color: hsla(0,0%,100%,1.00);
	padding-bottom: 56px;
	font-size: 12px;
	color: hsla(189,100%,89%,1.00);
}
.example4 h3 {
	font-family: 'Nunito', sans-serif;
	position: absolute;
	width: 100%;
	height: 100%;
	margin-top: 59px;
	margin-right: 59px;
	margin-left: 59px;
	margin-bottom: 59px;
	line-height: 19px;
	text-align: left;
	/* Apply animation to this element */	
	-moz-animation: example4 10s ease-out;
	-webkit-animation: example4 10s ease-out;
	animation: example4 10s ease-out;
	color: hsla(0,0%,0%,1.00);
	font-style: oblique;
	text-indent: 77px;
	padding-top: 22px;
	text-shadow: 1px 0px hsla(0,0%,0%,1.00);
	padding-left: 15px;
	font-size: 12pt;
}
/* Move it (define the animation) */
@-moz-keyframes example4 {
 0%   { -moz-transform: translateX(200%); }
 100% { -moz-transform: translateX(0%); }
}
@-webkit-keyframes example4 {
 0%   { -webkit-transform: translateX(200%); }
 100% { -webkit-transform: translateX(0%); }
}
@keyframes example4 {
 0%   { 
 -moz-transform: translateX(200%); /* Firefox bug fix */
 -webkit-transform: translateX(200%); /* Firefox bug fix */
 transform: translateX(200%); 		
 }
 100% { 
 -moz-transform: translateX(0%); /* Firefox bug fix */
 -webkit-transform: translateX(0%); /* Firefox bug fix */
 transform: translateX(0%); 
 }
}
.door {
	width: 50%;
}
h1 {
	font-family: 'Nunito', sans-serif;
	text-shadow: 1px 0px hsla(238,100%,50%,1.00);
	margin-left: 56px;
	color: hsla(0,0%,100%,1.00);
	background-color: hsla(0,0%,0%,1.00);
	z-index: 32;
	font-size: medium;
	font-style: normal;
}
nav .pagination {
	float: right;
	clear: none;
	margin-right: 10%;
}

.b {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	list-style-type: none;
	height: auto;
	padding-bottom: 16px;
	background-color: hsla(0,0%,0%,1.00);
	padding-left: 121px;
	-webkit-box-shadow: 0px 0px;
	box-shadow: 0px 0px;
	border-bottom: medium groove hsla(0,0%,100%,1.00);
	font-size: 16px;
}
li #back {
	font-size: 16px;
	z-index: 86;
	background-color: hsla(0,0%,0%,1.00);
}
#back {
	color: hsla(0,0%,0%,1.00);
	text-decoration: none;
	height: 46px;
}
.pager {
	width: 114px;
}
.body2 .example2 {
	font-size: medium;
	font-style: normal;
	padding-top: 71px;
	padding-bottom: 35px;
	padding-left: 208px;
	position: relative;
}

/* 

Define this in your CSS 
.ease-outTransition = Replace it by the name you want to give your transition

*/

.example3 {
    /*Add a property and value that you like to transition. Ex: width:200px;*/
    /* For Safari 3.1 to 6.0 */
    -webkit-transition-property: opacity:1;
    /*property*/
    ;
    -webkit-transition-duration: 1s;
    /*Control the transition duration*/
    -webkit-transition-timing-function: ease-out;
    /*Control the transitionfunction*/
    -webkit-transition-delay: 1s;
    /*Control the transition start delay*/
    /* Opera */
    -o-transition-property:
    /*property*/
    ;
    -o-transition-duration: 1s;
    -o-transition-timing-function: ease-out;
    -0-transition-delay: 1s;
    /* Firefox */
    -moz-transition-property: opacity:1;
    ;
    -moz-transition-duration: 1s;
    -moz-transition-timing-function: ease-out;
    -moz-transition-delay: 1s;
    /* Standard syntax */
    transition-property:
    /*property*/
    ;
    transition-duration: 1s;
    transition-timing-function: ease-out;
    transition-delay: 1s;
}
/*Pick the action to trigger the animation - Ex: hover */

.example3:active {
	opacity:0;
}


.example3:hover {
    opacity:0;
}
.body2 .example3 {
	list-style-type: none;
	color: hsla(0,0%,100%,1.00);
	background-color: hsla(0,0%,0%,0.75);
	text-align: center;
	line-height: 45px;
	font-style: italic;
	border-top-left-radius: 0px;
	
}
.example1 .indent {
	text-indent: 154px;
	margin-left: 210px;
}
.example2.p3 {
	background-color: hsla(0,0%,0%,0.65);
	padding-bottom: 21px;
	color: hsla(0,0%,100%,1.00);
	min-width: 181px;
}
.example1 h3 {
	z-index: 92;
	color: hsla(0,0%,100%,1.00);
}
