@charset "utf-8";
/* CSS Document */

.responsive_image{
	height: auto;
	max-width: 100%;
}

.header{ 
	background-color: #fff;
	box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1);
	/*position: fixed;*/
    width:100%;
	/*z-index:0;*/
	}
	
.header ul{
	margin: 10;
	padding: 10;
	list-style:none;
	overflow:hidden;
	background-color: #fff;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size: 16px;
	}
	
.header ul a{
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
	padding-right: 20px;
	text-decoration: none;
	}

.header .logo{
	float: left;
	display: block;
	padding: 10px 20px;
	}

.header .menu{
	clear: both;
	max-height: 0;
	padding-right: 10px;
	transition: max-height .2s ease-out;
	}

.header .menu-icon {
	padding: 28px 20px;
	position: relative;
	float: right;
	cursor: pointer;
	}

.header .menu-icon .nav-icon{
	background-color: #333;
	display: block;
	height: 2px;
	width: 18px;
	position: relative;
	transition: background .2s ease-out;
	}

.header .menu-icon .nav-icon:before{
	background: #333;
	content: "";
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	transition: all .2s ease-out;
	top: 5px;

	}

.header .menu-icon .nav-icon:after{
	background: #333;
	content: "";
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	transition: all .2s ease-out;
	top: -5px;
	}
	
.header .menu-btn {
	display: none;
}

.header .menu-btn:checked ~ .menu {
	max-height:340px;
	}

.header .menu-btn:checked ~ .menu-icon .nav-icon {
	background: transparent;
	}

.header .menu-btn:checked ~ .menu-icon .nav-icon:before {
	transform: rotate(-45deg);
	top: 0;
	}
	
.header .menu-btn:checked ~ .menu-icon .nav-icon:after {
	transform: rotate(45deg);
	top: 0;
	}
	

@media (min-width:78em) {
	.header li{
		float: left
		}
		.header li a{
			padding: 20px 30px
		}
		.header .menu {
			clear: none;
			float: right;
			max-height: none;
			}
		.header .menu-icon {
			display: none;
				}
			
}

	
a.class1
{color: #4e4e4e;
}
a.class1:link  
{color: #4e4e4e; text-decoration: none;
}
a.class1:visited 
{color: #4e4e4e; text-decoration: none;
}
a.class1:hover
{color: #bdbdbf; text-decoration: none;
}
a.class1:active 
{color: #4e4e4e; text-decoration: none;
}

a.class2
{
color: #4e4e4e;
font-size: 12px;
letter-spacing: 1px;

}
a.class2:link  
{color: #4e4e4e; text-decoration: none;
}
a.class2:visited 
{color: #4e4e4e; text-decoration: none;
}
a.class2:hover
{color: #bdbdbf; text-decoration: none;
}
a.class2:active 
{color: #4e4e4e; text-decoration: none;
}