.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 0px 0px 0px;
    -moz-border-radius: 0 0px 0px;
    border-radius: 0 0px 0px 0px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 0px 0 0px 0px;
    -moz-border-radius: 0px 0 0px 0px;
    border-radius: 0px 0 0px 0px;
}

.dropdown-submenu > li > a {
    color:#555555;
    font-weight:400;
    padding:10px 15px;
	transition:0.3s ease-in-out 0s;
	background-color:#FFFFFF;
	position:relative;
}


/*  ISOTOPE */

* { box-sizing: border-box; }

/* force scrollbar, prevents initial gap */
html {
  overflow-y: scroll; 
}

body {
  font-family: sans-serif;
}

/* ---- grid ---- */

.grid {
  background: #DDD;
}

/* clear fix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- .element-item ---- */

/* 5 columns, percentage width */
.grid-item,
.grid-sizer {
  width: 20%;
}

.grid-item {
  float: left;
  height: 100px;
  background: #0D8;
  border: 2px solid #333;
  border-color: hsla(0, 0%, 0%, 0.7);
}

.grid-item--width2 { width: 40%; }
.grid-item--height2 { height: 200px; }

/*  ISOTOPE END */