﻿#nav-wrap { margin: 0px auto; width: 1180px; float: none;}

/* menu icon */
#menu-icon { display: none; /* hide menu icon initially */}

#nav, #nav li { margin: 0 auto; padding: 0;}

#nav li { list-style: none; display:inline-block; padding:0px;  margin: 0 2%;}

/* nav link */
#nav a {
    display: block; font-size: 20pt; font-family: 'HelveticaCE55RomanRegular', Arial, "Lucida Grande", sans-serif; 
    color: #fff; text-decoration:none; text-transform:lowercase;  padding:9px 0px 1px 0px;   white-space: nowrap;
    -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease;   -o-transition: all 0.5s ease;   transition: all 0.5s ease;
}
#nav a:hover {
	color: #000;
}

#nav li:hover>a {
    color: #f05a28;
}

#nav .active>a {
    color: #f05a28;
}

/* nav dropdown */
#nav ul {
	background:url(images/menu-top-arrow.png) no-repeat top left;
	background-position: 22px 0px;
	padding: 8px 0px 0px 0px;
	position: absolute;
	display: none; /* hide dropdown */
	width: auto;
	z-index:99999;
	
}


#nav ul li { margin: 0px; padding: 0px; display:block; text-align:left; background: #fff; min-width: 150px;}
#nav li:hover > ul { display: block; /* show dropdown on hover */}

#nav li li a {
    display: block; font-size: 11pt; font-family: 'HelveticaCE55RomanRegular', Arial, "Lucida Grande", sans-serif; 
    color: #333; text-decoration:none; text-transform:lowercase;   padding: 8px 15px; margin:0px;
    -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease;   -o-transition: all 0.5s ease;   transition: all 0.5s ease;
}
#nav li li a:hover { color: #f05a28;}

#nav li ul.portfolio { 
    width: 490px;
    background-color: #fff;
    background-position: 22px 0px;
    padding: 0px 0px 0px 0px;
    position: absolute;
    display: none;
    z-index: 99999;
    top: 160px;}
#nav ul.portfolio:before  {    content: url(images/menu-top-arrow.png);
    position: absolute;
    top: -14px;
    left: 15px;
    }
#nav li ul.portfolio li { display:inline-block; float:left; min-width:150px; padding:0px; margin:0px;  background-color:#fff;}
#nav li:hover > ul.portfolio{ display: block; /* show dropdown on hover */}



/************************************************************************************
IPAD PORTRAIT
*************************************************************************************/
@media only screen and ( min-width: 980px) and ( max-width: 1024px)
{  
 
#nav-wrap { margin: 0px auto; width: 100%; float: none;}
 
 /* nav link */
#nav a {
    display: block; font-size: 17pt; font-family: 'HelveticaCE55RomanRegular', Arial, "Lucida Grande", sans-serif; 
    color: #fff; text-decoration:none; text-transform:lowercase;  padding:9px 0px 5px 0px;   white-space: nowrap;
    -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease;   -o-transition: all 0.5s ease;   transition: all 0.5s ease;
}

}

@media only screen and ( min-width: 768px) and ( max-width: 980px)
{  
 
#nav-wrap { margin: 0px auto; width: 100%; float: none;}

#nav li { list-style: none; display:inline-block; padding:0px;  margin: 0 1%;}
 
 /* nav link */
#nav a {
    display: block; font-size: 15pt; font-family: 'HelveticaCE55RomanRegular', Arial, "Lucida Grande", sans-serif; 
    color: #fff; text-decoration:none; text-transform:lowercase;  padding:9px 0px 9px 0px;   white-space: nowrap;
    -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease;   -o-transition: all 0.5s ease;   transition: all 0.5s ease;
}

}

/************************************************************************************
MOBILE
*************************************************************************************/

@media only screen and ( min-width: 240px) and ( max-width: 767px)
{     
	/* nav-wrap */
	#nav-wrap {
		position: relative;
		display:inline-block;
		padding:0px;
		margin:0px;
		float:left;
		background:#c1c1c1;
		width:100%;
		margin-bottom:10px;
		height:30px;
	}

	/* menu icon */
	#menu-icon {
		color: #fff;
		height: 24px;
		background:url(images/menu-icon.png) no-repeat right center;
		padding: 14px 0px 0px 0px;
		width:95%;
		cursor: pointer;
		display: block; /* show menu icon */
		float:right;
		line-height:9px;		
		margin-right:8px;
		text-align:left;
	}
	#menu-icon:hover {
		background:url(images/menu-icon-hover.png) no-repeat right center;
	}
	#menu-icon.active {
		background:url(images/menu-icon-hover.png) no-repeat right center;
	}
	
	/* main nav */
	#nav {
		clear: both;
		position: absolute;
		top: 38px;
		width:100%;
		z-index: 10000;
		background: #fff;
		box-shadow: 1px 1px 3px #999999;
		display: none; /* visibility will be toggled with jquery */
		text-align:left;
		padding-bottom:10px;
	}
	#nav ul { padding:0px; margin:0px;  }
	#nav li {
		clear: both;
		float: none;
		margin: 0px 0 0px 15px;
		padding:0px;
		line-height:25px;
		width:90%;
		border-bottom: 1px dotted #000;
	}
	#nav a, 
	#nav ul a {
		font: inherit;
		background: none;
		display: block;
		padding: 5px 0px 5px 0px;
		margin:0px;
		line-height:25px;
		color: #333;
		font-size:15px;
		width:100%;
	}
	#nav a:hover, 
	#nav ul a:hover {
		background: none;
		color: #f05a28;
	}
	
	/* nav dropdown */
#nav ul {
	background: none;
	padding: 0px;
	margin:0px;
	position: absolute;
	display: none; /* hide dropdown */
	width: auto;
	
}
#nav ul li {
	margin: 0px;
	padding: 0px;
	border:none;
}
#nav li:hover > ul {
	display: none; /* show dropdown on hover */
    position: static;
}

#nav li li a:before {
   content: "» ";
}

#nav li li a {
    display: block;
    font-size: 13px;
    font-family: inherit;
    color: #000;
    text-decoration:none;
    text-transform: none;
    padding: 0px 10px;
    margin:0px;
    border:none;
    line-height:25px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    background: none;
}
#nav li li a:hover {
	background: none;
	color: #f05a28;
}

}







