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

@media only screen and (max-width: 1200px) {
	 .animallist, .shows, .semenembryolist, .clubcalf {	
		width: 100%;
	 	-webkit-box-align: start;
	 	    -ms-flex-align: start;
	 	        align-items: flex-start;
	 }
	 
	  .innerflex {
		width: 100%;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap; 
		-ms-flex-pack: distribute; 
		    justify-content: space-around;
	  }
	  
	  .animallist a {
			width: 40%;  
	  }
}

@media only screen and (max-width: 1100px) {
	header {
		width: 100%;	
	}
	
	.logo {
		width: 25%;	
		margin-top: -11vw;
		top: 0;
	}
	
	nav {
		margin-top: -4.9vw;	
		font-size: 1.5vw;
	}
	
	nav a, .dropdown {
		padding: 1vw;	
	}
	
	.multipleitems {
		width: 90%;	
	}
	
	.cover, .crsl-item, .crsl-item div {
		width: 15vw;	
		font-size: 1vw;
	}
	
	.familypicture {
		width: 75%;	
	}
	
}	

@media only screen and (max-width: 800px) {
	header, .logo, nav {
		display: none;
	}
	
	.topper {
		position: relative;	
	}
	
	.familypicture {
		z-index: 99;
	}	
	
	.heading {
		margin-top: 25px;	
	}
	
	.mobileopen {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-pack: distribute;
		    justify-content: space-around;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		height: 50px;
	}
	
	.mobileopen a {
		color: black;
		text-decoration: none;	
	}
	
	.opener {
		width: 35px;	
	}
	
	.opener:hover {
		cursor: pointer;	
	}
	
	.open {
		width: 100vw;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		text-align: center;
		font-size: 8vw;
		margin: 0 auto;
		background-color: rgba(0,0,0,0.8);
		z-index: 1000;
	}
	
	nav a, .dropdown {
		width: 100%;	
	}
	
	.dropmenu, .dropdown:hover .dropmenu {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		font-size: 8vw;
		position: relative;	
		text-align: center;
		font-size: 3vw;
		width: 100%;
		padding: 0 auto;
	}
	
	.dropmenu a {
		padding-top: 5px;
		padding-bottom: 5px;
		width: 100%;
	}
	
	.semenembryolist, .clubcalf {
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;	
	}
	
	.innersire {
		-webkit-box-orient: vertical;
		-webkit-box-direction: reverse;
		    -ms-flex-direction: column-reverse;
		        flex-direction: column-reverse;	
		width: 100%;
		margin: auto;
	}
	
	.innersire .animalinfo {
		width: 450px;	
		margin: 0 auto;
	}
	
	.innersire .picture {
		width: 500px;
		margin: 0 auto;
		margin-bottom: 20px;	
	}

	
	 .animallist a, .animallist a.larger, .semen, .embryo, .club, .clubinfo {
			width: 70%;  
	  }
	  
	  .shows a {
			width: 40%;  
	  }
	  
	  .aniversarylogo {
			width: 85%;  
	  }
	  
	  .contactinfo {
		display: block;  
	  }	
	  
	  .contactinfo .picture {
			width: 100%;
			margin-top: 25px;
	  }
	  
	  .cover {
			width: 50vw; 
			margin: auto; 
	  }
	  
	.crsl-item, .crsl-item div {
		text-align: center;
		width: 90vw;	
		font-size: 4vw;
	}
	
	.heading h1, .heading2 h1 {
		width: 100vw;
		font-size: 7vw;	
	}
	
	 .embryo .pedigree, .club .pedigree {
			margin-left: 25px; 
	 }
	 
	 .embryo .pedigree strong, .club .pedigree strong {
			margin-left: -25px; 
	 }
}