nav{margin:0;background:#e64}
/*Since we'll have the "ul li" "float:left" we need to add a clear after the container*/
nav:after{content:'';display:table;clear:both}
/*Removing padding, margin and "list-style" from the "ul", and adding "position:reltive"*/
nav ul{padding:0;margin:0;list-style:none;position:relative}
/*Positioning the navigation items inline*/
nav ul li{margin:0;display:inline-block;float:left;background:#e64;border-left:1pt dotted #888;min-width:188pt}
/*Styling the links*/
nav a{display:block;padding:0 8px;color:#fff;line-height:60px;text-decoration:none}
nav ul li ul li:hover,nav a:hover{background:red}
/*Hide Dropdowns by Default and giving it a position of absolute*/
nav ul ul{display:none;position:absolute;top:100%}
/*Display Dropdowns on Hover*/
nav ul li:hover>ul{display:inherit}
/*Fisrt Tier Dropdown*/
nav ul ul li{min-width:188px;float:none;display:list-item;position:relative}
/*Second, Third and more Tiers We move the 2nd and 3rd etc tier dropdowns to the left by the amount of the width of the first tier*/
nav ul ul ul{position:absolute;top:0;left:100%}
/*Change ' +' in order to change the Dropdown symbol*/
li>a:after{content:' +'}
li>a:only-child:after{content:''}