/* (c) Metaswitch Networks. All rights reserved. */
/* Portions (c) Microsoft Corporation. All rights reserved. */
/* Highly Confidential Material */

/******************************************************************************
 * Remove all margins and paddings.
 *****************************************************************************/

*
{
  margin: 0;
  padding: 0;
}

body
{
  font-size: 14px;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12,
.col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5,
.col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9,
.col-md-1, .col-md-10, .col-md-11, .col-md-12,
.col-md-2, .col-md-3, .col-md-4, .col-md-5,
.col-md-6, .col-md-7, .col-md-8, .col-md-9,
.col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12,
.col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5,
.col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9,
.col-1, .col-10, .col-11, .col-12,
.col-2, .col-3, .col-4, .col-5,
.col-6, .col-7, .col-8, .col-9
{
  padding-left: 0;
}

.col-lg-1.right, .col-lg-10.right, .col-lg-11.right, .col-lg-12,
.col-lg-2.right, .col-lg-3.right, .col-lg-4.right, .col-lg-5.right,
.col-lg-6.right, .col-lg-7.right, .col-lg-8.right, .col-lg-9.right,
.col-md-1.right, .col-md-10.right, .col-md-11.right, .col-md-12,
.col-md-2.right, .col-md-3.right, .col-md-4.right, .col-md-5.right,
.col-md-6.right, .col-md-7.right, .col-md-8.right, .col-md-9.right,
.col-sm-1.right, .col-sm-10.right, .col-sm-11.right, .col-sm-12,
.col-sm-2.right, .col-sm-3.right, .col-sm-4.right, .col-sm-5.right,
.col-sm-6.right, .col-sm-7.right, .col-sm-8.right, .col-sm-9.right,
.col-1.right, .col-10.right, .col-11.right, .col-12,
.col-2.right, .col-3.right, .col-4.right, .col-5.right,
.col-6.right, .col-7.right, .col-8.right, .col-9.right
{
  padding-right: 0;
}

ul
{
  padding-left: 0;
}

/**
 * The rules above will remove padding from form-control inputs that have col-*
 * classes, so we need to add it back (this is bootstrap's default padding).
 */
input.form-control
{
  padding: 6px;
}

/*
 * This rule make the font size the same pattern for all inputs, to control
 * their size
 */
.form-control,
.form-select
{
  font-size: inherit;
}

/**
 * Remove IE's x icon on form inputs
 */
input::-ms-clear
{
  display: none;
}

/******************************************************************************
 * PBX-related classes, used to show / hide different versions of a text based
 * on the subscriber type.
 *****************************************************************************/

.pbxText, .nonPBXText
{
  display: none;
}

body.isPBX .pbxText, body.isNotPBX .nonPBXText
{
  display: inline;
}

/******************************************************************************
 * Navigation Tabs
 *****************************************************************************/

.nav
{
  background: rgba(130, 130, 130, 0.15);
  border-radius: 3px;
}

.nav.navbar-nav,
#innerTabBox.nav,
#mainMenu .nav
{
  background: none;
}

.nav-pills > li.selected > a,
.nav-pills > li.selected > a:focus,
.nav-pills > li.selected > a:hover
{
  color: #fff;
}

#tabBox,
#topTabBox
{
  margin: 10px 0;
}

.nav-justified > li > a
{
  font-size: 12px;
}

.nav-justified > li
{
  float: left;
}

.nav > li > a
{
  padding: 5px 8px;
}

@media only screen and (min-width : 768px)
{
  .nav-justified>li>a
  {
    font-size: 13px;
  }

  .nav-justified>li
  {
    float: none;
  }
}

@media only screen and (min-width : 992px)
{
  .nav-justified>li>a
  {
    font-size: 14px;
  }
  .nav>li>a
  {
    padding: 10px 15px;
  }
}

h2, h3
{
  font-size: 26px;
  font-weight: 100;
}

h4
{
  font-size: 18px;
}

/******************************************************************************
 * Navigation sub-tabs - used in the Call Manager, Account Codes, and others
 *****************************************************************************/

.nav-tabs
{
  margin-top: 15px;
  margin-bottom: 15px;
  border: none;
  background: rgba(130, 130, 130, 0.15);
  border-radius: 3px;
  font-weight: 400;
}

.nav-tabs > li > a,
.nav-tabs > li > span,
.nav-tabs > li > a:focus,
.nav-tabs > li > a:hover,
.nav-tabs > li.selected > a,
.nav-tabs > li.selected > a:focus,
.nav-tabs > li.selected > a:hover
{
  border:none;
  color: rgba(130, 130, 130, 0.55);
  padding: 5px;
}

.nav-tabs > li > span,
.nav-tabs > li > a:focus,
.nav-tabs > li > a:hover,
.nav-tabs > li.selected > a:focus,
.nav-tabs > li.selected > a:hover
{
  color: rgba(130, 130, 130, 0.85);
}

.nav-tabs > li > span
{
  display: block;
}

ul>li>a
{
  padding: 4px 8px;
}

.nav-pills > li > a
{
  padding: 5px;
  font-size: 12px;
  margin: 0;
}

.nav-justified > li,
.nav-pills > li
{
  float: none;
  display: table-cell;
  text-align: center;
}

.nav-pills.nav-stacked > li
{
  display: block;
  width: auto;
  text-align: inherit;
}

@media only screen and (min-width : 768px)
{
  .nav-pills > li > a
  {
    font-size: 14px;
  }
}

/******************************************************************************
 * Settings definitions, used in pages that contain a list of inputs - the
 * container div should have the "settings" class for these to work.
 *****************************************************************************/

.settings label
{
  margin-left: 5px;
}

/* Set some styling and layout corrections for notifications page */

.panel
{
  margin-bottom: 0px;
  background: none;
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.pageHeader
{
        height:auto;
}

.settings ul
{
  padding-left: 20px;
}

.settings h4.header
{
  margin-top: 30px;
}

/* The "listContainer" class is used to group other li elements inside it */
/* without nesting the inner options visually, i.e. from a user point of  */
/* view they are not grouped. Used mainly to add a single showIf/hideIf   */
/* clause for a group of options.                                         */
.settings li.listContainer ul
{
  padding-left: 0;
}

/* The "sectionInfo" class is used for an italic description of a section. */
.settings span.sectionInfo
{
  margin-bottom: 5px;
  margin-top: 10px;
  opacity:0.7;
}

.settings li, .settings span.sectionInfo
{
  display: block;
  line-height: 22px;
  min-width:147px;
  margin-bottom: 0.25rem;
}

/* The "sectionHeader" and "subsectionHeader" classes are used to add an   */
/* arrow icon to each section header. The following attributes should also */
/* be added to the header div to make the section collapsible:             */
/*    data-toggle="collapse" data-target="#id"                             */
/* where id is the target div id, which should also contain the classes    */
/* "collapse" and "in" - the latter is optional and makes it expanded by   */
/* default.                                                                */
.settings div.sectionHeader,
.settings div.subsectionHeader
{
  cursor: pointer;
}

.settings div.sectionHeader h1,
.settings div.sectionHeader h2,
.settings div.sectionHeader h3,
.settings div.sectionHeader h4
{
  display: inline-block;
  vertical-align: middle;
}

.settings div.sectionHeader h2
{
  font-size: 18px;
  margin-top: 10px;
}

.settings div.sectionHeader.collapsed:before,
.settings div.subsectionHeader.collapsed:before
{
  content: url("../../img/icons/arrow-collapsed.png");
  vertical-align: middle;
}

.settings div.sectionHeader:before,
.settings div.subsectionHeader:before
{
  content: url("../../img/icons/arrow-expanded.png");
  vertical-align: middle;
}

/* The "settingsOverlay" class is used to disable an area by placing a */
/* transparent overlay over it. The overlay should be a div with this  */
/* class and a height must be specified. The width defaults to 80% to  */
/* cover the whole width (except the padding) without overflowing.     */
div.settingsOverlay
{
  opacity: 0.6;
  position: absolute;
  width: 80%;
  z-index: 40;
}

/* The "disabledElement" class is similar to "settingsOverlay", but is   */
/* used by the DisablingController widget, which creates the overlay div */
/* automatically. Its width and height are set to 100% by default, but   */
/* the user can set a top position and override the height to be 100%    */
/* minus the top - e.g. { top: 100px; height: calc(100% - 100px); }      */
div.disabledElement
{
  opacity: 0.6;
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
}

.vcenter
{
  display: flex;
  align-items: center;
}

.noWrap
{
  white-space: nowrap;
}

/******************************************************************************
 * Actions
 *****************************************************************************/

.flatButton > .roundedEdge {
  width: 70%;
  float: left;
}

.flatButton
{
  display: inline-block;
  padding: 0px 5px;
  margin-bottom: 0;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
  }
}

.flatButton a, .flatButton a:hover, .flatButton a:focus
{
  text-decoration: none;
}

.actionsButton
{
  width: 20px;
  height: 20px;
  border-radius: 10px;
  text-decoration: none;
}

.actionsButton > span
{
  margin-left: 2px;
  margin-top: -7px;
  display: block;
  font-size: 18px;
}

.actionsButton:hover,
.actionsButton:hover > span,
.actionsButton:focus,
.actionsButton:focus > span,
tr:hover .actionsButton > span,
tr:focus .actionsButton > span
{
  text-decoration: none!important;
}

.actionsButton.active
{
  opacity: 0.3;
}

/******************************************************************************
 * Button bar
 *****************************************************************************/

.pageHeader, .btn-container
{
  display: inline-block;
}

.buttonBar
{
  margin-top: 15px;
}

.buttonBar:before,
.buttonBar:after
{
  content: "";
  display: table;
}

.buttonBar:after
{
  clear: both;
}

.row
{
  margin:0;
}

.row > .buttonBar
{
  margin-left: 0;
  margin-right: 0;
}

.btn-container.disabled,
.btn-container.enabled-false
{
  pointer-events: none;
}

.btn-container.disabled > .btn,
.btn-container.enabled-false > .btn,
.btn.disabled,
.btn.enabled-false
{
  filter: alpha(opacity=50);
  -webkit-box-shadow: none;
  box-shadow: none;
  opacity: .5;
}

.btn:hover,
.servicesBtnBkg:hover
{
  opacity:0.7;
}

.btn-auto
{
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.btn
{
  font-size: inherit;
}

.messagesBadge
{
  color: inherit;
  background-color: inherit;
  vertical-align: inherit;
  font-size: 13px;
  padding: 0px 4px;
}

.numberDiv
{
  position: relative
}

@media screen and (min-width: 992px)
{
  .btn-auto
  {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.33;
    border-radius: 6px;
  }
}

@media screen and (max-width: 768px)
{
  .btn-auto
  {
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.5;
    border-radius: 4px;
  }

  /* Make the page header smaller on small screens */
  h2.pageHeader, div.pageHeader h2
  {
    font-size: 24px;
  }
}

/******************************************************************************
 * Container
 *****************************************************************************/

@media (min-width: 768px) {
    #outerBox.container {
        max-width: 750px;
    }
}

/******************************************************************************
 * Sprites
 *****************************************************************************/

.sprite-cellIcon, .sprite-emailIcon, .sprite-faxIcon, .sprite-groupIcon,
.sprite-homeIcon, .sprite-phoneIcon, .sprite-smsIcon, .sprite-workIcon
{
  background: url(../../img/sprites/contactlist-icons.png) no-repeat;
  width: 23px;
  height: 21px;
}

.sprite-cellIcon
{
  background-position: 0 0;
}

.sprite-emailIcon
{
  background-position: -28px 0;
}

.sprite-faxIcon
{
  background-position: -56px 0;
}

.sprite-groupIcon
{
  background-position: -84px 0;
}

.sprite-homeIcon
{
  background-position: -112px 0;
}

.sprite-phoneIcon
{
  background-position: -140px 0;
}

.sprite-smsIcon
{
  background-position: -168px 0;
}

.sprite-workIcon
{
  background-position: -196px 0;
}

.sprite-icm_forward2Icon, .sprite-icm_myphoneIcon, .sprite-icm_rulesetIcon,
.sprite-icm_scheduleIcon, .sprite-icm_voicemailIcon
{
  background: url(../../img/sprites/icm-icons.png) no-repeat;
  width: 48px;
  height: 48px;
}

.sprite-icm_forward2Icon
{
  background-position: 0 0;
}
.sprite-icm_myphoneIcon
{
  background-position: -53px 0;
}
.sprite-icm_rulesetIcon
{
  background-position: -106px 0;
}
.sprite-icm_scheduleIcon
{
  background-position: -159px 0;
}
.sprite-icm_voicemailIcon
{
  background-position: -212px 0;
}

.sprite-called_faxIcon, .sprite-called_landlineIcon, .sprite-called_otherIcon,
.sprite-called_wirelessIcon, .sprite-fax-readIcon, .sprite-fax-unreadIcon,
.sprite-importantIcon, .sprite-importantprivateIcon, .sprite-privateIcon,
.sprite-voicemail-deletedIcon
{
  background: url(../../img/sprites/message-icons.png) no-repeat;
}

.sprite-called_faxIcon, .sprite-called_landlineIcon, .sprite-called_otherIcon,
.sprite-called_wirelessIcon, .sprite-fax-readIcon, .sprite-fax-unreadIcon
{
  width: 23px;
  height: 21px;
}

.sprite-called_faxIcon
{
  background-position: 0 0;
}

.sprite-called_landlineIcon
{
  background-position: -28px 0;
}

.sprite-called_otherIcon
{
  background-position: -56px 0;
}

.sprite-called_wirelessIcon
{
  background-position: -84px 0;
}

.sprite-fax-readIcon
{
  background-position: -112px 0;
}

.sprite-fax-unreadIcon
{
  background-position: -140px 0;
}

.sprite-importantIcon
{
  background-position: -168px 0;
  width: 7px;
  height: 17px;
}

.sprite-importantprivateIcon
{
  background-position: -180px 0;
  width: 19px;
  height: 17px;
}

.sprite-privateIcon
{
  background-position: -204px 0;
  width: 16px;
  height: 18px;
}

.sprite-voicemail-deletedIcon
{
  background-position: -225px 0;
  width: 21px;
  height: 21px;
}

/******************************************************************************
 * Suggestions dropdown
 *****************************************************************************/

div.suggestions
{
  box-sizing: border-box;
  position: fixed;
  margin-top: 5px;
  color: black;
  border: 1px solid #929EAB;
  z-index: 9999;
  background-color: white;
  padding: 0px 2px 0px 4px;
}

div.suggestions div
{
  cursor: default;
  height: 18px;
}

div.suggestions div.current
{
  background-color: #3366cc;
  color: white;
}

input.suggestions
{
  padding-right: 26px;
}

a.suggestions
{
  cursor: default;
  position: relative;
  margin: 0;
  padding: 0;
  top: 2px;
  margin-left: -23px;
  color: #333;
  width: auto;
}

input.defaultPrompt, textarea.defaultPrompt
{
  color: #999999;
}

/******************************************************************************
 * Other base definitions
 *****************************************************************************/

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th
{
  padding: 0px 8px;
  font-weight: 200;
}

.calendarButton
{
  display: inline-block;
  position: relative;
  top: 3px;
  width: 21px;
  height: 22px;
  cursor: pointer;
  background: url(../../img/icons/calendar.png) no-repeat;
}

iframe
{
  border: 0;
}

img
{
  border: none;
  margin: 0;
  padding: 0;
}

label
{
  font-weight: normal;
}

textarea
{
  resize: none;
}

.italic
{
  font-style: italic;
}

.inline
{
  display: inline-block;
}

.truncatedResult
{
  display: none;
}

.showTruncatedHint .truncatedResult
{
  display: block;
}

.jsHighlight
{
  background-color: yellow;
}

.disabledBtn
{
  opacity: 0.4;
}

.roundedCorner
{
  border-radius: 3px;
}

input,
.form-control,
.form-select,
select
{
  border-radius: 3px;
  background-color:       rgba(255, 255, 255, 0.15);
}
input[disabled],
.form-control[disabled]
{
  opacity:0.6;
}

tr.linkRow
{
  cursor: pointer;
}

tr.linkRow:hover span,
tr.linkRow:hover a:not(.actionsButton)
{
  text-decoration: underline;
}

/******************************************************************************
 * Error Panel
 *****************************************************************************/

div#errorPanel,
div#mainErrorPanel
{
  z-index: 1100;
  box-sizing: content-box;
}

div#errorPanel h2#errorMessage,
div#mainErrorPanel h2#mainErrorMessage,
div#mobileBadUXPanel h2#mobileBadUXMessage
{
  text-align: center;
  padding: 6px;
  padding-top: 10px;
  min-height: 64px;
  font-size: 100%;
  margin: 0;
  line-height: normal;
  box-sizing: content-box;
}

div#errorPanel h2#errorMessage li,
div#mainErrorPanel h2#mainErrorMessage li
{
  text-align: left;
}

div#errorPanel div.button,
div#mainErrorPanel div.button
{
  float: none;
  height: 20px;
  position: absolute;
  bottom: 10px;
  left: 50%;
  margin-left: -18%;
  width: 30%;
  text-align: center;
  box-sizing: content-box;
}

div#errorPanel div.button a,
div#mainErrorPanel div.button a
{
  width: 100%;
  box-sizing: content-box;
}

.smallPopup
{
  width: 100vw;
  left: 0;
  margin: 0;
}

/******************************************************************************
 * Form inputs
 *****************************************************************************/

/* Overrides some of Bootstrap form-control and form-select class properties */
.form-control,
.form-select
{
  width: auto;
  display: inline;
  margin: 2px 0;
}

#securityEmail.form-control,
#currentPINAsPassword.form-control
/* #currentPassword.form-control */
{
  width: 100%;
}

/******************************************************************************
 * List items
 *****************************************************************************/

li
{
  list-style: none;
}

/******************************************************************************
 * Popups
 *****************************************************************************/

.modal-backdrop
{
  background-color: #757575;
}

.modal-content, .actionMenu, .MultiRecipActionMenu,
div.dialog, .panel-footer, .panel-heading, #feedback-welcome,
#feedback-highlighter, #feedback-overview, #feedback-submit-success,
#feedback-submit-error, #bcmStatusOptions, #bcmRingOptions
{
  border: 1px solid rgba(255, 255, 255, 0.43);
}

div.progressBarContainer
{
  margin: 3px 0 0 0;
  height: 15px;
  background-color: #fff;
  border-left: 1px solid #8FA7C1;
  border-top: 1px solid #8FA7C1;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  overflow: hidden;
}

div.progressBarContainer.initial
{
  background-color: #ccc;
}

div.progressBarContainer .progressBar
{
  width: 0px;
  margin: 0px;
  height: 15px;
  background: #fff url(../../img/interface/bg-progressbar.gif) top left repeat-x;
}

div.progressBarContainer.initial .progressBar
{
  width: 0px;
  background: none;
}

div.csvPanel .modal-dialog span.buttonName
{
  font-weight: bold;
}

.actionMenu
{
  position: absolute;
  background: white;
  border-radius: 3px;
  box-shadow: 0 3px 6px rgba(74, 74, 74, 0.64);
  border: 1px solid rgba(0,0,0,0.2);
  white-space: no-wrap;
  line-height: 18px;
}

.actionMenu table
{
  margin: 0;
}

.actionMenu tr:hover, .actionMenu tr a:hover
{
  background: #ccf;
  cursor: pointer;
}

.actionMenu td
{
  padding: 6px;
}

.modal
{
  height: auto;
}

.modal-open .modal
{
  overflow-y: hidden;
}

.hint {
  padding: 4px;
  margin-top: 0px;
  float: left;
}

.truncatedResult
{
  display: none;
}

.instantHelp
{
  background: url('../../img/icons/instanthelp.png') no-repeat center center;
  background-size:100%;
  border-radius:50%;
  width:15px;
  height:15px;
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  margin-left:6px;
}

#webrtcUploadingPopupPanel .modal-dialog
{
  width: 300px;
}

/******************************************************************************
 * Tables
 *****************************************************************************/

.headerBox,
thead
{
  background: rgba(130, 130, 130, 0.15);
  border: none;
  padding: 4px;
  margin: 15px 0;
  font-weight: 400;
}

.table > thead.headerBox > tr > th
{
  padding-top: 4px;
  padding-bottom: 4px;
}

table
{
  margin: 15px 0;
}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th
{
  border:none;
  padding: 4px 8px;
  font-weight: 400;
}


@media (max-width: 591px)
{
  body
  {
    font-size: 12px;
  }

  .modal-dialog
  {
    margin-top: .1rem;
  }
}

@media (max-width: 591px) and (max-height: 441px)
{
  .pageHeader
  {
    height: auto;
  }

  div.pageHeader h2
  {
    font-size: 20px;
  }

  .buttonBar
  {
    margin-top: 10px;
  }

  .headerBox
  {
    margin: 10px 0 4px 0;
  }

  .btn, .nav-pills > li.selected > a
  {
    padding: 4px 10px;
    font-size: 12px;
  }

  .form-control
  {
    height: 25px;
    font-size: 12px;
    padding: 3px 6px;
  }

  .modal-dialog .h4,
  .modal-dialog .h5,
  .modal-dialog .h6,
  .modal-dialog h4,
  .modal-dialog h5,
  .modal-dialog h6
  {
    margin-top: 0px;
    margin-bottom: 0px
  }

  .modal-header,
  .modal-footer
  {
    padding: 6px;
  }
}

/* svg icons */

.svgicon{
  display:inline-block;
  height: 20px;
  width: 20px;
}

.svgicon-paperclip{ background: url(../../img/svgs/attachment.svg) no-repeat;}
.svgicon-forward{ background: url(../../img/svgs/forward.svg) no-repeat; }
.svgicon-forward-more{ background: url(../../img/svgs/forward-more.svg) no-repeat; }
.svgicon-backward{ background: url(../../img/svgs/backward.svg) no-repeat; }
.svgicon-backward-more{ background: url(../../img/svgs/backward-more.svg) no-repeat; }
.svgicon-check{ background: url(../../img/svgs/check.svg) no-repeat;}
.svgicon-chevron-left{ background: url(../../img/svgs/chevron-left.svg) no-repeat; vertical-align: middle; height: 25px;}
.svgicon-chevron-right{ background: url(../../img/svgs/chevron-right.svg) no-repeat; vertical-align: middle; height: 25px;}
.svgicon-close{ background: url(../../img/svgs/cross.svg) no-repeat; height: 25px; width: 25px;}
.svgicon-question-sign{ background: url(../../img/svgs/help-with-circle.svg) no-repeat; height: 16px; width: 16px; position: relative; top:3px;}

.svgicon-question-sign-white{
  background: url(../../img/svgs/help-with-circle-white.svg) no-repeat;
  height: 16px;
  width: 16px;
  position: relative;
  top: 3px;
}

.svgicon-info-sign{
  background: url(../../img/svgs/info-with-circle.svg) no-repeat;
  height: 18px;
  width: 16px;
  vertical-align: middle;
}

.svgicon-cog{
  background: url(../../img/svgs/cog.svg) no-repeat;
  height: 15px;
  width: 15px;
  vertical-align: middle;
}

/* PNG Icon */
.arrow-down-icon
{
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  background-image: url(../../img/icons/ic_dropdown.png);
}

/*Warning styles*/

#totalCountContainer .countLimitWarning
{
  color: #D9121B;
  font-weight: bold;
}

#countDisplay
{
  display: block;
  float: right;
}