.bannerb { width:300px;
				height: 200px;
				border: 8px solid white;
				margin: auto;
				background-size: 100% 100%;
				animation: bannerb 20s infinite;
				animation-direction: alternate;}
@media (min-width:768px) {.bannerb 
				{width:600px;
				height: 394px;
				border: 6px solid white;
				margin: auto;
				background-size: 100% 100%;
				animation: bannerb 20s infinite;
				animation-direction: alternate;}}
@keyframes bannerb { 
					 				0%, 7% {background-image:url(../objetos/banner.jpg);}
									10%, 24% {background-image:url(../objetos/rambolla1.jpg);}
									27%, 38% {background-image:url(../objetos/ramcandy2.jpg);}
									42%, 56% {background-image:url(../objetos/ramblanclilajegut.jpg);}
									59%, 73% {background-image:url(../objetos/ramvariat.jpg);}
									76%, 90% {background-image:url(../objetos/ramydiadema.jpg);}
									94%, 100% {background-image:url(../objetos/pastissets.jpg);}}

#banner{ margin-top: 50px;
				 position: relative;}
#banner img { width: 100%;
							height: 75%;}
#banner .contenedor {position: absolute;
										top: 50%;
										left: 50%;
										transform: translateX(-50%) translateY(-55%);
										color: white;}
#banner h2 {font-size: 28px;
				margin: auto; color: white;}									
#banner a { display: block;
						width: 80px;
						height: 90px;
						color: black;
						text-decoration: none;
						padding: 3px;
						margin-top: 3px;
						border: 3px solid black;}
#banner a:hover {background: rgba(51,51,51,0.5);}