@charset "utf-8";
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
body{
	background-color:beige;
} 
div{
	border-width: thin;
}
#wrapper{
	background-color: white;
	width: 70%;
	border: 2px solid #000080;
	height: auto;
	margin: auto;
	padding: 3px;
	border-radius: 25px;
}
.wrapper2{
	background-color: white;
	width: 97%;
	border: 2px solid #000080;
	height: auto;
	margin: auto;
	padding: 5px;
	border-radius: 25px;
}
	 #header {
		 /*display: flex;
         flex-wrap: wrap;*/
	     width: 50%;
		 margin: auto;
		 padding: 2px;
		 border: 2px solid grey;
		 font-family: Georgia, serif;
		 font-size: 30px;
		 text-align: center;
		 color: #0247FE;
		 border-radius: 20px;
	     background: #F7E9D4;
        }
    img{
	border-radius: 25px;
     }
    .container{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	height: auto;
    margin: auto;
	/*border: 1px solid #000080;*/
}
.photo {
	border-radius: 25px;
	width: 40%;
	height: 200px;
	 background-image: url("images/catf-patchandflopper.jpg");
	 background-size: contain;
	 background-size: 100% 100%;
     background-repeat: no-repeat;
	 margin: auto;
	order: 1;
}
.photo1 {
	flex:1 1 90%;
	border-radius: 25px;
	height: 200px;
	background-color: cadetblue;
	 background-image: url("");
	 background-size: contain;
	 background-size: 100% 100%;
     background-repeat: no-repeat;
	 margin: auto;
	order: 1;
}
#photo1a {
	flex:0 1 200px;
	border-radius: 25px;
	height: 200px;
	/*background-color: cadetblue;*/
	 background-image: url("images/catf-2020-03-17Spot-1000.png");
	 background-size: contain;
	 background-size: 100% 100%;
     background-repeat: no-repeat;
	 margin: auto;
	order: 1;
}
#photo1b {
	flex:0 1 200px;
	border-radius: 25px;
	height: 200px;
	/*background-color: cadetblue;*/
	 background-image: url("images/Floppey.jpg");
	 background-size: contain;
	 background-size: 100% 100%;
     background-repeat: no-repeat;
	 margin: auto;
	order: 1;
}
#photo1c {
	flex:0 1 200px;
	border-radius: 25px;
	height: 200px;
	/*background-color: cadetblue;*/
	 background-image: url("images/scruffy1.jpg");
	 background-size: contain;
	 background-size: 100% 100%;
     background-repeat: no-repeat;
	 margin: auto;
	order: 1;
}
#photo1d {
	flex:0 1 200px;
	border-radius: 25px;
	height: 200px;
	/*background-color: cadetblue;*/
	 background-image: url("images/ET1.jpg");
	 background-size: contain;
	 background-size: 100% 100%;
     background-repeat: no-repeat;
	 margin: auto;
	order: 1;
}
.cont1{
	display: flex;
	flex-wrap: wrap;
	border-radius: 25px;
	flex: 1 1 30%;
	height: auto;
	border: 1px solid #000080;
}
.headline{
	flex: 1 1 90%;
	margin: 0px auto auto auto;
	text-align: center;
	order: 2;
}.story{
	color:darkblue;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	order: 3;
} p{
	text-align: center;
}
#textrow{
	/*display: flex;
	flex-direction: row;*/
	width: 70%;
	height: 100px;
    margin: auto;
	border: 2px solid #000080;
	
}.stories{
	display: flex;
	flex-wrap: wrap;
	width: 75px;
	height: auto;
	border: 2px solid #000080;
}#storcont{
	flex-direction: row;
	flex: 1 1 100%;
	/*flex-wrap: wrap;*/
	border: 2px solid yellow;
}
.divwrapper{
	border: 2px solid yellow;
}

@media screen and (max-width:768px){
	.wrapper2{
		width: 100%
	}
	#wrapper{
		width: 100%;
	}
	#header{
		width: 100%;
	}
.cont1
{flex: 1 1 50%;
}
.photo
	{flex: 1 1 100%;
}	
}