@media only screen and (min-width: 600px) {
* {box-sizing: border-box;}

body{
	font-family: "Copse", system-font;
}
#title{
	text-align: center;
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
	padding: 0.5em;
	width: 20em;
	margin: auto;
	margin-bottom: 0.5em;
}

#main{
	grid-column: 2/3;
	grid-row: 1/-1;
	height: 100%;
	width: 100%;
	line-height: 2;
}


#status{
    grid-column: 1;
    grid-row: 1;
    line-height: 1.5;
	height: 100%;
	width: 100%;
	text-align: center;
}

#art{
    grid-column: 1;
    grid-row: 2;
	height: 100%;
	width: 100%;
	text-align: center;
}

#blog{
    grid-column: 3/-1;
    grid-row: 1/-1;
	height: 100%;
	width: 100%;
	text-align: center;
}

.grid{
    display: grid;
    grid-template-columns: 23% 50% 23%;
    grid-template-rows: auto auto;
    column-gap: 2em;
	row-gap: 2em;
}

.grid2{
    display: grid;
    grid-template-columns: auto auto auto;
    grid-template-rows: auto auto;
    column-gap: 2em;
	row-gap: 2em;
	justify-content: space-around;
	height: 600px;
	margin-bottom: 2em;
}

.grid2 img{
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
	padding: 1em;
	border-radius: 8px;
}

img.river7{
	padding: 1 2;
}

img.me{
	float: left;
	margin-right: 10px;
}

body{
	background-color: black;
	background-image: linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)),  url("images/reigen.webp");
	background-size: 200px;
}


section {
	margin: auto;
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
	padding: 1em 1em;
}


footer{
	margin-top: 2em;
	margin-bottom: 2em;
	text-align: center;
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
	bottom: 0;
}

#columns{
	display: flex;
	flex-direction: row;
}
#column{
	flex: 1;
	box-sizing: border-box;
}


.river-header{
	text-align: center;
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
	width: 25em;
	padding: 0em 2em 2em 2em;
	margin: auto;
	margin-bottom: 2em;
}

.skinny{
	text-align: center;
}

a{
	text-decoration: none;
}

}

@media only screen and (max-width: 600px) {
	* {box-sizing: border-box;}
body{
	font-family: "Copse", system-font;
}
#title{
	text-align: center;
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
}

#main{
	/*grid-column: 2/3;
	grid-row: 1/-1;*/
	width: 100%;
}


#status{
    /*grid-column: 1;
    grid-row: 1;
    line-height: 1.5;*/
	width: 100%;
	text-align: center;
}

#art{
    /*grid-column: 1;
    grid-row: 2;*/
	width: 100%;
	text-align: center;
}

#blog{
    /*grid-column: 3/-1;
    grid-row: 1/-1;*/
	width: 100%;
	text-align: center;
}

/*.grid{
    display: grid;
    grid-template-columns: 25% 50% 25%;
    grid-template-rows: auto auto;
    column-gap: 2em;
	row-gap: 2em;
}*/

.grid2{
    /*display: grid;
    grid-template-columns: auto auto auto;
    grid-template-rows: auto auto;
    column-gap: 2em;
	row-gap: 2em;
	justify-content: space-around;*/
	width: 100%;
	margin: 1em;
	margin: auto;
}

img.me{
	float: left;
}

body{
	background-color: black;
	background-image: linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)),  url("images/reigen.webp");
	background-size: 200px;
}


section {
	margin: auto;
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
	padding: 1em 1em;
}


footer{
	margin-top: 2em;
	text-align: center;
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
}





.river-header{
	text-align: center;
	border-style: double;
	border-radius: 6px;
	border-color: black;
	background: #ffffff;
	width: 25em;
	padding: 0em 1em 1em 1em;
	margin: auto;
	margin-bottom: 2em;
}

	
}