body {
	background-image: url("../background.png");
	background-repeat: repeat-y;
	background-size: 100% 100%;
	background-attachment: fixed;
}

main {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 100%;
	gap: 20px;
}

div#logo {
	display: flex;
	max-width: 100%;
}

div#logo img {
	max-width: 100%;
}

h1#introh1 {
	font-size: 2.4em;
	color: #EE0000;
	text-shadow: 2px 2px 6px midnightblue;
	text-align: center;
}

div.divbox {
	display: flex;
	flex-direction: column;
	border: 4px solid darkgray;
	box-shadow: 3px 3px white;
	align-items: center;
	width: 95%;
	padding: 10px;
}

p.txt {
	color: white;
	font-size: 1.2em;
	font-weight: bold;
}

/* information */
div#ttinfo {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

div#ttinfo img {
	max-height: 600px;
}

div#ttinfo article {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

#ttinfo h1 {
	color: white;
	font-size: 2em;
}

#ttinfo p {
	color: white;
	font-size: 1.2em;
	font-weight: bold;
	text-align: justify;
}

#ttinfo ul {
	color: white;
	font-size: 1.1em;
	font-weight: bold;
	text-align: justify;
}

#ttinfo ul h2 {
}

/* levels */
div#egypt {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: white;
}

#egypt img {
	max-width: 100%;
	margin-bottom: 10px;
}

#egypt p {
	text-align: justify;
}

#egypt ul {
	width: 85%;
	text-align: justify;
}

#egypt li {
	font-size: 1.2em;
}

#egypt li li {
	font-size: 1em;
}

/* social networks */
div#ssnn {
	display: flex;
	flex-direction: column;
	text-align: center;
	justify-content: center;
	align-items: center;
}

#ssnn div {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	gap: 20px;
}

#ssnn img {
	max-height: 96px;
}

/* companies */
div#complist {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

div#complist h1 {
	color: white;
	text-shadow: 2px 2px black;
	text-align: center;
}

div#listc {
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: center;
}

div.company {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 10%;
	border: 3px solid silver;
	background-color: white;
}

div.company:hover {
	border-color: gold;
	background-color: skyblue;
}

div.company:hover p {
	color: gold;
	text-shadow: 1px 1px black;
}

div.company a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 3px;
	text-decoration: none;
	width: 100%;
	height: 100%;
}

div.company a img {
	width: 100%;
	height: 100%;
}

div.company p {
	font-weight: bold;
	color: black;
	text-align: center;
}

/* sustainability */
div#sus {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	max-width: 50%;
}

div#sus p {
	color: white;
	text-align: center;
	font-size: 1.1em;
	font-weight: bold;
}

div#sus img {
	max-width: 30%;
}

/* ecohosting */
div#ecohosting {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	gap: 20px;
}

div#ecohosting h2 {
	color: white;
}

div#ecohosting a {
	max-width: 8%;
}

div#ecohosting img {
	max-width: 100%;
	max-height: 100%;
}

/*---------*/
/* responsive */
@media screen and (max-width: 790px) {
div#ttinfo {
	flex-direction: column-reverse;
}

div#ttinfo img {
	max-height: 400px;
}

div#listc {
	flex-direction: column;
}

#egypt ul {
	width: 87%;
}

div.company {
	width: 95%;
	max-height: 96px;
	margin-top: 10px;
	margin-bottom: 10px;
}

div.company a {
	flex-direction: row;
	justify-content: space-between;
}

div.company img {
	max-width: 96px;
	max-height: 96px;
}

div#sus img {
	max-width: 90%;
}

div#ecohosting a {
	max-width: 16%;
}
}