/* CSS Document */
.subcontent{
	max-width: 600px;
	margin-left:auto;
	margin-right:auto;
	font-family: 'Marck Script', cursive;
	font-size: 1.2em;
}
#headerdiv{
			/*
			margin-top:40px;
			z-index: 19;
			background-image: url("/images/kellilogo.jpg");
    		background-repeat: no-repeat;
			width:100%;
			height:150px;
			background-position: center; 
			background-size: contain;
	*/
	z-index: 19;
    background-image: url(/images/kellilogo.jpg);
    background-repeat: no-repeat;
    width: 180px;
    height: 113px;
    background-position: center;
    background-size: contain;
    display: inline-block;
    float: left;
		}

#menu-icon{
	display: none;
	width: 40px;
	height: 40px;
	background: #4C8FEC url(/images/menu.png) center;
	background-size: 40px 40px;
    background-repeat: no-repeat;	
}

#facebook-icon{
    display: inline-block;
	width: 30px;
	height: 30px;
	background: #fff url(/images/facebook.png) center;
	background-size: 30px 30px;
    background-repeat: no-repeat;
    opacity: 0.3;
    float:right;
}
#instagram-icon{
    display: inline-block;
    width: 30px;
	height: 30px;
	background: #fff url(/images/instagram.png) center;
	background-size: 30px 30px;
    background-repeat: no-repeat;	
    opacity: 0.3;
    float:right;
}
#blog-icon{
    display: inline-block;
    width: 30px;
	height: 30px;
	background: #fff url(/images/blog.png) center;
	background-size: 30px 30px;
    background-repeat: no-repeat;	
    opacity: 0.3;
    float:right;
}


/*------------------------------------*\
    NAV
\*------------------------------------*/
#nav
{
    margin-top:0px;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    background-color:transparent;
    z-index:20;
}

#nav ul
{
	list-style:none;
	position:relative;
	float:left;
	padding:0;
    background-color:transparent;
    max-width:800px;
    margin:0px auto;
    z-index: 99;
}

#nav ul a
{
	display:block;
	
	text-decoration:none;
	font-weight:300;
	font-size:25px;
	line-height:42px;
	padding:0 15px;
	/*font-family:"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif*/
	font-family: 'Dr Sugiyama', cursive;
    		
}

#nav ul li
{
	position:relative;
	float:left;
	margin:0;
	padding:0;
    z-index:98;
	background-color:#fff;
	-webkit-transition: 0.5s; /* Safari */
    transition: 0.5s;
}

#nav ul li.current-menu-item
{
	background-color:#ddd
}

#nav ul li:hover, #nav ul li a:hover
{
	background:#999;
    color:#fff;
}

#nav ul ul
{
	display:none;
	/*position:absolute;*/
	top:100%;
	left:0;
	background-color:#fff;
	padding:0
}

#nav ul ul li
{
	float:none;
	/*width:200px;*/
	background-color: #e2bbc6;
}

#nav ul ul a
{
	line-height:120%;
	padding:10px 15px;
	color: #fff;
}

#nav ul ul ul
{
	top:0;
	left:100%
}

#nav ul li:hover > ul
{
	display:block
}



a:link {color: #ccc;}
a:visited {text-decoration:none;color:#ccc;}
a:hover {text-decoration: underline;color: #ddd;}
a:active {text-decoration:underline;color:#ccc;}


@media screen and (max-device-width: 480px) {
	#nav ul ul{
		display:block;
	}
	#nav ul ul li{
		position:relative;
	}
  #headerdiv{
			
			/*margin-top:40px;*/
			z-index: 19;
			background-image: url("/images/kellilogo.jpg");
    		background-repeat: no-repeat;
			width:100%;
			height:150px;
			background-position: center; 
			background-size: contain;
	  
	}
	#slider{
		padding-top:230px;
	}
	
    #menu-icon {
		display:inline-block;
		float:right;
		position: absolute;
    	top: 0px;
	}
    #facebook-icon,#blog-icon,#instagram-icon {
    	display:inline-block;
		float:left;
		background-size: 40px 40px;
		width:40px;
		height:40px;
		position: absolute;
    	top: 0px;
		left:0px;
	}
	#instagram-icon {
		left:40px;
	}
	/*test*/
	#nav{background-color:transparent;top:0;}
	#nav>ul, nav:active>ul { 
		z-index:99;
		display: none;
		/*position: absolute;*/
		padding: 0px;
		background: #fff;
		/*border: 1px solid #444;*/
		/*right: 20px;*/
		top: 0px;
		width: 100%;
		border-radius: 4px 0 4px 4px;
		
		position: absolute;
    	top: 40px;
		
	}
	#nav ul{right:0;float:none;}
	#nav li {
		text-align: center;
		width: 100%;
		padding: 10px 0;
		margin: 0;
	}

	#nav:hover ul {
		/*display: block;*/
	}
	#nav ul li{
		border:thin solid #eee;	
	}
	#nav ul ul li{
		float:none;
		width:100%;
	}

	#nav > ul > li > ul,#nav > ul > li > ul > li{
		z-index:100;	
		background-color: #e2bbc6;
	}
	
	
	/*test*/
}