@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Martel+Sans|Paytone+One');
body {
	padding: 0;
	margin: 0;	
	font-family: 'Martel Sans', sans-serif; 
	background: url(images/build/dark_geometric.png);
}


h1, h2, h3, h4 {
	font-family: 'Paytone One', sans-serif;	
}

hr {
	outline: none;
	border: none;
	width: 80%;
	margin: auto;
	height: 1px;
	background-color: white;	
}

nav {
	background: url(images/build/dark_geometric.png);
	text-transform: uppercase;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	font-family: 'Paytone One';
	font-size: 1.5vw;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}

.links {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 70%;
	-ms-flex-pack: distribute;
	    justify-content: space-around;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.links a {
	color: white;
	padding: 1vw;
	font-style: italic;	
}

.links a.facebook {
	color: white;
	text-decoration: none;	
	background-color: #B1001B;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	font-size: 3vw;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	width: 7%;
}

.links a:hover {
	text-decoration: none;	
	background-color: #B1001B;

}

.links a.facebook:hover {
	color:#3b5998;
	background-color: white;
}

.logo {
	position: absolute;
	width: 22%;	
	margin-top: -7vw;
	margin-left: 6vw;
	background-color: #333;
	z-index: 999;
}

.banner {
	width: 100%;	
	background-color: black;
	border-bottom: 5px #B1001B solid;
}

.banner img.background {
	opacity: 0.45;	
}

.banner img.background2 {
	opacity: .7;	
}

.homebannerinfo {
	width: 50%;
	position: absolute;
	margin-top: -28vw;	
	margin-left: 24vw;
	color: white;
}

.homebannerinfo h1 {
	text-align: center;	
	font-size: 1.5vw;
	margin-top: -3.5vw;
	margin-left: -1vw;
}

.homebannerinfo2 {
	width: 70%;
	position: absolute;
	margin-top: -15vw;	
	margin-left: 14vw;
	color: white;
}

.homebannerinfo2 h1 {
	text-align: center;	
	font-size: 2vw;
}

.content {
	width: 70%;
	margin: auto;
	color: white;
	font-size: 1.2vw;
}

img.homeabout  {
	float: right;
	padding-left: 1vw;	
}

.footer {
	background-color: #b01f24;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center; 
	color: white;	
}

.footerlogo {
	width: 40%;
	padding: 1vw;	
}

.footer div {
	padding: 1vw;
	text-align: center;
}	

.footer .contact {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 40%;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}	
.footer .phonenumbers {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}	

.footer a {
	color: #fff;
	font-family: 'Paytone One';
	font-size: 1.5vw;
}

.animals {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;	
}

.animal {
	width: 30%;
	margin: 1.5%;	
	font-size: 0.9vw;
	text-align: center;
	color: black;
	background-color: white;
}

.animal2 {
	width: 30%;
	margin: 1.5%;	
	font-size: 0.7vw;
	text-align: center;
	color: black;
	background-color: white;
}

.embryo {
	width: 25%;
	margin: 1.5%;	
	font-size: 0.9vw;
	text-align: center;
	color: black;
	background-color: white;
}

.animal img {
	width: 100%;	
	margin-bottom: -1.2vw;
}


.animal2 img {
	width: 100%;	
	margin-bottom: -1.2vw;
}


.embryo img {
	width: 100%;	
	margin-bottom: -0.6vw;
}

.animal strong {
	color: #b1001b;
	font-family: 'Paytone One';	
	font-weight: normal;
	font-size: 2vw;
	 -webkit-text-stroke-width: 1px;
   -webkit-text-stroke-color: white;
   position: relative;
   z-index: 999;
}

.animal2 strong {
	color: #b1001b;
	font-family: 'Paytone One';	
	font-weight: normal;
	font-size: 2vw;
	 -webkit-text-stroke-width: 1px;
   -webkit-text-stroke-color: white;
   position: relative;
   z-index: 999;
}


.embryo strong {
	color: #b1001b;
	font-family: 'Paytone One';	
	font-weight: normal;
	font-size: 1.2vw;
	 -webkit-text-stroke-width: 1px;
   -webkit-text-stroke-color: white;
}


.sale {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;	
}

.saleinfo {
	font-size: 0.8vw;	
	display: -webkit-box;	
	display: -ms-flexbox;	
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	width: 60%;
}

.saleinfo strong {
	color: #b1001b;
	font-size: 1.2vw;	
}

.cross {
	color: white;
	font-size: 4vw;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;	
}

.contact {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;	
	-webkit-box-align: center;	
	    -ms-flex-align: center;	
	        align-items: center;
}

.contact a {
	color: white;	
}

.phonenumbers {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%;
	text-align: center;
	-ms-flex-pack: distribute;
	    justify-content: space-around;	
}

.opener {
	display: none;
	color: white;	
	width: 100%;
	font-size: 5vw;
	text-align: center;
}

.animalinfo {
	width: 100%;
	margin-left: 3vw;	
}


button {
	background-color: transparent;
	border: 2px solid #b1001b;
	outline: none;
	padding: 1vw;
	color: white;	
}

button:hover {
	cursor: pointer;
	background-color: #b1001b;
}

.animal a {
	color: black;	
}

.animal a:hover {
	text-decoration: none;	
}

.animal a:hover img{
	opacity: 0.8;
}

.animal2 a {
	color: black;	
}

.animal2 a:hover {
	text-decoration: none;	
}

.animal2 a:hover img{
	opacity: 0.8;
	z-index: 1;
}

.footnote {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;	
}

.footnote div {
	width: 50%;	
}

.child {
	font-size: 0.8vw;
	text-align: center;	
}

.currentsale {
	width: 100%;
	background-color: #b1001b;
	text-align: center;
	padding: 1vw;
	margin-bottom: 5vw;
	color: white;	
}

.animalinfo strong {
	color: #b1001b;
	font-size: 1.5vw;	
}
