/* general */
html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; -webkit-font-smoothing: antialiased;}

/* clearfix */
.group:before,
.group:after { content: " "; display: table; }
.group:after { clear: both; }


body {
	max-width: 1200px;
	overflow-x: hidden;
	text-align: center;
	margin: 0 auto;
	color: #000;
	font-size: 16px;
}

.container {
	background: rgb(225,215,118);
}

header {
	margin: 10px 10px 10px 10px;
}

.pict1 {
	float: left;
	margin-top: -10px;
}

.pict2 {
	float: right;
	margin-top: -25px;
}

.pict2f {
	visibility: hidden;
	/*display: none;*/
}

.pict3 {
	float: right;
	margin-top: -25px;
	margin-right: 50px;
}

.header_text {
	float: none;
	white-space: nowrap;
	width: 100%;
	max-width: 1180px;
	text-align: center;
	margin-top: 20px;
}

.under_header_text {
	display: none;
}

#_nav {
	clear: both;
	position: absolute;
	margin: 20px auto;
	display: block;
	max-width: 1200px;
	width: 90%;
	right: 5%;
	overflow-x: hidden;
	text-align: center;
	color: #000;
	font-size: 16px;
	z-index: 9999;
}

#gre_nav {
	clear: both;
	margin: 0 auto;
	display: block;
	width: 70%;
	text-align: center;
}

#gr1_nav, #gr2_nav, #gr3_nav {
	width: 31%;
	float: left;
	display: inline;
	margin: 0 1.15% 0 1.15%;
}

#gr_nav_1, #gr_nav_2, #gr_nav_3 {
	height: 50px;
	margin: 0 1% 0 1%;
	font-weight: bold;
	text-align: left !important;
	padding-left: 20px !important;
	padding-top: 15px !important;
	background-image: url("../img/inactive.png") ;
	background-size: cover ;
}

#gr_nav_1 .glyphicon, #gr_nav_2 .glyphicon, #gr_nav_3 .glyphicon {
	margin-left: 20px;
}

#gr_nav_1:hover, #gr_nav_2:hover, #gr_nav_3:hover {
	color: #fff;
	font-weight: bold;
	background-color: #000;
	background-image: none;
}

.sm_nav_0, .sm_nav_1 {
	clear: both;
	margin-top: 3px;
	/*display: block;*/
	display: none;
	width: 100%;
	background-color: black;
}

.sm_nav_0 a {
	clear: both;
	display: block;
	font-weight: bold;
	color: #e1d776 !important;
	background-color: black;
	padding-top: 5px;
	padding-bottom: 5px;
}

.sm_nav_0 a:hover {
	text-decoration: none;
	color: white !important;
}

.sm_nav_1_1, .sm_nav_1_2, .sm_nav_1_3 {
	clear: both;
	display: block;
	width: 100%;
	background-color: black;
}

.sm_nav_1_2 {
	border: 2px solid #e1d776;
}

.sm_nav_1_3 {
	border-top: 2px solid #e1d776;
}

.sm_nav_1_1_1, .sm_nav_1_2_1 {
	clear: both;
	float: left;
	color: #fff !important;
	font-weight: bold;
	display: table;
	width: 30%;
	text-align: center;
	vertical-align: middle;
	background-color: black;
}

.sm_nav_1_1_2, .sm_nav_1_2_2 {
	/*clear: both;*/
	float: right;
	/*display: block;*/
	width: 70%;
	background-color: black;
	border-left: 2px solid #e1d776;
}

.sm_nav_1_1_2 a, .sm_nav_1_2_2 a, .sm_nav_1_3 a {
	clear: both;
	display: block;
	font-weight: bold;
	color: #e1d776 !important;
	background-color: black;
	padding-top: 5px;
	padding-bottom: 5px;
}

.sm_nav_1_3 a {
	padding-right: 10px;
	text-align: right;
}

.sm_nav_1_1_2 a:hover, .sm_nav_1_2_2 a:hover, .sm_nav_1_3 a:hover {
	text-decoration: none;
	color: white !important;
}

.down {
	clear: both;
	display: block;
	text-align: center;
	margin-top: 100px;
	margin-bottom: 50px;
}

.down_button a {
	clear: both;
	color: black !important;
	/*display: inline-block;*/
	font-weight: bold;
	margin: 0 auto;
	border: 3px solid black;
	padding: 5px 10px 5px 10px;
}

.down_button a:hover {
	text-decoration: none;
	color: white !important;
	background-color: black;
}

.text {
	width: 100%;
	margin-top: 70px;
}

.tr1 {
	clear: both;
	width: 100%;
	font-weight: bold;
	border-top: 1px solid black;
}

.td1 {
	float: left;
	width: 15%;
	margin-top: 5px;
	margin-bottom: 5px;
}

.td2 {
	float: left;
	width: 50%;
	text-align: left;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-left: 20px;
}

.td3 {
	float: left;
	width: 25%;
	text-align: left;
	margin-top: 20px;
	margin-bottom: 5px;
}

.td4 {
	float: left;
	width: 10%;
	margin-top: 35px;
	margin-bottom: 5px;
}

@media ( max-width: 800px ) {

	header {
		margin-top: 25px;
	}

	.pict1 {
		clear: both;
		float: none;
		text-align: center;
		margin: 0 auto;
	}

	.pict2 {
		display: none;
	}

	.pict2f {
		visibility: visible;
		/*display: inline;*/
		margin-top: -5px;
		float: right;
	}

	.pict3 {
		display: none;
	}

	.header_text {
		display: none;
	}

	.under_header_text {
		display: block;
		white-space: nowrap;
		text-align: center;
		margin-top: 10px;
	}

	#_nav {
		width: 98%;
		right: 1%;
	}

	#gre_nav {
		width: 100%;
	}

	#gr1_nav, #gr2_nav, #gr3_nav {
		margin-bottom: 3px !important;
		float: none;
		display: inline-block;
		width: 100%;
		margin: 0 0 0 0;
	}

	#gr_nav_1, #gr_nav_2, #gr_nav_3 {
		margin-left: 0px !important;
		margin-right: 0px !important;
		padding-left: 0px !important;
		padding-right: 0px !important;
		text-align: center !important;
/*		background-color: #000 !important;
		background-image: none;
		color: #e1d776;*/
		background-image: url("../img/inactive.png") ;
		background-size: cover ;
		color: #000;
	}

	.text {
		margin-top: 200px;
	}

	.td1 {
		float: none;
		width: 100%;
		margin-top: 20px;
		margin-bottom: 0px;
	}

	.td2 {
		float: none;
		width: 100%;
		text-align: center;
		margin-top: 0px;
		margin-bottom: 0px;
		padding-left: 0px;
	}

	.td3 {
		float: none;
		width: 100%;
		text-align: center;
		margin-top: 20px;
		margin-bottom: 0px;
	}

	.td4 {
		float: none;
		width: 100%;
		margin-top: 20px;
		margin-bottom: 20px;
	}

}

@media ( min-width: 1400px) and (max-width: 1600px ) {
	#_nav {
		width: 70%;
		right: 15%;
	}
}

@media ( min-width: 1601px) and (max-width: 1800px ) {
	#_nav {
		width: 50%;
		right: 25%;
	}
}

@media ( min-width: 1801px) and (max-width: 2300px ) {
	#_nav {
		width: 40%;
		right: 30%;
	}
}

@media ( min-width: 2301px) and (max-width: 3000px ) {
	#_nav {
		width: 30%;
		right: 35%;
	}
}

@media ( min-width: 3001px) and (max-width: 7000px ) {
	#_nav {
		width: 20%;
		right: 40%;
	}
}
