@import url('https://fonts.googleapis.com/css?family=Finger+Paint:400,700');
@import url('https://fonts.googleapis.com/css?family=Recursive:400,700');
@import url('https://fonts.googleapis.com/css?family=Yuji+Boku:400,700');

* {
	transition:all 1s;
}

html {
	color:white; font-family:system-ui;
	background-color:rgb(5,5,5);
}


body {
	text-align:center;
	margin:auto; padding:0em;
	background-color:rgb(225,225,225);
	/* background-image:url('./res/image/Photo.jpg'); background-attachment:fixed; background-size:cover; */
}
body > h1 {
	text-align:center; font-size:1.75em;
	display:inline-block; margin:1em auto; padding:0.5em 2em;
	border-bottom:solid 0.2em white;
}

header {
	text-align:center;
	padding:1em;
}
header img {
	box-shadow:0em 0em 2em rgba(0,0,00,0.25);
	vertical-align:middle; display:inline-block; height:12em;
}
header h1 {
	vertical-align:middle; display:inline-block; margin:1em;
}

header nav {
	text-align:center; font-family:'Finger Paint';
	margin-top:2em;
}
header nav ol {
	list-style-type:none;
	padding:0em;
}
header nav li {
	transition:all 0.5s;
	color:white; cursor:pointer;
	display:inline-block; width:calc((100% / 3) - (3 * 2em)); min-width:5em; margin:0.5em; padding:0.5em;
	background-color:rgb(30,175,185);
	border:double 0.5em rgba(0,0,0,0.25);
}
header nav li:hover {
	background-color:rgb(20,125,150);
}
header nav li a {
	color:inherit; text-decoration:none; font-weight:bold;
}


#wrapper {
	color:rgb(20,125,150);
	vertical-align:middle; display:inline-block; max-width:54em;
	background-color:rgba(255,255,255,0.99);
}

/* #header_title_part_1 { */
	/* color:rgb(235,135,35); */
/* } */
/* #header_title_part_2 { */
	/* color:rgb(245,175,65); */
/* } */
/* #header_title_part_3 { */
	/* color:rgb(20,125,150); */
/* } */
/* #header_title_part_4 { */
	/* color:rgb(245,175,65); */
/* } */
/* #header_title_part_5 { */
	/* color:rgb(20,125,150); */
/* } */
/* #header_title_part_6{ */
	/* color:rgb(30,175,185); */
/* } */

#page {
	position:relative;
}

.organization_title_color_1 {
	color:rgb(235,135,35);
}
.organization_title_color_2 {
	color:rgb(245,175,65);
}
.organization_title_color_3 {
	color:rgb(20,125,150);
}
.organization_title_color_4 {
	color:rgb(30,175,185);
}

#organization {
	font-family:'Recursive';
}


#organization_about {
	width:100%; margin:1em auto;
	border-top:solid 1px rgb(125,125,125);
}

#organization_summary {
	color:white;
	/* border-top:solid 1em rgb(20,125,150); border-bottom:solid 1em rgb(20,125,150); */
}
#organization_summary_wrapper {
	/* margin:1em auto; */
	padding:2em;
	background-color:rgb(20,125,150);
}

#organization_missions {
	margin:1em auto; padding:0em 2em;
}
#organization_missions_wrapper {
	padding:1em 0em;
	border-top:dotted 1em rgb(20,125,150); border-bottom:dotted 1em rgb(20,125,150);
}
#organization_missions ul {
	text-align:left; font-family:'Yuji Boku'; font-weight:bold;
}


#organization_objectif {
	color:white;
}

#organization_objectif_wrapper {
	/* margin:1em auto; */
	padding:2em 1em;
	background-color:rgb(235,135,35);
	/* border-top:dashed 0.5em rgb(245,175,65); border-bottom:dashed 0.5em rgb(245,175,65); */
}
#organization_objectif_wrapper p {
	font-weight:bold;
}


#organization_objectif_subtext1 {
	text-align:left;
}

#voluntary {
	color:white; font-family:'Recursive';
	display:inline-block; margin:10vh 5vw; padding:1em 2em;
	background-color:rgb(30,175,185);
	border:dashed 0.25em rgba(0,0,0,0.1); border-radius:0.5em;
}
#voluntary_icon {
	height:6em;
}

#voluntary h1 {
	font-size:1.25em;
}

#voluntary form {
	text-align:left;
	display:inline-block; margin:auto;
}
#voluntary form fieldset {
	border:none;
}
#voluntary form fieldset input {
	border:solid 0.25em rgba(0,0,0,0.1);
	border-radius:0.25em;
}
#voluntary form fieldset textarea {
	display:block; height:4em; width:100%; margin:1em auto;
	border:solid 0.25em rgba(0,0,0,0.1);
	border-radius:0.25em;
}
#voluntary form button {
	color:white; font-weight:bold;
	display:block; margin:auto; padding:1em 2em;
	background-color:rgba(0,0,0,0.1);
	border:solid 0.25em rgba(0,0,0,0.1); border-radius:0.25em;
}

#fabrikayoops {
	position:relative;
}
#fabrikayoops video {
	transform:rotateX(180deg);
	width:100%;
}

#fabrikayoops_text {
	color:white;
	position:absolute; top:0em; left:0em;
	height:calc(100% - 4em - 0.25em); width:calc(100% - 4em); padding:2em;
	/* background-color:rgba(0,0,0,0.5); */
	background:linear-gradient(rgba(0,0,0,0.5) 25%, rgba(0,0,0,0.75));
}

#fabrikayoops_text img {
	display:block;
	height:4em; margin:1em auto;
}

#fabrikayoops_text h1 {
	display:inline-block;
	padding:0.25em 1em;
	border-bottom:solid 0.25em white;
}

#fabrikayoops_text a {
	color:inherit;
}

#donations {
	font-family:'Finger Paint';
	margin:8em auto;
}

#donations ol {
	list-style-type:none;
}
#donations li {
	display:inline;
}
#donations button {
	cursor:pointer;
	width:calc((100% / 4) - (4 * 0.5em));
	background:none; border:none;
}
#donations button img {
	width:100%;
}

#donations form label {
	vertical-align:middle; font-size:1.25em;
}

#donations form input {
	color:rgb(20,125,150); font-family:inherit; font-size:2em; font-weight:bold;
	vertical-align:middle; display:inline-block; width:2em; margin-left:0.25em;
}

#donations form button {
	cursor:pointer; color:rgb(20,125,150); font-weight:bold;
	width:unset; padding:1em 2em;
	background:none;
	border:solid 0.15em rgb(20,125,150); border-radius:0.5em;
}

#contact {
	font-family:'Finger Paint';
}

#contact ul {
	list-style-type:none;
}

#contact a {
	color:inherit;
}

#contact iframe {
	vertical-align:middle; display:inline-block; height:8em; width:8em;
}
#contact p {
	text-align:left; font-weight:bold;
	vertical-align:middle; display:inline-block; width:24em;
}

#contact_address {
	margin-left:1em;
}

#contact_hours {
	color:white; margin:1em auto;
	border:solid 0.5em rgb(25,125,150);
}
#contact_hours td {
	padding:0.25em 0.5em;
	border:solid 0.25em rgb(25,125,150);
	background-color:rgb(25,125,150);
}