Navbar bearbeiten

Hallo Leute,

ist es möglich einen Rand um die Dropdownauswahl zu erstellen.

Hier ist ein Bild

Hier ist der Abschnitt der CSS:

/*
==========================================
Navigation Area
==========================================
*/
.navigation {
float: left;
width: 100%;
/*padding-top: 28px;*/
padding-top: 15px;
font-family: ‚Roboto Condensed‘, sans-serif;
}
.navigation > ul {
margin: 0;
}
.navigation > ul > li {
float: left;
margin-left: 15px;
position: relative;
list-style: none;
}
.navigation > ul > li:before {
content: „“;
position: absolute;
width: 1px;
height: 12px;
left: -10px;
top: 50%;
margin-top: -6px;
border-left: 2px dotted rgba(255,0,0,0.3);
}
.navigation > ul > li:first-child {
margin-left: 0;
}
.navigation > ul > li:first-child:before {
display: none;
}
.navigation > ul > li > a {
display: block;
float: left;
line-height: 32px;
padding: 0 14px;
font-size: 14px;
font-weight: normal;
text-transform: uppercase;
color: #76dc13;
position: relative;
}
.navigation > ul > li.current-menu-ancestor > a{
background-color: #76dc13; //0,0,0,0.2
color: #76dc13; //#01aef0
}
.navigation > ul > li.current-menu-ancestor > a:before{
display: none;
}
.navigation > ul > li > a:before {
content: “;
width: 100%;
width: calc(100% – 28px);
height: 1px;
position: absolute;
left: 0;
left: calc(28px – 14px);
top: 100%;
border-bottom: 1px dotted #01aef0;
opacity: 0;
visibility: hidden;

}
.navigation > ul > li:hover > a:before {
opacity: 1;
visibility: visible;
}
.navigation > ul > li.current_meneu_item > a{
background: rgba(0,0,0,0.2);// rgba(0,0,0,0.2);
}
.navigation > ul > li.current_meneu_item > a:before {
display: none;
}
.navigation ul ul {
float:left;
position:absolute;
top:52px;
top: 35px /; /* IE8+9 */
left:0;
z-index:998;
background:#ffffff;
width:175px;
opacity: 10;
margin: 10px;
padding: 18px 0;
padding-bottom: 8px;
visibility: hidden;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateY(20px);
-moz-transform: translateY(20px);
-ms-transform: translateY(20px);
-o-transform: translateY(20px);
transform: translateY(20px);
-webkit-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
-moz-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
-ms-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
-o-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
}
.navigation ul ul:before {
content: “;
position: absolute;
left: 0;
top: -8px;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 8px 8px 8px;
border-color: transparent transparent transparent #01aef0 ;

}
.navigation ul ul ul:before {
display: none;
}
.navigation ul ul li{
float:left;
width:100%;
position:relative;
padding: 0 10px 0 20px;
margin-bottom: 8px;
list-style: none;
}

.navigation ul ul ul {
left: 96%;
top: 0;
box-shadow: 1 10 8px rgba(0,0,0,0.4);
}
.navigation ul ul a {
display:block;
margin:0;
float: left;
padding-bottom: 2px;
font-size:14px;
color:#000000;
font-weight: normal;
text-transform: uppercase;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
border-bottom: 1px dotted transparent;
}
.navigation ul ul.sub-menu li > a{
color:#01aef0 !important;
}
.navigation ul ul li:hover > a {
color:#fff;
}
.navigation ul li:hover > ul {
visibility: visible;
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
.navigation select {
display: none;
width:100%;
float:left;
color:#01aef0;//000
padding:6px;
margin:0;
background-color: #01aef0;
border:rgba(0, 0, 0, 0.15) solid 1px;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
.topindex {
position:relative;
z-index:10;
}
.selectnav {
display: none;
}