/********* TOP MENU BAR - APPLICATION SPECIFIC**************/
.menubarholder {
   margin-bottom:15px;
   text-align:center;
}

.menubar {
	display:inline-block;
	border: solid 1px #c2c2c2;
 	border-width: 0 1px 1px 1px;
   border-radius: 0 0 7px 7px;
   padding:0px 4px;
}

/* HORIZONTAL FREESTYLE MENU LAYOUT */

.menulist {
	text-align:right;
	background: white;
 	margin: 0;
	padding: 0;
	list-style: none;
	z-index:10000;
}

/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulist li {
	display:inline-block;
 	margin: 7px 10px;
}

/* Links inside the menu */
.menulist a, .menulist a:link,.menulist a:visited,.menulist button {
	font-size:12px;
	color: #009bde;
 	text-decoration:  none;
}

.menulist button {
   height:13px;
   line-height:normal;
   margin-right:0px;
}

.menulist a.currentpage, .menulist a.currentpage:link,.menulist a.currentpage:visited {
 	color: #000 !important;
 	cursor:default;
}

.menulist a.currentpage:hover {
 	color: #009bde;
}


.menulist li span.arrow{
	display:inline-block;
	top:3px;
	margin-left:0px;
}

.menulist li ul{
	display:none;
	position:absolute;
	background: white;
	padding:0;
	min-width:80px;
}


.menulist li a:hover+ul, .menulist li:hover ul{
   display:block;
    position:absolute;
    margin-left:0px;
    margin-top:-1px;
    border: 1px solid #999999;
    z-index:10000;
}


.menulist li ul li{
	display:block;
	text-align:left;
	
}

span.menuButton div.x-btn, span.menuButton div.x-btn-disabled {
	background-image:none !important;
	background-color:transparent !important;
}


/********* BUTTON BAR - PAGE SPECIFIC**************/
.bttn {
   text-decoration:none;
   cursor:pointer;
   font-size:12px;
   height:26px;
   line-height:26px;
   display:inline-block;
   outline:0;
   color:#3382C5;
   margin-right:15px;
   border:0px;
   background:none;
   text-align:left;
}

.bttn.norightmargin{
   margin-right:0px;
}

.bttn.fa, .team-name, .user-count{
    font-family: verdana, sans-serif, Arial, Helvetica  !important;
}

.bttn.fa:before{
   padding-right:3px;
   font-family:fontawesome;
}

.bttn.fa-fw-block.fa:before{
   display:inline-block;
   width: 1em;
}


.bttn.disabled,.bttn:disabled, .menu.menu-disabled ul li a{
   cursor:default;
   color:#CCC !important;
}

.bttn.disabled .arrow,.bttn:disabled .arrow, .menu.menu-disabled ul li a .arrow{
   border-color: #CCC transparent white;
}


.bttn-primary, .x-btn.bttn.bttn-primary{
  color: #FFF;
  background-color: #007AC4 !important; /*ie requires !important */
  padding:0px 8px;
}

.x-btn.bttn.bttn-primary{
	background-image:none;
	padding: 4px 3px;
	border-radius:0px;
	border:0px;
 	height:26px;
}

.x-btn.bttn.bttn-primary a span{
   color: #FFF !important;
}

.bttn:hover {
   position:relative;
   z-index:1;
}


.emphasis {
   text-transform:uppercase;
}

.grouped {
   display:block;
   list-style:none;
   padding:0;
   float:left;
}
.grouped.right{
	float:right;
}
.grouped li {
   float:left;
   margin:0;
   padding:0;
}
.grouped .bttn {
   text-align:left;
   margin-left:-1px;
}

.grouped label{
   width:auto !important; 
   height:24px;
   padding-top:4px;
   margin-right:5px;
}

.grouped.right span{
   font-size:12px;
   height:26px;
   line-height:26px;
   margin-right:15px;
   margin-left:-1px;
}

.grouped li:not(:first-child):not(:last-child) .bttn,
.grouped > .bttn:not(:first-child):not(:last-child),
.x-toolbar .bttn
 {
   -webkit-border-radius:0;
   -moz-border-radius:0;
   -ms-border-radius:0;
   -o-border-radius:0;
   border-radius:0;
}
.grouped li:first-child .bttn,
.grouped > .bttn:first-child
 {
   margin-left:0;
   -webkit-border-top-right-radius:0;
   -webkit-border-bottom-right-radius:0;
   -moz-border-radius-topright:0;
   -moz-border-radius-bottomright:0;   
   border-top-right-radius:0;
   border-bottom-right-radius:0;       
}
.grouped li:last-child .bttn,
.grouped > .bttn:last-child
 {
   -webkit-border-top-left-radius:0;
   -webkit-border-bottom-left-radius:0;
   -moz-border-radius-topleft:0;
   -moz-border-radius-bottomleft:0; 
   border-top-left-radius:0;
   border-bottom-left-radius:0;
}

/************** DROP DOWN BUTTON ****************/
.menu {
    float:left;
   margin-right:15px;
}
.menu ul {
    list-style:none;
    color:#FFF;
    width:auto;
    z-index:10;
}
.menu ul li {
    float:left;
    position: relative;
}
.menu ul li a {
   color:#3382C5;
    font-size:12px;
   height:26px;
   text-decoration:none;
    padding:6px 0px;
    position:relative;
    display:inline-block;
}

/* links in menu dropdown */
.menu ul li ul li a{
   padding-left:8px;
}

.menu ul li a.fa{
   font-family:inherit;
}

.menu ul li a.fa:before{
   padding-right:5px;
   font-family:fontawesome;
}


.menu :not(.menu-disabled) ul li a:hover {
    color:#333;
}
/* styling for the left buttons(buttons which are joined)*/
.menu ul li a.left {
    margin: 0;
}
/* styling for the middle buttons(buttons which are joined)*/
.menu ul li a.middle {
     margin:0;
}

/* styling for the right buttons(buttons which are joined)*/
/*style for the arrow pointing downward*/
.arrow {
    border:thick;
    border-color:#3382C5 transparent white;
    border-style:solid dashed dashed;
    margin-left:4px;
    position:relative;
    top: 11px;
}

/* hide the dropdown*/
.menu ul li ul {
    display: none;
}
/*changing the background of the button(which has a dropdown) to creyish gradient when we hover the mouse over it*/
.menu :not(.menu-disabled)  ul li:hover a.dropdown {
    color:#000;
}

.menu.menu-disabled ul li:hover ul{
   display:none !important;
}
   
.menu ul li:hover ul {
    display:block;
    position:absolute;
    margin-left:0px;
    margin-top:-1px;
    border: 1px solid #999999;
}
.menu ul li:hover ul li a {
    display:block;
   color:#62ABDB;
    background:#ffffff;
    border:none;
    margin-right:1px;
}
.menu ul li:hover ul li a:hover {
    background: #EEEEEE;
}
/*the first item in dropdown must not have a border on top */
.menu ul li ul li:first-child a {
    border-top: none;
}
/* now let us define the widths of various dropdown*/
.width-1 li a {
    width:55px;
}
.width-2 li a {
    width: 135px;
}
.width-3 li a {
    width: 250px;
}


.menu ul.disabled li ul{
   display:none !important;
}

.menu ul.disabled li a{
   color:#CCC !important;
   cursor:default !important;
    -webkit-box-shadow:none !important;
    -moz-box-shadow:none !important;
    box-shadow:none !important;
}

.menu ul.disabled li a span.arrow{
   border-top-color:#CCC !important;
}