/*! * bootstrap-tokenfield
 * https://github.com/sliptree/bootstrap-tokenfield
 * Copyright 2013-2014 Sliptree and other contributors; Licensed MIT */
 
.twitter-typeahead {width:auto; vertical-align: top; position:static !important; float: left;}
.twitter-typeahead pre {display:none  !important;}
.twitter-typeahead .tt-input{margin: 0; vertical-align: middle; background-color: #ffffff;}
.twitter-typeahead .tt-input {color: #555555; z-index: 2;}
.twitter-typeahead .tt-input{height: 26px; padding:6px; font-size: 14px; line-height: 1.428571429;}
.twitter-typeahead .input-sm.tt-input{border-radius: 3px;}
.twitter-typeahead .input-lg.tt-input{border-radius: 4px;}
.input-group .twitter-typeahead:first-child .tt-input{border-radius: 4px 0 0 4px !important;}
.input-group .twitter-typeahead:last-child .tt-input{border-radius: 0 4px 4px 0 !important;}
.input-group.input-group-sm .twitter-typeahead:first-child .tt-input{border-radius: 3px 0 0 3px !important;}
.input-group.input-group-sm .twitter-typeahead:last-child .tt-input{border-radius: 0 3px 3px 0 !important;}
.input-sm.tt-input, .input-group.input-group-sm .tt-input{height: 30px; padding: 5px 10px; font-size: 12px; line-height: 1.5;}
.input-group.input-group-lg .twitter-typeahead:first-child .tt-input {border-radius: 6px 0 0 6px !important;}
.input-group.input-group-lg .twitter-typeahead:last-child .tt-input{border-radius: 0 6px 6px 0 !important;}
.input-lg.tt-input, .input-group.input-group-lg .tt-input{height: 45px; padding: 10px 16px; font-size: 18px; line-height: 1.33;}
.tokenfield .twitter-typeahead {width: auto;}
.tokenfield.input-sm .twitter-typeahead .tt-input {height: 18px; font-size: 12px; line-height: 1.5;}
.tokenfield.input-lg .twitter-typeahead .tt-input {height: 23px; font-size: 18px; line-height: 1.33;}
.tokenfield .twitter-typeahead .tt-suggestions {font-size: 14px;}

.tt-dropdown-menu {right:0 !important; min-width: 160px; margin-top: 2px; padding: 5px 0; background-color: #ffffff; border: 1px solid #ccc; border-radius: 4px;  -webkit-overflow-scrolling: touch;
 -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box;  max-height: 130px; overflow-y: auto;}
 .flipttmenu .tt-dropdown-menu {margin-top: 0px; margin-bottom:2px; top:auto !important; bottom:100%;}
 .tt-dropdown-menu .empty-message {padding:0 10px;}
 /*Auto Suggest Template*/
.typeahead_wrapper {display: block; height: 30px; line-height:normal;}
.typeahead_photo {float: left; max-width: 30px; max-height: 30px; margin-right: 8px;  border-radius: 4px;}
.typeahead_labels {display: block; margin-left: 40px;}
.typeahead_primary {font-size: 14px; color: #2f2f2f;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.typeahead_secondary {font-size:12px; color:#939393; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.typeahead_wrapper.normal {display: block; height:auto;}
.typeahead_wrapper.normal .typeahead_labels {display: block; margin-left: 0px;}

.tt-suggestion {display: block; padding:5px 10px;}
.tt-suggestion.tt-cursor .typeahead_primary, .tt-suggestion:hover .typeahead_primary,
.tt-suggestion.tt-cursor .typeahead_secondary, .tt-suggestion:hover .typeahead_secondary,
.tt-suggestion.tt-cursor a, .tt-suggestion:hover .a {color:#FFFFFF;}
.tt-suggestion.tt-cursor, .tt-suggestion:hover {cursor:pointer; background:#019ddc; color:#FFFFFF;}
.tt-suggestion.tt-cursor .icon:before, .tt-suggestion:hover .icon:before {color:#FFFFFF;}
.tt-suggestion p {margin: 0;}

.twitter-typeahead .tt-hint, .twitter-typeahead .tt-hint.token-input, .twitter-typeahead .tt-hint, .twitter-typeahead .hint-sm.tt-hint, .twitter-typeahead .hint-lg.tt-hint,
.input-group .twitter-typeahead:first-child .tt-hint, .input-group .twitter-typeahead:last-child .tt-hint, .input-group.input-group-sm .twitter-typeahead:first-child .tt-hint,
.input-group.input-group-sm .twitter-typeahead:last-child .tt-hint, .hint-sm.tt-hint, .input-group.input-group-sm .tt-hint, .input-group.input-group-lg .twitter-typeahead:first-child .tt-hint,
.input-group.input-group-lg .twitter-typeahead:last-child .tt-hint, .hint-lg.tt-hint, .input-group.input-group-lg .tt-hint, .tokenfield.input-sm .twitter-typeahead .tt-hint,
.tokenfield.input-lg .twitter-typeahead .tt-hint, .tokenfield .twitter-typeahead .tt-hint, .twitter-typeahead pre {padding: 0; display:none !important; color:#fff; height:0 !important; font-size:0 !important; line-height:0 !important; background:transparent; width:0 !important;}
.twitter-typeahead .tt-hint.token-input {display:none !important;}

/* token and field css start here */
.tokenfield {height: auto; min-height:34px; padding:0; overflow-y:auto; overflow-x:hidden; z-index:2101; max-height:100px;}
.tokenfield.focus {outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 0, 0, 0.2); border-color: rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 0, 0, 0.2);}
.tokenfield .token {margin:4px 4px 4px 4px; padding: 2px 0; max-width: 98%; float:left; display: inline-block;}
.tokenfield .token .token-label {line-height: 18px; padding: 0 20px 0 10px;}
.tokenfield .token .close { margin:0px; position: absolute; right:0; padding:1px 5px; }
.tokenfield .token.active {border-color: #52a8ec; border-color: rgba(82, 168, 236, 0.8);}
.tokenfield .token.duplicate {background: #d9534f; color:#fff;}
.tokenfield .token.invalid {background: none; border: 1px solid #d9534f; color:#d9534f;}
.tokenfield .token.invalid.active {background: #ededed; color:#d9534f;}
.tokenfield .token-input {background: none; width: 60px; min-width: 60px; border: 0; height: 32px; padding:0 10px; margin-bottom:0px; -webkit-box-shadow: none; box-shadow: none;}
.tokenfield .token-input:focus {border-color: transparent; outline: 0; /* IE6-9 */ -webkit-box-shadow: none; box-shadow: none;}
.tokenfield.disabled {cursor: not-allowed; background-color: #ededed;}
.tokenfield.disabled .token-input {cursor: not-allowed;}
.tokenfield.disabled .token:hover {cursor: not-allowed; border-color: #d9d9d9;}
.tokenfield.disabled .token:hover .close {cursor: not-allowed; opacity: 0.2; filter: alpha(opacity=20);}
.has-warning .tokenfield.focus {border-color: #66512c;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
}
.has-error .tokenfield.focus {border-color: #a94442;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
}
.has-success .tokenfield.focus {border-color: #2b542c;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
}
.tokenfield.rtl {direction: rtl; text-align: right;}
.token {-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; position:relative; padding:4px 0; max-width:100%; margin:0 5px 5px 0; cursor: default; font-size:13px; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); 
	background-color:#ededed;
	border: 1px solid #D9D9D9; color:#555555;}
.token .token-label {padding:0 10px; display:block; text-overflow: ellipsis; overflow: hidden; word-wrap:normal; white-space: nowrap;}
.token .close { margin:0px; position: absolute; right:0; padding:2px 5px;  font-size:18px; text-decoration: none;}
.token:hover {border-color:#0979A7; background:#019ddc; color:#FFFFFF;}
.tt-menu-maxHeight{max-height: 330px;}
/* token content single page view */
a.token {margin:4px 8px 4px 0px; padding: 4px 10px 4px 10px; line-height: 22px; display:inline-block; cursor:pointer; float:left;}
a.token:hover {color:#FFFFFF;}
.token.keyword {background:transparent;}
.token.keyword:hover {background:#019ddc; color:#FFFFFF;}

/*Contact Auto Suggest*/
.typeahead {z-index: 2101; }
.typeahead.dropdown-menu .active a .typeahead_primary, .typeahead.dropdown-menu .active a .typeahead_secondary{color: #FFF;}
.typeahead.dropdown-menu {width: 100%; min-width: 160px; margin-top: 2px; border: 1px solid rgba(0, 0, 0, 0.2); 
*border-right-width: 2px; *border-bottom-width: 2px; max-height:200px; overflow-y:auto; }
.typeahead.dropdown-menu li a{padding: 5px 10px;}

@media (max-width: 767px) {
.token {font-size: 12px; padding: 2px 0;}
.token .token-label{line-height: 17px; padding: 0 6px;}
.token .close {font-size: 16px; padding: 1px 5px 1px;}
}