/*   Yorkshire.guide pictures.css   v27.005  ©2022  */

/* styles+buttonpics+pictures>wide>small>smallwide>tablet */

/* slides */

div#text {overflow: hidden;}

div.image0{ 
	position: absolute; top: 0px; left: 0px; width: 650px; height: 320px; border: 0; padding: 0; overflow: hidden;
	background-image: url(slides/slide0.jpg?012);
	background-size: 650px 320px;
	background-repeat: no-repeat;
	animation: imageAnimation0 60s infinite linear;
	-webkit-animation: imageAnimation0 60s infinite linear;
}

div.image1{ 
	position: absolute; bottom: 0px; left: 0px; width: 650px; height: 320px; border: 0; padding: 0; overflow: hidden;
	background-image: url(slides/slide1.jpg?012);
	background-size: 650px 320px;
	background-repeat: no-repeat;
	animation: imageAnimation1 60s infinite linear;
	-webkit-animation: imageAnimation1 60s infinite linear;
}

div.image2 {
	position: absolute; bottom: 0px; left: 320px; width: 650px; height: 320px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide2.jpg?012);
	background-size: 650px 320px;
	background-repeat: no-repeat;
	animation: imageAnimation2 60s infinite linear;
	-webkit-animation: imageAnimation2 60s infinite linear;
}

div.image3 { 
	position: absolute; top: 0px; left: 320px; width: 650px; height: 320px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide3.jpg?012);
	background-size: 650px 320px;
	background-repeat: no-repeat;
	animation: imageAnimation3 60s infinite linear;
	-webkit-animation: imageAnimation3 60s infinite linear;
}

div.image4 { 
	position: absolute; bottom: 0px; left: 640px; width: 650px; height: 320px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide4.jpg?012);
	background-size: 650px 320px;
	background-repeat: no-repeat;
	animation: imageAnimation4 60s infinite linear;
	-webkit-animation: imageAnimation4 60s infinite linear;
}

div.image5 { 
	position: absolute; top: 0px; left: 640px; width: 320px; height: 155px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide5.jpg?012);
	background-size: 320px 155px;
	background-repeat: no-repeat;
	animation: imageAnimation5 60s infinite linear;
	-webkit-animation: imageAnimation5 60s infinite linear;
}

div.image6 { 
	position: absolute; bottom: 0px; right: 0px; width:320px; height: 155px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide6.jpg?012);
	background-size: 320px 155px;
	background-repeat: no-repeat;
	animation: imageAnimation6 60s infinite linear;
	-webkit-animation: imageAnimation6 60s infinite linear;
}

div.image7 { 
	position: absolute; top: 0px; right: 0px; width: 320px; height: 155px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide7.jpg?012);
	background-size: 320px 155px;
	background-repeat: no-repeat;
	animation: imageAnimation7 60s infinite linear;
	-webkit-animation: imageAnimation7 60s infinite linear;
}

div.image8 { 
	position: absolute; top: 0px; right: 320px; width: 320px; height: 155px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide8.jpg?012);
	background-size: 320px 155px;
	background-repeat: no-repeat;
	animation: imageAnimation8 60s infinite linear;
	-webkit-animation: imageAnimation8 60s infinite linear;
}

div.image9 { 
	position: absolute; bottom: 0px; left: 720px; width: 320px; height: 155px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide9.jpg?012);
	background-size: 320px 155px;
	background-repeat: no-repeat;
	animation: imageAnimation9 60s infinite linear;
	-webkit-animation: imageAnimation9 60s infinite linear;
}

div.image10 { 
	position: absolute; bottom: 0px; left: 720px; width: 320px; height: 155px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide10.jpg?012);
	background-size: 320px 155px;
	background-repeat: no-repeat;
	animation: imageAnimation10 60s infinite linear;
	-webkit-animation: imageAnimation10 60s infinite linear;
}

div.image11 { 
	position: absolute; top: 0px; left: 480px; width: 320px; height: 155px; border: 0; padding: 0; overflow: hidden;
    background-image: url(slides/slide11.jpg?012);
	background-size: 320px 155px;
	background-repeat: no-repeat;
	animation: imageAnimation11 60s infinite linear;
	-webkit-animation: imageAnimation11 60s infinite linear;
}



@keyframes imageAnimation0 { 
    0% { opacity: 0; left: 0px;}
    30% { opacity: 1; left: 960px; }
	50% { opacity: 1; left: 960px; top: 200px; }
	80% { opacity: 1; left: 0px; }
    100% { opacity: 0; top: 0px;}
}

@-webkit-keyframes imageAnimation0 { 
    0% { opacity: 1; left: 0px;}
    50% { opacity: 1; left: 960px;  top: 0px}
	60% { opacity: 0; left: 320px; width: 320px; height: 155px; background-size: 320px 155px;}
	90% { opacity: 0; left: 20px; }
    100% { opacity: 1; left: 0px; width: 650px; height: 320px; background-size: 650px 320px;}
}

@keyframes imageAnimation1 { 
    0% { opacity: 0; left: 20px; }
	10% { opacity: 1; left: 0px; }
	20% { opacity: 1; left: 320px; }
	25% { opacity: 0; left: 240px; }
    100% { opacity: 0; }
}

@-webkit-keyframes imageAnimation1 { 
    0% { opacity: 0; left: 20px; }
	10% { opacity: 1; left: 0px; }
	20% { opacity: 1; left: 320px; }
	25% { opacity: 0; left: 240px; }
    100% { opacity: 0; }
}
	
@keyframes imageAnimation2 { 
    0% { opacity: 0; }
	10% { opacity: 0; left: 20px; top: 300px;  }
	20% { opacity: 1; left: 0px; } 
	30% { opacity: 1; left: 320px; top: 100px; width: 650px; height: 320px; background-size: 650px 320px;}
	35% { opacity: 0; left: 240px; }
    100% { opacity: 0; width: 320px; height: 155px; background-size: 320px 155px;}
}

@-webkit-keyframes imageAnimation2 { 
    0% { opacity: 0; }
	10% { opacity: 0; left: 20px; top: 300px; }
	20% { opacity: 1; left: 0px; } 
	30% { opacity: 1; left: 320px; top: 100px; width: 650px; height: 320px; background-size: 650px 320px;}
	35% { opacity: 0; left: 240px; }
    100% { opacity: 0; width: 320px; height: 155px; background-size: 320px 155px;}
}

@keyframes imageAnimation3 { 
    0% { opacity: 0; }
	20 % { opacity: 0; left: 20px; }
	30% { opacity: 1; left: 0px; }
	40% { opacity: 1; left: 320px; }
	45% { opacity: 0; left: 240px; }
    100% { opacity: 0; }
}

@-webkit-keyframes imageAnimation3 { 
    0% { opacity: 0; }
	20 % { opacity: 0; left: 20px; }
	30% { opacity: 1; left: 0px; }
	40% { opacity: 1; left: 320px; }
	45% { opacity: 0; left: 240px; }
    100% { opacity: 0; }
}

@keyframes imageAnimation4 { 
    0% { opacity: 0; }
	30% { opacity: 0; left: 20px; }
	40% { opacity: 1; left: 0px; }
	50% { opacity: 1; left: 320px; }
	55% { opacity: 0; left: 240px; }
    100% { opacity: 0; }
}

@-webkit-keyframes imageAnimation4 { 
    0% { opacity: 0; }
	30% { opacity: 0; left: 20px; }
	40% { opacity: 1; left: 0px; }
	50% { opacity: 1; left: 320px; }
	55% { opacity: 0; left: 240px; }
    100% { opacity: 0; }
}

@keyframes imageAnimation5 { 
    0% { opacity: 0; }
	40% { opacity: 0; left: 20px; top: 400px;}
	50% { opacity: 0; left: 0px; }
	60% { opacity: 1; left: 320px; top: 100px; width: 650px; height: 320px; background-size: 650px 320px;}
	65% { opacity: 1; left: 120px; }
    100% { opacity: 0; width: 320px; height: 155px; background-size: 320px 155px;}
}

@-webkit-keyframes imageAnimation5 { 
    0% { opacity: 0; }
	40% { opacity: 0; left: 20px; top: 400px;}
	50% { opacity: 0; left: 0px; }
	60% { opacity: 1; left: 320px; top: 100px; width: 650px; height: 320px; background-size: 650px 320px;}
	65% { opacity: 1; left: 120px; }
    100% { opacity: 0; width: 320px; height: 155px; background-size: 320px 155px;}
}

@keyframes imageAnimation6 { 
    0% { opacity: 0; right: 0px; bottom: 0px;}
	25% { opacity: 1; right: 640px; bottom: 240px; }
	50% { opacity: 1; right: 640px; bottom: 0px; } 
	75% { opacity: 1; right: 0px; bottom: 240px; }
    100% { opacity: 0; right: 0px; bottom: 0px;}
}

@-webkit-keyframes imageAnimation6 { 
    0% { opacity: 0; right: 0px; bottom: 0px;}
	25% { opacity: 1; right: 640px; bottom: 240px; }
	50% { opacity: 1; right: 640px; bottom: 0px; } 
	75% { opacity: 1; right: 0px; bottom: 240px; }
    100% { opacity: 0; right: 0px; bottom: 0px;}
}

@keyframes imageAnimation7 { 
    0% { opacity: 1; right: 0px; top: 0px; }
	30% { opacity: 1; right: 1000px; top: 0px;  }
	50% { opacity: 1; right: 1000px; top: 240px; }
	80% { opacity: 0; right: 0px; top: 240px; }
    100% { opacity: 1; right: 0px; top: 0px; }
}

@-webkit-keyframes imageAnimation7 { 
    0% { opacity: 1; right: 0px; top: 0px; }
	30% { opacity: 1; right: 1000px; top: 0px;  }
	50% { opacity: 1; right: 1000px; top: 240px; }
	80% { opacity: 0; right: 0px; top: 240px; }
    100% { opacity: 1; right: 0px; top: 0px; }
}

@keyframes imageAnimation8 { 
    0% { opacity: 1; right: 320px; top: 0px;}
	25% { opacity: 0; right: 0px; top: 0px}
	50% { opacity: 0; right: 0px;  top: 240px; } 
	75% { opacity: 1; right: 320px; top: 240px; }
    100% { opacity: 1; right: 320px; top: 0px;}
}

@-webkit-keyframes imageAnimation8 { 
    0% { opacity: 1; right: 320px; top: 0px;}
	25% { opacity: 0; right: 0px; top: 0px}
	50% { opacity: 0; right: 0px;  top: 240px; } 
	75% { opacity: 1; right: 320px; top: 240px; }
    100% { opacity: 1; right: 320px; top: 0px;}
}

@keyframes imageAnimation9 { 
    0% { opacity: 1; left: 640px; bottom: 0px; }
	30% { opacity: 0; left: 0px; bottom: 0px; }
	50% { opacity: 1; left: 0px; bottom: 240px; }
	80% { opacity: 0;  left: 1000px;  bottom: 240px; }
	100% { opacity: 1; left: 640px; bottom: 0px; }
}

@-webkit-keyframes imageAnimation9 { 
    0% { opacity: 1; left: 640px; bottom: 0px; }
	30% { opacity: 0; left: 0px; bottom: 0px; }
	50% { opacity: 1; left: 0px; bottom: 240px; }
	80% { opacity: 0;  left: 1000px;  bottom: 240px; }
	100% { opacity: 1; left: 640px; bottom: 0px; }
}

@keyframes imageAnimation10 { 
    0% { opacity: 1; right: 0px; bottom: 0px; }
	30% { opacity: 0; right: 0px; bottom: 0px; }
	50% { opacity: 1; right: 0px; bottom: 400px; }
	80% { opacity: 0;  right: 320px;  bottom: 400px; }
	100% { opacity: 1; right: 0px; bottom: 0px; }

@-webkit-keyframes imageAnimation10 { 
    0% { opacity: 1; right: 0px; bottom: 0px; }
	30% { opacity: 0; right: 0px; bottom: 0px; }
	50% { opacity: 1; right: 0px; bottom: 400px; }
	80% { opacity: 0;  right: 320px;  bottom: 400px; }
	100% { opacity: 1; right: 0px; bottom: 0px; }
}

@keyframes imageAnimation11 { 
    0% { opacity: 1; left: 0px; top: 200px; }
	30% { opacity: 0; left: 480px; top: 0px; }
	50% { opacity: 1; right: 0px; top: 0px; }
	80% { opacity: 0;  right: 0px;  bottom: 0px; }
	100% { opacity: 1; left: 0px; top: 200px; }
}

@-webkit-keyframes imageAnimation11 { 
    0% { opacity: 1; left: 0px; top: 200px; }
	30% { opacity: 0; left: 480px; top: 0px; }
	50% { opacity: 1; right: 0px; top: 0px; }
	80% { opacity: 0;  right: 0px;  bottom: 0px; }
	100% { opacity: 1; left: 0px; top: 200px; }
}