
html {
	font-size: 100%; /*1vw;*/
	font-family: Calibri, sans-serif; /*"Calibri Light",*/ /*Arial,Helvetica,Tahoma,Verdana,sans-serif;*/ /*Times, "Times New Roman", serif;*/
	background: linear-gradient(to bottom, #808080, #d3d3d3, #e0e0e0, #d3d3d3, #808080); /*grey;*/ /*#acb6bd;*/ /*#d3d3d3;*/ /*#f2f2f2;*/ /*#fff;*/ /*#b67a2a;*/
	background-attachment: fixed;
	color: #555;
}

body {
	width: auto;
	max-width: 1350px; /*1250px;*/
	min-height: 100vh;
	margin: 0px auto;
	/*padding: 0.5% 0.5% 0px 0.5%; /*10px 15px 0px 15px;*/ /*10px;*/
	text-align: left;
	overflow: visible;
	background: #fff;
}



.stb {
	font-size: 1.1em; /*0.9rem;*/ /*1rem;*/
	font-weight: 500;
	color: #555; /*goldenrod;*/
}

a:link.stb, a:active.stb, a:visited.stb {
	font-size: 1.1em; /*0.9rem;*/ /*1rem;*/
	color: #555; /*white;*/
	text-decoration: none;
}

a:hover.stb {
	color: #D92247;
	text-decoration: none;	
}

.stb_big {
	font-size: 2.55em; /*2.8em;*/
	font-weight: 500;
	color: #b67a2a;
}

a:hover.stb_big {
	color: #D92247;
	text-decoration: none;	
}

.stb_big2 {
	font-size: 2.55em; /*2.8em;*/
	font-weight: 700;
	color: #555;
	letter-spacing: 0.2em;
}




/*---- !!! MENU !!! -----*/

.topnav {
	overflow: hidden;
	background-color: #b67a2a;
	/*margin-bottom: 10px;*/  
}

.topnav a {
	float: left;
	display: block;
	color: #f2f2f2;
	text-align: center;
	padding: 10px 16px; /*14px 16px;*/
	text-decoration: none;
	font-size: 1.0625rem; /*17px;*/
	transition-property: background-color; /* What to animate */
	transition-duration: 0.2s; /* How long it takes */
	transition-timing-function: ease-in-out; /* How it speeds up/slows down */  
}

.topnav .active {
	background-color: #555; /*lightgrey;*/ /*grey;*/ /*#04AA6D;*/
	color: white; /*#555;*/
}

.topnav .icon {
	display: none;
}

.dropdown {
	float: left;
	overflow: hidden;
}

.dropdown .dropbtn {
	font-size: 1.0625rem; /*17px;*/
	border: none;
	outline: none;
	color: white;
	padding: 10px 16px; /*14px 16px;*/
	background-color: inherit;
	font-family: inherit;
	margin: 0;
	transition-property: background-color; /* What to animate */
	transition-duration: 0.2s; /* How long it takes */
	transition-timing-function: ease-in-out; /* How it speeds up/slows down */  
}

.dropdown-content {
	display: none;
	position: absolute;
	background-color: #b67a2a; /*#f9f9f9;*/
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
}

.dropdown-content a {
	float: none;
	color:  white; /*black;*/
	padding: 10px 16px; /*12px 16px;*/
	text-decoration: none;
	display: block;
	text-align: left;
}

.topnav a:hover, .dropdown:hover .dropbtn {
	background-color: #ddd; /*lightgrey;*/ /*#555;*/
	color: #555; /*white;*/
	transition-property: background-color; /* What to animate */
	transition-duration: 0.2s; /* How long it takes */
	transition-timing-function: ease-in-out; /* How it speeds up/slows down */  
}

.dropdown-content a:hover {
	background-color: #ddd;
	color: #555;
}

.dropdown:hover .dropdown-content {
	display: block;
}

@media screen and (max-width: 680px) {
	.topnav a:not(:first-child), .dropdown .dropbtn {
		display: none;
	}
	.topnav a.icon {
		float: right;
		display: block;
		
	}
}

@media screen and (max-width: 680px) {
	.topnav.responsive {position: relative;}
	.topnav.responsive .icon {
		position: absolute;
		right: 0;
		top: 0;
	}
	.topnav.responsive a {
		float: none;
		display: block;
		text-align: left;
	}
	.topnav.responsive .dropdown {float: none;}
	.topnav.responsive .dropdown-content {position: relative;}
	.topnav.responsive .dropdown .dropbtn {
		display: block;
		width: 100%;
		text-align: left;
	}
}

/*---- !!! MENU !!! -----*/





.main_big_content {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly; /*space-between;*/ /*space-around;*/
	align-content: space-around; /*stretch|center|flex-start|flex-end|space-between|space-around*/
	align-items: center; /*flex-start;*/
	padding: 1%;
}

.main_big_chapter {
	align-items: top;
	justify-content: center;
	text-align: center;
	background-color: lightgrey; /*#666;*/
	margin: 20px 1% 5px 1%; /*15px 1% 15px 1%;*/ /*1% 1% 30px 1%;*/ /*10px 10px 20px 10px;*/ /*15px;*/
	padding: 8px;
	width: 20%; /*23%;*/
	min-width: 300px; /*315px;*/
	border-radius: 10px;
	transition: 0.3s;
	overflow: visible;
	/*box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);*/
}

.main_big_chapter:hover, .main_big_chapter:focus {
	background-color: grey; /*#666;*/
}

.main_big_content a {
	text-decoration: none;
	font-size: 1.1rem; /*1.25rem;*/
	color: #444; /*#818181;*/
}

.main_big_content a:hover {
	color: white;
}

.main_big_chapter_icon {
	display: inline-block;
	background-color: transparent;
	width: 99%; /*50%;*/
	margin-bottom: 5px;
	margin-top: 15px;
}

.chapter_icon_img {
	width: 50%; /*90%;*/
	/*max-width: 100%;*/
	/*height: auto;*/
}









/*---------------------------------------------------------------------*/

@media only screen and (max-width:1200px) {
	html {font-size: 95%}
	}

@media only screen and (max-width:800px) {
	html {font-size: 85% /*80%*/}
}

@media only screen and (max-width:680px) {
	html {font-size: 80%}
}

@media only screen and (max-width:600px) {
	html {font-size: 80%}
}

@media only screen and (max-width:480px) {
	html {font-size: 80%}
}

@media only screen and (max-width:360px){
	html {font-size: 80%}
