/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ TOP NAVIGATION LINKS CSS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#top-nav {
	position:absolute;
	top:5px;
	right:0;
	height: 25px;
}
#top-nav ul {
	padding:0;
	margin: 0;
	list-style:none;
}
#top-nav li{
	float: left;
}
#top-nav li, #top-nav li a {
	letter-spacing:0.5px;
	color: #118cd9;	
	line-height:26px;	
}
#top-nav li a {
	padding:0 15px 0 25px;
}
.social-links {
	position:relative;
	float:left;
		margin:0 5px;
}
.social-links i {
	background:#118cd9;
	color:#FFF;
}
.social-links a {
	padding:0 !important;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ MAIN NAVIGATION LINKS CSS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#main-nav {
	position: absolute;
	top:65px;
	right:0px;
	height: 45px;
	z-index: 1000;
}
#main-nav ul {
	margin: 0;
	padding: 0;
	position: relative;
}
#main-nav > ul {
	position: relative;
	float: left;
}
#main-nav li {
	float: left;
	list-style: none;
}
#main-nav > ul > li {
	float: left;
	position: relative;
}
#main-nav li a {
	color: #777;
	text-decoration: none;
}
#main-nav li a:hover {
	color: #000;
}
#main-nav > ul > li > a {
	display: block;
	padding: 0 15px;
	margin-left:3px;
	line-height: 45px;
	color: #00A;
	font-family: roboto, arial;
	font-size: 15px;
	border-radius:4px 4px 0 0;
	
}
#main-nav > ul > li > a > i {
	text-align: center;
	display: block;
	padding: 18px 0 6px 0;
	font-size: 24px;
}
#main-nav > ul > li:hover > a,
#main-nav > ul > li.selected:hover > a {
	background: #06F;
	background:linear-gradient(#0AF 20% ,#118cd9);
	color: #FFF;
}
#main-nav > ul > li.selected > a {
	background: #118cd9;
	background:linear-gradient(#00A 20% ,#008);
	color: #FFF;	
}
#main-nav>ul>li.dropdown:hover>a {
	border-radius: 4px 4px 0 0;
}
#main-nav li ul {
	position: absolute;
	z-index: 999;
	visibility: hidden;
}
#main-nav li:hover ul {
	opacity: 1;
	visibility: visible;
}
#main-nav>ul>li>ul {
	height: 0;
	overflow: hidden;
	background: #FFF;
	background:linear-gradient(#FFF 80%,  #EEE);
	padding: 0 10px;
	border:1px solid #EEE;
	border-top: 8px solid #118cd9;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	-ms-transition: all .4s;
	-o-transition: all .4s;
	transition: all .4s;
	
	
}
#main-nav>ul>li:hover>ul {
	padding: 10px;
}
#main-nav>ul>li.crane-parts>ul {
	width: 450px;
	left: -104px;
}
#main-nav>ul>li.crane-parts:hover>ul {
	height: 340px;
}
#main-nav>ul>li.crane-brands>ul {
	width: 450px;
	left: -100px;
}
#main-nav>ul>li.crane-brands:hover>ul {
	height: 340px;
}
#main-nav li li {
	float: none;
	color: #444;
}
#main-nav li li a {
	display: block;
	line-height: 30px;
	font-size: 13px;
	color: #008;
	border-bottom: 1px solid #118cd9;
	transition: all 0.4s;
	font-weight: 700;
}
#main-nav li li a:hover {
	color: #0AF;
}
#main-nav li li h3 {
	margin-top:0;
}
#main-nav li li h3 a {
	font-size:14px;
	line-height:20px;
	border-bottom:0;
}
#main-nav li li h3 a:hover {
	padding-left: 0;
	color:#118cd9;
}
#main-nav li.title {
	width: 100%;
	position: relative;
	line-height: 28px;
	font-family: Arial, Helvetica, sans-serif;
	color: #118cd9;
	font-size: 18px;
	font-weight: bold;
	border-bottom: 1px solid #118cd9;
	margin-bottom: 10px;
}
#main-nav li.list {
	margin-top: 8px;
	float: left;
	width: 50%;
	position: relative;
}
#main-nav li.crane-brands .list {
	width: 155px;
}
#main-nav li.crane-parts .list {
	width: 190px;
}
#main-nav li.list ul {
	position: relative;
	padding: 0;
}
#main-nav li.preview {
	float: right;
	width: 48%;
	position: relative;
}
#main-nav li.crane-brands .preview {
	width: 250px;
}
#main-nav li.crane-parts .preview {
	width: 220px;
}
#main-nav li.preview img {
	width: 100%;
	margin: 10px 0;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ BREADCRUNB NAVIGATION LINKS CSS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#breadcrumb {
	width:1000px;
	margin:0 auto;
	height: 34px;
	padding:15px 0;
	background:#FFF;
}
#breadcrumb ul {
	margin: 0 auto;
	padding: 0;
	width: 990px;
}
#breadcrumb li {
	list-style: none;
	float: left;
	color: #118cd9;
	line-height: 34px;
}
#breadcrumb li:after {
	content: "\f105";
	position: relative;
	padding: 0 5px;
	display: inline-block;
	color: #008;
	font: normal normal normal 14px/1 FontAwesome;
}
#breadcrumb li:last-child:after {
	content: "";
}
#breadcrumb li a {
	color: #008;
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
	line-height: 32px;
}
#breadcrumb li a:hover {
	color: #118cd9;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ SIDEBAR NAVIGATION LINKS CSS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#sidebar-nav {
	float: left;
	width: 180px;
	margin-bottom: 20px;
	clear: left;
}
#sidebar-nav ul {
	margin: 0;
	padding: 0;
	border:1px solid #DDD;
	border-top:0;
	border-radius:0 0 4px 4px;
	background:linear-gradient(#FFF 50%, #EEE);
}
#sidebar-nav li {
	list-style: none;
}
#sidebar-nav li:first-child a {
	border-top:0;
}
#sidebar-nav li a {
	display: block;
	color: #008;
	padding-left: 6px;
	line-height: 30px;
	font-family: lato;
	font-size: 12px;
	font-weight: 400;
	text-decoration: none;
	border-top: 1px solid #EEE;
	
}
#sidebar-nav li i {color:#008;}
#sidebar-nav .title {
	padding: 0 15px;
    line-height: 40px;
    color: #FFF;
	background: linear-gradient(#00A 20% ,#008);
    font-family: roboto, arial;
    font-size: 15px;
    border-radius: 4px 4px 0 0;	
	border-top: 0px;
}
#sidebar-nav li a:hover {
	color: #118cd9;
}
#sidebar-nav li.selected a,
#sidebar-nav li.selected a:hover {
	color: #118cd9;
	font-weight: bold;
}