/* Minification failed. Returning unminified contents.
(14,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(15,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(16,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(17,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(266,17): run-time error CSS1039: Token not allowed after unary operator: '-masterspec-orange'
(276,28): run-time error CSS1039: Token not allowed after unary operator: '-masterspec-orange-hover'
(712,28): run-time error CSS1039: Token not allowed after unary operator: '-masterspec-orange'
(826,17): run-time error CSS1039: Token not allowed after unary operator: '-masterspec-orange-hover'
(9486,17): run-time error CSS1036: Expected expression, found ';'
(9534,17): run-time error CSS1036: Expected expression, found ';'
(11757,47): run-time error CSS1046: Expect comma, found '140'
(11757,55): run-time error CSS1046: Expect comma, found '/'
(11759,39): run-time error CSS1046: Expect comma, found '140'
(11759,47): run-time error CSS1046: Expect comma, found '/'
(12577,71): run-time error CSS1030: Expected identifier, found ','
(12577,81): run-time error CSS1031: Expected selector, found ')'
(12577,81): run-time error CSS1025: Expected comma or open brace, found ')'
 */
/*! jQuery UI - v1.12.1 - 2017-09-17
* http://jqueryui.com
* Includes: draggable.css, core.css, resizable.css, selectable.css, sortable.css, accordion.css, autocomplete.css, menu.css, button.css, controlgroup.css, checkboxradio.css, datepicker.css, dialog.css, progressbar.css, selectmenu.css, slider.css, spinner.css, tabs.css, tooltip.css, theme.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?scope=&folderName=base&cornerRadiusShadow=8px&offsetLeftShadow=0px&offsetTopShadow=0px&thicknessShadow=5px&opacityShadow=30&bgImgOpacityShadow=0&bgTextureShadow=flat&bgColorShadow=666666&opacityOverlay=30&bgImgOpacityOverlay=0&bgTextureOverlay=flat&bgColorOverlay=aaaaaa&iconColorError=cc0000&fcError=5f3f3f&borderColorError=f1a899&bgTextureError=flat&bgColorError=fddfdf&iconColorHighlight=777620&fcHighlight=777620&borderColorHighlight=dad55e&bgTextureHighlight=flat&bgColorHighlight=fffa90&iconColorActive=ffffff&fcActive=ffffff&borderColorActive=003eff&bgTextureActive=flat&bgColorActive=007fff&iconColorHover=555555&fcHover=2b2b2b&borderColorHover=cccccc&bgTextureHover=flat&bgColorHover=ededed&iconColorDefault=777777&fcDefault=454545&borderColorDefault=c5c5c5&bgTextureDefault=flat&bgColorDefault=f6f6f6&iconColorContent=444444&fcContent=333333&borderColorContent=dddddd&bgTextureContent=flat&bgColorContent=ffffff&iconColorHeader=444444&fcHeader=333333&borderColorHeader=dddddd&bgTextureHeader=flat&bgColorHeader=e9e9e9&cornerRadius=3px&fwDefault=normal&fsDefault=1em&ffDefault=Arial%2CHelvetica%2Csans-serif
* Copyright jQuery Foundation and other contributors; Licensed MIT */

.ui-draggable-handle{-ms-touch-action:none;touch-action:none}.ui-helper-hidden{display:none}.ui-helper-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.ui-helper-reset{margin:0;padding:0;border:0;outline:0;line-height:1.3;text-decoration:none;font-size:100%;list-style:none}.ui-helper-clearfix:before,.ui-helper-clearfix:after{content:"";display:table;border-collapse:collapse}.ui-helper-clearfix:after{clear:both}.ui-helper-zfix{width:100%;height:100%;top:0;left:0;position:absolute;opacity:0;filter:Alpha(Opacity=0)}.ui-front{z-index:100}.ui-state-disabled{cursor:default!important;pointer-events:none}.ui-icon{display:inline-block;vertical-align:middle;margin-top:-.25em;position:relative;text-indent:-99999px;overflow:hidden;background-repeat:no-repeat}.ui-widget-icon-block{left:50%;margin-left:-8px;display:block}.ui-widget-overlay{position:fixed;top:0;left:0;width:100%;height:100%}.ui-resizable{position:relative}.ui-resizable-handle{position:absolute;font-size:0.1px;display:block;-ms-touch-action:none;touch-action:none}.ui-resizable-disabled .ui-resizable-handle,.ui-resizable-autohide .ui-resizable-handle{display:none}.ui-resizable-n{cursor:n-resize;height:7px;width:100%;top:-5px;left:0}.ui-resizable-s{cursor:s-resize;height:7px;width:100%;bottom:-5px;left:0}.ui-resizable-e{cursor:e-resize;width:7px;right:-5px;top:0;height:100%}.ui-resizable-w{cursor:w-resize;width:7px;left:-5px;top:0;height:100%}.ui-resizable-se{cursor:se-resize;width:12px;height:12px;right:1px;bottom:1px}.ui-resizable-sw{cursor:sw-resize;width:9px;height:9px;left:-5px;bottom:-5px}.ui-resizable-nw{cursor:nw-resize;width:9px;height:9px;left:-5px;top:-5px}.ui-resizable-ne{cursor:ne-resize;width:9px;height:9px;right:-5px;top:-5px}.ui-selectable{-ms-touch-action:none;touch-action:none}.ui-selectable-helper{position:absolute;z-index:100;border:1px dotted black}.ui-sortable-handle{-ms-touch-action:none;touch-action:none}.ui-accordion .ui-accordion-header{display:block;cursor:pointer;position:relative;margin:2px 0 0 0;padding:.5em .5em .5em .7em;font-size:100%}.ui-accordion .ui-accordion-content{padding:1em 2.2em;border-top:0;overflow:auto}.ui-autocomplete{position:absolute;top:0;left:0;cursor:default}.ui-menu{list-style:none;padding:0;margin:0;display:block;outline:0}.ui-menu .ui-menu{position:absolute}.ui-menu .ui-menu-item{margin:0;cursor:pointer;list-style-image:url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7")}.ui-menu .ui-menu-item-wrapper{position:relative;padding:3px 1em 3px .4em}.ui-menu .ui-menu-divider{margin:5px 0;height:0;font-size:0;line-height:0;border-width:1px 0 0 0}.ui-menu .ui-state-focus,.ui-menu .ui-state-active{margin:-1px}.ui-menu-icons{position:relative}.ui-menu-icons .ui-menu-item-wrapper{padding-left:2em}.ui-menu .ui-icon{position:absolute;top:0;bottom:0;left:.2em;margin:auto 0}.ui-menu .ui-menu-icon{left:auto;right:0}.ui-button{padding:.4em 1em;display:inline-block;position:relative;line-height:normal;margin-right:.1em;cursor:pointer;vertical-align:middle;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:visible}.ui-button,.ui-button:link,.ui-button:visited,.ui-button:hover,.ui-button:active{text-decoration:none}.ui-button-icon-only{width:2em;box-sizing:border-box;text-indent:-9999px;white-space:nowrap}input.ui-button.ui-button-icon-only{text-indent:0}.ui-button-icon-only .ui-icon{position:absolute;top:50%;left:50%;margin-top:-8px;margin-left:-8px}.ui-button.ui-icon-notext .ui-icon{padding:0;width:2.1em;height:2.1em;text-indent:-9999px;white-space:nowrap}input.ui-button.ui-icon-notext .ui-icon{width:auto;height:auto;text-indent:0;white-space:normal;padding:.4em 1em}input.ui-button::-moz-focus-inner,button.ui-button::-moz-focus-inner{border:0;padding:0}.ui-controlgroup{vertical-align:middle;display:inline-block}.ui-controlgroup > .ui-controlgroup-item{float:left;margin-left:0;margin-right:0}.ui-controlgroup > .ui-controlgroup-item:focus,.ui-controlgroup > .ui-controlgroup-item.ui-visual-focus{z-index:9999}.ui-controlgroup-vertical > .ui-controlgroup-item{display:block;float:none;width:100%;margin-top:0;margin-bottom:0;text-align:left}.ui-controlgroup-vertical .ui-controlgroup-item{box-sizing:border-box}.ui-controlgroup .ui-controlgroup-label{padding:.4em 1em}.ui-controlgroup .ui-controlgroup-label span{font-size:80%}.ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item{border-left:none}.ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item{border-top:none}.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content{border-right:none}.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content{border-bottom:none}.ui-controlgroup-vertical .ui-spinner-input{width:75%;width:calc( 100% - 2.4em )}.ui-controlgroup-vertical .ui-spinner .ui-spinner-up{border-top-style:solid}.ui-checkboxradio-label .ui-icon-background{box-shadow:inset 1px 1px 1px #ccc;border-radius:.12em;border:none}.ui-checkboxradio-radio-label .ui-icon-background{width:16px;height:16px;border-radius:1em;overflow:visible;border:none}.ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon,.ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon{background-image:none;width:8px;height:8px;border-width:4px;border-style:solid}.ui-checkboxradio-disabled{pointer-events:none}.ui-datepicker{width:17em;padding:.2em .2em 0;display:none}.ui-datepicker .ui-datepicker-header{position:relative;padding:.2em 0}.ui-datepicker .ui-datepicker-prev,.ui-datepicker .ui-datepicker-next{position:absolute;top:2px;width:1.8em;height:1.8em}.ui-datepicker .ui-datepicker-prev-hover,.ui-datepicker .ui-datepicker-next-hover{top:1px}.ui-datepicker .ui-datepicker-prev{left:2px}.ui-datepicker .ui-datepicker-next{right:2px}.ui-datepicker .ui-datepicker-prev-hover{left:1px}.ui-datepicker .ui-datepicker-next-hover{right:1px}.ui-datepicker .ui-datepicker-prev span,.ui-datepicker .ui-datepicker-next span{display:block;position:absolute;left:50%;margin-left:-8px;top:50%;margin-top:-8px}.ui-datepicker .ui-datepicker-title{margin:0 2.3em;line-height:1.8em;text-align:center}.ui-datepicker .ui-datepicker-title select{font-size:1em;margin:1px 0}.ui-datepicker select.ui-datepicker-month,.ui-datepicker select.ui-datepicker-year{width:45%}.ui-datepicker table{width:100%;font-size:.9em;border-collapse:collapse;margin:0 0 .4em}.ui-datepicker th{padding:.7em .3em;text-align:center;font-weight:bold;border:0}.ui-datepicker td{border:0;padding:1px}.ui-datepicker td span,.ui-datepicker td a{display:block;padding:.2em;text-align:right;text-decoration:none}.ui-datepicker .ui-datepicker-buttonpane{background-image:none;margin:.7em 0 0 0;padding:0 .2em;border-left:0;border-right:0;border-bottom:0}.ui-datepicker .ui-datepicker-buttonpane button{float:right;margin:.5em .2em .4em;cursor:pointer;padding:.2em .6em .3em .6em;width:auto;overflow:visible}.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{float:left}.ui-datepicker.ui-datepicker-multi{width:auto}.ui-datepicker-multi .ui-datepicker-group{float:left}.ui-datepicker-multi .ui-datepicker-group table{width:95%;margin:0 auto .4em}.ui-datepicker-multi-2 .ui-datepicker-group{width:50%}.ui-datepicker-multi-3 .ui-datepicker-group{width:33.3%}.ui-datepicker-multi-4 .ui-datepicker-group{width:25%}.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header{border-left-width:0}.ui-datepicker-multi .ui-datepicker-buttonpane{clear:left}.ui-datepicker-row-break{clear:both;width:100%;font-size:0}.ui-datepicker-rtl{direction:rtl}.ui-datepicker-rtl .ui-datepicker-prev{right:2px;left:auto}.ui-datepicker-rtl .ui-datepicker-next{left:2px;right:auto}.ui-datepicker-rtl .ui-datepicker-prev:hover{right:1px;left:auto}.ui-datepicker-rtl .ui-datepicker-next:hover{left:1px;right:auto}.ui-datepicker-rtl .ui-datepicker-buttonpane{clear:right}.ui-datepicker-rtl .ui-datepicker-buttonpane button{float:left}.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,.ui-datepicker-rtl .ui-datepicker-group{float:right}.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header{border-right-width:0;border-left-width:1px}.ui-datepicker .ui-icon{display:block;text-indent:-99999px;overflow:hidden;background-repeat:no-repeat;left:.5em;top:.3em}.ui-dialog{position:absolute;top:0;left:0;padding:.2em;outline:0}.ui-dialog .ui-dialog-titlebar{padding:.4em 1em;position:relative}.ui-dialog .ui-dialog-title{float:left;margin:.1em 0;white-space:nowrap;width:90%;overflow:hidden;text-overflow:ellipsis}.ui-dialog .ui-dialog-titlebar-close{position:absolute;right:.3em;top:50%;width:20px;margin:-10px 0 0 0;padding:1px;height:20px}.ui-dialog .ui-dialog-content{position:relative;border:0;padding:.5em 1em;background:none;overflow:auto}.ui-dialog .ui-dialog-buttonpane{text-align:left;border-width:1px 0 0 0;background-image:none;margin-top:.5em;padding:.3em 1em .5em .4em}.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset{float:right}.ui-dialog .ui-dialog-buttonpane button{margin:.5em .4em .5em 0;cursor:pointer}.ui-dialog .ui-resizable-n{height:2px;top:0}.ui-dialog .ui-resizable-e{width:2px;right:0}.ui-dialog .ui-resizable-s{height:2px;bottom:0}.ui-dialog .ui-resizable-w{width:2px;left:0}.ui-dialog .ui-resizable-se,.ui-dialog .ui-resizable-sw,.ui-dialog .ui-resizable-ne,.ui-dialog .ui-resizable-nw{width:7px;height:7px}.ui-dialog .ui-resizable-se{right:0;bottom:0}.ui-dialog .ui-resizable-sw{left:0;bottom:0}.ui-dialog .ui-resizable-ne{right:0;top:0}.ui-dialog .ui-resizable-nw{left:0;top:0}.ui-draggable .ui-dialog-titlebar{cursor:move}.ui-progressbar{height:2em;text-align:left;overflow:hidden}.ui-progressbar .ui-progressbar-value{margin:-1px;height:100%}.ui-progressbar .ui-progressbar-overlay{background:url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw==");height:100%;filter:alpha(opacity=25);opacity:0.25}.ui-progressbar-indeterminate .ui-progressbar-value{background-image:none}.ui-selectmenu-menu{padding:0;margin:0;position:absolute;top:0;left:0;display:none}.ui-selectmenu-menu .ui-menu{overflow:auto;overflow-x:hidden;padding-bottom:1px}.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup{font-size:1em;font-weight:bold;line-height:1.5;padding:2px 0.4em;margin:0.5em 0 0 0;height:auto;border:0}.ui-selectmenu-open{display:block}.ui-selectmenu-text{display:block;margin-right:20px;overflow:hidden;text-overflow:ellipsis}.ui-selectmenu-button.ui-button{text-align:left;white-space:nowrap;width:14em}.ui-selectmenu-icon.ui-icon{float:right;margin-top:0}.ui-slider{position:relative;text-align:left}.ui-slider .ui-slider-handle{position:absolute;z-index:2;width:1.2em;height:1.2em;cursor:default;-ms-touch-action:none;touch-action:none}.ui-slider .ui-slider-range{position:absolute;z-index:1;font-size:.7em;display:block;border:0;background-position:0 0}.ui-slider.ui-state-disabled .ui-slider-handle,.ui-slider.ui-state-disabled .ui-slider-range{filter:inherit}.ui-slider-horizontal{height:.8em}.ui-slider-horizontal .ui-slider-handle{top:-.3em;margin-left:-.6em}.ui-slider-horizontal .ui-slider-range{top:0;height:100%}.ui-slider-horizontal .ui-slider-range-min{left:0}.ui-slider-horizontal .ui-slider-range-max{right:0}.ui-slider-vertical{width:.8em;height:100px}.ui-slider-vertical .ui-slider-handle{left:-.3em;margin-left:0;margin-bottom:-.6em}.ui-slider-vertical .ui-slider-range{left:0;width:100%}.ui-slider-vertical .ui-slider-range-min{bottom:0}.ui-slider-vertical .ui-slider-range-max{top:0}.ui-spinner{position:relative;display:inline-block;overflow:hidden;padding:0;vertical-align:middle}.ui-spinner-input{border:none;background:none;color:inherit;padding:.222em 0;margin:.2em 0;vertical-align:middle;margin-left:.4em;margin-right:2em}.ui-spinner-button{width:1.6em;height:50%;font-size:.5em;padding:0;margin:0;text-align:center;position:absolute;cursor:default;display:block;overflow:hidden;right:0}.ui-spinner a.ui-spinner-button{border-top-style:none;border-bottom-style:none;border-right-style:none}.ui-spinner-up{top:0}.ui-spinner-down{bottom:0}.ui-tabs{position:relative;padding:.2em}.ui-tabs .ui-tabs-nav{margin:0;padding:.2em .2em 0}.ui-tabs .ui-tabs-nav li{list-style:none;float:left;position:relative;top:0;margin:1px .2em 0 0;border-bottom-width:0;padding:0;white-space:nowrap}.ui-tabs .ui-tabs-nav .ui-tabs-anchor{float:left;padding:.5em 1em;text-decoration:none}.ui-tabs .ui-tabs-nav li.ui-tabs-active{margin-bottom:-1px;padding-bottom:1px}.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor{cursor:text}.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor{cursor:pointer}.ui-tabs .ui-tabs-panel{display:block;border-width:0;padding:1em 1.4em;background:none}.ui-tooltip{padding:8px;position:absolute;z-index:9999;max-width:300px}body .ui-tooltip{border-width:2px}.ui-widget{font-family:Arial,Helvetica,sans-serif;font-size:1em}.ui-widget .ui-widget{font-size:1em}.ui-widget input,.ui-widget select,.ui-widget textarea,.ui-widget button{font-family:Arial,Helvetica,sans-serif;font-size:1em}.ui-widget.ui-widget-content{border:1px solid #c5c5c5}.ui-widget-content{border:1px solid #ddd;background:#fff;color:#333}.ui-widget-content a{color:#333}.ui-widget-header{border:1px solid #ddd;background:#e9e9e9;color:#333;font-weight:bold}.ui-widget-header a{color:#333}.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default,.ui-button,html .ui-button.ui-state-disabled:hover,html .ui-button.ui-state-disabled:active{border:1px solid #c5c5c5;background:#f6f6f6;font-weight:normal;color:#454545}.ui-state-default a,.ui-state-default a:link,.ui-state-default a:visited,a.ui-button,a:link.ui-button,a:visited.ui-button,.ui-button{color:#454545;text-decoration:none}.ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover,.ui-state-focus,.ui-widget-content .ui-state-focus,.ui-widget-header .ui-state-focus,.ui-button:hover,.ui-button:focus{border:1px solid #ccc;background:#ededed;font-weight:normal;color:#2b2b2b}.ui-state-hover a,.ui-state-hover a:hover,.ui-state-hover a:link,.ui-state-hover a:visited,.ui-state-focus a,.ui-state-focus a:hover,.ui-state-focus a:link,.ui-state-focus a:visited,a.ui-button:hover,a.ui-button:focus{color:#2b2b2b;text-decoration:none}.ui-visual-focus{box-shadow:0 0 3px 1px rgb(94,158,214)}.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active,a.ui-button:active,.ui-button:active,.ui-button.ui-state-active:hover{border:1px solid #003eff;background:#007fff;font-weight:normal;color:#fff}.ui-icon-background,.ui-state-active .ui-icon-background{border:#003eff;background-color:#fff}.ui-state-active a,.ui-state-active a:link,.ui-state-active a:visited{color:#fff;text-decoration:none}.ui-state-highlight,.ui-widget-content .ui-state-highlight,.ui-widget-header .ui-state-highlight{border:1px solid #dad55e;background:#fffa90;color:#777620}.ui-state-checked{border:1px solid #dad55e;background:#fffa90}.ui-state-highlight a,.ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a{color:#777620}.ui-state-error,.ui-widget-content .ui-state-error,.ui-widget-header .ui-state-error{border:1px solid #f1a899;background:#fddfdf;color:#5f3f3f}.ui-state-error a,.ui-widget-content .ui-state-error a,.ui-widget-header .ui-state-error a{color:#5f3f3f}.ui-state-error-text,.ui-widget-content .ui-state-error-text,.ui-widget-header .ui-state-error-text{color:#5f3f3f}.ui-priority-primary,.ui-widget-content .ui-priority-primary,.ui-widget-header .ui-priority-primary{font-weight:bold}.ui-priority-secondary,.ui-widget-content .ui-priority-secondary,.ui-widget-header .ui-priority-secondary{opacity:.7;filter:Alpha(Opacity=70);font-weight:normal}.ui-state-disabled,.ui-widget-content .ui-state-disabled,.ui-widget-header .ui-state-disabled{opacity:.35;filter:Alpha(Opacity=35);background-image:none}.ui-state-disabled .ui-icon{filter:Alpha(Opacity=35)}.ui-icon{width:16px;height:16px}.ui-icon,.ui-widget-content .ui-icon{background-image:url("images/ui-icons_444444_256x240.png")}.ui-widget-header .ui-icon{background-image:url("images/ui-icons_444444_256x240.png")}.ui-state-hover .ui-icon,.ui-state-focus .ui-icon,.ui-button:hover .ui-icon,.ui-button:focus .ui-icon{background-image:url("images/ui-icons_555555_256x240.png")}.ui-state-active .ui-icon,.ui-button:active .ui-icon{background-image:url("images/ui-icons_ffffff_256x240.png")}.ui-state-highlight .ui-icon,.ui-button .ui-state-highlight.ui-icon{background-image:url("images/ui-icons_777620_256x240.png")}.ui-state-error .ui-icon,.ui-state-error-text .ui-icon{background-image:url("images/ui-icons_cc0000_256x240.png")}.ui-button .ui-icon{background-image:url("images/ui-icons_777777_256x240.png")}.ui-icon-blank{background-position:16px 16px}.ui-icon-caret-1-n{background-position:0 0}.ui-icon-caret-1-ne{background-position:-16px 0}.ui-icon-caret-1-e{background-position:-32px 0}.ui-icon-caret-1-se{background-position:-48px 0}.ui-icon-caret-1-s{background-position:-65px 0}.ui-icon-caret-1-sw{background-position:-80px 0}.ui-icon-caret-1-w{background-position:-96px 0}.ui-icon-caret-1-nw{background-position:-112px 0}.ui-icon-caret-2-n-s{background-position:-128px 0}.ui-icon-caret-2-e-w{background-position:-144px 0}.ui-icon-triangle-1-n{background-position:0 -16px}.ui-icon-triangle-1-ne{background-position:-16px -16px}.ui-icon-triangle-1-e{background-position:-32px -16px}.ui-icon-triangle-1-se{background-position:-48px -16px}.ui-icon-triangle-1-s{background-position:-65px -16px}.ui-icon-triangle-1-sw{background-position:-80px -16px}.ui-icon-triangle-1-w{background-position:-96px -16px}.ui-icon-triangle-1-nw{background-position:-112px -16px}.ui-icon-triangle-2-n-s{background-position:-128px -16px}.ui-icon-triangle-2-e-w{background-position:-144px -16px}.ui-icon-arrow-1-n{background-position:0 -32px}.ui-icon-arrow-1-ne{background-position:-16px -32px}.ui-icon-arrow-1-e{background-position:-32px -32px}.ui-icon-arrow-1-se{background-position:-48px -32px}.ui-icon-arrow-1-s{background-position:-65px -32px}.ui-icon-arrow-1-sw{background-position:-80px -32px}.ui-icon-arrow-1-w{background-position:-96px -32px}.ui-icon-arrow-1-nw{background-position:-112px -32px}.ui-icon-arrow-2-n-s{background-position:-128px -32px}.ui-icon-arrow-2-ne-sw{background-position:-144px -32px}.ui-icon-arrow-2-e-w{background-position:-160px -32px}.ui-icon-arrow-2-se-nw{background-position:-176px -32px}.ui-icon-arrowstop-1-n{background-position:-192px -32px}.ui-icon-arrowstop-1-e{background-position:-208px -32px}.ui-icon-arrowstop-1-s{background-position:-224px -32px}.ui-icon-arrowstop-1-w{background-position:-240px -32px}.ui-icon-arrowthick-1-n{background-position:1px -48px}.ui-icon-arrowthick-1-ne{background-position:-16px -48px}.ui-icon-arrowthick-1-e{background-position:-32px -48px}.ui-icon-arrowthick-1-se{background-position:-48px -48px}.ui-icon-arrowthick-1-s{background-position:-64px -48px}.ui-icon-arrowthick-1-sw{background-position:-80px -48px}.ui-icon-arrowthick-1-w{background-position:-96px -48px}.ui-icon-arrowthick-1-nw{background-position:-112px -48px}.ui-icon-arrowthick-2-n-s{background-position:-128px -48px}.ui-icon-arrowthick-2-ne-sw{background-position:-144px -48px}.ui-icon-arrowthick-2-e-w{background-position:-160px -48px}.ui-icon-arrowthick-2-se-nw{background-position:-176px -48px}.ui-icon-arrowthickstop-1-n{background-position:-192px -48px}.ui-icon-arrowthickstop-1-e{background-position:-208px -48px}.ui-icon-arrowthickstop-1-s{background-position:-224px -48px}.ui-icon-arrowthickstop-1-w{background-position:-240px -48px}.ui-icon-arrowreturnthick-1-w{background-position:0 -64px}.ui-icon-arrowreturnthick-1-n{background-position:-16px -64px}.ui-icon-arrowreturnthick-1-e{background-position:-32px -64px}.ui-icon-arrowreturnthick-1-s{background-position:-48px -64px}.ui-icon-arrowreturn-1-w{background-position:-64px -64px}.ui-icon-arrowreturn-1-n{background-position:-80px -64px}.ui-icon-arrowreturn-1-e{background-position:-96px -64px}.ui-icon-arrowreturn-1-s{background-position:-112px -64px}.ui-icon-arrowrefresh-1-w{background-position:-128px -64px}.ui-icon-arrowrefresh-1-n{background-position:-144px -64px}.ui-icon-arrowrefresh-1-e{background-position:-160px -64px}.ui-icon-arrowrefresh-1-s{background-position:-176px -64px}.ui-icon-arrow-4{background-position:0 -80px}.ui-icon-arrow-4-diag{background-position:-16px -80px}.ui-icon-extlink{background-position:-32px -80px}.ui-icon-newwin{background-position:-48px -80px}.ui-icon-refresh{background-position:-64px -80px}.ui-icon-shuffle{background-position:-80px -80px}.ui-icon-transfer-e-w{background-position:-96px -80px}.ui-icon-transferthick-e-w{background-position:-112px -80px}.ui-icon-folder-collapsed{background-position:0 -96px}.ui-icon-folder-open{background-position:-16px -96px}.ui-icon-document{background-position:-32px -96px}.ui-icon-document-b{background-position:-48px -96px}.ui-icon-note{background-position:-64px -96px}.ui-icon-mail-closed{background-position:-80px -96px}.ui-icon-mail-open{background-position:-96px -96px}.ui-icon-suitcase{background-position:-112px -96px}.ui-icon-comment{background-position:-128px -96px}.ui-icon-person{background-position:-144px -96px}.ui-icon-print{background-position:-160px -96px}.ui-icon-trash{background-position:-176px -96px}.ui-icon-locked{background-position:-192px -96px}.ui-icon-unlocked{background-position:-208px -96px}.ui-icon-bookmark{background-position:-224px -96px}.ui-icon-tag{background-position:-240px -96px}.ui-icon-home{background-position:0 -112px}.ui-icon-flag{background-position:-16px -112px}.ui-icon-calendar{background-position:-32px -112px}.ui-icon-cart{background-position:-48px -112px}.ui-icon-pencil{background-position:-64px -112px}.ui-icon-clock{background-position:-80px -112px}.ui-icon-disk{background-position:-96px -112px}.ui-icon-calculator{background-position:-112px -112px}.ui-icon-zoomin{background-position:-128px -112px}.ui-icon-zoomout{background-position:-144px -112px}.ui-icon-search{background-position:-160px -112px}.ui-icon-wrench{background-position:-176px -112px}.ui-icon-gear{background-position:-192px -112px}.ui-icon-heart{background-position:-208px -112px}.ui-icon-star{background-position:-224px -112px}.ui-icon-link{background-position:-240px -112px}.ui-icon-cancel{background-position:0 -128px}.ui-icon-plus{background-position:-16px -128px}.ui-icon-plusthick{background-position:-32px -128px}.ui-icon-minus{background-position:-48px -128px}.ui-icon-minusthick{background-position:-64px -128px}.ui-icon-close{background-position:-80px -128px}.ui-icon-closethick{background-position:-96px -128px}.ui-icon-key{background-position:-112px -128px}.ui-icon-lightbulb{background-position:-128px -128px}.ui-icon-scissors{background-position:-144px -128px}.ui-icon-clipboard{background-position:-160px -128px}.ui-icon-copy{background-position:-176px -128px}.ui-icon-contact{background-position:-192px -128px}.ui-icon-image{background-position:-208px -128px}.ui-icon-video{background-position:-224px -128px}.ui-icon-script{background-position:-240px -128px}.ui-icon-alert{background-position:0 -144px}.ui-icon-info{background-position:-16px -144px}.ui-icon-notice{background-position:-32px -144px}.ui-icon-help{background-position:-48px -144px}.ui-icon-check{background-position:-64px -144px}.ui-icon-bullet{background-position:-80px -144px}.ui-icon-radio-on{background-position:-96px -144px}.ui-icon-radio-off{background-position:-112px -144px}.ui-icon-pin-w{background-position:-128px -144px}.ui-icon-pin-s{background-position:-144px -144px}.ui-icon-play{background-position:0 -160px}.ui-icon-pause{background-position:-16px -160px}.ui-icon-seek-next{background-position:-32px -160px}.ui-icon-seek-prev{background-position:-48px -160px}.ui-icon-seek-end{background-position:-64px -160px}.ui-icon-seek-start{background-position:-80px -160px}.ui-icon-seek-first{background-position:-80px -160px}.ui-icon-stop{background-position:-96px -160px}.ui-icon-eject{background-position:-112px -160px}.ui-icon-volume-off{background-position:-128px -160px}.ui-icon-volume-on{background-position:-144px -160px}.ui-icon-power{background-position:0 -176px}.ui-icon-signal-diag{background-position:-16px -176px}.ui-icon-signal{background-position:-32px -176px}.ui-icon-battery-0{background-position:-48px -176px}.ui-icon-battery-1{background-position:-64px -176px}.ui-icon-battery-2{background-position:-80px -176px}.ui-icon-battery-3{background-position:-96px -176px}.ui-icon-circle-plus{background-position:0 -192px}.ui-icon-circle-minus{background-position:-16px -192px}.ui-icon-circle-close{background-position:-32px -192px}.ui-icon-circle-triangle-e{background-position:-48px -192px}.ui-icon-circle-triangle-s{background-position:-64px -192px}.ui-icon-circle-triangle-w{background-position:-80px -192px}.ui-icon-circle-triangle-n{background-position:-96px -192px}.ui-icon-circle-arrow-e{background-position:-112px -192px}.ui-icon-circle-arrow-s{background-position:-128px -192px}.ui-icon-circle-arrow-w{background-position:-144px -192px}.ui-icon-circle-arrow-n{background-position:-160px -192px}.ui-icon-circle-zoomin{background-position:-176px -192px}.ui-icon-circle-zoomout{background-position:-192px -192px}.ui-icon-circle-check{background-position:-208px -192px}.ui-icon-circlesmall-plus{background-position:0 -208px}.ui-icon-circlesmall-minus{background-position:-16px -208px}.ui-icon-circlesmall-close{background-position:-32px -208px}.ui-icon-squaresmall-plus{background-position:-48px -208px}.ui-icon-squaresmall-minus{background-position:-64px -208px}.ui-icon-squaresmall-close{background-position:-80px -208px}.ui-icon-grip-dotted-vertical{background-position:0 -224px}.ui-icon-grip-dotted-horizontal{background-position:-16px -224px}.ui-icon-grip-solid-vertical{background-position:-32px -224px}.ui-icon-grip-solid-horizontal{background-position:-48px -224px}.ui-icon-gripsmall-diagonal-se{background-position:-64px -224px}.ui-icon-grip-diagonal-se{background-position:-80px -224px}.ui-corner-all,.ui-corner-top,.ui-corner-left,.ui-corner-tl{border-top-left-radius:3px}.ui-corner-all,.ui-corner-top,.ui-corner-right,.ui-corner-tr{border-top-right-radius:3px}.ui-corner-all,.ui-corner-bottom,.ui-corner-left,.ui-corner-bl{border-bottom-left-radius:3px}.ui-corner-all,.ui-corner-bottom,.ui-corner-right,.ui-corner-br{border-bottom-right-radius:3px}.ui-widget-overlay{background:#aaa;opacity:.3;filter:Alpha(Opacity=30)}.ui-widget-shadow{-webkit-box-shadow:0 0 5px #666;box-shadow:0 0 5px #666}
/*! jQuery UI - v1.10.3 - 2013-06-04
* http://jqueryui.com
* Includes: jquery.ui.core.css, jquery.ui.autocomplete.css, jquery.ui.menu.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Verdana%2CArial%2Csans-serif&fwDefault=normal&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=cccccc&bgTextureHeader=highlight_soft&bgImgOpacityHeader=75&borderColorHeader=aaaaaa&fcHeader=222222&iconColorHeader=222222&bgColorContent=ffffff&bgTextureContent=flat&bgImgOpacityContent=75&borderColorContent=aaaaaa&fcContent=222222&iconColorContent=222222&bgColorDefault=e6e6e6&bgTextureDefault=glass&bgImgOpacityDefault=75&borderColorDefault=d3d3d3&fcDefault=555555&iconColorDefault=888888&bgColorHover=dadada&bgTextureHover=glass&bgImgOpacityHover=75&borderColorHover=999999&fcHover=212121&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=glass&bgImgOpacityActive=65&borderColorActive=aaaaaa&fcActive=212121&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=glass&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=glass&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px
* Copyright 2013 jQuery Foundation and other contributors Licensed MIT */.ui-helper-hidden{display:none}.ui-helper-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.ui-helper-reset{margin:0;padding:0;border:0;outline:0;line-height:1.3;text-decoration:none;font-size:100%;list-style:none}.ui-helper-clearfix:before,.ui-helper-clearfix:after{content:"";display:table;border-collapse:collapse}.ui-helper-clearfix:after{clear:both}.ui-helper-clearfix{min-height:0}.ui-helper-zfix{width:100%;height:100%;top:0;left:0;position:absolute;opacity:0;filter:Alpha(Opacity=0)}.ui-front{z-index:100}.ui-state-disabled{cursor:default!important}.ui-icon{display:block;text-indent:-99999px;overflow:hidden;background-repeat:no-repeat}.ui-widget-overlay{position:fixed;top:0;left:0;width:100%;height:100%}.ui-autocomplete{position:absolute;top:0;left:0;cursor:default}.ui-menu{list-style:none;padding:2px;margin:0;display:block;outline:0}.ui-menu .ui-menu{margin-top:-3px;position:absolute}.ui-menu .ui-menu-item{margin:0;padding:0;width:100%;list-style-image:url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)}.ui-menu .ui-menu-divider{margin:5px -2px 5px -2px;height:0;font-size:0;line-height:0;border-width:1px 0 0}.ui-menu .ui-menu-item a{text-decoration:none;display:block;padding:2px .4em;line-height:1.5;min-height:0;font-weight:400}.ui-menu .ui-menu-item a.ui-state-focus,.ui-menu .ui-menu-item a.ui-state-active{font-weight:400;margin:-1px}.ui-menu .ui-state-disabled{font-weight:400;margin:.4em 0 .2em;line-height:1.5}.ui-menu .ui-state-disabled a{cursor:default}.ui-menu-icons{position:relative}.ui-menu-icons .ui-menu-item a{position:relative;padding-left:2em}.ui-menu .ui-icon{position:absolute;top:.2em;left:.2em}.ui-menu .ui-menu-icon{position:static;float:right}.ui-widget{font-family:Verdana,Arial,sans-serif;font-size:1.1em}.ui-widget .ui-widget{font-size:1em}.ui-widget input,.ui-widget select,.ui-widget textarea,.ui-widget button{font-family:Open Sans, Arial;font-size:1em}.ui-widget-content{border:1px solid #aaa;background:#4e4e50 url(/assets/tools/JQueryUI/images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x;color:#fff}.ui-widget-content a{color:#222}.ui-widget-header{border:1px solid #aaa;background:#ccc url(/assets/tools/JQueryUI/images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x;color:#222;font-weight:bold}.ui-widget-header a{color:#222}.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default{border:1px solid #d3d3d3;background:#e6e6e6 url(/assets/tools/JQueryUI/images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;font-weight:normal;color:#555}.ui-state-default a,.ui-state-default a:link,.ui-state-default a:visited{color:#555;text-decoration:none}.ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover,.ui-state-focus,.ui-widget-content .ui-state-focus,.ui-widget-header .ui-state-focus{border:1px solid #999;background:#dadada url(/assets/tools/JQueryUI/images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;font-weight:normal;color:#212121}.ui-state-hover a,.ui-state-hover a:hover,.ui-state-hover a:link,.ui-state-hover a:visited{color:#212121;text-decoration:none}.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active{border:1px solid #aaa;background:#fff url(/assets/tools/JQueryUI/images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x;font-weight:normal;color:#212121}.ui-state-active a,.ui-state-active a:link,.ui-state-active a:visited{color:#212121;text-decoration:none}.ui-state-highlight,.ui-widget-content .ui-state-highlight,.ui-widget-header .ui-state-highlight{border:1px solid #fcefa1;background:#fbf9ee url(/assets/tools/JQueryUI/images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x;color:#363636}.ui-state-highlight a,.ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a{color:#363636}.ui-state-error,.ui-widget-content .ui-state-error,.ui-widget-header .ui-state-error{border:1px solid #cd0a0a;background:#fef1ec url(/assets/tools/JQueryUI/images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x;color:#cd0a0a}.ui-state-error a,.ui-widget-content .ui-state-error a,.ui-widget-header .ui-state-error a{color:#cd0a0a}.ui-state-error-text,.ui-widget-content .ui-state-error-text,.ui-widget-header .ui-state-error-text{color:#cd0a0a}.ui-priority-primary,.ui-widget-content .ui-priority-primary,.ui-widget-header .ui-priority-primary{font-weight:bold}.ui-priority-secondary,.ui-widget-content .ui-priority-secondary,.ui-widget-header .ui-priority-secondary{opacity:.7;filter:Alpha(Opacity=70);font-weight:normal}.ui-state-disabled,.ui-widget-content .ui-state-disabled,.ui-widget-header .ui-state-disabled{opacity:.35;filter:Alpha(Opacity=35);background-image:none}.ui-state-disabled .ui-icon{filter:Alpha(Opacity=35)}.ui-icon{width:16px;height:16px}.ui-icon,.ui-widget-content .ui-icon{background-image:url(/assets/tools/JQueryUI/images/ui-icons_222222_256x240.png)}.ui-widget-header .ui-icon{background-image:url(/assets/tools/JQueryUI/images/ui-icons_222222_256x240.png)}.ui-state-default .ui-icon{background-image:url(/assets/tools/JQueryUI/images/ui-icons_888888_256x240.png)}.ui-state-hover .ui-icon,.ui-state-focus .ui-icon{background-image:url(/assets/tools/JQueryUI/images/ui-icons_454545_256x240.png)}.ui-state-active .ui-icon{background-image:url(/assets/tools/JQueryUI/images/ui-icons_454545_256x240.png)}.ui-state-highlight .ui-icon{background-image:url(/assets/tools/JQueryUI/images/ui-icons_2e83ff_256x240.png)}.ui-state-error .ui-icon,.ui-state-error-text .ui-icon{background-image:url(/assets/tools/JQueryUI/images/ui-icons_cd0a0a_256x240.png)}.ui-icon-blank{background-position:16px 16px}.ui-icon-carat-1-n{background-position:0 0}.ui-icon-carat-1-ne{background-position:-16px 0}.ui-icon-carat-1-e{background-position:-32px 0}.ui-icon-carat-1-se{background-position:-48px 0}.ui-icon-carat-1-s{background-position:-64px 0}.ui-icon-carat-1-sw{background-position:-80px 0}.ui-icon-carat-1-w{background-position:-96px 0}.ui-icon-carat-1-nw{background-position:-112px 0}.ui-icon-carat-2-n-s{background-position:-128px 0}.ui-icon-carat-2-e-w{background-position:-144px 0}.ui-icon-triangle-1-n{background-position:0 -16px}.ui-icon-triangle-1-ne{background-position:-16px -16px}.ui-icon-triangle-1-e{background-position:-32px -16px}.ui-icon-triangle-1-se{background-position:-48px -16px}.ui-icon-triangle-1-s{background-position:-64px -16px}.ui-icon-triangle-1-sw{background-position:-80px -16px}.ui-icon-triangle-1-w{background-position:-96px -16px}.ui-icon-triangle-1-nw{background-position:-112px -16px}.ui-icon-triangle-2-n-s{background-position:-128px -16px}.ui-icon-triangle-2-e-w{background-position:-144px -16px}.ui-icon-arrow-1-n{background-position:0 -32px}.ui-icon-arrow-1-ne{background-position:-16px -32px}.ui-icon-arrow-1-e{background-position:-32px -32px}.ui-icon-arrow-1-se{background-position:-48px -32px}.ui-icon-arrow-1-s{background-position:-64px -32px}.ui-icon-arrow-1-sw{background-position:-80px -32px}.ui-icon-arrow-1-w{background-position:-96px -32px}.ui-icon-arrow-1-nw{background-position:-112px -32px}.ui-icon-arrow-2-n-s{background-position:-128px -32px}.ui-icon-arrow-2-ne-sw{background-position:-144px -32px}.ui-icon-arrow-2-e-w{background-position:-160px -32px}.ui-icon-arrow-2-se-nw{background-position:-176px -32px}.ui-icon-arrowstop-1-n{background-position:-192px -32px}.ui-icon-arrowstop-1-e{background-position:-208px -32px}.ui-icon-arrowstop-1-s{background-position:-224px -32px}.ui-icon-arrowstop-1-w{background-position:-240px -32px}.ui-icon-arrowthick-1-n{background-position:0 -48px}.ui-icon-arrowthick-1-ne{background-position:-16px -48px}.ui-icon-arrowthick-1-e{background-position:-32px -48px}.ui-icon-arrowthick-1-se{background-position:-48px -48px}.ui-icon-arrowthick-1-s{background-position:-64px -48px}.ui-icon-arrowthick-1-sw{background-position:-80px -48px}.ui-icon-arrowthick-1-w{background-position:-96px -48px}.ui-icon-arrowthick-1-nw{background-position:-112px -48px}.ui-icon-arrowthick-2-n-s{background-position:-128px -48px}.ui-icon-arrowthick-2-ne-sw{background-position:-144px -48px}.ui-icon-arrowthick-2-e-w{background-position:-160px -48px}.ui-icon-arrowthick-2-se-nw{background-position:-176px -48px}.ui-icon-arrowthickstop-1-n{background-position:-192px -48px}.ui-icon-arrowthickstop-1-e{background-position:-208px -48px}.ui-icon-arrowthickstop-1-s{background-position:-224px -48px}.ui-icon-arrowthickstop-1-w{background-position:-240px -48px}.ui-icon-arrowreturnthick-1-w{background-position:0 -64px}.ui-icon-arrowreturnthick-1-n{background-position:-16px -64px}.ui-icon-arrowreturnthick-1-e{background-position:-32px -64px}.ui-icon-arrowreturnthick-1-s{background-position:-48px -64px}.ui-icon-arrowreturn-1-w{background-position:-64px -64px}.ui-icon-arrowreturn-1-n{background-position:-80px -64px}.ui-icon-arrowreturn-1-e{background-position:-96px -64px}.ui-icon-arrowreturn-1-s{background-position:-112px -64px}.ui-icon-arrowrefresh-1-w{background-position:-128px -64px}.ui-icon-arrowrefresh-1-n{background-position:-144px -64px}.ui-icon-arrowrefresh-1-e{background-position:-160px -64px}.ui-icon-arrowrefresh-1-s{background-position:-176px -64px}.ui-icon-arrow-4{background-position:0 -80px}.ui-icon-arrow-4-diag{background-position:-16px -80px}.ui-icon-extlink{background-position:-32px -80px}.ui-icon-newwin{background-position:-48px -80px}.ui-icon-refresh{background-position:-64px -80px}.ui-icon-shuffle{background-position:-80px -80px}.ui-icon-transfer-e-w{background-position:-96px -80px}.ui-icon-transferthick-e-w{background-position:-112px -80px}.ui-icon-folder-collapsed{background-position:0 -96px}.ui-icon-folder-open{background-position:-16px -96px}.ui-icon-document{background-position:-32px -96px}.ui-icon-document-b{background-position:-48px -96px}.ui-icon-note{background-position:-64px -96px}.ui-icon-mail-closed{background-position:-80px -96px}.ui-icon-mail-open{background-position:-96px -96px}.ui-icon-suitcase{background-position:-112px -96px}.ui-icon-comment{background-position:-128px -96px}.ui-icon-person{background-position:-144px -96px}.ui-icon-print{background-position:-160px -96px}.ui-icon-trash{background-position:-176px -96px}.ui-icon-locked{background-position:-192px -96px}.ui-icon-unlocked{background-position:-208px -96px}.ui-icon-bookmark{background-position:-224px -96px}.ui-icon-tag{background-position:-240px -96px}.ui-icon-home{background-position:0 -112px}.ui-icon-flag{background-position:-16px -112px}.ui-icon-calendar{background-position:-32px -112px}.ui-icon-cart{background-position:-48px -112px}.ui-icon-pencil{background-position:-64px -112px}.ui-icon-clock{background-position:-80px -112px}.ui-icon-disk{background-position:-96px -112px}.ui-icon-calculator{background-position:-112px -112px}.ui-icon-zoomin{background-position:-128px -112px}.ui-icon-zoomout{background-position:-144px -112px}.ui-icon-search{background-position:-160px -112px}.ui-icon-wrench{background-position:-176px -112px}.ui-icon-gear{background-position:-192px -112px}.ui-icon-heart{background-position:-208px -112px}.ui-icon-star{background-position:-224px -112px}.ui-icon-link{background-position:-240px -112px}.ui-icon-cancel{background-position:0 -128px}.ui-icon-plus{background-position:-16px -128px}.ui-icon-plusthick{background-position:-32px -128px}.ui-icon-minus{background-position:-48px -128px}.ui-icon-minusthick{background-position:-64px -128px}.ui-icon-close{background-position:-80px -128px}.ui-icon-closethick{background-position:-96px -128px}.ui-icon-key{background-position:-112px -128px}.ui-icon-lightbulb{background-position:-128px -128px}.ui-icon-scissors{background-position:-144px -128px}.ui-icon-clipboard{background-position:-160px -128px}.ui-icon-copy{background-position:-176px -128px}.ui-icon-contact{background-position:-192px -128px}.ui-icon-image{background-position:-208px -128px}.ui-icon-video{background-position:-224px -128px}.ui-icon-script{background-position:-240px -128px}.ui-icon-alert{background-position:0 -144px}.ui-icon-info{background-position:-16px -144px}.ui-icon-notice{background-position:-32px -144px}.ui-icon-help{background-position:-48px -144px}.ui-icon-check{background-position:-64px -144px}.ui-icon-bullet{background-position:-80px -144px}.ui-icon-radio-on{background-position:-96px -144px}.ui-icon-radio-off{background-position:-112px -144px}.ui-icon-pin-w{background-position:-128px -144px}.ui-icon-pin-s{background-position:-144px -144px}.ui-icon-play{background-position:0 -160px}.ui-icon-pause{background-position:-16px -160px}.ui-icon-seek-next{background-position:-32px -160px}.ui-icon-seek-prev{background-position:-48px -160px}.ui-icon-seek-end{background-position:-64px -160px}.ui-icon-seek-start{background-position:-80px -160px}.ui-icon-seek-first{background-position:-80px -160px}.ui-icon-stop{background-position:-96px -160px}.ui-icon-eject{background-position:-112px -160px}.ui-icon-volume-off{background-position:-128px -160px}.ui-icon-volume-on{background-position:-144px -160px}.ui-icon-power{background-position:0 -176px}.ui-icon-signal-diag{background-position:-16px -176px}.ui-icon-signal{background-position:-32px -176px}.ui-icon-battery-0{background-position:-48px -176px}.ui-icon-battery-1{background-position:-64px -176px}.ui-icon-battery-2{background-position:-80px -176px}.ui-icon-battery-3{background-position:-96px -176px}.ui-icon-circle-plus{background-position:0 -192px}.ui-icon-circle-minus{background-position:-16px -192px}.ui-icon-circle-close{background-position:-32px -192px}.ui-icon-circle-triangle-e{background-position:-48px -192px}.ui-icon-circle-triangle-s{background-position:-64px -192px}.ui-icon-circle-triangle-w{background-position:-80px -192px}.ui-icon-circle-triangle-n{background-position:-96px -192px}.ui-icon-circle-arrow-e{background-position:-112px -192px}.ui-icon-circle-arrow-s{background-position:-128px -192px}.ui-icon-circle-arrow-w{background-position:-144px -192px}.ui-icon-circle-arrow-n{background-position:-160px -192px}.ui-icon-circle-zoomin{background-position:-176px -192px}.ui-icon-circle-zoomout{background-position:-192px -192px}.ui-icon-circle-check{background-position:-208px -192px}.ui-icon-circlesmall-plus{background-position:0 -208px}.ui-icon-circlesmall-minus{background-position:-16px -208px}.ui-icon-circlesmall-close{background-position:-32px -208px}.ui-icon-squaresmall-plus{background-position:-48px -208px}.ui-icon-squaresmall-minus{background-position:-64px -208px}.ui-icon-squaresmall-close{background-position:-80px -208px}.ui-icon-grip-dotted-vertical{background-position:0 -224px}.ui-icon-grip-dotted-horizontal{background-position:-16px -224px}.ui-icon-grip-solid-vertical{background-position:-32px -224px}.ui-icon-grip-solid-horizontal{background-position:-48px -224px}.ui-icon-gripsmall-diagonal-se{background-position:-64px -224px}.ui-icon-grip-diagonal-se{background-position:-80px -224px}.ui-corner-all,.ui-corner-top,.ui-corner-left,.ui-corner-tl{border-top-left-radius:4px}.ui-corner-all,.ui-corner-top,.ui-corner-right,.ui-corner-tr{border-top-right-radius:4px}.ui-corner-all,.ui-corner-bottom,.ui-corner-left,.ui-corner-bl{border-bottom-left-radius:4px}.ui-corner-all,.ui-corner-bottom,.ui-corner-right,.ui-corner-br{border-bottom-right-radius:4px}.ui-widget-overlay{background:#aaa url(/assets/tools/JQueryUI/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;opacity:.3;filter:Alpha(Opacity=30)}.ui-widget-shadow{margin:-8px 0 0 -8px;padding:8px;background:#aaa url(/assets/tools/JQueryUI/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;opacity:.3;filter:Alpha(Opacity=30);border-radius:8px}
:root {
    --masterspec-orange-visited: #e98b3a;
    --masterspec-orange-hover: #dc8500;
    --masterspec-orange-hover-border: #c67800;
    --masterspec-orange-active-border: #b26c00;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
    display: block;
}

audio:not([controls]) {
    display: none;
    height: 0;
}

[hidden], template {
    display: none;
}

html {
    font-family: 'Open Sans', sans-serif, Arial;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-size: 1rem;
    color: #4e4e50;
}

a {
    background: transparent;
}

a:focus {
    outline: thin dotted;
}

a:active, a:hover {
    outline: 0;
}

abbr[title] {
    border-bottom: 1px dotted;
}

b, strong {
    font-weight: bold;
}

dfn {
    font-style: italic;
}

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
}

mark {
    background: #ff0;
    color: #000;
}

code, kbd, pre, samp {
    font-family: monospace, serif;
    font-size: 1em;
}

pre {
    white-space: pre-wrap;
}

q {
    quotes: "\201C" "\201D" "\2018" "\2019";
}

small {
    font-size: 80%;
    font-weight: 300;
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
    bottom: -0.25em;
}

img {
    border: 0;
}

svg:not(:root) {
    overflow: hidden;
}

figure {
    margin: 0;
}

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

legend, menu {
    border: 0;
    padding: 0;
    margin: 0;
}

button, input, select, textarea {
    font-family: inherit;
    font-size: 100%;
    margin: 0;
}

button, input {
    line-height: normal;
}

button, select {
    text-transform: none;
}

button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

button[disabled], html input[disabled] {
    cursor: default;
}

input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

textarea {
    overflow: auto;
    vertical-align: top;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

.cic-logo-img {
    max-width: 200px;
    max-height: 100px;
}

/* HTML tags the streamSWEET way
===================== */
p {
    margin: 2px 0 22px 0;
}

h1 {
    font-size: 3em;
    margin: 0.67em 0;
    font-weight: 300;
}

h2 {
    font-size: 2rem;
    font-weight: 300;
    line-height: 1.5;
    margin-bottom: 0.5rem;
}

h3 {
    font-size: 1.75rem;
    line-height: 1.5;
    font-weight: 300;
    margin-bottom: 0.5rem;
}

h4 {
    font-size: 1.5rem;
    font-weight: 300;
    margin-top: 0;
    margin-bottom: 0.5rem;
}

h5 {
    font-size: 1.25rem;
    font-weight: 300;
    margin-bottom: 0.5rem;
}

h6 {
    font-size: 1rem;
    margin-bottom: 0.5rem;
    font-weight: 400;
}

blockquote {
    margin: 0 0 1rem
}

hr {
    border-top-width: 1px;
    border-top-style: solid;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-top-color: #eaeaea;
    margin-right: 0px;
    margin-left: 0px;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

img {
    border: 0;
    display: block;
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}

.alink, .alink:link, .alink:visited {
    font-size: 12px;
    display: inline-block;
    color: var(--masterspec-orange);
    background-color: transparent;
    text-align: center;
    padding: 3px 10px 3px 10px;
    text-decoration: none;
    margin: 0;
    border-radius: 3px;
}

.alink:hover, .alink:active {
    background-color: var(--masterspec-orange-hover);
    color: #fff;
}
/* streamSWEET additional Fonts 
===================== */
.TextEmphasis {
    color: #999;
    font-style: italic;
}

.TextStrong {
    font-weight: bold;
}

.TextSml1 {
    font-size: 90% !important;
    color: #939598;
    line-height: 1.5;
}

.TextSml2 {
    font-size: 11px;
    color: #999;
}

.TextLarge {
    font-size: 18px;
}

.TextLarge1 {
    font-size: 22px;
    line-height: 32px;
}

.TextQuote {
    font-size: 14px;
    font-weight: bold;
    color: #4898d4;
    line-height: 18px;
    font-style: italic;
}

.TextLabel {
    font-size: 14px;
    color: #777 !important;
    vertical-align: top;
}

.TextInstruct {
    font-size: 12px;
    color: #2d4285;
}

.TextBold {
    font-weight: bold;
}

.TextCaps {
    text-transform: uppercase;
}

.TextQuote {
    font-size: 14px;
    font-weight: bold;
    color: #4898d4;
    line-height: 22px;
    font-style: italic;
}

.TextBold {
    font-weight: bold;
}

.TextCaps {
    text-transform: uppercase;
}

.KeynotesTxtColor {
    color: #1c1cff;
}

.ButtonDarkGray:link, .ButtonDarkGray:visited {
    text-decoration: none;
}

.ButtonDarkGray i {
    color: #666 !important;
    font-size: 14px;
}

.ButtonDarkGray span {
    color: #888;
    font-size: 10px;
    display: inline-block;
    margin-left: 5px;
}

.ButtonDarkGray:hover i {
    color: #1890ff;
    text-decoration: none;
}

.ButtonDarkGray:hover span {
    color: #1890ff;
    text-decoration: none;
}
/* streamSWEET predefined tables
===================== */
.Table1 {
    border-collapse: collapse;
    border: 1px solid #b7b8b8;
}

.Table1Head {
    background-color: #3c3c3c;
    padding: 5px 5px 5px 3px;
    font-size: 14px;
    font-weight: bold;
    color: #f7f7f7;
    text-align: left;
    border: 1px solid #b7b8b8;
}

.Table1SubHead {
    background-color: #d4d4d4;
    padding: 3px 3px 3px 3px;
    font-size: 12px;
    font-weight: bold;
    border-top: 1px solid #b7b8b8;
    border-bottom: 1px solid #b7b8b8;
}

.Table1Content {
    background-color: #fbfbfb;
    padding: 2px 2px 2px 3px;
    font-size: 12px;
    border-top: 1px solid #b7b8b8;
    border-bottom: 1px solid #b7b8b8;
}

.FormContItemFile {
    width: 90%;
    max-width: 800px;
    border-collapse: collapse;
    border: 1px solid #ccc;
}

.FormContItemFile td {
    padding: 2px;
}

.TableWidth80 {
    width: 80%;
    border: 0;
    margin: 30px 0;
}

.TableWidth80 td {
    padding: 5px;
    font-size: 14px;
}

/* Font - Legacy Support until replaced throughout the code.  
Meantime manually align with h1 h2 etc tags above and text classes used above.
===================== */
.Head1 {
    font-size: 3em;
    margin: 0.67em 0;
    font-weight: 300;
}

.Head2 {
    font-size: 2rem;
    font-weight: 300;
    line-height: 1.5;
    margin-bottom: 0.5rem;
}

.Head3 {
    font-size: 1.75rem;
    line-height: 1.5;
    font-weight: 300;
    margin-bottom: 0.5rem;
}

.Head4 {
    font-size: 1.5rem;
    font-weight: 300;
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.Text1 {
    font-size: 12px;
    color: #000;
}

.Text2 {
    font-size: 12px;
    color: #999;
}

.Text3 {
    font-size: 12px;
    color: #999;
    font-style: italic;
}

/* Migrated from Admin */
.Heading1 {
    font-size: 13px;
    line-height: 17px;
    height: 25px;
    vertical-align: top;
    color: #fff;
    font-weight: bold;
    background-color: #667486;
    padding: 0 0 0 10px;
    background-image: url(/assets/images/tile_Heading1.jpg);
    background-repeat: repeat-x;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    overflow: hidden;
}

.Heading1 .BtnAddNew {
    color: #fff;
    border-top-right-radius: 6px;
}

.Heading2 {
    font-size: 12px;
    line-height: 17px;
    height: 22px;
    color: #fff;
    font-weight: bold;
    padding: 0 0 0 5px;
    vertical-align: top;
    background-color: #93a1b7;
    background-image: linear-gradient(0deg, #93a1b7, #cfd6e3 90%);
    overflow: hidden;
}

.Heading3 {
    font-size: 12px;
    line-height: 17px;
    height: 20px;
    vertical-align: top;
    color: #2e2e2e;
    font-weight: bold;
    padding: 0 5px 0 5px !important;
    background-color: #e8eefa;
    background-image: linear-gradient(0deg, #e8eefa, #dadde6 90%);
    overflow: hidden;
    border-bottom: 1px solid #d1d8e8;
}

.Heading1 span, .Heading2 span, .Heading3 span {
    float: left;
    margin-top: 3px;
}

.Heading2Top {
    font-size: 12px;
    line-height: 17px;
    height: 22px;
    color: #fff;
    font-weight: bold;
    padding: 0 0 0 5px;
    vertical-align: top;
    background-color: #93a1b7;
    background-image: linear-gradient(0deg, #93a1b7, #cfd6e3 90%);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    overflow: hidden;
}

.Heading2Top .BtnAddNew {
    border-top-right-radius: 4px;
}

.Heading2Top span {
    float: left;
    margin-top: 3px;
}

.Heading2Top select {
    float: right;
    margin: 2px 10px 0 0 !important;
    height: 20px !important;
    font-size: 11px;
    border-radius: 3px;
}

/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */
/* CONTENT LAYOUT - DIV based (being phased IN) */
/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */

/* Main Content Area */
.ContentShell {
    overflow: hidden;
    padding: 0 5px 10px 5px;
    border-color: #eee;
    border-width: 0 1px 1px 1px;
    border-style: solid;
    background-color: #fcfcfc;
    min-height: 600px;
}

.ContentColSet1Left {
    width: 30%;
    float: left;
}

.ContentColSet1Right {
    width: 70%;
    float: right;
}

.ContentColSet2Left {
    width: 40%;
    float: left;
}

.ContentColSet2Right {
    width: 60%;
    float: right;
}

.ContentColSet3Left {
    width: 50%;
    float: left;
}

.ContentColSet3Right {
    width: 50%;
    float: right;
}

.ContentColSet4Left {
    width: 65%;
    float: left;
}

.ContentColSet4Right {
    width: 35%;
    float: right;
}

.ContentColContRight {
    margin-left: 8px;
}

/* Panels within content area */
.PanelShell {
    margin: 13px 0 0 0;
}

.PanelShellTop {
    margin: 0;
}

/* Occasionally needed for a panel that sits at the top, where spacing is already applied at the container level*/
.PanelContainTable {
    border: solid 1px #ccc;
    background-color: #fff;
}

.PanelContainText {
    padding: 10px;
    border: solid 1px #ccc;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.PanelContainTextSquare {
    padding: 10px;
    border: solid 1px #ccc;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
}

.PanelContainChart {
    padding: 10px;
    border: solid 1px #ccc;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
    border-radius: 5px;
}

.PanelContainTree {
    border-style: solid;
    border-width: 0 1px 1px 1px;
    border-color: #ccc;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
    padding: 10px 5px 25px 5px;
}

.PanelContainColumns {
    overflow: hidden;
}

.PanelTabsContentTelerik {
    margin-top: -1px;
    border: 1px solid #888;
    padding: 13px 10px 10px 10px;
    background-color: #fff;
    overflow: hidden;
}

.PanelContentItemSet {
    margin: 15px 10px 0 10px;
}

.PanelContentItemSet > span {
    display: block;
    line-height: 16px;
}

.PanelContainTextSquareWhiteBox {
    padding: 10px;
    border: solid 1px #ccc;
    background-color: #fff;
}

/* In-page alert and information panels */
.PanelInPageAlert {
    width: 80%;
    max-width: 800px;
    margin: 20px 6px;
    padding: 18px;
    font-size: 1.2em;
    background-color: #fcf7f2;
    border: 1px solid var(--masterspec-orange);
    border-radius: 5px;
    box-shadow: 0 0 20px 0px #ccc;
}

.PanelInPageAlert h2 {
    margin-top: 0;
}

.PanelInPageAlertTitle {
    font-size: 1.3em;
}

.PanelInPageAlertEmphasis {
    font-style: italic;
}

.PanelInPageAlert a {
    font-weight: bolder;
}

.PanelInPageInform {
    width: 80%;
    max-width: 800px;
    margin: 10px;
    padding: 8px 8px 8px 70px;
    font-size: 1.2em;
    background-color: #ffc;
    border: 1px solid #fc0;
    border-radius: 5px;
    box-shadow: 0 0 20px 0px #ffdbd9;
    background-image: url('/assets/admin/images/icon_warning_sign.gif');
    background-repeat: no-repeat;
    background-position: 10px 10px;
}

.PanelEditorChanged {
    max-width: 800px;
}

.PanelEditorChangedText {
    float: left;
}

.PanelEditorChangedHelp {
    float: right;
    margin-right: 10px;
}

.PanelEditorChangedButtons {
    margin-left: 20px;
}

.PanelLogin {
    background-color: #f5f5f5;
    padding: 15px 30px;
    border-left: 1px solid #999;
    border-right: 1px solid #999;
    border-bottom: 5px solid #999;
    text-align: left;
}

.PanelLoginCont {
    position: absolute;
    top: 0;
    right: 150px;
    height: 0;
    overflow: hidden;
    z-index: 10002;
}

.PanelLogin input {
    display: inline-block;
    margin: 5px 0 !important;
}

.PanelLoginHide {
    float: right;
    margin: -20px -20px 50px 0;
    color: #666;
    padding: 0 10px;
    border: 1px solid transparent;
}

.PanelLoginHide:hover {
    border: 1px solid #000;
    background-color: #fff;
    cursor: pointer;
}

.PanelLoginProfile {
    background-color: #f5f5f5;
    padding: 15px 30px;
    border-left: 1px solid #999;
    border-right: 1px solid #999;
    border-bottom: 5px solid #999;
    width: 300px;
    font-size: 14px;
}

.PanelLoginProfileCont {
    position: absolute;
    top: 0;
    right: 50px;
    height: 0;
    overflow: hidden;
    z-index: 10002
}

.PanelLoginProfile a:link, .PanelLoginProfile a:visited {
    color: #69646c;
}

.PanelLoginProfile a:hover, .PanelLoginProfile a:active {
    color: var(--masterspec-orange-hover);
}

.PanelLoginProfileSelect {
    font-size: 12px;
    padding: 3px 10px;
}

/* Address Handling*/
/* data-address fields: Name, TradingName, Building, StreetPOBox, Suburb, TownCity, PostZipCode, StateProvince, Country, Email, Phone*/
/* Note that for each country we may have custom formating, with several fields in one line. In those instances use first field data-address name i.e. TownCity for Auckland 1001*/
.PanelAddress > span {
    display: block;
}

.PanelAddress {
    margin: 15px 5px 5px 5px;
}

.PanelAddress span[data-address=Name], .PanelAddress span[data-address=TradingName] {
    font-size: 1.2em;
}

.PanelAddress span[data-address=Email] {
    margin-top: 15px;
}

.PanelAddressBilling > span {
    display: block;
}

.PanelAddressBilling {
    margin: 15px 5px 5px 5px;
}

.PanelAddressBilling span[data-address=Name], .PanelAddress span[data-address=TradingName] {
    font-size: 1.2em;
}

.PanelAddressBilling span[data-address=Email] {
    margin-top: 15px;
}

.PanelAddressDelivery > span {
    display: block;
}

.PanelAddressDelivery {
    margin: 15px 5px 5px 5px;
}

.PanelAddressDelivery span[data-address=Name], .PanelAddress span[data-address=TradingName] {
    font-size: 1.2em;
}

.PanelAddressDelivery span[data-address=Phone] {
    margin-top: 15px;
}
/* ======================================================================================== */
/* ======================================================================================== */
/* Template Layout */
/* ======================================================================================== */
/* ======================================================================================== */

/* Generic container for each logical section of the page - creates horizontal 'slices' of content at full screen width */
.wrapper {
    clear: both;
    margin: 0 auto;
    padding: 0;
    position: relative;
    max-width: 1400px;
    width: 94%;
}

/* First level containers for each horizontal panel - set margins, background colours, panel widths etc */
.PageHeader {
    margin: 0px auto;
    overflow: hidden;
}

.PageBanner {
    margin: 0px auto;
    padding: 8px 0px;
    background-color: #aec1c8;
    overflow: hidden;
}

.PageBannerHome {
    background-image: url(/assets/images/Home-sample-1.jpg);
    min-height: 300px;
    margin-top: 0;
    background-repeat: no-repeat;
    background-size: cover; /*contain;*/
    background-position: 50% 50%;
    overflow: hidden; /*background-attachment:fixed;*/
}

.PageBannerHome h1 {
    font-weight: 300;
    line-height: 1.6;
    font-size: 2.4em;
    margin: 0.5em 0;
}

.PageBannerHome hr {
    border-color: #bdbebf;
}

.HeroPanel {
    width: 60%;
    margin: 90px 0;
    color: #fdfdfd;
    background-color: rgba(87, 111, 131, 0.8);
    padding: 1rem 2rem;
    float: right;
    position: relative;
}

.PageHero {
    margin: 0px auto;
}

.PageMenu {
    margin: 8px auto;
    padding: 0 0;
    background-color: #ccc;
    border-radius: 7px;
    height: 50px;
}

.PageContent {
    margin: 0px auto;
    padding: 20px 0;
    background-color: #fff;
    text-align: left;
    min-height: 800px;
}

.PageFooter {
    margin: 0px auto;
    background-color: #4e4e50;
    padding: 30px 0;
}

/* Second level container, nested within each logical section of the page per above. Set horizontal alignment, usable width and position (to give an anchor for nested elements with position handling). */
.SectionWrapper {
    margin: 0 auto;
    position: relative;
    max-width: 1380px;
    width: 96%;
}


/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */
/* Forms :: Layout (Note. The 'section' element is used to show panels of content based on user selection) */
/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */

.FormSetHor, .FormSetVert {
    border: 1px solid #ccc;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: #fefefe;
    margin-bottom: 10px;
}

.FormSetHor > section, .FormSetVert > section, .FormSetHor .FormSetHor, .FormSetVert .FormSetVert {
    margin: 0;
    padding: 0;
    border: none;
    width: 100%;
}

.FormSetHor > h1, .FormSetVert > h1 {
    font-size: 20px;
    font-weight: 400;
    background-color: #eee;
    margin: 10px 0 0 0;
    padding: 10px 10px 5px 10px;
    line-height: 20px;
    min-height: 22px;
}

.FormSetHor > h2, .FormSetVert > h2 {
    font-size: 20px;
    font-weight: 400;
    background-color: #eee;
    margin: 10px 0 0 0;
    padding: 18px 18px 16px 20px;
    line-height: 20px; /*min-height:22px;*/
}

.FormSetHor > h2:first-of-type, .FormSetVert > h2:first-of-type {
    margin: 0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.FormSetHor > h3, .FormSetHor > section > h3, .FormSetVert > h3, .FormSetVert > section > h3 {
    font-size: 16px;
    font-weight: 400;
    background-color: #eee;
    margin: 10px 0 0 0;
    padding: 14px 14px 14px 20px;
    line-height: 16px; /*min-height:18px;*/
}

.FormSetHor > div, .FormSetHor > section > div, .FormSetVert > div, .FormSetVert > section > div {
    vertical-align: top;
    padding: 10px 10px 0 10px;
}

.FormSetHor > div:last-of-type, .FormSetVert > div:last-of-type {
    padding-bottom: 10px;
}

.FormSetHor > div > div:nth-of-type(1), .FormSetHor > section > div > div:nth-of-type(1) {
    width: 25%;
    min-width: 150px;
    max-width: 200px;
    font-size: 14px;
    color: #666;
    vertical-align: top;
    display: inline-block;
}

.FormSetHor > div > div:nth-of-type(2), .FormSetHor > section > div > div:nth-of-type(2) {
    width: 70%;
    max-width: 850px;
    display: inline-block;
    position: relative;
}

.FormSetVert > div > div:nth-of-type(1), .FormSetVert > section > div > div:nth-of-type(1) {
    width: 95%;
    min-width: 200px;
    max-width: 95%;
    font-size: 14px;
    color: #666;
    vertical-align: top;
    padding: 0 0 5px 0;
}

.FormSetVert > div > div:nth-of-type(2), .FormSetVert > section > div > div:nth-of-type(2) {
    width: 95%;
    position: relative;
    max-width: 850px;
}

.FormSetHor > h2 > span, .FormSetVert > h2 > span {
    float: left;
    padding-right: 10px;
}

.FormSetHor > h2 > div, .FormSetVert > h2 > div {
    float: left;
}

.FormSetHor > h2 > .HelpIcon, .FormSetVert > h2 > .HelpIcon {
    padding: 0 15px 0 0;
}

.FormSetHor > h2 > i, .FormSetVert > h2 > i {
    font-size: 22px !important;
}

.FormSetHor > aside, .FormSetVert > aside {
    padding: 15px;
    max-width: calc(100% - 30px);
}

.FormSetHor aside, .FormSetVert aside {
    color: #999;
    font-style: italic;
}



/* Home 
===================== */
.hNavMain {
    margin: 0 auto;
    position: relative;
    background-color: #4e4e50;
}

.hContent1 {
    width: 90%;
    padding: 0;
    background-color: #fff;
    text-align: left;
    vertical-align: top;
    margin-left: auto;
    margin-right: auto;
}

.hContent2 {
    padding: 0px 0px 20px 0;
    text-align: left;
    vertical-align: top;
}

/* Not Used */
.hLogin {
    width: 425px;
    float: right;
    background-color: #f3eff4;
    padding: 8px 3px 10px 24px;
    border-bottom: 6px solid #ede8ec;
}

.hBasket {
    width: 300px;
    float: left;
}

.hBasket a:link, .hBasket a:visited {
    color: #fff;
    text-decoration: none;
}

.hBasket a:hover, .hBasket a:active {
    color: #fff;
    text-decoration: underline;
}

.hContact {
    padding: 8px 12px;
    float: right;
    color: #fff;
    margin-left: 0;
    margin-right: 0;
    font-size: 12px;
    text-align: center;
}

.hContact a:link, .hContact a:visited {
    color: #fff;
    text-decoration: none;
}

.hContact a:hover, .hContact a:active {
    color: #fff;
    text-decoration: underline;
}

.hNavBottom {
    padding: 15px 30px 20px 30px;
    vertical-align: top;
    color: #fff;
}

.hFooterInfo {
    background-color: #144f97;
}

/* Content - Standard
===================== */
.MenuWrapper {
}

.cBanner {
    padding: 8px 0px;
    background-color: #aec1c8;
}

.cNavMain {
    margin: 0 auto;
    position: relative;
    background-color: #4e4e50;
}

.cNavSub {
    padding: 0;
    background-color: #fff;
    vertical-align: top;
    border: 1px solid #ddd;
    border-radius: 0.25rem;
    margin: 20px 0;
}

.cPage {
    width: 100%
}

.cNavBottom {
    padding: 15px 0 20px 0;
    vertical-align: top;
    color: #fff;
}

.cContent1 {
    width: 94%;
    padding: 10px 0 30px 0;
    text-align: left;
    vertical-align: top;
    margin-left: auto;
    margin-right: auto;
}

.cContent2 {
    padding: 0px 0px 30px 0;
    text-align: left;
    vertical-align: top;
}

.cFooterInfo {
    background-color: #144f97;
    padding-bottom: 20px;
}

.cFooter {
    padding: 15px;
    vertical-align: top;
}

.cBannerCol1 {
    width: 300px;
    float: left;
    height: 160px;
    overflow: hidden;
}

.cBannerCol2 {
    width: 662px;
    float: left;
    height: 160px;
    overflow: hidden;
}

.cLogin {
    min-width: 200px;
    float: right;
    background-color: #f5f5f5;
    padding: 8px 3px 10px 24px;
    border-bottom: 6px solid #d8d8d8;
    margin-top: 6px;
}

.cBasket {
    width: 300px;
    float: left;
    margin-top: 6px;
}

.cBasket a:link, .cBasket a:visited {
    color: #fff;
    text-decoration: none;
}

.cBasket a:hover, .cBasket a:active {
    color: #fff;
    text-decoration: underline;
}

/* Generic Layout
===================== */
.LogoRow {
    height: 70px;
}

.LogoRow > div:nth-of-type(1) {
    width: 50%;
    max-width: 270px;
    float: left;
}

.LogoRow > div:nth-of-type(2) {
    width: 50%;
    float: right;
    text-align: right;
}

.LogoRow aside {
    display: inline;
}


/* This is old stuff already and we should use group handling for this.  Needs a global find/replace done to remove instances of use and then delete this */
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: "";
    clear: both;
    height: 0;
}

.clearfix {
    display: inline-block;
}
/* start commented backslash hack \*/
* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}
/* close commented backslash hack */

/* This new class group is used to replace clearfix */
.group:after {
    content: "";
    display: table;
    clear: both;
}

/* MISC CLASSES */
.NoDisplay {
    display: none;
}

/* ======================================================================================== */
/* ======================================================================================== */
/* Content - Coded outputs */
/* ======================================================================================== */
/* ======================================================================================== */

/* Table
===================== */
.TableBorder {
    background-color: #fff;
    border: 1px solid #888;
    margin-top: 1px;
}

.TableBasic {
    border-width: 0px;
    width: 100%;
}
/* should probably be reworked, because this has been moved from rugby for a handful of controls that we placed in streamSWEET. */
/* These controls are still not made part of the system properly, so we can either update them to use generic styles, or remove styles and controls */
/* usercontrol\front\custom\CreditsLogBought.ascx */
/* usercontrol\front\custom\CreditsLogUsed.ascx */
/* usercontrol\front\Network\FriendsResultsList.ascx */
/* usercontrol\front\Network\MyFriends.ascx */
.AccountTable {
    margin-bottom: 6px;
}

.AccountTable td {
    padding: 4px 2px;
}

.AccountTable th {
    text-align: left;
    background-color: #fff;
    border: 2px solid #cde9b4;
    font-size: 15px;
    padding: 6px;
    background-image: url(/assets/images/tile_header_profile.jpg);
    background-repeat: repeat-x;
}

.AccountTableLeft {
    text-align: left;
    font-weight: bold;
    background-color: #fff;
    border-top: 2px solid #cde9b4;
    border-left: 2px solid #cde9b4;
    border-bottom: 2px solid #cde9b4;
    font-size: 15px;
    padding: 6px;
    background-image: url(/assets/images/tile_header_profile.jpg);
    background-repeat: repeat-x;
}

.AccountTableCenter {
    text-align: left;
    font-weight: bold;
    background-color: #fff;
    border-top: 2px solid #cde9b4;
    border-bottom: 2px solid #cde9b4;
    font-size: 15px;
    padding: 6px;
    background-image: url(/assets/images/tile_header_profile.jpg);
    background-repeat: repeat-x;
}

.AccountTableRight {
    text-align: left;
    font-weight: bold;
    background-color: #fff;
    border-top: 2px solid #cde9b4;
    border-right: 2px solid #cde9b4;
    border-bottom: 2px solid #cde9b4;
    font-size: 15px;
    padding: 6px;
    background-image: url(/assets/images/tile_header_profile.jpg);
    background-repeat: repeat-x;
}

.AccountTableSub {
    background-image: url(/assets/images/tile_account_sub.jpg);
    background-repeat: repeat-x;
    border-bottom: 1px solid #ccc;
}

/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */
/* Data Repeater*/
/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */

.TableDataRepeat {
    width: 100%;
    border-collapse: collapse;
}

.TableDataRepeat caption {
    text-align: left;
    font-size: 14px;
    color: #2d4285;
    font-weight: bold;
    padding: 7px 5px 4px 10px;
    border-color: #ccc;
    border-style: solid;
    border-width: 1px 1px 0 1px;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.TableDataRepeat th {
    font-size: 12px;
    color: #2d4285;
    font-weight: normal;
    text-align: left;
    padding: 4px;
    background-color: #C3CAD6;
    background-image: linear-gradient(0deg, #C3CAD6, #EBEFF5 90%);
}

.TableDataRepeat td {
    font-size: 12px;
    text-align: left;
    padding: 4px 3px;
}

.TableDataRepeat td a {
    text-decoration: none;
    display: block;
}

.TableDataRepeat td a:hover {
    text-decoration: none;
    color: #f30;
}

.TableDataRepeat tr:nth-child(even) {
    background-color: #fff;
    border-bottom: 1px solid #fff;
}

.TableDataRepeat tr:nth-child(odd) {
    background-color: #efefef;
    border-bottom: 1px solid #efefef;
}

.TableDataRepeat tr:hover {
    background-color: #fbeadb;
    border-bottom: 1px solid #c4c4b5;
}

/* Grid 
===================== */
/* Note. There is a level of repetition and !important handling on the grid rows to override default Telerik values applied, where Telerik Grid is used.  */
.datagridTable {
    color: #f60;
    background-color: #fff;
}

.dataGridCont {
    border-width: 0 1px 1px 1px;
    border-style: sold;
    border-color: #999;
}

/* Handling of the data rows */
.datagrid {
    background-color: #ffffff;
    width: 100%;
    border-collapse: collapse;
}

.datagrid td {
    font-size: 14px;
    line-height: 20px;
    border-top: 1px solid #ddd;
    padding: 8px 5px;
}

.datagrid td a {
    text-decoration: none;
    position: relative;
    color: #222324;
    display: block;
}

.datagrid tr:first-of-type td {
    border-width: 0px;
}

.datagrid .deleted {
    color: #999;
    text-decoration: line-through;
}

.datagridAlter {
    background-color: #f9f9f9;
}

.datagridAlter td {
    font-size: 14px;
    line-height: 20px;
    border-top: 1px solid #ddd;
}

.datagridAlter td a {
    text-decoration: none;
    position: relative;
    color: #222324;
    display: block;
}

.datagridSelected {
    background-color: #dfe6cf;
}

.datagridSelected td {
    font-size: 14px;
    line-height: 20px;
    border-top: 1px solid #ddd;
}

.datagridSelected td a {
    text-decoration: none;
    position: relative;
    color: #222324;
    display: block;
}

.datagridOver {
    background-color: #fbeadb;
}

.datagridOver td {
    font-size: 14px;
    line-height: 20px;
    border-top: 1px solid #ddd;
}

.datagridOver td a {
    text-decoration: underline;
    color: #e98b3a;
    cursor: pointer;
}

/* Apply a border to the bottom of the last row before pagination */
/* .datagrid tr:nth-last-of-type(2) td		{border-bottom:1px solid #999;} */

/* datagridHeader is only applied to the header row of non-sortable, non drag n drop grids. */
.datagridHeader {
    padding: 0;
}

.datagridHeader td {
    padding: 4px 2px 4px 4px;
}

/*Set the line height of the heading row*/
.datagrid tr:first-of-type td {
    vertical-align: bottom;
}

.datagridColumn {
    line-height: 16px !important;
    vertical-align: bottom;
    font-size: 14px;
    font-weight: bold;
    text-align: left;
    padding: 10px 5px 4px 5px;
    background-color: #fafafa;
    border-bottom: 2px solid #ccc;
    border-top: 2px solid #ccc;
}

.datagridColumn a:link, .datagridColumn a:visited, .datagridColumn a:active {
    text-decoration: none;
    position: relative;
    color: #222324;
    display: block;
}

.datagridColumn a:hover {
    text-decoration: none;
    color: #f63;
    cursor: pointer;
}

.datagridColumnSelected {
    line-height: 16px !important;
    vertical-align: bottom;
    font-size: 14px;
    font-weight: bold;
    text-align: left;
    padding: 10px 5px 4px 5px;
    background-color: #edf2f3; /*border-top:2px solid #ccc !important;*/
}

.datagridColumnSelected a:link, .datagridColumnSelected a:visited, .datagridColumnSelected a:active {
    text-decoration: none;
    position: relative;
    color: #222324;
    display: block;
}

.datagridColumnSelected a:hover {
    text-decoration: none;
    color: #f63;
    cursor: pointer;
}

.datagridColumnSelected a::after {
    content: "\21C5";
    margin-left: 10px;
}

/*Format pagination handling. */
.datagridPager td {
    height: 35px;
    font-size: 14px;
    color: #006;
    font-weight: normal;
    background-color: #fff;
    padding: 8px 40px 6px 0 !important;
    text-align: right;
    vertical-align: bottom;
    border-top: 1px solid #999;
}

.datagridPager td span {
    padding: 0 10px 0 10px;
    font-weight: bold;
}

.datagridPager td a {
    padding: 5px 10px;
    margin: 0 1px 0 0;
    color: #999;
    font-weight: bold;
    border: 1px solid #666;
    display: inline-block;
    line-height: 20px;
    height: 24px;
    border-radius: 3px;
}

.datagridPager td a:hover {
    background-color: #555;
    border-color: #000;
    color: #fff;
    font-weight: bold;
}

/*Apply colours to key columns with data such as "Yes" and "No" so they stand out more. */
.datagridRed {
    font-size: 11px;
    color: #006;
    font-weight: normal;
    background-color: #ffd9d9;
}

.datagridGreen {
    font-size: 11px;
    color: #006;
    font-weight: normal;
    background-color: #d0ffce;
}

.datagridOrange {
    font-size: 11px;
    color: #006;
    font-weight: normal;
    background-color: #ffe6b0;
}

/* RadGrid - used for drag and drop grid */
.HypergridTableHeader {
    overflow: hidden;
    width: 100%;
    table-layout: fixed;
    empty-cells: show;
    border-collapse: collapse;
}

.HypergridTableHeader th {
    padding: 4px 2px 4px 4px;
}

.DivDragDropImage {
    margin-left: auto;
    margin-right: auto;
    width: 16px;
    height: 16px;
    text-align: center;
    background-image: url(/assets/images/icon_sort_up_down.gif);
}

.RadGridDragDropEnabled {
    cursor: move;
}

.rgPager .rgCurrentPage {
    text-decoration: none;
    color: Black;
}

.rgPager .rgInfoPart {
    display: none;
}

.rgMasterTable {
    border-collapse: collapse !important;
}

.rgMasterTable tr th {
    vertical-align: bottom;
}

.rgMasterTable tr:last-of-type td {
    border-bottom: 1px solid #999;
}

.rgFooterWrapper {
    border-top: 2px solid #999;
    padding-top: 5px;
    color: #2d4285 !important;
    font-size: 11px;
}

/* Tabs 
===================== */
.tabspanelcont {
    height: 35px;
}

.tabspanel {
    float: left;
    width: 100%;
    font-size: 90%;
    line-height: normal;
    border-bottom: 2px solid #505050;
    margin-top: 10px;
}

.tabspanel ul {
    margin: 0;
    padding: 0px 10px 0 10px;
    list-style: none;
}

.tabspanel li {
    display: inline;
    margin: 0;
    padding: 0;
}

.tabspanel a {
    float: left;
    background: url(/assets/images/tabspanelleft.gif) no-repeat left top;
    margin: 0;
    padding: 0 0 0 5px;
    text-decoration: none;
    background-position: 0% -42px;
}

.tabspanel a span {
    float: left;
    display: block;
    background: url(/assets/images/tabspanelright.gif) no-repeat right top;
    padding: 10px 15px 6px 10px;
    color: #000;
    background-position: 100% -42px;
}

.tabspanelon a {
    float: left;
    background: url(/assets/images/tabspanelleft.gif) no-repeat left top;
    margin: 0;
    padding: 0 0 0 5px;
    text-decoration: none;
}

.tabspanelon a span {
    float: left;
    display: block;
    background: url(/assets/images/tabspanelright.gif) no-repeat right top;
    padding: 10px 15px 6px 10px;
    color: #e98b3a;
}

.tabspanel a:hover {
    background-position: 0% 0px;
}

.tabspanel a:hover span {
    color: #ff6600;
    background-position: 100% 0px;
}

/* New tabs, all contained in the page, with only display values modified. */
.TabSet {
    width: 100%;
    margin: 0 auto;
}

.TabSet > nav {
    border: none;
    position: relative;
    margin: 0 10px;
}
/* Must keep the 'border' attribute or the rendering engines get confused.*/
.TabSet > nav > a {
    display: inline-block;
    min-width: 60px;
    text-decoration: none;
    color: #000;
    text-align: center;
    padding: 10px 20px 10px 20px;
    font-size: 14px;
    letter-spacing: 0.5px;
    border: 1px solid #bcbcbc;
    outline: 0;
    margin: 0;
    z-index: 1000;
    background-color: #efefef;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
}

.TabSet > nav > a:nth-of-type(n+2) {
    margin-left: -1px;
}

.TabSet > nav > a:hover {
    background-color: #576F83;
    color: #fff;
}

.TabSet .TabSel {
    border-bottom: none;
    background-color: #fff;
    padding-top: 15px;
    z-index: 1002;
    position: relative;
}

.TabSet .TabSel:hover {
    background-color: #fff;
    cursor: default;
    color: #ccc;
}

.TabSet > article {
    border: 1px solid #bcbcbc;
    margin: -2px 10px 0 10px;
    z-index: 1001;
    padding: 15px;
    background-color: #fff;
    font-weight: 300;
}

.TabSet > article > header {
    display: none;
}

.TabSet > article > header:nth-of-type(1) {
    display: block;
}

.TabSet > article > header > div {
    margin: 40px;
}

.NarrowViewText {
    display: none;
}
/* Special handling where a smaller tab size is required. */
.TabSetSml > nav > a {
    min-width: 40px;
    padding: 10px 5px 10px 5px;
    font-size: 12px;
    letter-spacing: 0.0px;
}

.TabSetSml > article > header > div {
    margin: 20px;
}



/* Stream 
===================== */

/* Alert Message Handling */
.AlertBox {
    width: 350px;
    margin: 0;
    padding: 0;
    border-radius: 10px;
    box-shadow: 0 0 20px 0px #ffdbd9;
    overflow: hidden;
    cursor: auto;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 10000;
}

.AlertBoxInner {
    padding: 10px 10px 10px 70px;
    overflow: hidden;
    z-index: 9999;
}

.AlertBoxTitle {
    margin: 5px 0 0 0;
    font-size: 24px;
    font-weight: bold;
    color: #333;
}

.AlertBoxText {
    margin: 15px 10px 10px 0;
    font-size: 1.1em;
    color: #333;
}

/*.AlertBoxSuccess   {background-color:#d0fbc1; border:1px solid #54FF54;}
.AlertBoxInnerSuccess 		{background-image:url('/assets/images/msg_type_01_01.gif'); background-repeat:no-repeat; background-position:5px 10px;}
.AlertBoxError							{background-color:#fbc8c1; border:1px solid #FF2B2B;}
.AlertBoxInnerError				{background-image:url('/assets/images/msg_type_02_01.gif'); background-repeat:no-repeat; background-position:5px 10px;}
.AlertBoxInfo 							{background-color:#fee1ab; border:1px solid #FFAE17;}
.AlertBoxInnerInfo    {background-image:url('/assets/images/msg_type_03_01.gif'); background-repeat:no-repeat; background-position:5px 10px;}*/

.AlertBoxSuccess {
    background-color: #d0fbc1;
    border: 1px solid #54FF54;
    animation: ActionSuccess 7.0s forwards;
}

.AlertBoxInnerSuccess {
    background-image: url('/assets/images/msg_type_01_01.gif');
    background-repeat: no-repeat;
    background-position: 5px 10px;
}

.AlertBoxError {
    background-color: #fbc8c1;
    border: 1px solid #FF2B2B;
    animation: ActionAlert 1.5s forwards;
}

.AlertBoxInnerError {
    background-image: url('/assets/images/msg_type_02_01.gif');
    background-repeat: no-repeat;
    background-position: 5px 10px;
}

.AlertBoxInfo {
    background-color: #fee1ab;
    border: 1px solid #FFAE17;
    animation: ActionAlert 1.5s forwards;
}

.AlertBoxInnerInfo {
    background-image: url('/assets/images/msg_type_03_01.gif');
    background-repeat: no-repeat;
    background-position: 5px 10px;
}

/* No Results Handling */
.AlertNoResult {
    padding: 10px;
    border: 1px solid #e5e5e5;
    background: #f7f7f7;
}


@keyframes ActionSuccess {
    0% {
        right: -360px;
    }

    5% {
        right: 40px;
        opacity: 0.6;
    }

    8% {
        right: 10px;
        opacity: 1.0;
    }

    10% {
        right: 27px;
    }

    12% {
        right: 17px;
    }

    13% {
        right: 22px;
    }

    14% {
        right: 20px;
    }

    80% {
        opacity: 1.0;
    }

    99% {
        right: 20px;
        opacity: 0.0;
    }

    100% {
        right: -9000px;
        opacity: 0.0;
    }
}

@keyframes ActionAlert {
    0% {
        right: -360px;
    }

    50% {
        right: 40px;
        opacity: 1.0;
    }

    70% {
        right: 10px;
    }

    85% {
        right: 27px;
    }

    90% {
        right: 17px;
    }

    95% {
        right: 22px;
    }

    100% {
        right: 20px;
    }
}


/* Image Crop - Keep this so the refrence point of the selector is the immediate container, and NOT <BODY>.  Refer the _ReadMe file with this tool.
===================== */
#MyImgAreaSelect {
    position: relative;
}

/* Telerik
===================== */
.riTextBox {
    height: 24px !important;
}

.TabHover {
    color: #039
}

.TabDisabled {
    color: #999;
}
/* Over-ride telerik generated styles */
.rwControlButtons li {
    list-style-type: none;
}

.rcbHeader ul, .rcbHeader ul li, .rcbFooter ul, .rcbFooter ul li, .rcbItem ul, .rcbItem ul li, .rcbHovered ul, .rcbHovered ul li, .rcbDisabled ul, .rcbDisabled ul li {
    list-style-type: none !important;
    margin: 0px;
    padding: 0px;
}

/* Modal 
===================== */
.modalBackground {
    background-color: Gray;
}

.modalPopup {
    display: none;
}

/* Tool Tip 
===================== */

/* Footer
===================== */
.FooterText {
    font-size: 9px;
    color: #666;
    line-height: 15px;
}

.FooterText a:link, .FooterText a:visited {
    color: #666;
    text-decoration: underline;
}

.FooterText a:hover, .FooterText a:active {
    color: #f60;
    text-decoration: underline;
}

/* Custom Footer Navigation */
/*  GRID OF FOUR  */
.span_1_of_4Footer {
    width: 23.8%;
}

.FooterNavText h5 {
    color: #fff;
}

.FooterNavText {
    color: #fff;
    font-size: 12px;
    line-height: 18px;
    font-weight: 200;
}

.FooterNavText p {
    margin: 2px 0 16px 0;
}

.FooterNavText a:link, .FooterNavText a:visited {
    color: #fff;
    text-decoration: none;
}

.FooterNavText a:hover, .FooterNavText a:active {
    color: #fff;
    text-decoration: underline;
}

.PageFooter hr {
    border-top-width: 1px;
    border-top-style: solid;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-top-color: #a7a7a7;
    margin-right: 0px;
    margin-left: 0px;
}

.PageFooter h5 {
    font-weight: 300;
    font-size: 20px;
}

/* Social Icons */
.SocialLinks {
    width: 100%;
}

.SocialIcon {
    float: left;
    height: 24px;
    width: 24px;
    margin-right: 18px;
}

/* File Upload
===================== */
.FileUploadHeader {
    font-size: 12px;
    font-weight: bold;
    color: #464c55;
    background-color: #c1d82f;
    padding: 4px;
    border-bottom: 1px solid #666;
}

/* Ajax Popup 
===================== */
/* shop */
.FormTopPopup {
    background-image: url(/assets/images/tile_stripe.jpg);
    background-repeat: repeat-x;
    color: #fff;
    font-weight: bold;
    padding-left: 15px;
}

.FormButtonPopup {
    padding: 6px 12px 6px 12px;
    font-size: 14px;
    color: #393b4a;
    background-image: url(/assets/images/tile_ajaxform_header.jpg);
    background-repeat: repeat-x;
    background-color: #b0becd;
    border: inset 1px #708090;
    text-decoration: none;
}
/* feedback only */
.FormTablePopup {
    padding: 0;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
}
/* carried from rugby - PayPal popup,  Login Message popup */
.FormHeaderPopup {
    padding: 5px 30px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    background-image: url(/assets/images/tile_ajaxform_header.jpg);
    background-repeat: repeat-x;
}

.FormHeaderPopup {
    padding: 3px;
    font-size: 14px;
    font-weight: bold;
    color: #393b4a;
    background-image: url(/assets/images/tile_ajaxform_header.jpg);
    background-repeat: repeat-x;
}
/* \PayPal_HTML.aspx */
/* \usercontrol\front\custom\BuyCredits.ascx */
.CreditDisplay {
    font-size: 14px;
    color: #000;
    padding: 6px 10px;
    background-color: #dbefde;
    border: 1px solid #6eaf4e;
}
/* PayPal popup - \PayPal_HTML.aspx */
.TableBuyStuff {
    width: 100%;
    margin: 10px 0px;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
}

.TableBuyStuff th {
    background-color: #f1eded;
    padding: 4px;
}

.TableBuyStuff td {
    padding: 4px;
}
/* BUY NOW POP-UP */
/* ref:http://www.sohtanaka.com/web-design/inline-modal-window-w-css-and-jquery/ */
#fade {
    display: none;
    background: #000;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .80;
    z-index: 9999;
}

.popup_block {
    display: none;
    background: #fff;
    padding: 0px;
    border: 2px solid #ddd;
    float: left;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 99999;
}

/* Responsive GMAP
===================== */

.containerMap {
    width: 100%; /* pick whatever width you want */
}

.containerMap .outerMap {
    width: 100%;
    padding-top: 75%; /* defines aspect ratio */
    position: relative;
}

.containerMap .outerMap .innerMap {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */
/* FORMS */
/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */

/* GENERIC FORMATTING */
textarea, input[type="text"] {
    font-family: Arial, Helvetica, sans-serif;
}

.TableFormLayout {
    border: 1px solid #ccc;
    width: 100%;
    border-collapse: collapse;
    background-color: #efefef;
    max-width: 1000px;
}

.TableFormLayout caption {
    text-align: left;
    font-size: 14px;
    color: #2d4285;
    font-weight: bold;
    padding: 7px 5px 4px 10px;
    border-color: #ccc;
    border-style: solid;
    border-width: 1px 1px 0 1px;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.TableFormLayout caption span {
    float: left;
    padding-right: 10px;
}

.TableFormLayout th {
    text-align: left;
    font-size: 12px;
    color: #333;
    font-weight: bold;
    padding: 3px 5px 2px 10px !important;
    border: 1px solid #bebebe;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
}

.TableFormLayout td {
    text-align: left;
    vertical-align: top;
    padding: 7px 3px 3px 3px;
}

.TableFormLayout tr:first-of-type td {
    padding: 10px 3px 7px 3px;
}

.FormInvalid {
    background-color: #eaced1 !important;
}
/* IC: important useful when dealing with telerik */

/* Form for the NG2 */
.FormPanel {
    width: 100%;
    border: 1px solid #c6c8cb;
}

.FormTitle {
    background: url(/assets/images/app/tile_header_standard.gif) repeat-x #f1f1f1;
    padding: 8px;
    font-size: 12px;
    text-align: left;
    color: #606063;
    font-weight: bold;
}

.FormTextBoxLine {
    font-family: Arial, Helvetica, sans-serif;
    padding: 3px;
    font-size: 14px;
    line-height: 20px;
    color: #000;
    background-color: #fff;
    border: solid 1px #a9a9a9 !important;
    height: auto !important;
}
/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */
/* Global Form Style Handling */
/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */

/* Causes a star to display after mandatory form elements - apply class to a trailing span */
.FormRequiredField::after {
    content: "\2605";
    color: #fa613e;
    font-size: 12px;
    right: -4px;
    top: 0;
    position: relative;
    vertical-align: top;
    height: 100%;
}

/* Default form element styling */
textarea {
    width: 90%;
    max-width: 800px;
    height: 75px;
    font-family: Arial, Helvetica, sans-serif;
}

textarea, input[type="text"], input[type="password"], input[type="select"], input[type="number"], textarea {
    box-sizing: border-box;
    padding: 4px;
    margin: 0;
    font-size: 16px;
    line-height: 1.5;
    color: #000;
    background-color: #fff;
    border: 2px solid #8e8e8e;
    border-radius: 0.25rem;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075)
}

input[type="text"], input[type="password"] {
    margin: 0 5px 0 0;
}

textarea:focus, input[type="text"]:focus, input[type="select"]:focus, input[type="number"]:focus, input[type="password"]:focus {
    outline: none;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6)
}

select {
    padding: 2px;
    margin: 0 5px 0 0;
    font-size: 12px;
    color: #000;
    background-color: #fff;
    border: 1px solid #888;
    height: 24px;
}

fieldset {
    width: 90%;
    max-width: 800px;
    border: 1px solid #ccc;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

legend {
    border: 0;
    padding: 0;
    margin: 0 5px;
    font-size: 12px;
    font-weight: normal;
}

/* Give a hover effect to checkboxes and radio buttons */
label {
    padding: 0 3px 0 5px;
    vertical-align: top;
}

label:hover {
    cursor: pointer;
    color: #f60;
}

input[type="checkbox"]:hover, input[type="radio"]:hover {
    cursor: pointer;
    color: #f60;
}

/* Form element standard widths */
input[type="text"] {
    width: 90%;
    max-width: 794px;
}

input[type="file"] {
    width: 100px !important;
}

select {
    width: 200px;
}

.FormWidthFull {
    width: 90%;
    max-width: 800px;
}

.FormWidthLong {
    width: 400px !important;
}

.FormWidthMedium {
    width: 200px !important;
}

.FormWidthMedium1 {
    width: 150px !important;
}

.FormWidthShort {
    width: 100px !important;
}

.FormWidthTiny {
    width: 50px !important;
}

.InlineBlock {
    display: inline-block;
}

/* Carried back from ng2_spec to make the NG2 forms work. e.g. Org Profile  */
.FormPulldown {
    padding: 4px;
    font-size: 12px;
    color: #000;
    background-color: #b0becd;
    width: auto !important;
    height: auto !important;
}

.FormTextBox {
    padding: 4px;
    font-size: 12px;
    color: #000;
    background-color: #fff;
    border: 2px solid #e8e8e8;
}

.FormButton {
    padding: 6px 12px 6px 12px;
    font-size: 14px;
    color: #393b4a;
    background-image: url(/assets/images/button_tile.jpg);
    background-repeat: repeat-x;
    background-color: #e9e9e9;
    border: 2px solid #d3d3d3;
    text-decoration: none;
    cursor: pointer;
}

.FormButtonSubmit {
    padding: 6px 12px 6px 12px;
    font-size: 14px;
    color: #393b4a;
    background-image: url(/assets/images/button_tile.jpg);
    background-repeat: repeat-x;
    background-color: #e9e9e9;
    border: 2px solid #d3d3d3;
    text-decoration: none;
}

a.FormButton {
    color: #393b4a !important;
    text-decoration: none;
}
/* Change the appearance on selection, or if the element is disabled */
input[type="text"]:hover, textarea:hover {
}

textarea:focus, input:focus, select:focus {
    outline: none;
    box-shadow: 0 0 10px 0px #ccc;
}

textarea:focus, input:focus {
    background-color: #fffaed !important;
}

textarea:disabled, input:disabled, select:disabled, submit:disabled {
    box-shadow: 0 0 8px 0px #fab9b9;
}

/* CONTAINERS.  
Wrap form elements and special sets of form elements to solves issues where the element is made up of multiple parts and/or comes from Telerik.  
This goes last as it often applies over-ride values */

/* ItemFile control - applied at the central control level */
.FormContItemFile {
    width: 90%;
    max-width: 800px;
    border-collapse: collapse;
    border: 1px solid #ccc;
    background-color: #fafafa;
}

.FormContItemFile caption {
    text-align: left;
    font-size: 14px;
    color: #2d4285;
    font-weight: bold;
    padding: 7px 5px 4px 10px;
    border-color: #ccc;
    border-style: solid;
    border-width: 1px 1px 0 1px;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.FormContItemFile td {
    padding: 7px 3px 3px 3px;
}

.FormContItemFile tr:first-of-type td {
    padding: 10px 3px 3px 3px;
}

.FormContFileUp {
}

.FormContFileUp input[type="text"] {
    width: 300px;
}

.FormContFileUp input[type="file"] {
    width: 65px !important;
}

.FormContFileUp input[type="file"]:hover {
    cursor: pointer;
}

/* Over-ride default image handling for the Telerik tree view - apply to a containing DIV */
.FormContTree img {
    display: inline;
}

/* Over-ride default form element settings for auto-complete search box - apply to a containing DIV */
.FormContAutoComplete {
    width: 200px !important;
    float: left;
    margin: 0 5px 0 0;
}

.FormContAutoComplete div td {
    height: 22px !important;
}

.FormContAutoComplete input {
    height: 16px !important;
}

.FormContAutoComplete input:focus {
    background-color: transparent !important;
}

.FormContAutoComplete input:hover {
    border: 0px;
}

/* Handle issues created by the the JQuery that handles the MaxChar functionality on textareas - apply to a containing DIV */
.FormContTextAreaMaxChar {
    width: 90%;
    max-width: 800px;
    display: inline-block;
}

.FormContTextAreaMaxChar textarea {
    width: 99%;
}

/* Over-ride default table cell formatting for the Telerik HTML editor and apply a max width - apply to a containing DIV */
.FormContHtmlEdit {
    width: 90%;
    max-width: 800px;
    display: inline-block;
}

.FormContHtmlEditWide {
    width: 90%;
    max-width: 1000px;
    display: inline-block;
}

.FormContHtmlEdit td, .FormContHtmlEditWide td {
    padding: 0 !important;
}
/* Wrap a Telerik Editor with a Div and apply this Class, otherwise inherited cellpadding causes the editor layout to mess up. */

/* Over-ride default settings for the Telerik Date Picker - apply to a containing DIV */
.FormContDate {
    padding: 0;
    display: inline-block;
    margin-right: 10px;
}

/* Special handling to make a nice 'QUICK search' that appears at the top right of the screen, typically within an admin module */
.ContQuickSearch {
    right: 30px;
    position: absolute;
    top: 88px;
    width: 250px;
}

.ContQuickSearch input[type="text"] {
    margin: 0;
    display: block;
    float: left;
}

/* Special handling to make a nice 'FILTER search' where multiple form elements sit on a single row */
.ContFilterSearch {
    overflow: hidden;
}

.ContFilterSearch input[type="text"], .ContFilterSearch input[type="password"], .ContFilterSearch select, .ContFilterSearch input[type="button"], .ContFilterSearch input[type="submit"], .ContFilterSearch span, .ContFilterSearch .FormContDate {
    display: block;
    float: left;
}

/* Give nice layout of the form buttons that sit at the bottom of each form - apply to a containing DIV */
.ContFormSubmit {
    overflow: hidden;
    margin: 10px 0 20px 5px;
}


/* BUTTONS (split out and set individual classes / customise as needed)  */

/* Applied 'OnClick' event to disable the button from being double clicked */
submit:disabled {
    box-shadow: 0 0 8px 0px #fab9b9;
    background-color: #993300;
    cursor: progress;
}

.FormButtonSubmitted {
    background-color: #993300;
    cursor: progress;
}

/* Full size buttons */
.BtnAdd, .BtnUpdate, .BtnDelete, .BtnCancel, .BtnSearch, .BtnUpload, .BtnSubmit, .BtnClone, .BtnImport, .BtnArchive, .BtnGo, .BtnContinue, .BtnUpdateQty, .BtnUnlock, .BtnActivate, .BtnResendActivateEmail, .BtnSynch, .BtnPreview, .BtnReportShow, .BtnReportExport, .BtnSchedule, .BtnSend, .BtnSendTest, .BtnSendStop, .BtnClearUnsent, .BtnConfirm, .BtnBack, .BtnSelect, .BtnAssign, .BtnClose, .BtnCheck, .BtnSet, .BtnInvite, .BtnRemind, .BtnClear, .BtnCloseOff, .BtnRecalculate, .BtnValidate, .BtnRestore, .BtnYes, .BtnNo, .BtnEdit, .BtnLogin {
    margin: 0 5px 0 0;
    padding: 8px 22px;
    font-size: 12px;
    color: #fff !important;
    border: 0;
    background-color: #e98b3a;
    cursor: pointer;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
    font-weight: 300;
    border: 0.0625rem solid #e98b3a;
    border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    text-decoration: none !important;
}

.BtnAdd:hover, .BtnYes:hover {
}

.BtnDelete:hover, .BtnNo:hover {
    background-color: #8f3f43;
}

.BtnUpdate:hover, .BtnCancel:hover, .BtnSearch:hover, .BtnUpload:hover, .BtnSubmit:hover, .BtnClone:hover, .BtnImport:hover, .BtnArchive:hover, .BtnGo:hover, .BtnContinue:hover, .BtnUpdateQty:hover, .BtnUnlock:hover, .BtnActivate:hover, .BtnResendActivateEmail:hover, .BtnSynch:hover, .BtnPreview:hover, .BtnReportShow:hover, .BtnReportExport:hover, .BtnSchedule:hover, .BtnSend:hover, .BtnSendTest:hover, .BtnSendStop:hover, .BtnClearUnsent:hover, .BtnConfirm:hover, .BtnBack:hover, .BtnSelect:hover, .BtnAssign:hover, .BtnClose:hover, .BtnCheck:hover, .BtnSet:hover, .BtnInvite:hover, .BtnRemind:hover, .BtnClear:hover, .BtnCloseOff:hover, .BtnRecalculate:hover, .BtnValidate:hover, .BtnRestore:hover, .BtnEdit:hover, .BtnLogin:hover {
    background-color: #d87118;
    border: 0.0625rem solid #d87118;
}

.BtnLogin:focus {
    background-color: red;
    border: 0.0625rem solid #d87118;
}

/* Small buttons (short to fit normal line height) */
.BtnSmlAdd, .BtnSmlUpdate, .BtnSmlSearch, .BtnSmlContinue, .BtnSmlSendTest, .BtnSmlReportShow, .BtnSmlSelect, .BtnSmlClear, .BtnSmlAssign, .BtnSmlGo, .BtnSmlYes, .BtnSmlNo {
    margin: 0 5px 0 0;
    padding: 1px 15px 3px 15px;
    border: 0;
    height: 24px;
    font-size: 12px;
    color: #fff;
    background-color: #584b7a;
    cursor: pointer;
    border-radius: 3px;
}

.BtnSmlAdd:hover, .BtnSmlYes:hover {
    background-color: transparent;
}

.BtnSmlNo:hover {
    background-color: #8f3f43;
}

.BtnSmlUpdate:hover, .BtnSmlSearch:hover, .BtnSmlContinue:hover, .BtnSmlSendTest:hover, .BtnSmlReportShow:hover, .BtnSmlSelect:hover, .BtnSmlClear:hover, .BtnSmlAssign:hover, .BtnSmlGo:hover {
    background-color: #3f578f;
    background-image: linear-gradient(0deg, #3F578F, #7086cf 90%);
}

/* custom button for the generic search at the top right of the screen */
.BtnSmlGoSearch {
    margin: 0 0 0 -7px;
    padding: 1px 5px 3px 5px;
    border: 0;
    height: 22px;
    font-size: 12px;
    color: #fff;
    background-color: #584b7a;
    background-image: linear-gradient(0deg, #584b7a, #bab3c9 90%);
    cursor: pointer;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.BtnSmlGoSearch:hover {
    background-color: #3f578f;
    background-image: linear-gradient(0deg, #3F578F, #7086cf 90%);
}

/* The following is being updated.  IVAN please clean this as you adopt / accept the new CSS handling */
.BtnAddNew {
    background-color: transparent;
    margin: 0;
    padding: 0 10px 0 8px;
    font-size: 12px;
    height: 100%;
    border: none;
    cursor: pointer;
    color: #222;
    font-weight: normal;
    float: right;
}

.BtnAddNew:hover {
    background-color: #b9faca;
    background-image: linear-gradient(0deg, #b9faca, #e6fcec 90%);
    text-decoration: none;
    color: #222;
}
/* Make a button that looks like Text that then looks like a button on hover */
.BtnText {
    color: #333;
    font-size: 100%;
    border: 1px solid transparent;
    padding: 5px 10px;
    background-color: transparent;
    cursor: pointer;
    border-radius: 4px;
}

.BtnText:hover, .BtnText:focus {
    border: 1px solid #333;
    background-color: #fff !important;
}

.BtnTextShow {
    border: 1px solid #f00;
    background-color: #fff;
}

/* Form Tables 
===================== */
.FormTable {
    margin-top: 20px;
    margin-bottom: 20px;
    background-color: #fff;
}

.FormTable th {
    font-size: 2rem;
    color: #333;
    font-weight: bold;
    padding: 12px 5px 12px 6px;
    text-align: left;
    border-bottom: 1px solid #eaeaea;
}

.FormTable td {
    font-size: 1rem;
    color: #333;
    padding: 6px 6px 6px 6px;
}

.FormTableHead {
    font-size: 1.5rem;
    color: #333;
    font-weight: bold;
    padding: 7px 5px 5px 15px;
    border: 1px solid #bebebe;
    background-image: url(/assets/images/tile_formheader.jpg);
    background-repeat: repeat-x;
}

.FormCellHeadSub {
    font-size: 1rem;
    color: #000;
    font-weight: bold;
    padding: 3px;
    background-color: #ecf1f7;
    background-image: url(/assets/images/tile_formheader_sub.jpg);
    background-repeat: repeat-x;
}

.FormSectionTop {
    border: 1px solid #888;
    margin-top: 1px;
}

.InstructTextSml {
    font-size: 12px;
    color: #999;
}

.FormRequired {
    font-size: 14px;
    color: #f60;
}

.ErrStdRed {
    font-size: 11px;
    color: #f00;
    vertical-align: top
}

/* A HREF Buttons
===================== */
.ButtonA {
    background-color: #e9e9e9;
    text-align: center;
    padding: 3px 15px 3px 15px;
    margin: 0 6px;
    border-radius: 3px;
}

a.ButtonA:link, a.ButtonA:visited {
    color: #393b4a;
    text-decoration: none;
}

a.ButtonA:hover, a.ButtonA:active {
    color: #7a7a7a;
    background-color: #d7d7d7;
    text-decoration: none;
}

.ButtonALge {
    background-color: #ff9c2b;
    text-align: center;
    padding: 4px 20px 4px 20px;
    margin: 0 6px;
    border-radius: 4px;
    font-size: 16px;
}

a.ButtonALge:link, a.ButtonALge:visited {
    color: #393b4a;
    text-decoration: none;
}

a.ButtonALge:hover, a.ButtonALge:active {
    color: #7a7a7a;
    background-color: #d7d7d7;
    text-decoration: none;
}

/* Image Buttons
===================== */
/* EVENT */
/* IC: these were created/scheduled for conversion while ago, and finally put to use now. I got them updated with correct sizes and new path (/cpd/) */
.ImgBtnEventAdd {
    width: 165px;
    height: 42px;
    background: url(/assets/images/cpd/button_add_event.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnEventRemove {
    width: 165px;
    height: 42px;
    background: url(/assets/images/cpd/button_remove_event.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnEventFind {
    width: 67px;
    height: 33px;
    background: url(/assets/images/cpd/button_find_events.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnReportFind {
    width: 133px;
    height: 33px;
    background: url(/assets/images/cpd/button_find_report.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnEventBook {
    width: 119px;
    height: 37px;
    background: url(/assets/images/button_booknow.gif) no-repeat 0px 0px;
    margin: 10px 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnEventBook:hover {
    opacity: .8;
}

.ImgBtnEventBookLge {
    width: 174px;
    height: 60px;
    background: url(/assets/images/button_booknow_lge.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnEventBookLge:hover {
    opacity: .8;
}

/* EVENT MULTIPLE LOCATIONS */
.EventGridTable {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 30px;
    background-color: #f6f7f5;
}

.EventGridTable th {
    background-color: #666;
    color: #fff;
    font-size: 12px;
    padding: 6px 5px;
}

.EventGridTable td {
    color: #000;
    font-size: 11px;
    padding: 3px;
    border-bottom: 1px solid #cfcfcf;
}

/* RUGBY SEARCH */
.ImgBtnSearchGo {
    width: 33px;
    height: 35px;
    background: url(/assets/images/button_search_go.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnSearchGoLarge {
    width: 36px;
    height: 28px;
    background: url(/assets/images/button_go_lge.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

/* FEEDBACK BUTTONS */
.ImgBtnFeedbackSubmit {
    width: 186px;
    height: 38px;
    background: url(/assets/images/button_submit_feedback.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnFeedbackIconPlus {
    width: 24px;
    height: 24px;
    background: url(/assets/images/icon_plus_feedback.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnFeedbackIconPicture {
    width: 24px;
    height: 24px;
    background: url(/assets/images/icon_picture_feedback.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

/* SHOPPING BASKET */
.ImgBtnBacketQtyUpdate {
    width: 196px;
    height: 22px;
    background: url(/assets/images/button_update_qty.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnBasketBrowse {
    width: 33px;
    height: 25px;
    background: url(/assets/images/button_browse.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

/* MISC BUTTONS */
.ImgBtnSubmit {
    width: 101px;
    height: 29px;
    background: url(/assets/images/button_submit.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnSubmit:hover {
    opacity: .8;
}

.ImgButtonCloseBox {
    width: 101px;
    height: 31px;
    background: url(/assets/images/button_closebox.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnFind {
    width: 66px;
    height: 24px;
    background: url(/assets/images/button_find.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnForumSearch {
    width: 66px;
    height: 24px;
    background: url(/assets/images/button_search_forum.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnTop {
    width: 141px;
    height: 31px;
    background: url(/assets/images/button_top.gif)no-repeat 0px 0px;
    margin: 20px 0 0 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    font-size: 13px;
}

.ImgBtnTop a:link, .ImgBtnTop a:visited {
    text-decoration: none;
    color: #fff;
    display: block;
    width: 141px;
    height: 31px;
    margin: 0;
    padding-top: 7px;
}

.ImgBtnTop a:hover, .ImgBtnTop a:active {
    background: url(/assets/images/button_top_on.gif) no-repeat 0px 0px;
}

/* IC: these are new classes, out of full ImageButton conversion */
.ImgBtnCPDPdfDownload {
    width: 132px;
    height: 25px;
    background: url(/assets/images/icon_download_report_pdf.png) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnCPDAddNew {
    width: 48px;
    height: 18px;
    background: url(/assets/images/CPD/button_addnew.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

.ImgBtnLoginFeature {
    width: 101px;
    height: 29px;
    background: url(/assets/images/button_login.gif) no-repeat 0px 0px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    display: inline-block;
}

/* ======================================================================================== */
/* ======================================================================================== */
/* Navigation */
/* ======================================================================================== */
/* ======================================================================================== */

/* Responsive Menu
===================== */
/* main menu bar */
#nav {
    margin: 0 auto;
    width: 96%;
    z-index: 2000;
    height: 58px;
    position: relative;
}
/* Use 'transform' to set a new container reference for nested elements with 'position:fixed' */
/* #nav {-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);}  */
#nav > a {
    display: none;
}

/* Generic */
#nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#nav li {
    text-align: left;
}

#nav li a {
    color: #a6a6a7;
    display: block;
    text-decoration: none;
    line-height: 1.0em;
    padding: 1.0em 0.3em 1.0em 0.8em;
}

/* First level */
#nav > ul {
    height: 58px;
}

#nav > ul > li:first-of-type {
    visibility: hidden;
    width: 0;
}
/* Hide the HOME button */
#nav > ul > li {
    display: inline-block;
    height: 100%;
    float: left;
    border: 0;
}

#nav > ul > li > a {
    font-size: 16px;
    line-height: 3.5em;
    font-weight: 300;
    padding: 0 1.5em 0 0.8em;
    cursor: context-menu;
}

#nav > ul > li > a > span:after {
    content: "\25BC";
    color: #a6a6a7;
    position: relative;
    right: -10px;
    font-size: 0.7em;
}
/*  ? = &#9660; = \25BC  || For special chars, convert entity code to CSS hex here: http://www.evotech.net/articles/testjsentities.html */
#nav > ul > li.active > a, #nav > ul > li.active > a > span::after {
    color: #fff;
}

#nav > ul > li:hover > a, #nav > ul > li:hover > a > span::after {
    color: #fff;
}


/* Second level  */
#nav > ul > li > ul {
    text-align: center;
    visibility: hidden;
    background-color: #fcf8f5;
    width: 100%;
    left: 0;
    right: 0;
    box-shadow: 0 0 15px #999;
    padding: 0;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    background-color: #fefefe;
    position: absolute;
    top: 100%;
    overflow: hidden;
    max-height: 0;
    opacity: 0.0;
    transition: padding 0.0s, max-height 1.0s, opacity 0.3s;
    -webkit-transition: padding 0.0s, max-height 1.0s, opacity 0.3s;
}

#nav > ul > li > ul > li {
    display: inline-block;
    vertical-align: top;
    position: relative;
    font-weight: bold;
    width: 200px;
    margin-top: 10px;
    margin-bottom: 30px;
}

#nav > ul > li > ul > li:first-of-type {
    margin-left: 10px;
}

#nav > ul > li > ul > li:first-of-type {
    margin-right: 10px;
}

#nav > ul > li > ul > li > a {
    color: #5e5e5e;
    border: 1px solid transparent;
    border-radius: 5px;
    font-size: 16px;
}

#nav > ul > li > ul > li > a::before {
    font-size: 0.8em;
    font-weight: bold;
    color: transparent;
    vertical-align: top;
    margin: 0 5px;
    content: ".";
    position: absolute;
    left: 2px;
    border-left: 1px solid #bbb;
}

#nav > ul > li > ul > li > a:hover {
    color: #222;
    border: 1px solid #999;
    background-color: #fefefe;
}

#nav > ul > li:hover > ul {
    visibility: visible;
    max-height: 800px;
    opacity: 1;
    overflow: visible;
    border: 1px solid #777;
    border-top: 0;
}

/* Third level */
#nav > ul > li > ul > li > ul > li {
    font-weight: 400;
    padding: 0 0 0 10px;
    border: 1px solid transparent;
    border-radius: 5px;
}

#nav > ul > li > ul > li > ul > li:hover {
    border: 1px solid #999;
    background-color: #fefefe;
}

#nav > ul > li > ul > li > ul > li > a {
    color: #5e5e5e;
    height: 100%;
    font-size: 14px;
    line-height: 1.2em;
    font-weight: 400;
    padding: 0.7em 1.5em 0.7em 0.3em;
}

#nav > ul > li > ul > li > ul > li > a:hover {
    color: #222;
}



/* Second level - Vertical 
===================== */
#navSub, #navSub ul {
    list-style: none;
    line-height: 14px;
    padding: 0;
    margin: 0;
    font-size: 14px;
}

#navSub .sel {
    background-color: #fff1e5;
    color: #555;
}

#navSub a {
    display: block;
    color: #555;
    text-decoration: none;
}

#navSub li {
    margin: 0px;
    padding: 0px;
    list-style: none;
    border-bottom: 1px solid #ddd;
}

#navSub li:first-child { /*border-top:none;*/
    border-top-left-radius: 0.25rem !important;
    border-top-right-radius: 0.25rem !important;
    overflow: auto;
}

#navSub li:last-child {
    border-bottom: none;
    border-bottom-left-radius: 0.25rem !important;
    border-bottom-right-radius: 0.25rem !important;
    overflow: auto;
}

#navSub li a {
    padding: 12px 20px 10px 20px;
}

#navSub > li a.plus:after {
    content: "+";
    padding: 1px 4px 1px 3px;
    border: solid 1px #aaa;
    border-radius: 3px;
    color: #999;
    float: right;
}

#navSub > li a.minus:after {
    content: "-" !important;
    padding: 1px 6px 1px 5px;
    border: solid 1px #aaa;
    border-radius: 3px;
    color: #999;
    float: right;
}

#navSub li ul {
    border: 0;
}

#navSub li li .sel {
    background-color: #fff1e5;
    color: #4e4e50;
}

#navSub li li {
    margin: 0px;
    padding: 0px;
}
/* #navSub li li a				{padding:20px 10px 20px 50px; color:#939598;} */
#navSub li li a {
    padding: 10px 10px 8px 30px;
    color: #939598;
}

#navSub li li:first-child { /*border-top:none;*/
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    overflow: auto;
    border-top: 1px solid #ddd;
}

#navSub li li:last-child {
    border-bottom: none;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: auto;
}

#navSub a:hover {
    background-color: #f5f5f5;
    color: #555;
}

/* Second level - Horizontal 
===================== */
.navSubH {
    font-size: 10px;
    color: #5d6786;
    line-height: 14px;
}

.navSubH a:link {
    color: #5d6786;
    text-decoration: none;
}

.navSubH a:visited {
    color: #666;
    text-decoration: none;
}

.navSubH a:active, .navSubH a:hover {
    color: #f60;
    text-decoration: underline;
}

/* Breadcrumbs 
===================== */
.MenuBCrumb {
    font-size: 10px;
    color: #333;
    font-weight: bold;
}

.MenuBCrumb a:link, .menuBCrumb a:visited {
    color: #666;
    text-decoration: none;
}

.MenuBCrumb a:active, .menuBCrumb a:hover {
    color: #a60e0e;
    text-decoration: underline;
}

/* Bottom
===================== */
.MenuBotL1 {
    font-size: 10px;
    color: #fff;
    line-height: 14px;
}

.MenuBotL1 a:link {
    color: #a6a6a7;
    text-decoration: none;
}

.MenuBotL1 a:visited {
    color: #a6a6a7;
    text-decoration: none;
}

.MenuBotL1 a:active, .MenuBotL1 a:hover {
    color: #f60;
    text-decoration: underline;
}

.MenuBotL1 span {
    padding: 0 5px 0 5px;
}


.MenuBotL2 {
    font-size: 9px;
    color: #fff;
    line-height: 14px;
    margin-top: 10px;
}

.MenuBotL2 a:link {
    color: #a6a6a7;
    text-decoration: none;
}

.MenuBotL2 a:visited {
    color: #a6a6a7;
    text-decoration: none;
}

.MenuBotL2 a:active, .MenuBotL2 a:hover {
    color: #f60;
    text-decoration: underline;
}

.MenuBotL2 span {
    padding: 0 5px 0 5px;
}


/* Callout Panel
===================== */
.CalloutIcon {
    display: inline-block;
    position: relative;
}

.CalloutIcon > i:hover {
    cursor: pointer;
}

.CalloutIcon:hover .Callout {
    visibility: visible;
    opacity: 1.0;
}

.Callout {
    position: absolute;
    left: 100%;
    transform: perspective(1px) translateY(-1.5rem);
    margin: -10px 0 0 20px;
    background: #fff;
    padding: 0;
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: 0.3rem;
    width: 275px;
    z-index: 2000;
    box-shadow: 0 5px 10px rgba(0,0,0,0.2);
    visibility: hidden;
    opacity: 0;
    transition: visibility 1s, opacity 1s;
}

.Callout::after, .Callout::before {
    right: 100%;
    top: 1.5rem;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.Callout::after {
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #f7f7f7;
    border-width: 8px;
    margin-top: -8px;
}

.Callout::before {
    border-color: 1px solid rgba(255, 255, 255,0);
    border-right-color: rgba(0,0,0,0.2);
    border-width: 9px;
    margin-top: -9px;
}

.Callout > div:first-of-type {
    background-color: #f7f7f7;
    padding: 8px 14px;
    line-height: 1.5rem;
    font-weight: 300 !important;
    color: #919191;
    font-size: 1.0rem;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
    border-bottom: 1px solid #ebebeb;
}

.Callout > div:last-of-type {
    background-color: #ffffff;
    padding: 9px 14px;
    line-height: 1.5rem;
    font-weight: 400;
    font-size: 0.95rem;
    border-bottom-left-radius: 0.3rem;
    border-bottom-right-radius: 0.3rem;
}


/* ======================================================================================== */
/* ======================================================================================== */
/* Modules - Shared */
/* ======================================================================================== */
/* ======================================================================================== */

/* Home Feature Controls
===================== */
.NewsHomeFeatureHead {
    padding: 5px;
    background-color: #ccc;
}
/* usercontrol\front\homepage\News.ascx */
.EventsHomeFeatureHead {
    padding: 5px;
    background-color: #ccc;
}
/* usercontrol\front\homepage\Events.ascx */
.CaseStudyFeatureHead {
    padding: 5px;
    background-color: #ccc;
}
/* usercontrol\front\homepage\CaseStudy.ascx */
.FriendsPanel {
    padding: 2px;
}

.FriendsPanelHeader {
    padding: 3px 5px;
    background-color: #e6e6e6;
    font-size: 11px;
}

/* Homepage Hero */
.HeroPosition {
    margin: 40px auto;
    width: 94%;
}

/* Homapage Hero CIL */

/*!
 *  Font Awesome 4.4.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
@font-face {
    font-family: 'FontAwesome';
    src: url("/assets/fonts/fontawesome-webfont.eot?v=4.4.0");
    src: url("/assets/fonts/fontawesome-webfont.eot?#iefix&v=4.4.0") format("embedded-opentype"),url("/assets/fonts/fontawesome-webfont.woff2?v=4.4.0") format("woff2"),url("/assets/fonts/fontawesome-webfont.woff?v=4.4.0") format("woff"),url("/assets/fonts/fontawesome-webfont.ttf?v=4.4.0") format("truetype"),url("/assets/fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular") format("svg");
    font-weight: normal;
    font-style: normal
}

.HomepageHeroCIL_Citation_Outer {
    max-width: 100%;
}

.HomepageHeroCIL_Citation {
    position: absolute;
    right: 20px;
    bottom: 20px;
    background-color: #576F83;
    color: #fff;
    padding: 5px 10px;
    line-height: 1.4;
    opacity: 0.6;
}

.HomepageHeroCIL_Citation i {
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 1em;
}

.HomepageHeroCIL_Citation i::before {
    content: "\F05A";
}

.HomepageHeroCIL_Citation span {
    font-family: "Open Sans",sans-serif;
    font-size: 1rem;
    font-style: italic;
    color: #fff;
    text-decoration: none;
}

.HomepageHeroCIL_Citation a {
    font-family: "Open Sans",sans-serif;
    font-size: 1rem;
    font-style: italic;
    color: #fff;
    text-decoration: none;
}

.HomepageHeroCIL_Citation a:hover {
    text-decoration: underline !important;
}

/* Home - MS Libraries */
.MSLibrariesHome {
    background-image: url(/assets/images/section_libraries_home.jpg);
    min-height: 400px;
    margin-top: 0;
    background-repeat: no-repeat;
    background-size: cover; /*contain;*/ /*background-position:50% 50%;*/
    overflow: hidden; /*background-attachment:fixed;*/
    padding: 38px 5px 60px 5px;
}

.MSLibrariesHome h2 {
    margin-bottom: 30px;
}

/* Home - Features & Benefits */
.HomeFeaturesBenefits {
    padding: 50px 0;
    background: url(/assets/images/tile_home_features_benefits.jpg) bottom center repeat-x;
    background-size: contain;
}

.HomeFeaturesBenefits h2 {
    line-height: normal;
}

.HomeFeaturesBenefits ul {
    margin: 25px 0;
}

.HomeFeaturesBenefits li {
    margin: 14px 0;
    font-weight: 300;
    font-size: 16px;
    line-height: 20px;
}

/* Jims Tabs Demo */
.TabbedPanel {
    width: 100%;
    background-color: #fff;
    padding: 10px 0;
}

.TabbedPanelInner {
    margin: 40px;
}

.TabbedText {
    width: 90%;
    margin: 0 auto;
}

/* Product Listings 
===================== */
/*** THIS BLOCK OF CSS NEEDS TO BE FULLY REWORKED - IT WAS COPIED WITHOUT THOUGHT IS IS WAY, WAY, WAY OVER COMPLICATED FOR WHAT IT DOES ***/
.TableHeadProductList {
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    background-color: #666;
    padding: 3px 3px 3px 6px;
    text-align: left;
}

#ProductList, #ProductList ul, .ProductList, .ProductList ul {
    list-style: none;
    line-height: 14px;
    padding: 0;
    margin: 0;
    background-color: #e5e5e5;
}

#ProductList .sel, .ProductList .sel {
    background-color: #fff;
    background-image: url(/assets/images/arrow_prod_toplevel_on.gif);
}

#ProductList a, .ProductList a {
    font-weight: normal;
    display: block;
    text-decoration: none;
    color: #000;
}

#ProductList li, .ProductList li {
    margin: 0;
    padding: 0;
    background: url(/assets/images/arrow_prod_toplevel.gif) 3px 6px no-repeat;
    list-style: none;
    border-bottom: 1px solid #f7f7f7;
}

#ProductList li a, .ProductList li a {
    width: 146px;
    width: 126px;
    padding: 4px 5px 3px 15px;
    background: url(/assets/images/arrow_prod_toplevel.gif) 3px 6px no-repeat;
    color: #878c9c;
}

#ProductList li ul, .ProductList li ul {
    border-width: 0;
}

#ProductList li li .sel, .ProductList li li .sel {
    background-color: #fff;
    color: #c00;
    background-image: url(/assets/images/arrow_prod_level2_on.gif);
}

#ProductList li li, .ProductList li li {
    margin: 0;
    padding: 0;
    background: url(/assets/images/arrow_prod_level2.gif) 10px 6px no-repeat;
    background-color: #f7f7f7;
    border-bottom: 1px solid #fff;
}

#ProductList li li a:hover, .ProductList li li a:hover {
    color: #c00;
    background-image: url(/assets/images/arrow_prod_level2_on.gif);
}

#ProductList li li a, .ProductList li li a {
    width: 146px;
    width: 116px;
    padding: 4px 5px 3px 25px;
    background: url(/assets/images/arrow_prod_level2.gif) 10px 6px no-repeat;
}

#ProductList a:hover, .ProductList a:hover {
    color: #c00;
    background-image: url(/assets/images/arrow_prod_toplevel_on.gif);
}

.ProductVariationTable {
    width: 100%;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    background-color: #fff;
}

.ProductVariationTable th {
    padding: 3px 2px;
    font-size: 11px;
    background-color: #fafafa;
}

.ProductVariationTable td {
    padding: 3px 2px;
    font-size: 11px;
}

/* Image Album 
===================== */
.AlbumImagePopup {
    background-color: #fff;
    border-collapse: collapse;
    margin: 0px;
    padding: 0px;
    width: 955px;
}

.AlbumImagePopupCellHeader {
    vertical-align: top;
    font-size: 12px;
    height: 40px;
    background-image: url(/assets/images/tile_stripe.jpg);
    background-repeat: repeat-x;
    color: #fff;
    font-weight: bold;
}

.AlbumImagePopupCellImage {
    vertical-align: middle;
    text-align: center;
    padding: 0px 5px 5px 5px;
    width: 740px;
}

.AlbumImagePopupCellThumbs {
    vertical-align: top;
    text-align: left;
    width: 225px;
}

.AlbumImageScrollerMainImage {
    width: 100%;
    text-align: left;
    padding: 10px;
}

.AlbumImageScrollerThumbnails {
    width: 100%;
}

.AlbumImageLargeImage {
    width: 700px;
    height: 100%;
}

.AlbumImageThumbnailImageBorder {
    margin: 0px 5px 5px 0px;
    width: 90px;
    height: 90px;
}

.AlbumImageThumbnailImageBorder td {
    border: 1px solid #ccc;
}

.AlbumImageThumbnailImageBorder td:hover, .AlbumImageThumbnailImageBorder .AlbumImageThumbnailSelected {
    border: 2px solid #f60;
}

.AlbumImageThumbnailImageBorder img {
    padding-top: 3px;
    margin-left: auto;
    margin-right: auto;
}

.AlbumImageFileDescriptionBox {
    display: none;
    position: absolute;
    margin: 0px;
    padding: 0px;
    float: left;
    border: 1px solid #ccc;
    background-color: #ddd;
    text-align: left;
    width: 400px;
}

.AlbumImageFileDescriptionBox p {
    padding: 5px;
    margin: 0px;
}

/* Image Rotator 
===================== */
.RotatorImageList {
    margin-left: auto;
    margin-right: auto;
}

.AlbumImageRotatorImageBorder {
    margin: 0px 5px 5px 0px;
    width: 90px;
    height: 78px;
}

.AlbumImageRotatorImageBorder td {
    border: 1px solid #ccc;
}

.AlbumImageRotatorImageBorder td:hover {
    border: 2px solid #f60;
}

.AlbumImageRotatorImageBorder img {
    padding-top: 3px;
}

.RadRotator li {
    list-style: none;
}

/* Comments 
===================== */
.CommentHeader {
    border-bottom: 3px solid #666;
    color: #000;
    font-weight: bold;
    padding: 6px 0;
}

.CommentAvatar, .CommentAvatarAlt {
    border-bottom: 1px solid #808080;
    padding: 5px;
}

.CommentText, .CommentTextAlt {
    background-color: #fff;
    border-bottom: 1px solid #808080;
    color: #000;
    font-size: 12px;
    padding: 10px 5px 8px;
}

.CommentItemNumber {
    color: #333;
    font-size: 12px;
}

.CommentTextUserName {
    color: #333;
    font-size: 12px;
    font-weight: bold;
}

.CommentTextDate {
    color: #999;
    font-size: 11px;
}

.CommentTextTime {
    color: #666;
    font-size: 11px;
}

/* Ratings 
===================== */
.filledRatingStar {
    background-image: url(/assets/images/FilledStar.png);
}

.ratingStar {
    background-repeat: no-repeat;
    cursor: pointer;
    display: block;
    font-size: 0;
    height: 12px;
    margin: 0;
    padding: 0;
    width: 13px;
}

.emptyRatingStar {
    background-image: url(/assets/images/EmptyStar.png);
}

.savedRatingStar {
    background-image: url(/assets/images/SavedStar.png);
}

/* Feedback 
===================== */
.FeedbackTable {
    width: 850px;
}

.feedbackPosition {
    position: fixed;
    bottom: 40px;
    right: 0px;
}

/* Shop - Shared 
===================== */

/* PRODUCT GRID LAYOUT*/

/* Product Category Layout */

.ProductPanel {
    width: 31%;
    min-width: 180px;
    min-height: 260px;
    float: left;
    margin-left: 0;
    margin-bottom: 14px;
    margin-right: 2%; /* border:1px solid #e1e1e1;*/
    box-shadow: 0 0 2px 2px #e1e1e1;
}

.ProductPanel:hover {
    opacity: 0.9;
    background-color: #fafafa;
}

.ProductPanelInfo {
    width: 88%;
    margin: 10px auto;
    text-align: center;
}

.ProductPanelInfo h2 {
    font-size: 14px !important;
    color: #36C;
}

.ProductPanelInfo p {
    font-size: 10px !important;
    color: #333;
    line-height: 12px !important;
}

.ProductPanelInfo a:link, .ProductPanelInfo a:visited {
    text-decoration: none;
    color: #c30 !important;
}

.ProductPanelInfo a:hover, .ProductPanelInfo a:active {
    text-decoration: underline;
}

.ProductPanelInfo img {
    margin: 5px auto;
}



/* Product Listings Layout */

/* Product Detail Layout */


/* Animation 
===================== */

/* Login Dashboard - usercontrol\front\customer\cust_login_dashboard.ascx
===================== */
.LoginField {
    padding: 3px;
    width: 120px;
    background-color: #f4f4f4;
    border: 2px solid #069;
}

.ProfileBoxTable {
    width: 160px;
    border: 0;
    color: #666;
    font-size: 11px;
}

.ProfileInnerTable {
    width: 130px;
    margin-left: auto;
    margin-right: auto;
    border: 0;
}

.ProfileBoxTile {
    background-image: url(/assets/images/profile_box_tile.gif);
    background-repeat: repeat-y;
    background-color: #fff;
    padding-left: 4px;
    padding-right: 3px;
}

.ProfileCountColumn {
    color: #666;
    font-size: 10px;
    text-align: right;
    padding-right: 3px;
}

.ProfileIcon {
    padding: 4px 8px 4px 8px;
    text-align: center;
}

.LoginPanelProfile {
    z-index: 1000;
    position: absolute;
    right: 10px;
    top: 35px;
    background-color: #fff;
    width: 250px;
}

.LoginPanelProfile a:link, .LoginPanelProfile a:visited {
    color: #69646c;
}

.LoginPanelProfile a:hover, .LoginPanelProfile a:active {
    color: #ff8c0a;
}

.LoginPanelProfileHeader {
    color: #fff;
    background-color: #384f7b;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: bold;
}

.LoginPanelProfileSelect {
    font-size: 12px;
    padding: 3px 10px;
}

.LoginPanelCancel {
    background-color: #ccc;
    font-size: 11px;
    text-align: center;
    padding: 2px 8px;
    margin: 0 10px 6px 0;
}

a.LoginPanelCancel:link, a.LoginPanelCancel:visited {
    text-decoration: none;
}

a.LoginPanelCancel:hover, a.LoginPanelCancel:active {
    color: #fff;
    background-color: #06c;
}


/* Dashboard */
.DashboardProfileBox {
    width: 95%;
    margin: 20px 0 20px 0;
    border: 1px solid #d9d9d9;
    background-color: #fff;
}

.DashboardProfileBox h2 {
    margin: 0;
}

.DashboardAvatar img { /*-webkit-box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1); -moz-box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1); box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1);*/
    border: 1px solid #e1e1e1;
    margin: 8px;
}

.DashboardProfileName {
    font-size: 22px;
    font-weight: bold;
}

/* CRM Chat
===================== */
.CRMChatPanel {
    margin-top: 20px;
    padding-bottom: 10px;
}

.CRMChatBorder {
    border: 1px solid #ddd;
}

.CRMChat_Item {
    clear: both;
    padding: 8px;
}

.CRMChat_Right {
    Width: 600px;
    border-radius: 8px;
    float: right;
    border: 1px solid #aaa;
    background-color: #d4f7d2;
    padding: 3px 6px;
}

.CRMChat_Left {
    Width: 600px;
    border-radius: 8px;
    float: left;
    border: 1px solid #aaa;
    background-color: #f4f4f4;
    padding: 3px 6px;
}

.CRMChat_FileNote {
    Width: 600px;
    border-radius: 8px;
    float: left;
    border: 1px solid #aaa;
    background-color: #ffea00;
    padding: 3px 6px;
}

.CRMComm_Left_NotRead {
    width: 32px;
    height: 32px;
    float: left;
}

.CRMComm_Right_NotRead {
    width: 32px;
    height: 32px;
    float: right;
}

.CRMChat_ItemDateTime {
    text-align: right;
    color: #999;
    font-size: 10px;
}

.ChatBoxPanel {
    Width: 750px;
}

.ChatBoxPanelInput {
    border: 1px solid #999;
    background-color: #f9faeb;
    padding: 2px;
}

.ChatBox {
}

.ChatBoxButton {
    float: right;
}

.CRMChat_AttachedFile {
    Margin-top: 5px;
}

/* ======================================================================================== */
/* ======================================================================================== */
/* Static */
/* ======================================================================================== */
/* ======================================================================================== */
.ShrinkWrap {
    display: block;
}

.ShrinkWrapInline {
    display: inline-block;
}

.nobr {
    display: inline;
    white-space: nowrap;
    font-size: 14px;
}

.BackgroundWhite {
    background-color: #fff;
}

.BackgroundGrey {
    background-color: #ccc;
}

.FloatLeft {
    float: left;
}

.FloatRight {
    float: right;
    overflow: hidden;
}

.OverflowHidden {
    overflow: hidden;
}

.AlignLeft {
    text-align: left;
}

.AlignRight {
    text-align: right;
}

.AlignCenter {
    text-align: center;
}

.AlignTop {
    vertical-align: top;
}

.AlignBottom {
    vertical-align: bottom;
}

.AlignMiddle {
    vertical-align: middle;
}

.AlignCenterImage {
    margin-left: auto;
    margin-right: auto;
}

.AlignCenterObject {
    margin-left: auto;
    margin-right: auto;
}

.AlignLeftImage {
    float: left;
    margin: 20px 20px 0 20px;
}

.AlignRightImage {
    float: right;
    margin: 20px 10px 20px 20px
}

.AlignVertMiddle {
    vertical-align: middle;
}

.Padding2 {
    padding: 2px;
}

.Padding3 {
    padding: 3px;
}

.Padding4 {
    padding: 4px;
}

.Padding5 {
    padding: 5px;
}

.Padding10 {
    padding: 10px;
}

.Padding20 {
    padding: 20px;
}

.Padding25 {
    padding: 25px;
}

.Padding30 {
    padding: 30px;
}

.PaddingBottom6 {
    padding-bottom: 6px;
}

.PaddingBottom10 {
    padding-bottom: 10px;
}

.PaddingBottom20 {
    padding-bottom: 20px;
}

.PaddingTop5 {
    padding-top: 5px;
}

.PaddingTop6 {
    padding-top: 6px;
}

.PaddingTop8 {
    padding-top: 8px;
}

.PaddingTop10 {
    padding-top: 10px;
}

.PaddingTop20 {
    padding-top: 20px;
}

.PaddingTop25 {
    padding-top: 25px;
}

.PaddingTop30 {
    padding-top: 30px;
}

.PaddingTopBot2 {
    padding: 2px 0;
}

.PaddingRight2 {
    padding-right: 2px
}

.PaddingRight3 {
    padding-right: 3px
}

.PaddingRight5 {
    padding-right: 5px
}

.PaddingRight10 {
    padding-right: 10px
}

.PaddingRight15 {
    padding-right: 15px
}

.PaddingRight25 {
    padding-right: 25px
}

.PaddingLeft5 {
    padding-left: 5px;
}

.PaddingLeft10 {
    padding-left: 10px;
}

.PaddingLeft20 {
    padding-left: 20px;
}

.PaddingLeft25 {
    padding-left: 25px;
}

.PaddingLeft50 {
    padding-left: 50px;
}

.PaddingLeft100 {
    padding-left: 100px;
}

.MarginAuto {
    margin: auto;
}

.Margin5 {
    margin: 5px;
}

.Margin10 {
    margin: 10px;
}

.Margin20 {
    margin: 20px;
}

.MarginSides30 {
    margin: 0 30px;
}

.MarginTop3 {
    margin-top: 3px;
}

.MarginTop5 {
    margin-top: 5px;
}

.MarginTop10 {
    margin-top: 10px;
}

.MarginTop20 {
    margin-top: 20px;
}

.MarginTop30 {
    margin-top: 30px;
}

.MarginTop40 {
    margin-top: 40px;
}

.MarginTopBot2 {
    margin-top: 2px;
    margin-bottom: 2px;
}

.MarginLeft5 {
    margin-left: 5px;
}

.MarginLeft7 {
    margin-left: 7px;
}

.MarginLeft10 {
    margin-left: 10px;
}

.MarginLeft12 {
    margin-left: 12px;
}

.MarginLeft20 {
    margin-left: 20px;
}

.MarginLeft40 {
    margin-left: 40px;
}

.MarginLeft50 {
    margin-left: 50px;
}

.MarginLeft60 {
    margin-left: 60px;
}

.MarginLeft80 {
    margin-left: 80px;
}

.MarginLeft100 {
    margin-left: 100px;
}

.MarginBottom2 {
    margin-bottom: 2px;
}

.MarginBottom3 {
    margin-bottom: 3px;
}

.MarginBottom5 {
    margin-bottom: 5px;
}

.MarginBottom7 {
    margin-bottom: 7px;
}

.MarginBottom15 {
    margin-bottom: 15px;
}

.MarginBottom20 {
    margin-bottom: 20px;
}

.MarginBottom100 {
    margin-bottom: 100px;
}

.MarginRight5 {
    margin-right: 5px;
}

.MarginRight6 {
    margin-right: 6px;
}

.MarginRight20 {
    margin-right: 20px;
}

.Border1Purple {
    border: 1px solid #e9dcf2;
}

.Border1Grey {
    border: 1px solid #ccc;
}

.Border3White {
    border: 3px solid #fff;
}

.BorderRightGrey {
    border-right: 1px solid #ccc;
}

.BorderLeftGrey {
    border-left: 1px solid #ccc;
}

.BorderTopGrey {
    border-top: 1px solid #ccc;
}

.BorderBottomGrey {
    border-bottom: 1px solid #ccc;
}

.BorderTop {
    border-top: 3px solid #bbe7c8;
}

.DividerLine {
    margin: 10px 0;
    background-color: #ccc;
    height: 4px;
}

.Border3Grey {
    border: 3px solid #e2dbe6;
}

.Border1Black {
    border: 1px solid #000;
}

.BackgroundHighlight {
    background-color: #fafafa;
}

/* % WIDTH SETTINGS
===================== */
.Width1 {
    width: 1%;
}

.Width2 {
    width: 2%;
}

.Width3 {
    width: 3%;
}

.Width4 {
    width: 4%;
}

.Width5 {
    width: 5%;
}

.Width6 {
    width: 6%;
}

.Width7 {
    width: 7%;
}

.Width8 {
    width: 8%;
}

.Width9 {
    width: 9%;
}

.Width10 {
    width: 10%;
}

.Width12 {
    width: 12%;
}

.Width15 {
    width: 15%;
}

.Width17 {
    width: 17%;
}

.Width19 {
    width: 19%;
}

.Width20 {
    width: 20%;
}

.Width25 {
    width: 25%;
}

.Width30 {
    width: 30%;
}

.Width33 {
    width: 33%;
}

.Width34 {
    width: 34%;
}

.Width35 {
    width: 35%;
}

.Width38 {
    width: 38%;
}

.Width40 {
    width: 40%;
}

.Width45 {
    width: 45%;
}

.Width50 {
    width: 50%;
}

.Width55 {
    width: 55%;
}

.Width60 {
    width: 60%;
}

.Width65 {
    width: 65%;
}

.Width70 {
    width: 70%;
}

.Width75 {
    width: 75%;
}

.Width80 {
    width: 80%;
}

.Width85 {
    width: 85%;
}

.Width90 {
    width: 90%;
}

.Width93 {
    width: 93%;
}

.Width95 {
    width: 95%;
}

.Width96 {
    width: 96%;
}

.Width97 {
    width: 97%;
}

.Width98 {
    width: 98%;
}

.Width99 {
    width: 99%;
}

.Width100 {
    width: 100%;
}

/* Responsive widths that expand in narrow view */
.Width10Flex {
    width: 10%;
}

.Width40Flex {
    width: 40%;
}


/* IMAGE SIZES
===================== */
.ImageBasic {
    border: 0px;
}

.ImageBorderWhite1 {
    border: 1px solid #fff;
}

.ImageBorderWhite2 {
    border: 2px solid #fff;
}

.ImageBorderWhite3 {
    border: 3px solid #fff;
}

.ImageBorderWhite10 {
    border: 10px solid #fff;
}

.ImageBorderGrey1 {
    border: 1px solid #ccc;
}

.BorderTop1 {
    border-top: 1px solid #ccc;
}

.ProductImage {
    margin: 5px auto !important;
}

/* Used for square images */
.Image16 {
    width: 16px;
    height: 16px;
}

.Image18 {
    width: 18px;
    height: 18px;
}

.Image24 {
    width: 24px;
    height: 24px;
}

.Image32 {
    width: 32px;
    height: 32px;
}

.Image40 {
    width: 40px;
    height: 40px;
}

.Image48 {
    width: 48px;
    height: 48px;
}

.Image72 {
    width: 72px;
    height: 72px;
}

.Image128 {
    width: 128px;
    height: 128px;
}

.Image256 {
    width: 256px;
    height: 256px;
}

/* COLORS
===================== */
.Red {
    color: #f00;
}

.Green {
    color: #093;
}

.Black {
    color: #000;
}

.White {
    color: #fff;
}

.Orange {
    color: #f60;
}

.SteelBlue {
    color: #959fa7;
}

/* ======================================================================================== */
/* ======================================================================================== */
/* Responsive Layouts */
/* ======================================================================================== */
/* ======================================================================================== */

/* For Help with the responsive grid system, follow the link below */
/* http://www.responsivegridsystem.com */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* Custom */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* Apply this style directly within an 'img' tag to create images that automatically resize as the parent space shrinks */
.responsive-image img {
    height: auto !important;
    max-width: 100% !important;
    width: 100% !important;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* Column system  */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/*  GRID COLUMN SETUP   ==================================================================== */
.col {
    display: block;
    float: left;
    margin: 1% 0 1% 1.6%;
}

.col:first-child {
    margin-left: 0;
}

.colMargin_0 {
    display: block;
    float: left;
    margin: 0;
}
/* Tight Columns */
.colMargin_0:first-child {
    margin-left: 0;
}

/*  GRID OF TWO   ============================================================================= */
.span_2_of_2 {
    width: 100%;
}

.span_1_of_2 {
    width: 49.2%;
}


/*  GRID OF THREE   ============================================================================= */
.span_3_of_3 {
    width: 100%;
}

.span_2_of_3 {
    width: 66.13%;
}

.span_1_of_3 {
    width: 32.26%;
}

/*  GRID OF FOUR   ============================================================================= */
.span_4_of_4 {
    width: 100%;
}

.span_3_of_4 {
    width: 74.6%;
}

.span_2_of_4 {
    width: 49.2%;
}

.span_1_of_4 {
    width: 23.8%;
}

/*  GRID OF FIVE   ============================================================================= */
.span_5_of_5 {
    width: 100%;
}

.span_4_of_5 {
    width: 79.68%;
}

.span_3_of_5 {
    width: 59.36%;
}

.span_2_of_5 {
    width: 39.04%;
}

.span_1_of_5 {
    width: 18.72%;
}

/*  GRID OF SIX   ============================================================================= */
.span_6_of_6 {
    width: 100%;
}

.span_5_of_6 {
    width: 83.06%;
}

.span_4_of_6 {
    width: 66.13%;
}

.span_3_of_6 {
    width: 49.2%;
}

.span_2_of_6 {
    width: 32.26%;
}

.span_1_of_6 {
    width: 15.33%;
}

/*  GRID OF SEVEN   ============================================================================= */
.span_7_of_7 {
    width: 100%;
}

.span_6_of_7 {
    width: 85.48%;
}

.span_5_of_7 {
    width: 70.97%;
}

.span_4_of_7 {
    width: 56.45%;
}

.span_3_of_7 {
    width: 41.94%;
}

.span_2_of_7 {
    width: 27.42%;
}

.span_1_of_7 {
    width: 12.91%;
}

/*  GRID OF EIGHT   ============================================================================= */
.span_8_of_8 {
    width: 100%;
}

.span_7_of_8 {
    width: 87.3%;
}

.span_6_of_8 {
    width: 74.6%;
}

.span_5_of_8 {
    width: 61.9%;
}

.span_4_of_8 {
    width: 49.2%;
}

.span_3_of_8 {
    width: 36.5%;
}

.span_2_of_8 {
    width: 23.8%;
}

.span_1_of_8 {
    width: 11.1%;
}

/*  GRID OF NINE   ============================================================================= */
.span_9_of_9 {
    width: 100%;
}

.span_8_of_9 {
    width: 88.71%;
}

.span_7_of_9 {
    width: 77.42%;
}

.span_6_of_9 {
    width: 66.13%;
}

.span_5_of_9 {
    width: 54.84%;
}

.span_4_of_9 {
    width: 43.55%;
}

.span_3_of_9 {
    width: 32.26%;
}

.span_2_of_9 {
    width: 20.97%;
}

.span_1_of_9 {
    width: 9.68%;
}

/*  GRID OF TEN   ============================================================================= */
.span_10_of_10 {
    width: 100%;
}

.span_9_of_10 {
    width: 89.84%;
}

.span_8_of_10 {
    width: 79.68%;
}

.span_7_of_10 {
    width: 69.52%;
}

.span_6_of_10 {
    width: 59.36%;
}

.span_5_of_10 {
    width: 49.2%;
}

.span_4_of_10 {
    width: 39.04%;
}

.span_3_of_10 {
    width: 28.88%;
}

.span_2_of_10 {
    width: 18.72%;
}

.span_1_of_10 {
    width: 8.56%;
}

/*  GRID OF ELEVEN   ============================================================================= */

.span_11_of_11 {
    width: 100%;
}

.span_10_of_11 {
    width: 90.76%;
}

.span_9_of_11 {
    width: 81.52%;
}

.span_8_of_11 {
    width: 72.29%;
}

.span_7_of_11 {
    width: 63.05%;
}

.span_6_of_11 {
    width: 53.81%;
}

.span_5_of_11 {
    width: 44.58%;
}

.span_4_of_11 {
    width: 35.34%;
}

.span_3_of_11 {
    width: 26.1%;
}

.span_2_of_11 {
    width: 16.87%;
}

.span_1_of_11 {
    width: 7.63%;
}

/*  GRID OF TWELVE   ============================================================================= */
.span_12_of_12 {
    width: 100%;
}

.span_11_of_12 {
    width: 91.53%;
}

.span_10_of_12 {
    width: 83.06%;
}

.span_9_of_12 {
    width: 74.6%;
}

.span_8_of_12 {
    width: 66.13%;
}

.span_7_of_12 {
    width: 57.66%;
}

.span_6_of_12 {
    width: 49.2%;
}

.span_5_of_12 {
    width: 40.73%;
}

.span_4_of_12 {
    width: 32.26%;
}

.span_3_of_12 {
    width: 23.8%;
}

.span_2_of_12 {
    width: 15.33%;
}

.span_1_of_12 {
    width: 6.86%;
}

/* ======================================================================================== */
/* ======================================================================================== */
/* Custom */
/* ======================================================================================== */
/* ======================================================================================== */


/*Example Generic Table Handling*/
.TableStd {
    width: 100%;
    margin: 40px 0;
}

.TableStd > tbody {
}

.TableStd caption {
    text-align: left;
    font-size: 14px;
    color: #2d4285;
    font-weight: bold;
    padding: 10px 5px 4px 10px;
    border-color: #a9a9a9;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    background-color: #efefef;
    background-image: linear-gradient(0deg, #efefef, #fff 90%);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.TableStd th {
    font-size: 14px;
    font-weight: bold;
    text-align: left;
    padding: 10px 5px 10px 5px;
    background-color: #fff;
    border-bottom: 2px solid #ccc;
}

.TableStd td {
    font-size: 14px;
    line-height: 17px;
    border-top: 1px solid #ddd;
    padding: 8px 5px 8px 5px;
}

.TableStd td.date {
    white-space: nowrap;
}

.TableStd > tbody > tr:nth-child(odd) {
    background-color: #f9f9f9;
}

.TableStd > tbody > tr:nth-child(even) {
    background-color: #ffffff;
}

.TableStd > tbody > tr:first-child > td {
    border-top: 0
}

.TableStd > tbody > tr:last-child > td {
    border-bottom: 0
}

.TableStd > tbody > tr:hover td {
    background-color: #fbeadb;
}

.TableStd > tbody > tr > td > a {
    text-decoration: none;
    position: relative;
    color: #222324;
    display: block;
}

.TableStd > tbody > tr > td > a:hover, .TableStd > tbody > tr > td > a:active {
    text-decoration: underline;
    color: #e98b3a;
    cursor: pointer;
}

.TableStd > thead > tr > th > a {
    text-decoration: none;
    position: relative;
    color: #222324;
}

.TableStd > thead > tr > th > a:hover, .TableStd > thead > tr > th > a:active {
    text-decoration: none;
    color: #f63;
    cursor: pointer;
}

.TableStd > tbody > tr > td .deleted {
    color: #ccc;
}

/*Apply additional custom rendering per table*/
/*Customer Profile Table*/
.TableCustProf > thead {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
/*Set matching left and right borders in the heading row*/
.TableCustProf > thead > tr > th:nth-of-type(3), .TableCustProf > tbody > tr > td:nth-of-type(3) {
    text-align: right;
}
/*Make the number in the 3rd column align right*/
.TableCustProf > thead > tr > th:nth-of-type(4), .TableCustProf > tbody > tr > td:nth-of-type(4) {
    text-align: center;
}
/*Make the size / button in the 4th column align in the middle*/
.TableCustProf > tbody > tr > td:first-of-type {
    font-weight: bold;
}
/*Make the text in the first column bold*/
.TableCustProf > tbody > tr > td > a.ABtnStd {
    display: inline-block;
    text-decoration: none;
    width: 75px;
}
/*Override the A tag handling that the table handling applies over the standard button*/

/* Product Partners Pricing Table */
.HeadProductPartners {
    background-color: #fac08f !important;
    text-align: center !important;
}

.HeadNonProductPartners {
    background-color: #fdeada !important;
    text-align: center !important;
}

/* Miproducts Pricing Table*/
.TableMiproducts {
    border: 1px solid #ccc;
    margin: 20px 0;
}

.TableMiproducts th {
    padding: 8px 5px;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    background-color: #f5f5f5;
}

.TableMiproducts th:last-child {
    border-right: 0;
}

.TableMiproducts td {
    padding: 5px;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.TableMiproducts td:last-child {
    border-right: 0;
}

.TableMiproducts img {
    float: left;
    margin-left: 5px;
    margin-right: 5px;
    position: relative;
}

/* Module Sets */
.TableModuleSets {
    width: 100%;
    margin: 30px 0;
}

.TableModuleSets th {
    background-color: #fff;
    padding: 40px 6px 20px 10px;
}

.TableModuleSets td {
    background-color: #f2f2f2;
    padding: 6px 6px 6px 10px;
}

.TableModuleSets td:first:child {
}

.TableModuleSets td:last:child {
}

/*Site wide button style from an Anchor tag */
.ABtnStd {
    text-align: center;
    padding: 4px 12px;
    margin: 3px;
    font-size: 14px;
    line-height: normal;
    display: inline-block;
}

a.ABtnStd:link, a.ABtnStd:visited {
    text-decoration: none;
}

a.ABtnStd:hover, a.ABtnStd:active {
    text-decoration: none;
    color: #fff !important;
    background-color: #f08c3d;
    border-radius: 3px;
}

.HomePartnersPanel {
    background-color: #fff;
    margin: 0;
}

.HomePartnersPanel h6 {
    margin-top: 10px;
}

.HomePartnersPanel img {
    margin-right: 20px;
}

.PartnerLogo {
    padding: 2px 20px 2px 2px;
}

.HomeFeaturesPanel {
    background-color: #dfe2e6;
    margin: 0;
}

.HomeFeaturesPanel h1 {
    font-size: 2.1rem;
}

.HomeNewsPanel {
    background-color: #fff;
    margin: 0;
    padding: 20px 0;
}

.HomeNewsPanel h3 {
    margin-top: 20px;
}

.HomeTestimonialPanel {
    background-color: #dfe2e6;
    margin: 0;
    padding: 2px 10px 20px 10px;
}

/* News & Events */
.NewsDate {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    background-color: #ccc;
    border-radius: 10px;
    padding: 0 8px;
    line-height: 22px;
    float: right;
    margin: 0px 3px 8px 20px;
}

.NewsFeed, .EventFeed {
    border: 1px solid #dddddd;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

.NewsFeedStory, .EventFeedStory {
    border-bottom: 1px solid #dddddd;
    padding: 20px;
}

.NewsFeed h6, .EventFeed h6 {
    margin: 2px 0;
    color: #4e4e50;
}

.NewsFeed h6, .EventFeed h6 {
    margin: 2px 0;
    color: #4e4e50
}

.NewsFeed p, .EventFeed p {
    font-size: 12px;
    color: #999;
    font-weight: 300;
}

.EventDate, .EventLocation {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    background-color: #ccc;
    border-radius: 10px;
    padding: 0 8px;
    line-height: 22px;
    margin: 0px 8px 8px 0px;
}

.EventFeed a:link, .EventFeed a:visited {
    text-decoration: none !important;
    color: #ddd !important;
}

.NewsFeed a:link, .NewsFeed a:visited {
    text-decoration: none !important;
    color: #ddd !important;
}

.NewsFeedStory:hover {
    background-color: #f5f5f5;
}

.EventFeedStory:hover {
    background-color: #f5f5f5;
}

.TestimonialFeature {
    width: 65%;
    background-color: #fff;
    border: 0.0625rem solid #e5e5e5;
    border-radius: 0.25rem;
    margin: 25px auto;
    padding: 1.25rem; /*box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5)*/
    box-shadow: 0 5px 8px rgba(0, 0, 0, 0.2);
}

.TestimonialFeature img {
    margin: 8px auto;
}

.TestimonialFeature p {
    font-size: 1.25rem;
    font-weight: 300;
    margin-top: 0;
    margin-bottom: 1rem;
    padding: 0.5rem 1rem;
}

.TestimonialFeaturePage {
    width: 85%;
    background-color: #fff;
    border: 0.0625rem solid #e5e5e5;
    border-radius: 0.25rem;
    margin: 25px auto;
    padding: 1.25rem; /*box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5)*/
    box-shadow: 0 5px 8px rgba(0, 0, 0, 0.2);
}

.TestimonialFeaturePage img {
    margin: 8px auto;
}

.TestimonialFeaturePage p {
    font-size: 1.25rem;
    font-weight: 300;
    margin-top: 0;
    margin-bottom: 1rem;
    padding: 0.5rem 1rem;
}



/* Main Buttons */
.BtnBase {
    display: inline-block;
    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;
}

.BtnBase a {
    display: block;
}

.BtnFlatRight {
    border-bottom-right-radius: 0 !important;
    border-top-right-radius: 0 !important;
    margin-right: -2px !important;
}

.BtnFlatLeft {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
    margin-left: -2px !important;
}

.BtnFlatBoth {
    border-radius: 0 !important;
    margin-left: -3px !important;
    margin-right: -3px !important;
}

.BtnGroup > button.BtnFlatBoth:last-of-type {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
    margin-left: -2px !important;
}

.BtnXLarge {
    font-size: 2.0rem;
    padding: 0.6rem 1.5rem;
}

.BtnLarge {
    font-size: 1.3rem;
    padding: 0.5rem 1.3rem;
}

.BtnMedium {
    font-size: 1.0rem;
    padding: 0.375rem 1rem;
}

.BtnSmall {
    font-size: 0.7rem;
    padding: 0.375rem 1rem;
}

.BtnXSmall {
    font-size: 0.5rem;
    padding: 0.275rem 1rem;
}

.BtnFullWidth {
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* removes box effect padding */
.BtnHalflWidth {
    width: 50%;
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.BtnGroup {
    display: inline-block;
}

.BtnColorBlue {
    background-color: rgba(97, 111, 131, 0.2);
}

/* Primary Button */
.BtnPrimary {
    background-color: #576F83;
    position: relative;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
    font-weight: 300;
    border: 0.0625rem solid #576F83;
    border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    margin: 10px 0;
}

.BtnPrimary a:link, .BtnPrimary a:visited {
    text-decoration: none !important;
    color: #fff !important;
}

.BtnPrimary:hover {
    text-decoration: none !important;
    background-color: #435564;
    border: 0.0625rem solid #3f505e;
}

.BtnPrimary:active {
    background-image: none;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.25);
}

/* Primary Button Outline */
.BtnPrimaryOutline {
    background-color: #fff;
    position: relative;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
    font-weight: 300;
    border: 0.0625rem solid #576F83;
    border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    margin: 10px 0;
}

.BtnPrimaryOutline a:link, .BtnPrimaryOutline a:visited {
    text-decoration: none !important;
    color: #576F83;
}

.BtnPrimaryOutline:hover {
    text-decoration: none !important;
    background-color: #435564;
    color: #fff;
    border: 0.0625rem solid #3f505e;
}

.BtnPrimaryOutline a:hover {
    color: #fff !important;
}
/*Force the white text appear on LINKS */
.BtnPrimaryOutline:active {
    background-image: none;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.25);
}

/* Secondary Button */
.BtnSecondary {
    background-color: #e98b3a;
    position: relative;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
    font-weight: 300;
    border: 0.0625rem solid #e98b3a;
    border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    margin: 10px 0;
}

.BtnSecondary a:link, .BtnSecondary a:visited {
    text-decoration: none !important;
    color: #fff !important;
}

.BtnSecondary:hover {
    text-decoration: none !important;
    background-color: #d87118;
    border: 0.0625rem solid #d87118;
}

.BtnSecondary:active {
    background-image: none;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.25);
}

/* Secondary Button */
.BtnSecondaryOutline {
    background-color: transparent;
    position: relative;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
    font-weight: 300;
    border: 0.0625rem solid #e98b3a;
    border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    margin: 10px 0;
}

.BtnSecondaryOutline a:link, .BtnSecondaryOutline a:visited {
    text-decoration: none !important;
    color: #fff !important;
}

.BtnSecondaryOutline:hover {
    text-decoration: none !important;
    background-color: #d87118;
    border: 0.0625rem solid #d87118;
}

.BtnSecondaryOutline:active {
    background-image: none;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.25);
}

/* Homepage Main Button */
.HomepageFeatureButton {
    background-color: #576F83;
    position: relative;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
    font-weight: 300;
    border: 0.0625rem solid #576F83;
    border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    margin: 10px 0;
}

.HomepageFeatureButton a:link, .HomepageFeatureButton a:visited {
    text-decoration: none !important;
    color: #fff !important;
}

.HomepageFeatureButton:hover {
    text-decoration: none !important;
    background-color: #435564;
    border: 0.0625rem solid #3f505e;
}

.HomepageFeatureButton:active {
    background-image: none;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.25);
}

/* Homepage Secondary Button */
.HomepageFeatureButtonAlt {
    background-color: #e98b3a;
    position: relative;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
    font-weight: 300;
    border: 0.0625rem solid #e98b3a;
    border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    margin: 10px 0;
}

.HomepageFeatureButtonAlt a:link, .HomepageFeatureButtonAlt a:visited {
    text-decoration: none !important;
    color: #fff !important;
}

.HomepageFeatureButtonAlt:hover {
    text-decoration: none !important;
    background-color: #d87118;
    border: 0.0625rem solid #d87118;
}

.HomepageFeatureButtonAlt:active {
    background-image: none;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.25);
}

/* Icons and rollovers */
.RolloverMoreInfo {
    background-image: url(/assets/images/link/icon_info.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 16px;
    width: 33px;
    display: block;
}

.RolloverMoreInfo span {
    display: none;
}

.RolloverMoreInfo:hover {
    background-image: url(/assets/images/link/icon_info_on.gif);
}

.RolloverPreviewDoc {
    background-image: url(/assets/images/link/icon_preview.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 16px;
    width: 33px;
    display: block;
}

.RolloverPreviewDoc span {
    display: none;
}

.RolloverPreviewDoc:hover {
    background-image: url(/assets/images/link/icon_preview_on.gif);
}

.RolloverWizard {
    background-image: url(/assets/images/link/icon_wizard_wand.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 16px;
    width: 33px;
    display: block;
    margin-left: 2px;
}

.RolloverWizard span {
    display: none;
}

.RolloverWizard:hover {
    background-image: url(/assets/images/link/icon_wizzard_wand_on.gif);
}

.RolloverDownloadlink {
    text-decoration: none;
}

.RolloverDownloadlink img {
    background-image: url(/assets/images/link/icon_download_section.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 16px;
    width: 33px;
    margin-left: 2px;
    vertical-align: middle;
}

.RolloverDownloadlink:hover img {
    background-image: url(/assets/images/link/icon_download_section_on.gif);
    vertical-align: middle;
}

.RolloverNextQuestion {
    background-image: url(/assets/images/link/button_next_lge.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 40px;
    width: 95px;
    display: block;
}

.RolloverNextQuestion span {
    display: none;
}

.RolloverNextQuestion:hover {
    background-image: url(/assets/images/link/button_next_lge_on.gif);
}

.RolloverBackQuestion {
    background-image: url(/assets/images/link/back_nor.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 20px;
    width: 42px;
    display: block;
}

.RolloverBackQuestion span {
    display: none;
}

.RolloverBackQuestion:hover {
    background-image: url(/assets/images/link/back_on.gif);
}

.RolloverCancelQuestion {
    background-image: url(/assets/images/link/cancel_nor.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 20px;
    width: 48px;
    display: block;
}

.RolloverCancelQuestion span {
    display: none;
}

.RolloverCancelQuestion:hover {
    background-image: url(/assets/images/link/cancel_on.gif);
}

.RolloverAddToDocument {
    background-image: url(/assets/images/link/button_download_worksection.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 56px;
    width: 194px;
    display: block;
}

.RolloverAddToDocument span {
    display: none;
}

.RolloverAddToDocument:hover {
    background-image: url(/assets/images/link/button_download_worksection_on.gif);
}

.RolloverMergeWizard {
    background-image: url(/assets/images/link/button_mergeupdatedselections.png);
    background-position: left;
    background-repeat: no-repeat;
    height: 58px;
    width: 237px;
    display: block;
}

.RolloverMergeWizard span {
    display: none;
}

.RolloverMergeWizard:hover {
    background-image: url(/assets/images/link/button_mergeupdatedselections_on.png);
}

.RolloverRedoWizard {
    background-image: url(/assets/images/link/button_fullreplacement.png);
    background-position: left;
    background-repeat: no-repeat;
    height: 58px;
    width: 196px;
    display: block;
}

.RolloverRedoWizard span {
    display: none;
}

.RolloverRedoWizard:hover {
    background-image: url(/assets/images/link/button_fullreplacement_on.png);
}

a.button_download_content {
    background-image: url(/assets/images/link/button_download_content.gif);
    background-position: left;
    background-repeat: no-repeat;
    height: 50px;
    width: 52px;
    display: block;
    text-decoration: none;
    margin-left: 3px;
}

a.button_download_content:hover {
    background-image: url(/assets/images/link/button_download_content_on.gif);
}



/* Custom Tables */
.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 1rem;
}

.table th, .table td {
    padding: 0.75rem;
    line-height: 1.5;
    vertical-align: top;
    border-top: 1px solid #bdbebf;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #bdbebf;
}

.table tbody + tbody {
    border-top: 2px solid #bdbebf;
}

.table .table {
    background-color: #fff;
}

.table--features th[scope=row] {
    font-size: 80%;
}

.table--features th[scope=row] {
    font-weight: 300;
    color: #939598;
}

.table--features th[scope=row] {
    font-weight: 700;
}

.table--features tbody td {
    font-size: 0.75rem;
}

.table--features tr:last-child {
    border-bottom: 1px solid #bdbebf;
}

.table-active, .table-active > th, .table-active > td {
    background-color: #f5f5f5;
}

.table-hover .table-active:hover {
    background-color: #e8e8e8;
}

.table-hover .table-active:hover > td, .table-hover .table-active:hover > th {
    background-color: #e8e8e8;
}

/* Attendees */

.TableAddAttendees {
    background-color: #fbf7f2;
    border-top: 3px solid #f7efe5;
    border-bottom: 3px solid #f7efe5;
    margin-bottom: 30px;
}

.TableAddAttendees caption {
    text-align: left;
    padding: 10px 0;
    font-size: 16px;
    font-weight: bold;
}

.AttendeeListing {
    margin: 20px 0;
    border: 2px solid #f7efe5;
}

.AttendeeListing td {
    padding: 5px 10px;
}

.AttendeeListingHeader h6 {
    margin: 0;
    background-color: #f7efe5;
    padding: 8px 15px;
}

/* FEATURE TABLE */
.TableFeature {
    margin-bottom: 1rem;
    padding: 0.75rem;
    line-height: 1.5;
    border-top: 1px solid #bdbebf;
    background-color: #fff;
}

.TableFeature th {
    background-color: #f5f5f5;
    padding: 10px;
}

.TableFeature th [scope=row] {
    font-weight: 300;
    color: #939598;
    background-color: #fff !important;
}

.TableFeature tr {
    border-bottom: 1px solid #bdbebf;
}

.TableFeature tr:hover {
    background-color: #fdf4ec;
}

.TableFeature td {
    font-size: 0.75rem;
    padding: 8px; /*vertical-align:top;*/
}

.TableFeature td [scope=row] {
    font-weight: bold;
}

.TableFeatureSubHead {
    color: #939598;
    font-weight: bold;
}

/* Custom Headings */
.Lead {
    font-size: 1.25rem;
    font-weight: 300;
}

.Display-1 {
    font-size: 3.5rem;
    font-weight: 300;
}

.Display-2 {
    font-size: 4.5rem;
    font-weight: 300;
}

.Display-3 {
    font-size: 5.5rem;
    font-weight: 300;
}

.Display-4 {
    font-size: 6rem;
    font-weight: 300;
}

/* Card */

.CardBox {
    position: relative;
    margin-bottom: 0.75rem;
    border: 0.0625rem solid #e5e5e5;
    border-radius: 0.25rem;
    background-color: #fff;
    padding: 1.25rem;
}

.CardBox h4 {
    font-size: 1.5rem;
    color: #4e4e50;
    font-weight: 300;
}

.CardBox h5 {
    font-size: 1.25rem;
    color: #4e4e50 !important;
    font-weight: 300;
}

.CardBoxHeader {
    padding: 0.75rem 1.25rem;
    background-color: #f5f5f5;
    border-bottom: 0.0625rem solid #e5e5e5;
}

.CardBoxTitle {
    margin-top: 0;
    margin-bottom: 0.75rem;
}

.CardBoxSubTitle {
    margin-top: -0.375rem;
    margin-bottom: 0;
}

.CardBoxText {
    font-size: 1rem;
    font-weight: 300;
}

.CardBoxTextTotal {
    font-size: 1rem;
    color: #4e4e50 !important;
    font-weight: 700;
}

.CardBoxBase {
    padding: 0.75rem 1.25rem;
    background-color: #f5f5f5;
    border-top: 0.0625rem solid #e5e5e5;
}

small, .CardBox {
    color: #939598;
}

.CardBoxNoPadding {
    position: relative;
    margin-bottom: 0.75rem;
    border: 0.0625rem solid #e5e5e5;
    border-radius: 0.25rem;
    background-color: #fff;
    overflow: hidden;
}

/* More Features Panel - Height Setting */
.MoreFeatures {
    height: 380px;
}

.ShadowBox1 {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2);
}

/* Sections */
.SectionBlueLarge {
    background-color: rgba(97, 111, 131, 0.2);
}

.SectionBlueLarge hr {
    border-top: 0.0625rem solid rgba(0,0,0,0.1);
}

.SectionBlueLarge h2 {
    font-weight: 300;
    line-height: 1.5;
    font-size: 2rem;
    color: #4e4e50;
}

.SectionPanel {
    width: 100%;
    margin: 40px 0;
    color: #fdfdfd;
    background-color: rgba(87, 111, 131, 0.8);
    border-color: transparent;
    padding: 1rem 0;
    float: right;
    position: relative;
    border-radius: 0.25rem;
}

.SectionPanel h1 {
    color: #fff;
    font-weight: 300;
    margin: 0.5em 0;
}

.SectionPanel hr {
    border-color: rgba(0,0,0,0.1);
}

/* Banners */
.ProductsBanner {
    background-image: url(/assets/images/section-product.jpg);
    min-height: 220px;
    margin-top: 0;
    background-repeat: no-repeat;
    background-size: cover; /*contain;*/
    background-position: 50% 50%;
    overflow: hidden; /*background-attachment:fixed;*/
}

.ProductsBanner2 {
    background-image: url(/assets/images/product-shot2.jpg);
    min-height: 220px;
    margin-top: 0;
    background-repeat: no-repeat;
    background-size: cover; /*contain;*/
    background-position: 50% 50%;
    overflow: hidden; /*background-attachment:fixed;*/
}

.SimpleBanner {
    background-color: #fff;
}

.SimpleBanner h1 {
    margin-top: 1.2rem;
}

/* SECONDARY NAVIGATION */

.UserLink {
    font-size: 0.75rem;
    color: #576F83;
    float: right;
    margin: 6px 10px;
    text-align: center;
}

.UserLink a:link, .UserLink a:visited {
    text-decoration: none;
}

.ButtonSubscribe {
    font-size: 1.0rem;
    padding: 0.375rem 1rem;
    margin-right: 20px;
}

.ButtonSubscribe a:hover {
    text-decoration: none !important;
}

.BtnLoginNav {
    background-color: #e98b3a;
    position: relative;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
    font-weight: 300;
    border: 0.0625rem solid #e98b3a;
    border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    margin: 10px 0;
    float: right;
}

a.BtnLoginNav:link, a.BtnLoginNav:visited {
    text-decoration: none !important;
    color: #fff !important;
}

.BtnLoginNav:hover {
    text-decoration: none !important;
    background-color: #d87118;
    border: 0.0625rem solid #d87118;
}

.BtnLoginNav:active {
    background-image: none;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.25);
}

.LoginPhone {
    display: none;
}

.PanelLoginAccount {
    margin: 20px 0;
}

/* Sticky Panel */
.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0 !important;
}

.sticky:before, .sticky:after {
    content: ' ';
    display: table;
}

/* PRICING SYSTEM */
.tile {
    display: inline-block;
    vertical-align: middle;
    background-color: #fff;
    cursor: pointer;
    width: 120px;
    height: 120px;
    margin: 10px;
    padding-top: 20px;
    font-size: 1.25rem;
    border-radius: 0.25rem;
    border: solid #d9e0e6 1px;
    text-transform: capitalize
}

.tile i {
    color: #576F83
}

.tile:hover, .tile.active {
    background-color: #e9edf0;
    border: solid #617c92 1px
}

.tile.tile--color-secondary {
    border: solid #f8dcc4 1px
}

.tile.tile--color-secondary i {
    color: #e98b3a
}

.tile.tile--color-secondary:hover, .tile.tile--color-secondary .active {
    background-color: #fbeadb;
    border: solid #ec9951 1px
}

.fa-star-o:before {
    content: "N"
}

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.fa-2x {
    font-size: 2em;
}

.fa-3x {
    font-size: 3em;
}

.fa-4x {
    font-size: 4em;
}

.fa-5x {
    font-size: 5em;
}

.fa-thumbs-o-up:before {
    content: "E"
}

.fa-question-circle:before {
    content: "?"
}

.form-select-number {
    height: 38px !important;
    width: 100%;
}

/* Subscription Form */
.TxtSpecialNote {
    font-size: 11px;
    color: #c00;
    line-height: 15px;
}

/* CBI Navigation - Start */

.CBILinkShow1 {
    font-size: 18px;
    text-decoration: none !important;
    display: block;
}

.CBILinkShow2 {
    font-size: 16px;
    text-decoration: none !important;
    display: block;
}

.CBILinkShow3 {
    font-size: 14px;
    text-decoration: none !important;
    display: block;
}

.CBILinkHide1 {
    font-size: 18px;
    text-decoration: none !important;
    display: none;
}

.CBILinkHide2 {
    font-size: 16px;
    text-decoration: none !important;
    display: none;
}

.CBILinkHide3 {
    font-size: 14px;
    text-decoration: none !important;
    display: none;
}

.CBIChangeLogNote {
    color: #666666 !important;
    font-size: 12px !important;
    max-width: 400px;
    background-color: #fff;
}

.rtPlus {
    background-image: url('/assets/images/btPlusMinus.png');
    background-position: 0 0;
    margin-top: 5px;
    margin-right: 3px;
    padding: 0;
    width: 11px;
    height: 11px;
    background-repeat: no-repeat;
    font-size: 0;
    display: inline-block;
    vertical-align: top;
}

.rtMinus {
    background-image: url('/assets/images/btPlusMinus.png');
    background-position: 0 -11px;
    margin-top: 5px;
    margin-right: 3px;
    padding: 0;
    width: 11px;
    height: 11px;
    background-repeat: no-repeat;
    font-size: 0;
    display: inline-block;
    vertical-align: top;
}

/* Set the container DIV that will be transitioned */
.CBIOuter {
    padding-top: 5px;
    height: 0;
    position: relative;
    overflow: hidden;
    width: auto;
}

/* Set the inner DIV(s), that hold the real content.  *** THIS MUST HAVE A BORDER OR PADDING APPLIED!  Otherwise the dynamic height calc may fail due to not recognising margin values */
.CBIInner {
    padding: 5px 5px 5px 20px;
    width: auto;
}

.CBIHeading {
    font-size: 15px;
    line-height: 20px;
    font-weight: 400;
    color: #333;
}

.CBIText {
    font-size: 13px;
    line-height: 17px;
}

.CBINoContent {
    font-size: 13px;
    line-height: 17px;
    color: #666;
}

/* Compare - Box Filter - Start */
.mix {
    display: none
}

.colBoxFilter {
    float: left;
    padding: 4px 6px 0 6px;
    box-sizing: border-box;
}

.colBoxFilter:before, .colBoxFilter:after {
    box-sizing: border-box;
}



.hrGray {
    margin-top: 24px;
    margin-bottom: 24px;
    border: 0;
    border-top: 0.0625rem solid #c9ccd0 !important;
    box-sizing: content-box;
    height: 0;
    display: block;
    -webkit-margin-before: 8px;
    -webkit-margin-after: 8px;
    -webkit-margin-start: auto;
    -webkit-margin-end: auto;
}

/* Compare - Box Filter - End */

/* Expanding Panels  (FAQ's or Attach a File Link)
===================== */
/* Format our link that will be used to trigger the toggle */
.TriggerText {
    font-size: 20px;
    width: 95%;
    color: #818181;
    padding: 25px 10px 15px 20px;
}

.CRMAttchFile .TriggerText {
    font-size: 16px;
    width: 95%;
    color: #333;
    padding: 15px 10px 5px 10px;
}

div.TriggerText:hover {
    color: #f60;
    text-decoration: none;
    cursor: pointer;
}

/* Set the container DIV that will be transitioned */
.Outer {
    height: 0;
    position: relative;
    overflow: hidden;
    width: auto;
}

/* Set the inner DIV(s), that hold the real content.  *** THIS MUST HAVE A BORDER OR PADDING APPLIED!  Otherwise the dynamic height calc may fail due to not recognising margin values */
.Inner {
    padding: 5px 5px 10px 20px;
    width: auto;
    margin-bottom: 5px;
}

/* Partner Net Logo */
.PartnerNetLogo {
    margin-top: 60px;
    margin-bottom: 20px;
    border-top: 1px solid #d9d9d9;
    border-bottom: 1px solid #d9d9d9;
    padding: 22px 0;
}

.PartnerNetLogo img {
    margin: 0 auto;
}

/* New CSS by Bruce in an attempt to set new standards.  If accepted, these need to be named properly and applied through all related templates*/
.TemplateNavSub {
    padding: 30px 0px 5px 10px;
    background-color: #fff;
    text-align: left;
    vertical-align: top;
    width: 184px;
}

.TemplateTitle h1 {
    margin: 30px 0px 30px 0px;
    border-bottom: 3px solid #333;
    font-size: 24px;
    font-weight: bold;
    line-height: 40px;
}

.TemplateTitle h3 {
    margin-bottom: 10px
}

.TemplateCMSContent {
    margin-top: 30px;
}

.TemplateControlContent {
    margin-top: 30px;
}

.TemplateNavLeftOuter {
    padding: 7px 0px 40px 50px;
    min-height: 400px;
    text-align: left;
    vertical-align: top;
    background-color: #fff;
    max-width: 1200px;
    width: 90%;
}

.TemplateNavLeftProdPartOuter {
    padding: 7px 30px 40px 50px;
    min-height: 400px;
    vertical-align: top;
    background-color: #fff;
}

.TemplateCentreOuter {
    padding: 7px 10px 40px 10px;
    min-height: 400px;
    vertical-align: top;
    background-color: #fff;
    text-align: left;
    width: 100%;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

.TemplateFullPageOuter {
    padding: 7px 0px 7px 0px;
    min-height: 400px;
    vertical-align: top;
    background-color: #fff;
    text-align: left;
    text-align: left;
}

/* TEMPORARY DEBUG */
.b1 {
    border: 1px solid blue !important;
}

.b2 {
    border: 1px solid red !important;
}

.b3 {
    border: 1px solid magenta !important;
}

/* Hover Effects */
/* Hover Fade */
.HoverFade {
}

.HoverFade:hover {
    opacity: 0.8;
}

/* NEWS */
.NewsMenuHeader {
    font-weight: 700;
    font-size: 18px;
}

.NewsNavCont {
    border: 1px solid #ccc;
    padding: 0 0 0 10px;
    border-radius: 4px;
    width: 100%; /*max-width:600px;*/
}

#NewsNav {
    position: relative;
    top: 0;
    height: 40px;
    background-color: #fafafa;
}

#NewsNav > nav {
    line-height: 40px;
}

#NewsNav > nav > article {
    float: left;
}

#NewsNav > nav > aside {
    float: right;
    background-color: #777;
    border-radius: 4px;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    width: 40px;
    height: 40px;
    text-align: center;
}

#NewsNav:hover {
}

#NewsNav:hover > nav > aside {
    background-color: #555;
}

#NewsNav a {
    display: block;
    padding: 5px 8px;
    text-decoration: none;
    color: #222;
    border-radius: 5px;
    font-size: 18px;
    border: 1px solid transparent;
}

#NewsNav a:nth-child(odd) {
    background-color: #fff;
    color: #000;
    border: 1px solid #ccc;
}

#NewsNav a:nth-child(even) {
    background-color: #f7f7f7;
    color: #000;
    border: 1px solid #ccc;
}

#NewsNav a:hover {
    background-color: #fcf6e8;
    color: #000;
    border: 1px solid #e6d39e;
}

#NewsNav > div {
    border: 1px solid #666;
    border-radius: 4px;
    margin: 0;
    overflow: hidden;
    width: 100%;
    position: absolute;
    top: 40px;
    left: -10px;
    max-height: 0;
    opacity: 0;
    transition: max-height 2.0s, opacity 0.75s;
    -webkit-transition: max-height 2.0s, opacity 0.75s;
    font-weight: 200;
    color: #333;
    background-color: #fff;
    z-index: 500;
    text-align: left;
}

#NewsNav > div > div {
    padding: 7px 7px;
    background-color: #e0e0e0;
}

#NewsNav:hover > div {
    max-height: 600px;
    opacity: 1.0;
    overflow: visible;
    overflow-y: scroll;
}

#NewsNav .NewsMenuTitle {
    font-size: 1.2rem;
    line-height: 1.2rem;
}

#NewsNav .NewsMenuTeaser {
    font-size: 1rem;
    line-height: 1rem;
}

.NewsMenuDate {
    font-size: 12px;
    color: #999;
}

.NewsMenuTitle {
    font-weight: 700;
}

.NewsTeaser {
    font-size: 14px;
    color: #666;
}

.CommentCount {
    font-size: 10px;
    color: #333;
    padding: 1px 5px;
    background-color: #f7f7f7;
    margin-left: 4px;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.NewsMenuViewCount {
    font-size: 10px;
    color: #333;
    padding: 1px 5px;
    background-color: #f7f7f7;
    margin-left: 10px;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.NewsPrevNext {
    text-decoration: none !important;
    display: block;
    float: right;
    overflow: hidden;
    padding: 0 3px;
}

.NewsPrevNext div {
    display: block;
    float: left;
    line-height: 40px;
    margin: 0 3px;
}

.NewsPrevNext:hover {
    background-color: #ccc;
    border-radius: 4px;
    color: #fff;
}

.NewsArrow {
    font-weight: bold;
    font-size: 30px;
}

.NewsArrowLeft {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.NewsArrowRight {
    float: right;
}

.NewsList {
    padding-left: 24px;
    background-image: url(/images/bullet_arrow_circle.gif);
    background-repeat: no-repeat;
    line-height: 22px;
}

.NewsHeader {
    height: 42px;
    padding-left: 12px;
}

/* USEFUL SNIPPETS */
/* Download */
.DownloadFeature {
    background-color: #fbf7f2;
    padding: 8px 10px;
    color: #6c6c6c;
    border-bottom: 3px solid #f7efe5;
    border-top: 3px solid #f7efe5;
    margin: 30px auto;
}

.DownloadFeature img {
    margin: 6px auto;
}

/* Editor Images */
.FloatLeftImage {
    float: left;
    margin: 20px 20px 20px 0;
}

.FloatRightImage {
    float: right;
    margin: 20px 10px 20px 20px;
}

/* Feature Table Info */
.TableInfo {
    border: 1px solid #e5eaf0;
    background-color: #f5f3f2;
    vertical-align: top;
    margin: 20px auto;
}

.TableInfo td {
    vertical-align: top;
    padding: 5px;
    border-bottom: 2px solid #ffffff;
}

.TableInfoAlt {
    background-color: #f9f9f9;
}

/* Tips & Tricks */
.TipsTricksPanel {
    background-color: #fdeada;
    border: 1px solid #a5a5a5;
    padding: 15px 20px;
    font-size: 15px;
    line-height: 18px;
    margin: 20px 0;
}

.TipsTricksPanel p {
    margin: 8px 0;
}

/* Tutorial Heading */
.TutorialHeading {
    background-color: #576f83;
    color: #fff;
    font-size: 15px;
    line-height: 18px;
    margin: 20px 0;
    padding: 15px 20px;
}

.TutorialHeading p {
    margin: 8px 0;
}

/* Updates and Changes*/

.UpdatesSummary {
    background-color: #fbf7f2;
    color: #6c6c6c;
    border-bottom: 3px solid #f7efe5;
    border-top: 3px solid #f7efe5;
    margin: 20px auto;
    width: 100%;
}

.UpdatesSummary td {
    padding: 8px 10px;
}

.span_1_of_4_CBI {
    width: 23.8%;
}

/* NextGen2 */
.TextSml3 {
    font-size: 11px;
    color: #999;
}

.TextLinkLabrariesSmall {
    font-size: 11px;
    color: #999;
    line-height: normal !important;
}

.bardiv {
    padding: 0 0 0 0px;
    background-color: #fff;
    max-width: 1200px;
}

.bardivfilter {
    padding: 5px;
    background-color: #f8f8f8;
}

.bartbl {
    width: 100%;
}

.txtkeyword {
    width: 300px;
    padding-top: 5px;
}

.txtkeyword .RadComboBox_Default .rcbInputCell {
    background-color: #ffffff;
}

.txtkeyword .RadComboBox_Default .rcbInputCellLeft {
    background-image: url(/assets/images/null.gif);
    border: solid 1px #aaa;
    height: 33px;
}

.txtkeyword .RadComboBox_Default .rcbArrowCellRight {
    background-image: url(/assets/images/null.gif);
}

.txtkeyword .RadComboBox_Default .rcbInput {
    font: 16px Arial, Helvetica, sans-serif;
}




/* Subscriber Overview Project List */
.ProjList {
    font-size: 12px;
}

.ProjList .Width160 {
    width: 130px;
}

.ProjList .Width400 {
    width: 360px;
}

.ProjList .RowList {
    border-bottom: 1px solid #e8e6e6;
    background-color: #fff;
}

.ProjList .RowList :hover {
    background-color: #fff1e5;
}

.ProjList .RowListInner {
    padding: 10px 5px 10px 10px;
}

.ProjList .btnsearch {
    padding: 8px 0 0 0;
}

.ProjList .btnsearchimage {
    background-color: #f79c4a;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    width: 36px;
    height: 36px;
}

.ProjList .barsortfilterproj {
    border-left: 1px solid #aaa;
    padding-left: 10px;
    margin-left: 10px;
}

.ProjList .barsortfilterspec {
    padding-left: 10px;
    padding-right: 10px;
}

.ProjList .barview {
    border-left: 1px solid #aaa;
    padding-left: 10px;
    display: block;
}

.ProjList .barsortspec {
    padding-left: 15px;
}

.ProjList .barview a {
    padding-left: 2px;
}

.ProjList .barview a img {
    padding-left: 2px;
    line-height: 17px;
}

.ProjList .ib_list img {
    border: 1px solid #aaa;
    background-color: #f5f5f5;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    float: left;
    margin-left: 1px;
}

.ProjList .ib_list_on img {
    border: 1px solid #aaa;
    background-color: #fb9d18;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    float: left;
    margin-left: 1px;
}

.ProjList .ib_gallery img {
    border: 1px solid #aaa;
    background-color: #f5f5f5;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    float: left;
    margin-left: 1px;
}

.ProjList .ib_gallery_on img {
    border: 1px solid #aaa;
    background-color: #fb9d18;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    float: left;
    margin-left: 1px;
}

.ProjList .ib_brief img {
    border: 1px solid #aaa;
    background-color: #f5f5f5;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    float: left;
    margin-left: 1px;
}

.ProjList .ib_brief_on img {
    border: 1px solid #aaa;
    background-color: #fb9d18;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    float: left;
    margin-left: 1px;
}

.ProjList .barddlist .rddlInner {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

/* Home page search list view */
.ProjList .bartd_keyword {
    width: 36px;
}

.ProjList .bartd_search {
    width: 40px;
}

.ProjList .bartd_sort {
    width: 36px;
}

.ProjList .bartd_statusproj {
    width: 120px;
}

.ProjList .bartd_statusspec {
    width: 120px;
}

.ProjList .bartd_space {
    width: 100%;
}

.ProjList .bartd_view {
    width: 106px;
    min-width: 106px;
}

.ProjList .bardiv_newspec {
    float: right;
    padding-right: 10px;
    padding-top: 1px;
}

.ProjList .bartbl_search {
    float: left;
    padding-left: 20px;
}

/* Home page search gallery view */
.ProjList .divgallery {
}

.ProjList .divgallery .row {
    float: left;
    width: 150px;
    height: 220px;
    border: 1px solid #ccc;
    overflow: hidden;
    margin: 20px 0 0 20px;
}

.ProjList .divgallery .row .thumbimg {
    width: 150px;
    height: 110px;
    background-color: #f5f5f5;
}

.ProjList .divgallery .row .thumbimg .space {
    height: 85px;
}

.ProjList .divgallery .row .thumbimg .addimg {
    width: 150px;
    height: 24px;
    line-height: 24px;
    background-color: #656567;
    color: #fff;
    text-align: right;
}

.ProjList .divgallery .row .thumbimg .addimg a {
    color: #fff;
    padding-right: 10px;
    text-decoration: none;
}

.ProjList .divgallery .row .thumbimg .addimg a:hover {
    color: #f63;
}

.ProjList .divgallery .row .title {
    font-size: 13px;
    color: #666666;
    line-height: 20px;
}

.ProjList .divgallery .row .speclist {
    padding: 5px 0px;
}

.ProjList .divgallery .row .speclist div {
    padding: 2px 0;
}

.ProjList .divgallery .row .speclist div img {
    width: 12px;
    height: 12px;
    display: inline;
}

.ProjList .divgallery .row .speclist div a {
    color: #666666;
    text-decoration: none;
}

.ProjList .divgallery .row .speclist div a:hover {
    color: #f63;
}

.ProjList .iconarrow {
    font-weight: bold;
    font-size: 10px;
}

.ProjList .divgallery_pager {
    margin-top: 20px;
    text-align: right;
}

.ProjList .divgallery_pager a {
    color: #333;
    font-size: 12px;
    text-decoration: none;
    line-height: 12px;
    border: 1px solid #666;
    border-radius: 3px;
    padding: 5px;
    box-shadow: 0px 0px 1px 1px #ddd;
    margin-left: 2px;
}

.ProjList .divgallery_pager a:hover {
    background-color: #f63;
    color: #fff;
    border: 1px solid #f63;
}

.ProjList .divgallery_pager a.current {
    color: #333;
    font-size: 12px;
    text-decoration: none;
    line-height: 12px;
    border: 0;
    padding: 5px;
    font-weight: bold;
    box-shadow: 0 0 0 0;
}

.ProjList .divgallery_pager a.current:hover {
    background-color: #fff;
    color: #333;
    border: 0;
}

.ProjList .divlist_pager {
    margin-top: 20px;
    text-align: right;
}

.ProjList .divlist_pager a {
    color: #333;
    font-size: 12px;
    text-decoration: none;
    line-height: 12px;
    border: 1px solid #666;
    border-radius: 3px;
    padding: 5px;
    box-shadow: 0px 0px 1px 1px #ddd;
    margin-left: 2px;
}

.ProjList .divlist_pager a:hover {
    background-color: #f63;
    color: #fff;
    border: 1px solid #f63;
}

.ProjList .divlist_pager a.current {
    color: #333;
    font-size: 12px;
    text-decoration: none;
    line-height: 12px;
    border: 0;
    padding: 5px;
    font-weight: bold;
    box-shadow: 0 0 0 0;
}

.ProjList .divlist_pager a.current:hover {
    background-color: #fff;
    color: #333;
    border: 0;
}

.ProjList .dvgrid_pager table {
    float: right;
    margin-top: 5px;
}

.ProjList .dvgrid_pager td {
    text-align: right;
}

.ProjList .dvgrid_pager a {
    color: #333;
    font-size: 12px;
    text-decoration: none;
    line-height: 12px;
    border: 1px solid #666;
    border-radius: 3px;
    padding: 5px;
    box-shadow: 0px 0px 1px 1px #ddd;
    margin-left: 2px;
}

.ProjList .dvgrid_pager a:hover {
    background-color: #f63;
    color: #fff;
    border: 1px solid #f63;
}

.ProjList .dvgrid_pager span {
    color: #333;
    font-size: 12px;
    text-decoration: none;
    line-height: 12px;
    border: 0;
    padding: 5px;
    font-weight: bold;
    box-shadow: 0 0 0 0;
}

/* Modal pop-up styles - Used to replace JavaScript Alert/Confirm dialogues*/
@keyframes ModalPopup_ModalContent {
    from {
        top: -100px;
        opacity: 0;
    }

    to {
        top: 0px;
        opacity: 1;
    }
}

.ModalPopup_ModalOuter {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 9999999;
    opacity: 0;
    -webkit-transition: opacity 10s ease-in;
    transition: opacity 2s ease-in;
    display: none;
}

.ModalPopup_ModalOuter:target {
    opacity: 1;
    display: block;
}

.ModalPopup_ModalOuter > div {
    width: 400px;
    position: relative;
    margin: 10% auto;
    padding: 5px 20px 13px 20px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 0 10px 5px #555;
    animation-name: ModalPopup_ModalContent;
    animation-duration: 0.8s;
    text-align: left;
}

.ModalPopup_ModalCloser {
    background: #606061;
    color: #fff;
    line-height: 25px;
    position: absolute;
    right: -12px;
    text-align: center;
    top: -10px;
    width: 24px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 12px;
    box-shadow: 1px 1px 3px #000;
}

.ModalPopup_ModalCloser:hover, .ModalPopup_ModalCloser:link, .ModalPopup_ModalCloser:visited {
    text-decoration: none;
    color: #fff;
}

.ModalPopup_ModalCloser:hover {
    background: #00d9ff;
}

.ModalPopup_ModalOuter .FormButton {
    padding: 6px 12px 6px 12px;
    font-size: 14px;
    color: #393b4a;
    background-image: url(/assets/images/button_tile.jpg);
    background-repeat: repeat-x;
    background-color: #e9e9e9;
    border: 2px solid #d3d3d3;
    text-decoration: none;
}

.ModalPopup_ModalOuter .FormButton:hover {
    padding: 6px 12px 6px 12px;
    font-size: 14px;
    color: #7a7a7a;
    background-image: url(/assets/images/button_tile_hover.jpg);
    background-repeat: repeat-x;
    background-color: #d7d7d7;
    border: 2px solid #d3d3d3;
    text-decoration: none;
    cursor: hand;
    cursor: pointer;
}

/* CRM */
.CRMComm_Item {
    clear: both;
    padding: 8px;
}

.CRMComm_Left {
    max-width: 500px;
    width: 100%;
    border-radius: 8px;
    float: right;
    border: 1px solid #aaa;
    background-color: #e7fce6;
    padding: 3px 6px;
}

.CRMComm_Right {
    max-width: 500px;
    width: 100%;
    border-radius: 8px;
    float: left;
    border: 1px solid #aaa;
    background-color: #e6eefc;
    padding: 3px 6px;
}

.CRMComm_FileNote {
    max-width: 500px;
    width: 100%;
    border-radius: 8px;
    float: left;
    border: 1px solid #aaa;
    background-color: #d4dcff;
    padding: 3px 6px;
}

.CRMComm_Left_NotRead {
    width: 32px;
    height: 32px;
    float: left;
}

.CRMComm_Right_NotRead {
    width: 32px;
    height: 32px;
    float: right;
}

.CRMComm_Bottom {
    overflow: hidden;
    margin: 8px 5px 0 5px;
}

.CRMComm_Bottom img {
    display: block;
    float: left;
}

.CRMComm_Bottom span {
    display: block;
    float: right;
    color: #999;
    font-size: 10px;
    margin: 5px 0 0 0;
}

.CRMComm_ItemDateTime {
    text-align: right;
    color: #999;
    font-size: 10px;
    vertical-align: bottom;
}

.CRMComm_AttachedFile {
    margin-top: 5px;
}

.CRMComm_Edit {
    color: #999;
}

.CRMComm_Edit:hover {
    color: #f30;
}

.CRM_Popup {
    width: 98%;
    margin: 10px auto auto auto;
}

.CallCycleDate {
    font-weight: bold;
    font-size: 18px;
}

.CallCycleDateRed {
    font-weight: bold;
    font-size: 18px;
    color: Red;
}

.iconmore {
    width: 100%;
    margin: auto;
    display: block;
    padding: 10px;
}

.iconmore img {
    margin: auto;
    cursor: pointer;
}




/* Left Contact Overview */
/*
.ContactTitle {width:100%; border-radius:8px; border:1px solid #aaa; background-color:#eeeeee; padding:3px 6px;}
.ContactSubject {font-size:14px; font-weight:bold; float:left;}
.ContactStatus {font-size:14px; font-weight:bold; float:right;}
.ContactContent {}
.ContactDatetime {font-size:10px; float:right; color:#666;}
.ContactSummary {width:100%; border-radius:8px; border:1px solid #aaa; background-color:#f6f6f6; padding:3px 6px;}
.ResponseLink {width:100%; border-radius:8px; border:1px solid #aaa; background-color:#eeeeee; padding:12px 6px; text-align:center; display:block;}
.ResponseLink {}
.ContactStatusLogList {width:100%; border-radius:8px; border:1px solid #aaa; background-color:#f6f6f6; padding:3px 6px;}
*/

/* Left Contact Overview */
/*
.ResponseLink {width:100%; border-radius:8px; border:1px solid #aaa; background-color:#eeeeee; padding:12px 6px; text-align:center; display:block;}
.ResponseLink {}
.ContactStatusLogList {width:100%; border-radius:8px; border:1px solid #aaa; background-color:#f6f6f6; padding:3px 0px;}
.ChatFormText em {color:#999;  font-style:normal; line-height:24px;}
.ChatFormText {width:100%; height:auto; min-height:28px; font-size:14px; line-height:24px; color:#000; background-color:#fff; border:2px solid #e8e8e8;}
.ContactNoChat {text-align:center; padding:10px; font-size:14px;}
.ChatFormButton{padding:6px 12px 6px 12px; font-size:14px; color:#393b4a; background-image:url(/assets/images/button_tile.jpg);  background-repeat:repeat-x; background-color:#e9e9e9; border:2px solid #d3d3d3; text-decoration:none;}
.ChatFormButton:hover{padding:6px 12px 6px 12px; font-size:14px; color:#7a7a7a; background-image:url(/assets/images/button_tile_hover.jpg); background-repeat:repeat-x; background-color:#d7d7d7; border:2px solid #d3d3d3; text-decoration:none; cursor:hand; cursor:pointer;}
.ContactsListTr:hover {cursor:pointer;}
*/

/*----------------------------------------------*/
/* Grid Layout -  Responsive Columns */

/*Generic handling to make the active area the same size as the contained DIV */
.PanelItemGrid {
    padding: 0 5px;
}

.PanelItemGrid > article {
    float: left;
    background-color: #fff;
}

.PanelItemGrid > article > a {
    display: block;
    width: 100%;
    text-decoration: none;
}

/*Custom size handling for each column variant */
.PanelItemGrid3Col > article {
    width: 31%;
    min-width: 160px;
    margin: 0 1% 14px 1%;
}

.PanelItemGrid3ColNarrow > article {
    width: 31%;
    min-width: 160px;
    margin: 0 1% 14px 1%;
}

.PanelItemGrid3ColDownloads > article {
    width: 31%;
    min-width: 180px;
    margin: 0 1% 14px 1%;
}

.PanelItemGrid3ColVideo > article {
    width: 31%;
    min-width: 210px;
    margin: 0 1% 14px 1%;
}

.PanelItemGrid4Col > article {
    width: 23%;
    min-width: 170px;
    margin: 0 1% 14px 1%;
}

.PanelItemGrid4ColProds > article {
    width: 23%;
    min-width: 220px;
    margin: 0 1% 14px 1%;
}

.PanelItemGrid4ColImages > article {
    width: 23%;
    min-width: 200px;
    margin: 0 1% 14px 1%;
    position: relative;
}

/*Set the heights by Grid type  (move generic handling from the next CSS block up into here if needed)*/
.PanelItemGrid3Col > article > a > div {
    height: 260px;
}

.PanelItemGrid3ColNarrow > article > a > div {
    height: 260px;
}

.PanelItemGrid3ColDownloads > article > a > div {
    height: 380px;
}

.PanelItemGrid3ColVideo > article > a > div {
    height: 350px;
}

.PanelItemGrid4Col > article > a > div {
    height: 300px;
}

.PanelItemGrid4ColProds > article > a > div {
    height: 350px;
}

.PanelItemGrid4ColImages > article > a > div {
    height: 180px;
}

/*Generic handing to set the primary container size, and ensure the active area is the same size and support the image resize effect*/
.PanelItemGrid > article > a > div {
    border: 1px solid #e1e1e1;
    padding: 0 5%;
    overflow: hidden;
    box-shadow: 0 0 2px 2px #e3e3e3;
}

.PanelItemGrid > article > a > div:hover {
    border: 1px solid #b7b7b7;
    box-shadow: 0 0 2px 2px #cacaca;
}

/*Animate the Image*/
.PanelItemGrid4ColProds > article > a > div > div:last-child img {
    max-height: 180px;
    max-width: 170px;
}

.PanelItemGrid > article > a > div > div:last-child img {
    -webkit-transition: -webkit-transform 1s;
    transition: transform 1s;
}

.PanelItemGrid > article > a > div:hover > div:last-child img {
    transform: scale(0.9,0.9);
    -webkit-transform: scale(0.9,0.9);
}

/*Image Gallery Custom*/
.PanelItemGrid4ColImages {
    margin-top: 20px;
}

.PanelItemGrid4ColImages > article > a > div {
    padding: 0;
    border: 1px solid #e1e1e1;
    box-shadow: none;
    background-color: #fcfcfc;
}

.PanelItemGrid4ColImages > article > a > div:hover {
    border: 1px solid #b7b7b7;
    box-shadow: none;
}

.PanelItemGrid4ColImages > article > a > div > img {
    margin: 0 auto;
    height: 100%;
    width: auto;
    max-width: 480px;
}

.PanelItemGrid4ColImages > article .ImgInfo {
    z-index: 51;
    overflow: hidden;
    background-color: #2b2b2b;
    color: #fff;
    opacity: 0.9;
    position: absolute;
    top: 180px;
    height: 0;
    width: 100%;
    -webkit-transition: -webkit-transform 0s, height 0.7s;
    transition: transform 0s, height 0.7s;
}

.PanelItemGrid4ColImages > article:hover .ImgInfo {
    transform: translate(0,0);
    -webkit-transform: translate(0,0);
    height: 110px;
    border-bottom: 2px solid #eee;
}

.PanelItemGrid4ColImages .ImgTitle {
    font-size: 13px;
    text-align: center;
}

.PanelItemGrid4ColImages .ImgDesc {
    text-align: left;
    padding: 5px 0px 0px 5px;
    font-size: 12px;
    line-height: 14px;
}

.PanelItemGrid4ColImages .ImgRelatedProducts {
    text-align: left;
    padding: 5px 0px 0px 5px;
    font-size: 12px;
    line-height: 14px;
}

/*Generic handling to deal with the content of each panel*/
.PanelItemGrid > article > a > div > div {
    margin: 15px auto;
    text-align: center;
}

.PanelItemGrid > article > a > div > div h2 {
    font-size: 18px !important;
    line-height: 21px;
    color: #333;
    margin: 20px 0 5px 0;
}

.PanelItemGrid > article > a > div > div p {
    font-size: 14px !important;
    line-height: 17px;
    color: #939598;
    font-weight: 300;
    margin: 0;
}

.PanelItemGrid > article > a > div > div p:hover {
    cursor: pointer;
}

.PanelItemGrid > article > a > div > div img {
    margin: 5px auto;
    z-index: 50;
    position: relative;
}

/*Layer in special markers*/
.PanelItemGrid aside:nth-of-type(1) {
    position: absolute;
    z-index: 150;
}

.PanelItemGrid aside:nth-of-type(1) > img {
    margin: 5px 0;
}

/*Layer in add to basket to list control*/
.PanelItemGrid aside:nth-of-type(2) {
    position: absolute;
    z-index: 150;
}

.PanelItemGrid aside:nth-of-type(2) > a {
    margin: 300px 0;
}


/* TabStrip */
.TabStrip {
    border-bottom: 2px solid #6d6d6d;
    height: 34px;
    background: url(/assets/images/app/tile_miproducts_tabs.gif) repeat-x #fff;
}

/* MIPRODUCTS TABS PANEL - Used for presentation of content in a tabbed view */

.MiproductsTabs {
    float: left;
    width: 100%;
    font-size: 12px;
    line-height: 16px;
    margin-top: 6px;
    height: 31px;
}

.MiproductsTabs ul {
    margin: 0 0 0 10px;
    padding: 0;
    list-style: none;
}

.MiproductsTabs li {
    display: inline;
    margin: 0;
    padding: 0;
}

.MiproductsTabs a {
    float: left;
    background: url(/assets/images/app/tabspanelleft.gif) no-repeat left top;
    margin: 0;
    padding: 0 0 0 4px;
    text-decoration: none;
}

.MiproductsTabs a span {
    float: left;
    display: block;
    background: url(/assets/images/app/tabspanelright.gif) no-repeat right top;
    padding: 10px 15px 6px 10px;
    color: #fff;
    font-weight: bold;
}

.MiproductsTabs a {
    background-position: 0% -42px;
}

.MiproductsTabs a span {
    background-position: 100% -42px;
}

.MiproductsTabsOn a {
    float: left;
    background: url(/assets/images/app/tabspanelleft.gif) no-repeat left top;
    margin: 0;
    padding: 0 0 0 4px;
    text-decoration: none;
}

.MiproductsTabsOn a span {
    float: left;
    display: block;
    background: url(/assets/images/app/tabspanelright.gif) no-repeat right top;
    padding: 10px 15px 6px 10px;
    color: #fff;
    font-weight: bold;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
.MiproductsTabs a span {
    float: none;
}
/* End IE5-Mac hack */
.MiproductsTabs a:hover span {
    color: #f93;
}

.MiproductsTabs a:hover {
    background-position: 0% 0px;
}

.MiproductsTabs a:hover span {
    background-position: 100% 0px;
}

/* Quick links for learning pages */
.QuickLinksPanel {
    width: 98%;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 30px;
}

.QuickLinksTitle {
    padding: 20px 0 0 0;
    font-size: 14px;
}

.QuickLinks {
    padding: 10px 0;
}

.QuickLinks a {
    display: block;
    text-decoration: none;
    margin: 8px 0;
    font-size: 12px;
    line-height: 14px;
}

.QuickLinks a.sel {
    font-weight: bold;
}

.QuickLinks h4 {
    font-size: 16px;
    line-height: 18px;
}

.NextAndPrevLinks {
    padding: 10px 0;
}

.NextAndPrevLinks > div {
    width: 50%;
    float: left;
    min-height: 1px;
}

.NextAndPrevLinks > div > a {
    text-decoration: none !important;
    font-size: 16px;
    line-height: 16px;
}

.NextAndPrevLinks > div > a > i {
    margin: 4px;
}

.NextAndPrevLinksTop > div {
    margin: 10px 0 0 0;
    padding: 0;
}

.NextAndPrevLinksBottom > div:last-of-type {
    text-align: right;
}

.NextAndPrevLinksBottom > div:first-of-type > a {
    margin: 20px 0 0 20px;
}

.NextAndPrevLinksBottom > div:last-of-type > a {
    margin: 20px 20px 0 0;
}

.ContentList {
}

.ContentList a {
    display: block;
    text-decoration: none;
}

.ContentList > div {
    padding: 20px 0 0 0;
}


/* Dashboard */
.UserPanel {
    background-color: #fafafa;
    padding: 12px 10px;
    border-bottom: 1px solid #dedede;
}

.UserPanelImage {
    display: table;
}

.UserPanelText {
    vertical-align: middle;
    display: table-cell;
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    color: #9d9d9d;
    padding: 0 20px;
}


.DashShortcutButtons {
    width: 50%;
    font-size: 12px;
    font-weight: 300;
    padding-top: 20px;
    padding-bottom: 10px;
    text-align: right;
}

.DashShortcutBtn {
    background-color: #fff;
    text-align: center;
    padding: 8px 15px;
    margin: 0 10px;
    border: 1px solid #ccc;
    border-radius: 8px;
    display: inline-block;
}

a.DashShortcutBtn:link, a.DashShortcutBtn:visited {
    color: #393b4a;
    text-decoration: none;
}

a.DashShortcutBtn:hover, a.DashShortcutBtn:active {
    color: #7a7a7a;
    background-color: #f5f5f5;
    text-decoration: none;
}

.DashShortcutLinks {
    padding: 8px 12px;
    border-bottom: 1px solid #dedede;
}

.DashShortcutLinks:hover {
    background-color: #fafafa;
}

.DashShortcutLinks a:link {
    text-decoration: none;
}

.DashShortcutLinks a:hover {
    color: #F60;
}

.DashSubHeader {
    font-size: 16px;
    font-weight: bold;
    color: #999;
    padding: 10px 2px;
    margin-top: 10px;
    display: inline-block;
    width: 80%;
}

.DashSubHeaderLink {
    display: inline-block;
    width: 18%;
}

.StatusDot_1 {
    color: #f60;
}
/*Editing*/
.StatusDot_2 {
    color: #333;
}
/*Completed*/

.DashProjIcon {
    padding: 6px;
}

.DashCustomerImgContainer {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    overflow: hidden;
}

.DashCustomerImg {
    width: 55px;
    height: 55px;
}

.DashCompanyImg {
    max-height: 55px;
}

.DashProjIconBorder {
    border: solid 2px #ccc;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    padding: 3px;
    margin: 5px 10px;
    text-align: center;
}

.DashProjIconBorder i {
    line-height: 28px;
    color: #ccc;
    height: 20px;
    width: 20px;
}

.DashProjIconBorder:hover {
    border: solid 2px #aaa;
}

.DashProjIconBorder:hover i {
    color: #aaa;
}

.DashProjIconBorder i.fa-angle-down {
    margin-top: 0;
}
/*Fix the verticle space difference*/
.DashProjIconBorder i.fa-angle-up {
    margin-top: -2px;
}
/*Fix the verticle space difference*/

.DashShortcutBtn i {
    color: #aaa !important;
}

.DashProjectMore i {
    color: #ccc;
}

.DashProjectMore:hover i {
    color: #aaa;
}

.DashContentFromCMS .cContent1 {
    min-height: 0;
}
/* The content is rarely entered on the Dashboard page, so override the standard min-height. */

a:link i, a:visited i {
    color: #ddd;
}

a:hover i {
    color: #aaa;
}

/* Project List */

.DashProjectPanel {
    width: 95%;
    padding: 20px 10px;
}

.DashCompletedProjects {
    width: 95%;
    margin: 10px 0;
}

.DashProjectList {
    width: 95%;
    margin: 10px 0;
}

.DashProjectList > tbody > tr {
    border-bottom: 1px solid #dedede !important;
}

.DashProjectList > tbody > tr:hover {
    background-color: #fafafa;
}

.DashProjectList td {
    padding: 8px 12px;
    font-size: 16px;
    line-height: 20px;
    color: #838383;
    font-weight: 400;
}

.DashProjectList a {
    display: block;
    padding: 0;
    border-radius: 3px;
}

.DashProjectList a:link {
    text-decoration: none;
    color: #838383;
}

.DashProjectList tr:not(last-of-type) a:hover {
    color: #e98b3a;
    background-color: #fff1e5;
}

.DashStatusDot span {
    font-size: 38px;
    line-height: none;
}

.DashArrowLink {
    width: 24px;
    height: 25px;
    background: url(/assets/images/arrow_project_dashboard.png) no-repeat top center;
}

.DashArrowLink :hover {
    background: url(/assets/images/arrow_project_dashboard_on.png) no-repeat top center;
}

.DashProjectList .dvgrid_pager table {
    float: right;
    margin-top: 5px;
}

.DashProjectList .dvgrid_pager td {
    text-align: right;
}

.DashProjectList .dvgrid_pager a {
    color: #333;
    font-size: 12px;
    text-decoration: none;
    line-height: 12px;
    border: 1px solid #666;
    border-radius: 3px;
    padding: 5px 10px;
    box-shadow: 0px 0px 1px 1px #ddd;
    margin-left: 2px;
}

.DashProjectList .dvgrid_pager a:hover {
    background-color: #f63;
    color: #fff;
    border: 1px solid #f63;
}

.DashProjectList .dvgrid_pager span {
    color: #333;
    font-size: 12px;
    text-decoration: none;
    line-height: 12px;
    border: 0;
    padding: 5px;
    font-weight: bold;
    box-shadow: 0 0 0 0;
}

.DashSubscription {
    padding: 5px 10px 5px 25px;
}


/* News story */
.DashStoryPanel {
    padding: 5px 0 15px 0;
}

.DashStoryPanel h3 {
    color: #ff7900;
    margin: 5px 0;
}

.DashStoryPanel hr {
    border-top-width: 3px;
    border-top-style: solid;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-top-color: #ff7900;
    margin-right: 0px;
    margin-left: 0px;
    margin-top: 5px;
    margin-bottom: 1rem;
}

.DashStoryHeading {
    font-weight: 300;
    color: #333;
    font-size: 18px;
    line-height: 21px;
}

.DashStoryText {
    font-weight: 300;
    color: #333;
    font-size: 14px;
    line-height: 18px;
}

.DashStoryText a:link {
    text-decoration: none;
}

.DashStoryImage {
    margin: 18px 0;
}

.NotesBanner {
    background-color: #595959;
    margin: 10px auto;
}

.HeaderProductPartners {
    background-color: #fac08f;
    text-align: center;
}

.HeaderNonProductPartners {
    background-color: #fdeada;
    text-align: center;
}


/* Shrink */
.ProjectImgContainer {
    width: 100px;
    height: 70px;
    overflow: hidden;
}

.ProjectImgContainer img {
    width: 100%;
    height: 100%;
    max-height: 100% !important;
    max-width: 100% !important;
}

.HoverShrink {
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.HoverShrink:hover, .HoverShrink:focus, .HoverShrink:active {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
}

/* Video */
.VideoDetailOuter {
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px 2%;
}

/* Responsive iframe */
.iframe4x3 {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 75%;
}
/* Aspect ratio is achieved through "padding-bottom"....  75% = 4x3; 56.25% = 16x9. */
.iframe16x9 {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 56.25%;
}
/* Aspect ratio is achieved through "padding-bottom"....  75% = 4x3; 56.25% = 16x9. */
.iframe4x3, .iframe16x9 iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Container for the DIV based Map handling	*/
.containerMap {
    width: 100%;
}

.outerMap {
    position: relative;
    width: 100%;
    padding-top: 75%;
}

.innerMap {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.GoogleMapInfoWindow {
    min-height: 100px;
    min-width: 200px;
}

.GoogleMapHeading1 {
    font-weight: bold;
    color: #11598a;
}

.GoogleMapText1 {
    font-size: 10px;
}
/* St No. */
.GoogleMapText2 {
    font-size: 10px;
    color: #000;
}
/* Suburb. */
.GoogleMapText3 {
    font-size: 10px;
    color: #000;
}
/* City. */
.GoogleMapText4 {
    font-size: 10px;
    color: #000;
}
/* Country. */
.GoogleMapText5 {
    font-size: 10px;
    color: #000;
    padding: 7px 0;
}
/* Phone. */
.GoogleMapText6 {
    font-size: 10px;
    color: #3488c1;
}
/* Web Address */
.GoogleMapText7 {
    font-size: 10px;
    color: #000;
}
/* Business type. */
.GoogleMapText8 {
    font-size: 10px;
    color: #000;
}
/* Untried as yet */
.GoogleMapText9 {
    font-size: 10px;
    color: #000;
}
/* Untried as yet */
.GoogleMapText10 {
    font-size: 10px;
    color: #000;
}
/* Untried as yet */

.GoogleMapButton {
    text-align: center;
    text-shadow: 0px 2px #0c1c5d;
    font-weight: 700;
    padding: 3px 20px;
    margin: 15px auto;
    font-size: 14px;
    line-height: normal;
    display: inline-block;
    border-radius: 5px;
    background-color: #0099ff;
    background-image: linear-gradient(0deg, #296abf, #1d327b 90%);
    cursor: pointer;
}

a.GoogleMapButton:link, a.GoogleMapButton:visited {
    text-decoration: none;
    color: #fff;
}

a.GoogleMapButton:hover, a.GoogleMapButton:active {
    text-decoration: none;
    background-color: #2a6abf;
    background-image: linear-gradient(0deg, #0099ff, #2a6abf 90%);
    transition: all 0.3s ease;
}

.GMapResultTable {
    margin-bottom: 20px;
    line-height: 1.5;
    border-top: 1px solid #bdbebf;
    background-color: #fff;
    width: 99%;
}

.GMapResultTable th {
    background-color: #11598a;
    font-weight: 300;
    color: #fff;
    padding: 10px;
}

.GMapResultTable tr {
    border-bottom: 1px solid #cdd6e1;
}

.GMapResultTable tr:hover {
    background-color: #f3f5f8;
}

.GMapResultTable td {
    font-size: 14px;
    padding: 12px 8px; /*vertical-align:top;*/
}

.GMapResultTable td > h4 {
    margin: 4px 0 6px 0;
}

.GMapResultTableSubHead {
    color: #939598;
    font-weight: bold;
}

.GMapResultCol1 {
    width: 70%;
}

.GMapResultCol2 {
    width: 15%;
}

.GMapResultCol3 {
    width: 15%;
}

.GMapResultCol4 {
    width: 15%;
}

/*video list icons and news list icons*/
.ib_gallery img {
    cursor: pointer;
    display: inline-block;
    border: 1px solid #aaa;
    background-color: #f5f5f5;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.ib_gallery_on img {
    cursor: pointer;
    display: inline-block;
    border: 1px solid #aaa;
    background-color: #fb9d18;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.ib_brief img {
    cursor: pointer;
    display: inline-block;
    border: 1px solid #aaa;
    background-color: #f5f5f5;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.ib_brief_on img {
    cursor: pointer;
    display: inline-block;
    border: 1px solid #aaa;
    background-color: #fb9d18;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.ib_list img {
    cursor: pointer;
    display: inline-block;
    border: 1px solid #aaa;
    background-color: #f5f5f5;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.ib_list_on img {
    cursor: pointer;
    display: inline-block;
    border: 1px solid #aaa;
    background-color: #fb9d18;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

/*----------------------------------------------*/
/* List Grid Layout -  Responsive Columns */

/*Containers */
.ListItem {
}

.ListItem article {
    border-top: 1px solid #e3e3e3;
    padding: 10px 5px;
    overflow: hidden;
}

.ListItem article > div:nth-of-type(1) {
    float: left;
    width: 30%;
    margin: 0 20px 0 0;
    vertical-align: top;
}

.ListItem article > div:nth-of-type(2) {
    float: left;
    width: 65%;
    vertical-align: top;
}

.ListItem h2 {
    font-size: 22px;
}

/* Product partner dashboard panels */
.TopBar {
    border: 1px solid #c6c8cb;
    padding: 0;
    background: url(/assets/images/app/tile_header_miproducts.gif) #f1f1f1 repeat-x;
    vertical-align: middle;
}

.TopBarNoBorder {
    padding: 0;
    background: url(/assets/images/app/tile_header_miproducts.gif) #f1f1f1 repeat-x;
    vertical-align: middle;
}

.WhiteBox {
    border: 1px solid #d9d9d9;
    background-color: #fff;
}

.WhiteBoxHeader {
    padding: 7px 8px;
    color: #68605e;
    border-bottom: 1px solid #e9eae2;
    background-color: #f5f6f1;
    border-top: 1px solid #fff;
    font-size: 14px;
    font-weight: bold;
}

.WhiteBoxHeaderSub {
    padding: 7px 8px;
    color: #68605e;
    border-bottom: 1px solid #e9eae2;
    background-color: #f9faf5;
    border-top: 1px solid #fff;
    font-size: 12px;
}

.DashboardH1 {
    font-size: 14px;
    font-weight: bold;
    color: #333;
    border-bottom: 3px solid #333;
    position: relative;
}

.DashboardBigNumber {
    background-color: #ff7900;
    padding: 8px 18px;
    text-align: center;
    color: #fff !important;
    font-weight: bold;
    font-size: 36px;
    line-height: 36px;
}

/* Authorise Spec */
.FooterAuthorise {
    border-top: 1px solid #333;
    padding: 15px 0;
    margin: 20px auto;
    width: 90%;
}

.FooterAuthQR {
    width: 25%;
    float: left;
    padding-top: 10px;
}

.FooterAuthText {
    width: 75%;
    float: left;
}

.AuthCheckAlert {
    margin: 20px auto;
    padding: 20px;
    font-size: 1.2em;
    background-color: #fcf7f2;
    border: 1px solid #ff9c2b;
    border-radius: 5px;
    box-shadow: 0 0 20px 0px #ccc;
}

.AuthCheck {
    padding: 20px 0 0 0;
}

.AuthCheck > div {
    height: 57px;
    width: 95px;
    margin: 0 5px;
    position: relative;
    display: inline-block;
}

.AuthCheck > div:nth-of-type(2) {
    width: 5px;
    margin: 0 0 0 -10px;
}

.AuthCheck > div span {
    position: absolute;
    left: 0;
    bottom: 0;
    line-height: 35px;
    font-size: 18px;
}

.AuthCheck > div input {
    position: absolute;
    left: 0;
    bottom: 0;
}

.AuthCheck > div label {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 14px;
    color: #ccc;
    cursor: context-menu;
}

.AuthCheck .BtnBase {
    position: absolute;
    left: 0;
    bottom: 0;
    margin: 0;
}

.AuthCheckResults {
    margin: 20px auto;
    padding: 10px;
}

.AuthReportErrorGroup {
    min-width: 300px;
    padding: 0 10px;
    margin: 20px auto;
}

.AuthReportErrorHeader {
    border: 1px solid #c0c0c0;
    background-color: #efefef;
    padding: 5px;
    cursor: pointer;
}

.AuthReportErrorBody {
    border: 1px solid #c0c0c0;
    border-top: 0px;
    padding: 5px 10px;
}

.AuthReportErrorHeader div:nth-of-type(1) {
    float: left;
    margin: 0 10px 0 5px;
}

.AuthReportErrorHeader div:nth-of-type(2) {
    float: left;
    max-width: 85%;
}

.AuthReportErrorForm {
    padding: 20px 0 0 0;
}

.AuthReportErrorForm > div {
    height: 57px;
    width: 295px;
    margin: 0 5px;
    position: relative;
    display: inline-block;
}

.AuthReportErrorForm > div input {
    position: absolute;
    left: 0;
    bottom: 0;
}

.AuthReportErrorForm > div label {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 14px;
    color: #ccc;
    cursor: context-menu;
}

.AuthReportErrorForm .BtnBase {
    position: absolute;
    left: 0;
    bottom: 0;
    margin: 0;
}


/*Chat icon*/
.ImgMessage {
    display: inline-block;
    margin: 0 15px -5px 0;
}

/*Free Trial*/
.ButtonFreeTrial {
    border: 1px solid #888;
    background-color: #e98b3a;
    cursor: pointer;
    border-radius: 4px;
    padding: 3px 10px;
    margin-right: 10px;
    margin-top: 0px;
    margin-bottom: 0px;
    color: #fafafa;
    font-size: 1.0rem;
}

.ButtonFreeTrial a:hover {
    text-decoration: none !important;
}

/* Password Reset Handling */
.WarningPasswordResetBox {
    background-color: #fcf1e6;
    border: 2px solid #ea8b3b;
    padding: 30px;
    margin: 0 0 30px 0;
}

.WarningPasswordResetText {
    float: left;
    width: 75%;
    font-size: 16px;
    line-height: 26px;
    color: #000;
}

.WarningPasswordResetIcon {
    float: left;
    width: 20%;
    max-width: 120px;
}

.WarningPasswordResetIcon img {
    margin: 0 auto;
}



/* Upload Chat Image */
#PreviewChatImage {
    height: 150px;
    overflow: hidden;
    text-align: center;
}

#PreviewChatImage img {
    height: 150px;
    max-width: 200px;
    max-height: 150px;
    margin: 0 auto;
}

.UploadChatImage {
    position: relative;
    height: 26px;
    line-height: 24px;
    text-align: center;
    color: #FFF;
    padding: 3px;
    margin: 15px auto;
}

.UploadChatImage form {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 100;
    filter: alpha(opacity=100);
}

.UploadChatImage form input {
    position: absolute;
    clip: rect(0 0 0 0);
}

/* Product partner contact request list page */
.cmrequestlist a {
    color: #e98b3a !important;
}

.cmrequestlist tr {
    cursor: pointer;
}

.snapshot-hamburger a {
    font-size: 16px;
    color: #000;
}

.snapshot-hamburger, a.aHamburgerShow, a.aHamburgerHide {
    display: none !important;
}


/* Price Calculator */
.PricingNotes {
    background-color: #ffeedd;
    padding: 15px;
    margin: 30px 0 0 0;
    border-radius: 5px;
    display: flex;
}

.PricingNotes p {
    margin: 0 !important;
}

.PricingNotes .left {
    display: inline-block;
    padding: 10px 10px 0 10px;
}

.PricingNotes .left i {
    font-size: 28px;
    color: #e98b3a;
}

.PricingNotes .main {
    display: inline-block;
    padding-left: 10px;
}

.PricingNotes .left1 {
    display: inline-block;
    padding: 0 10px 0 10px;
}

.PricingNotes .left1 i {
    font-size: 28px;
    color: #e98b3a;
}

.PricingNotes .main1 {
    display: inline-block;
    padding: 5px 0 0 10px;
}

.PricingCalculator {
    display: flex;
    padding: 15px;
}

.PricingCalculator .left {
    display: inline-block;
    padding: 10px 10px 0 10px;
}

.PricingCalculator .left i {
    font-size: 28px;
    color: #000;
}

.PricingCalculator .main {
    display: inline-block;
    padding-left: 10px;
    font-size: 14px;
}

.PricingCalculator .main h2 {
    margin: 0;
    font-size: 18px;
    font-weight: bold;
}
/* MAKE LAYOUT SHUFFLE at 1200px */
@media only screen and (max-width:1200px) {
    .span_1_of_4_CBI {
        width: 100%;
    }

    .snapshot-back-button {
        display:;
        padding-left: 0 !important;
        padding-top: 5px !important;
    }

    .snapshot-nav {
        width: 100% !important;
        max-width: calc(210mm - 40px) !important;
        margin: 0 0 0 1% !important;
        padding: 15px 5px 10px 5px !important;
    }

    .snapshot-hamburger {
        display: inline-block !important;
    }

    .sticky {
        position: inherit !important;
    }
    /*.mk-snapshot-container .sticky { position: sticky !important; top: 75px !important; }*/
    .snapshot-wrapper {
        width: 100% !important;
        max-width: 210mm !important;
    }


    #snapshot-nav-target:not( :target ) a.aHamburgerShow, #snapshot-nav-target:target a.aHamburgerHide {
        display: block !important;
    }

    #snapshot-nav-target:target > .cNavSub {
        display: block !important;
    }

    #snapshot-nav-target:target {
    }

    #snapshot-nav-target:not( :target ) > .cNavSub {
        display: none;
    }
}

@media only screen and (max-width:1800px) {
    .span_1_of_4_CBI_CIC {
        width: 100%;
    }

    .snapshot-back-button_CIC {
        display:;
        padding-left: 0 !important;
        padding-top: 5px !important;
    }

    .snapshot-nav_CIC {
        width: 100% !important;
        max-width: calc(210mm - 40px) !important;
        margin: 0 0 0 1% !important;
        padding: 15px 5px 10px 5px !important;
    }

    .snapshot-hamburger_CIC {
        display: inline-block !important;
    }

    .sticky_CIC {
        position: inherit !important;
    }
    /*.mk-snapshot-container .sticky { position: sticky !important; top: 75px !important; }*/
    .snapshot-wrapper_CIC {
        width: 100% !important;
        max-width: 210mm !important;
    }


    #snapshot-nav-target_CIC:not( :target ) a.aHamburgerShow, #snapshot-nav-target:target a.aHamburgerHide {
        display: block !important;
    }

    #snapshot-nav-target_CIC:target > .cNavSub {
        display: block !important;
    }

    #snapshot-nav-target_CIC:target {
    }

    #snapshot-nav-target_CIC:not( :target ) > .cNavSub {
        display: none;
    }
}

/* MAKE LAYOUT SHUFFLE at 1000px */
@media only screen and (max-width:1000px) {
    .PanelItemGrid4Col > article, .PanelItemGrid4ColProds > article, .PanelItemGrid4ColImages > article {
        width: 31%;
        margin: 0 1% 14px 1%;
    }
}

/*  MAKE LAYOUT SHUFFLE at 1000px  ============================================ */
@media only screen and (max-width: 1000px) and (min-width: 641px) {
    /* Use most of the width of the screen */

}

/* MAKE LAYOUT SHUFFLE at 900px */
@media only screen and (max-width: 900px) {
    .UserPanelText {
        font-size: 12px;
        line-height: 16px;
    }
}

/* MAKE LAYOUT SHUFFLE at 950px */
@media only screen and ( max-width: 950px) {
    /* Menu icon / menu row */
    .LogoRowCont .wrapper {
        width: 100%;
    }

    .LogoRowCont .PanelLoginAccount {
        margin: 0;
        line-height: 20px;
    }

    .LogoRow {
        height: 50px;
    }

    .LogoRow > div:nth-of-type(1) {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        max-width: 70vw;
        background-color: #fff;
        z-index: 99999;
        height: 60px;
    }
    /* Logo */
    .LogoRow > div:nth-of-type(1) img {
        max-width: 170px;
        float: left;
        max-width: 207px;
    }

    .LogoRow > div:nth-of-type(2) {
        position: absolute;
        width: 100%;
        text-align: right;
        top: 60px;
        left: 0;
        background-color: #ddd;
        height: 35px;
    }
    /* Login button / logged in text */
    .LogoRow .UserLink {
        text-align: right;
        color: #000;
        width: 90%;
        vertical-align: top;
    }

    .feedbackPosition {
        display: none;
    }

    /*Chat icon*/
    .LinkImgMessage {
    }

    .ContentStartRow {
        margin-top: 33px;
    }
    /*.LogoRow aside									{display:none;}			hide the pipe separateor */
    .BtnLoginNav {
        margin: 0 !important;
        font-size: 12px !important;
        padding: 2px 8px !important;
        box-shadow: none !important;
    }
    /* force buttons in Nav to be smaller */
    .ButtonSubscribe {
        margin: 0 20px 0 0;
        font-size: 12px !important;
        padding: 2px 8px !important;
        box-shadow: none !important;
    }
    /* force buttons in Nav to be smaller */

    .hNavMain .wrapper, .cNavMain .wrapper {
        width: 100vw;
    }
    /* Full width when we go to the mobile view. */
    #nav {
        position: fixed;
        top: 0;
        right: 0;
        width: 100vw;
        margin: 0;
        float: left;
        z-index: 88888;
        height: 60px;
        background-color: #fff;
        border-bottom: 1px solid #bbb;
    }

    #nav > a {
        height: 30px;
        position: relative;
        float: right;
        margin-top: 4px;
        width: 60px;
        color: #000;
    }

    #nav > a:hover {
        text-decoration: none;
        color: #222 !important;
    }

    #nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type {
        display: block;
    }

    #nav > ul {
        height: auto;
        display: none;
        position: absolute;
        left: 0;
        border: 0;
        width: 100%;
        top: 100%;
    }

    #nav .menuicon {
        float: left;
        font-size: 34px;
        line-height: 1.4em;
        font-weight: 400;
        padding: 0 14px 5px 20px;
    }

    #nav .menutext {
        float: left;
        font-size: 24px;
        line-height: 2.4em;
        font-weight: 300;
    }


    /* Make the header row smaller */
    .HdrSmaller {
        height: 40px !important;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

    .HdrSmaller > div:nth-of-type(1) {
        height: 40px;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

    .HdrSmaller > div:nth-of-type(1) img {
        max-width: 138px;
    }

    .HdrSmaller .menuicon {
        font-size: 22px !important;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

    .messagenumber {
        margin-left: -8px !important;
        font-size: 10px !important;
        padding: 1px !important;
        margin-top: -3px !important;
    }
    /*
	.HdrSmaller .LogoMain				{height:50px; top:0;}
	.HdrSmaller #nav > ul > li > a 	{padding:14px 20px;}	
	*/

    /* Generic */
    #nav li {
        width: 100%;
        border: none;
        border-top: 1px solid #c5c5c5;
        float: none;
    }

    #nav li a {
        line-height: 2.7em;
        padding: 0 1.0em 0 0.5em;
    }

    /* First level */
    /*#nav:target > ul {display:block; width:300px;}*/
    #nav:target > ul {
        display: block;
        width: 100vw;
    }

    #nav > ul > li {
        background-color: #f0f3f6;
        width: 100%;
        border-right: none;
    }

    #nav > ul > li > a {
        line-height: 2.5em;
    }

    #nav > ul > li > a > span:after {
        content: "\25BA";
        float: right;
        font-size: 1.2em;
        text-shadow: none;
    }
    /*  ? = &#9660; = \25BC  || For special chars, convert entity code to CSS hex here: http://www.evotech.net/articles/testjsentities.html */
    #nav > ul > li.active > a, #nav > ul > li.active > a > span::after {
        color: #222;
    }

    #nav > ul > li:hover > a, #nav > ul > li:hover > a > span::after {
        color: #222;
    }

    .navFirstLevelTitle {
        position: fixed;
        top: 50px;
        background-color: #fefefe;
        width: 100vw;
        border-top: 1px solid #bbb;
    }

    .navFirstLevelTitle span:after {
        content: "" !important;
    }

    .navFirstLevelTitle span:before {
        content: "\25C0  " !important;
    }

    /* Second level */
    #nav > ul > li > ul {
        display: none;
        visibility: visible !important;
    }

    #nav > ul > li > ul {
        width: 100% !important;
        position: static;
        border: 0;
        padding: 0;
        margin: 0;
        box-shadow: none;
        border-radius: 0;
        max-height: 0;
        opacity: 0.0;
        transition: max-width 2.0s, opacity 0.75s;
        -webkit-transition: max-width 2.0s, opacity 0.75s;
    }

    #nav > ul > li > ul > li:first-of-type {
        margin: 0;
    }

    #nav > ul > li > ul > li {
        display: block;
        width: 100%;
        border: none;
        margin: 0;
        padding: 0;
        font-size: 1em;
        border-bottom: 1px solid #c5c5c5;
    }

    #nav > ul > li > ul > li:first-child {
        border-top: 1px solid #c5c5c5;
    }

    #nav > ul > li > ul > li:last-child {
        border-bottom: none;
    }

    #nav > ul > li > ul > li > a {
        text-indent: 0.8em;
        font-size: 1.0em;
        border-radius: 0;
    }

    #nav > ul > li > ul > li > a:hover, #nav ul > li > ul:not( :hover ) li.active a {
        background-color: #dfe2e6;
        color: #000;
        border: 1px solid transparent;
    }

    #nav > ul > li > ul > li > a::before {
        margin: 0;
        content: "";
        position: absolute;
        left: 0;
        border: none;
    }

    #nav > ul > li > ul > li > a > span:after {
        content: '\25BC';
        margin-right: 0.5em;
        float: right;
        font-size: 1.1em;
    }
    /*  ? = &#9660; = \25BC  || For special chars, convert entity code to CSS hex here: http://www.evotech.net/articles/testjsentities.html */
    /*#nav > ul > li:hover > ul {max-height:800px; opacity:1; overflow:visible; padding:0;}*/

    /* Third level */
    #nav > ul > li > ul > li > ul {
        position: static;
        border: 0;
        padding: 0;
        margin: 0;
        box-shadow: none;
        border-radius: 0;
        max-height: 0;
        opacity: 0.0;
        transition: max-height 2.0s, opacity 0.75s;
        -webkit-transition: max-height 2.0s, opacity 0.75s;
    }

    #nav > ul > li > ul > li > ul {
        width: 100%;
        position: static;
    }

    #nav > ul > li > ul > li:hover > ul {
        max-height: 800px;
        opacity: 1;
    }

    #nav > ul > li > ul > li > ul > li {
        font-size: 1em;
        border-bottom: 1px solid #c5c5c5;
        padding: 0;
        border-left: none;
        border-radius: 0;
    }

    #nav > ul > li > ul > li > ul > li:hover {
        border-left: none;
        border-right: none;
        border-top: none;
    }

    #nav > ul > li > ul > li > ul > li:first-child {
        border-top: 1px solid #c5c5c5;
    }

    #nav > ul > li > ul > li > ul > li:last-child {
        border-bottom: none;
    }

    #nav > ul > li > ul > li > ul > li > a {
        text-indent: 1.5em;
        border: 0;
    }

    #nav > ul > li > ul > li > ul > li > a:hover, #nav ul > li > ul > li > ul:not( :hover ) > li.active a {
        background-color: #dfe2e6;
        color: #000;
    }
}


/* MAKE LAYOUT SHUFFLE at 768px */
@media only screen and (max-width: 768px) {
    .span_1_of_4Footer {
        width: 100%;
    }

    .FooterNavText {
        text-align: center;
        font-size: 16px !important;
        line-height: 24px !important;
        border-bottom: 1px solid #666;
        margin-bottom: 15px;
        padding-bottom: 10px;
    }

    .PageFooter hr {
        display: none;
    }

    .PageBannerHome h1 {
        line-height: 1.4;
        font-size: 2em;
    }

    .HeroPanel {
        width: 70% !important;
        margin: 50px auto;
        float: none !important;
    }

    .SectionPanel {
        margin: 20px auto !important;
    }

    .TableWidth80 {
        width: 100%;
    }

    .TableWidth80 td {
        font-size: 12px;
    }

    .Width10Flex {
        width: 20%;
    }

    .Width40Flex {
        width: 75%;
    }

    .ProductPanel {
        width: 47%;
        min-width: 240px;
        min-height: 260px;
        margin-right: 2%;
        border: 1px solid #f5f5f5;
    }

    .PanelItemGrid3Col > article, .PanelItemGrid3ColNarrow > article, .PanelItemGrid3ColDownloads > article, .PanelItemGrid3ColVideo > article, .PanelItemGrid4Col > article, .PanelItemGrid4ColProds > article, .PanelItemGrid4ColImages > article {
        width: 48%;
        margin: 0 1% 14px 1%;
    }

    /* Change the tabs to be vertically listed panels */
    .TabSet {
        width: 100%;
        max-width: 600px;
        margin: 50px auto;
    }

    .TabSet > nav {
        display: none;
    }

    .TabSet > article {
        border: none;
        margin: 0;
        z-index: 1001;
        padding: 0;
        background-color: transparent;
    }

    .TabSet > article > header {
        display: block;
        background-color: #fff;
        border: 1px solid #bcbcbc;
        margin: 0 10px 15px 10px;
        padding: 5px;
    }

    .NarrowViewText {
        display: block
    }

    .SocialLinks {
        width: 190px !important;
        margin: 0 auto;
    }
    /* Center Aligns the Social Icons */
    .SocialIcon {
        margin-right: 0;
        margin-left: 18px;
    }
}

/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
@media only screen and (max-width: 640px) {
    .span_2_of_2 {
        width: 100%;
    }

    .span_1_of_2 {
        width: 100%;
    }

    .span_3_of_3 {
        width: 100%;
    }

    .span_2_of_3 {
        width: 100%;
    }

    .span_1_of_3 {
        width: 100%;
    }

    .span_4_of_4 {
        width: 100%;
    }

    .span_3_of_4 {
        width: 100%;
    }

    .span_2_of_4 {
        width: 100%;
    }

    .span_1_of_4 {
        width: 100%;
    }

    .span_5_of_5 {
        width: 100%;
    }

    .span_4_of_5 {
        width: 100%;
    }

    .span_3_of_5 {
        width: 100%;
    }

    .span_2_of_5 {
        width: 100%;
    }

    .span_1_of_5 {
        width: 100%;
    }

    .span_6_of_6 {
        width: 100%;
    }

    .span_5_of_6 {
        width: 100%;
    }

    .span_4_of_6 {
        width: 100%;
    }

    .span_3_of_6 {
        width: 100%;
    }

    .span_2_of_6 {
        width: 100%;
    }

    .span_1_of_6 {
        width: 100%;
    }

    .span_7_of_7 {
        width: 100%;
    }

    .span_6_of_7 {
        width: 100%;
    }

    .span_5_of_7 {
        width: 100%;
    }

    .span_4_of_7 {
        width: 100%;
    }

    .span_3_of_7 {
        width: 100%;
    }

    .span_2_of_7 {
        width: 100%;
    }

    .span_1_of_7 {
        width: 100%;
    }

    .span_8_of_8 {
        width: 100%;
    }

    .span_7_of_8 {
        width: 100%;
    }

    .span_6_of_8 {
        width: 100%;
    }

    .span_5_of_8 {
        width: 100%;
    }

    .span_4_of_8 {
        width: 100%;
    }

    .span_3_of_8 {
        width: 100%;
    }

    .span_2_of_8 {
        width: 100%;
    }

    .span_1_of_8 {
        width: 100%;
    }

    .span_9_of_9 {
        width: 100%;
    }

    .span_8_of_9 {
        width: 100%;
    }

    .span_7_of_9 {
        width: 100%;
    }

    .span_6_of_9 {
        width: 100%;
    }

    .span_5_of_9 {
        width: 100%;
    }

    .span_4_of_9 {
        width: 100%;
    }

    .span_3_of_9 {
        width: 100%;
    }

    .span_2_of_9 {
        width: 100%;
    }

    .span_1_of_9 {
        width: 100%;
    }

    .span_10_of_10 {
        width: 100%;
    }

    .span_9_of_10 {
        width: 100%;
    }

    .span_8_of_10 {
        width: 100%;
    }

    .span_7_of_10 {
        width: 100%;
    }

    .span_6_of_10 {
        width: 100%;
    }

    .span_5_of_10 {
        width: 100%;
    }

    .span_4_of_10 {
        width: 100%;
    }

    .span_3_of_10 {
        width: 100%;
    }

    .span_2_of_10 {
        width: 100%;
    }

    .span_1_of_10 {
        width: 100%;
    }

    .span_11_of_11 {
        width: 100%;
    }

    .span_10_of_11 {
        width: 100%;
    }

    .span_9_of_11 {
        width: 100%;
    }

    .span_8_of_11 {
        width: 100%;
    }

    .span_7_of_11 {
        width: 100%;
    }

    .span_6_of_11 {
        width: 100%;
    }

    .span_5_of_11 {
        width: 100%;
    }

    .span_4_of_11 {
        width: 100%;
    }

    .span_3_of_11 {
        width: 100%;
    }

    .span_2_of_11 {
        width: 100%;
    }

    .span_1_of_11 {
        width: 100%;
    }

    .span_12_of_12 {
        width: 100%;
    }

    .span_11_of_12 {
        width: 100%;
    }

    .span_10_of_12 {
        width: 100%;
    }

    .span_9_of_12 {
        width: 100%;
    }

    .span_8_of_12 {
        width: 100%;
    }

    .span_7_of_12 {
        width: 100%;
    }

    .span_6_of_12 {
        width: 100%;
    }

    .span_5_of_12 {
        width: 100%;
    }

    .span_4_of_12 {
        width: 100%;
    }

    .span_3_of_12 {
        width: 100%;
    }

    .span_2_of_12 {
        width: 100%;
    }

    .span_1_of_12 {
        width: 100%;
    }

    .col {
        margin: 1% 0 1% 0%;
    }
    /* Use the full width of the screen */
    /* Control images when they have more space to display */
    .responsive-image img {
        height: auto !important;
        max-width: 80% !important;
        width: 80% !important;
    }
    /* Footer */
    .cNavBottom {
        text-align: center;
    }

    .HomePartnersPanel img {
        margin: 20px auto !important;
    }

    .HomePartnersPanel h6 {
        text-align: center;
    }

    .HomepageFeatureButton {
        width: 88%;
        margin: 6px auto;
    }

    .HomepageFeatureButtonAlt {
        width: 88%;
        margin: 6px auto;
    }

    .PartnerLogo {
        padding: 2px !important;
    }

    .AlignLeftImage {
        float: none !important;
        margin: 20px auto !important;
    }

    .AlignRightImage {
        float: none !important;
        margin: 20px auto !important;
    }
    /* .UserLink					{float:none !important;} */

    /* Get the login to fly down from the right place on smaller devices, otherwise it falls off the edge of the screen. */
    .PanelLoginCont {
        position: absolute;
        top: 0;
        right: 20px;
        height: 0;
        overflow: hidden;
        z-index: 10002;
    }

    .cNavSub {
        display: none;
    }

    .NextAndPrevLinksTop {
        text-align: left;
        display: none;
    }

    /*.LoginFull 					{display:none;}  */
    .LoginPhone {
        display: inline-block;
        float: right;
    }
    /* Quicl Links */
    .QuickLinksPanel {
        border-top: 2px solid #eaeaea;
    }

    .QuickLinksTitle {
        text-align: center;
    }

    .QuickLinks {
        text-align: center;
    }

    .QuickLinks h4 {
        text-align: center;
    }
}


@media only screen and (max-width: 480px) {
    .ListItem article > div:nth-of-type(1) {
        width: 90%;
    }

    .ListItem article > div:nth-of-type(2) {
        width: 90%;
    }

    /* Compare - Box Filter */
    .colBoxFilter {
        margin: 1% 0 1% 0%;
    }

    .ProductPanel {
        width: 98%;
        min-height: 260px;
        margin-right: 1%;
        margin-left: 1%;
        border: 1px solid #f5f5f5;
    }

    .PanelItemGrid3Col > article, .PanelItemGrid3ColNarrow > article, .PanelItemGrid3ColVideo > article, .PanelItemGrid3ColDownloads > article .PanelItemGrid4Col > article, .PanelItemGrid4ColProds > article, .PanelItemGrid4ColImages > article {
        width: 98%;
        float: none;
        margin: 0 auto 10px auto;
    }

    .PanelItemGrid > article > a > div {
        height: auto;
    }

    .PanelItemGrid4ColImages > article .ImgInfo {
        top: 100%;
    }

    /* Auth Check */
    .AuthCheck {
        padding-top: 55px;
    }

    .AuthCheck > div {
        height: 45px;
        margin: 5px 5px 0 5px;
        display: block;
    }

    .AuthCheck > div input {
        top: 0;
        bottom: initial;
        margin: 0 0 0 100px;
    }

    .AuthCheck > div label {
        top: 0;
        bottom: initial;
        margin: 10px 0 0 0;
        font-size: 14px;
        color: #ccc;
        cursor: context-menu;
    }

    .AuthCheck .BtnBase {
        top: 0;
        bottom: initial;
        margin: 0 0 0 100px;
    }

    .AuthCheck > div:nth-of-type(2) {
        display: none;
    }
}


/* miproducts panel */
.mip_Head2, .manf_Head2 {
    font-size: 16px;
    font-weight: bold;
    color: #000;
}

.mip_Head3, .manf_Head3 {
    font-size: 12px;
    font-weight: bold;
    color: #666;
}

.mip_Head20, .manf_Head20 {
    font-size: 16px;
    font-weight: bold;
    color: #000;
}

.mip_Head25, .manf_Head25 {
    font-size: 14px;
    font-weight: bold;
    color: #000;
}

.DataSheetsLinks {
    border-top: 1px solid #f3f3f3;
}

.DataSheetsLinks td {
    border-bottom: 1px solid #f3f3f3;
    font-size: 14px;
    padding: 8px 10px;
}

.listItem {
    display: list-item;
    list-style: disc;
    list-style-position: outside;
    font-size: 12px;
    line-height: 15px;
}
/* SEARCH LISTINGS */
#mip_container, #manf_container {
    width: 100%;
    clear: both;
    border-top: 1px solid #ccc;
    padding: 4px 0;
    vertical-align: top;
}

.mip_container, .manf_container {
    width: 100%;
    clear: both;
    border-top: 1px solid #ccc;
    padding: 4px 0;
    vertical-align: top;
}
/* 2 columns */
.mip_col_left, .manf_col_left {
    float: left;
    width: 20%;
    margin: 0px;
    margin: 4px 0;
}

.mip_col_right, .manf_col_right {
    float: right;
    width: 80%;
    margin: 0px;
    margin: 3px 0;
    text-align: left;
}

.mip_ImageList {
    margin-top: 5px;
    margin-bottom: 5px;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    clear: both;
}

.mip_ImageList img {
    max-width: 425px;
}

.MiproductsPDSView {
    margin-top: 5px;
    margin-bottom: 5px;
}

.iconSearchResult {
    float: left;
}


/* Popup window styles */
.popupHeaderBar {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    justify-content: center;
    position: fixed;
    background-color: #555;
    box-shadow: 0 0 8px #888;
    text-align: center;
    width: 100%;
    height: 50px;
    z-index: 200;
    top: 0;
    font-size: 0;
}

.popupHeaderBar div {
    font-size: 16px;
    color: #eee;
    font-weight: bold;
    padding: 16px 0 0 8px;
    text-shadow: 1px 1px 2px #000;
}

.popupHeaderBar ul {
    margin: 0;
    padding: 0;
}

.popupNavButtonActive {
    background: linear-gradient(#aaa,#888);
    text-shadow: 1px 1px 1px #000;
    color: #fff;
    font-weight: bold;
}

.popupNavButton {
    font-size: 16px;
    color: #eee;
    padding: 0 20px;
    margin: 0;
    height: 50px;
    line-height: 50px;
    border-right: solid 1px #aaa;
    vertical-align: central;
    display: inline-block;
}

.popupBody {
    margin: 50px 5px 75px 5px;
    padding: 5px;
}

.popupBottomBar {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 60px;
    z-index: 200;
    background-color: #555;
    vertical-align: top;
    box-shadow: 0 0 8px #888;
}

.popupBottomLeft {
    position: relative;
    display: inline-block;
    width: 49.5%;
    height: 100%;
    vertical-align: top;
}

.popupBoottomLeftContentHeader {
    font-size: 16px;
    color: #eee;
    font-weight: bold;
    padding: 8px 0 0 8px;
    text-shadow: 1px 1px 2px #000;
}

.popupBoottomLeftContentText {
    color: #ccc;
    font-size: 13px;
    padding: 5px;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.popupBottomRight {
    display: inline-block;
    width: 49%;
    height: 100%;
}

.popupBottomButtonNext, .popupBottomButtonNext:link, .popupBottomButtonNext:visited {
    float: right;
    color: #ddd;
    font-weight: bold;
    background-color: #6a6a6a;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    padding: 16px 18px;
    text-decoration: none;
    margin: 5px;
    border-radius: 4px;
    font-family: Arial,Helvetica,sans-serif;
    cursor: pointer;
}

.popupBottomButtonNext:hover,
.popupBottomButtonNext:active {
    background-color: #f08c3d;
    color: #fff
}

.spanButton {
    background-color: #eee;
    border: solid 2px #d3d3d3;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    color: #444;
    padding: 4px 10px;
}

.spanButton:hover {
    background-color: #d3d3d3;
}

.psWizardPopup {
    border-left: 5px solid #555;
    position: fixed;
    right: 0;
    top: 0;
    height: 100vh; /*width: 720px;*/
    width: 0;
    background-color: #fff;
    z-index: 999;
    overflow-y: auto;
    box-shadow: 0 0 8px 3px #666;
}



/* Border Less Style for telerik window. */
.borderLessDialog.RadWindow {
    border: none;
    padding: 0;
    box-shadow: 0 0 8px 3px #666;
    position: fixed !important;
    top: 0 !important;
}
/* remove the titlebar widening */
.borderLessDialog.RadWindow .rwTitleBar {
    margin: 0;
}
/* remove the titlebar */
.borderLessDialog .rwTitleBar {
    display: none;
}
/* remove the statusbar */
.borderLessDialog .rwStatusBar {
    display: none;
}
/* remove the border around the content */
.borderLessDialog.RadWindow .rwContent {
    border: none;
}
/*.borderLessDialog .rwCorner .rwTopLeft,
.borderLessDialog .rwTitlebar,
.borderLessDialog .rwCorner .rwTopRight,*/
.borderLessDialog .rwIcon,
.borderLessDialog table .rwTopLeft,
.borderLessDialog table .rwTopRight,
.borderLessDialog table .rwFooterLeft,
.borderLessDialog table .rwFooterRight,
.borderLessDialog table .rwFooterCenter,
.borderLessDialog table .rwBodyLeft,
.borderLessDialog table .rwBodyRight,
/*.borderLessDialog table .rwTitlebar,*/
.borderLessDialog table .rwTopResize,
.borderLessDialog table .rwStatusbar,
.borderLessDialog table .rwStatusbar .rwLoading {
    display: none !important;
}

.borderLessDialog .rwTitlebar {
    background-image: none !important;
    background-color: #000 !important;
}

.borderLessDialog .rwTitlebarControls em {
    color: #fff !important;
}

.borderLessDialog .rwTitleRow em {
    width: 90% !important;
}


.iconSource, .iconSubject {
    vertical-align: middle;
    display: inline-block;
    width: 20px;
    height: 20px;
}

.tblForm {
    width: 100%;
}

.tblForm > tbody > tr > td:first-child {
    padding: 10px 20px;
    font-size: 13px;
    color: #555;
}

.tblForm > tbody > tr > td {
    padding: 10px 20px;
    vertical-align: top;
    color: #555;
    font-size: 14px;
}

.tblForm select {
    box-sizing: border-box;
    padding: 4px;
    font-size: 14px;
    line-height: 1.5;
    border: 1px solid #8e8e8e;
    border-radius: .25rem;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    height: 36px;
    width: auto;
}

.tblForm input[type="file"] {
    width: auto !important;
    font-size: 14px;
    padding: 2px;
    border: solid 1px #666;
}

/*.tblForm input[type="button"] {
		width: auto !important;
		padding: 4px 12px;
		font-size: 14px;
		color: #666;
		border-radius: 3px;
		border: solid 1px #666;
	}*/

.tblForm input[type="text"] {
    box-sizing: border-box;
    padding: 4px;
    margin: 0;
    font-size: 16px;
    line-height: 1.5;
    color: #000;
    background-color: #fff;
    border-radius: .25rem;
    border: solid 1px #666;
    width: 90%;
    max-width: 794px;
}

.tblForm textarea {
    box-sizing: border-box;
    padding: 4px;
    margin: 0;
    font-size: 16px;
    line-height: 1.5;
    color: #000;
    background-color: #fff;
    border-radius: .25rem;
    border: solid 1px #666;
    width: 90%;
    max-width: 800px;
    height: 75px;
    font-family: Arial,Helvetica,sans-serif;
}

.tblForm .deleteBtn {
    font-size: 12px;
    color: #666;
    cursor: pointer;
}

.tblForm .deleteBtn:hover {
    color: #f63;
}
/* Switch:  Form decoration - make a switch out of a checkbox  */
/* The switch - the box around the slider */
.SliderSwitch, .prettyCBNormal, .prettyCB {
    position: relative;
    display: inline-block;
    width: 45px;
    height: 26px;
    margin: 5px 0 0 0;
}
/* Hide default HTML checkbox */
.SliderSwitch input, .prettyCB input, .prettyCBNormal input {
    display: none;
}

.SliderSwitch label, .prettyCB label, .prettyCBNormal label {
    position: absolute;
    width: 500px;
    max-width: 90vw;
    left: 0;
    padding: 4px 0 4px 65px;
    z-index: 100;
    cursor: pointer;
}

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
    cursor: pointer;
}

.slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider, input:checked + label + .slider {
    background-color: #1d327b;
}

input:focus + .slider, input:focus + label + .slider {
    box-shadow: 0 0 1px #1d327b;
}

input:checked + .slider:before, input:checked + label + .slider:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}
/* Rounded sliders */
.slider.round {
    border-radius: 24px;
}

.slider.round:before {
    border-radius: 50%;
}

/* Small Slider */
.SliderSwitchSmall {
    position: relative;
    display: inline-block;
    width: 23px;
    height: 13px;
    margin: 0;
}
/* Hide default HTML checkbox */
.SliderSwitchSmall input {
    display: none;
}

.SliderSwitchSmall label {
    position: absolute;
    width: 600px;
    max-width: 90vw;
    left: 0;
    padding: 4px 0 4px 65px;
    z-index: 100;
    cursor: pointer;
}

.sliderSmall {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
    cursor: pointer;
}

.sliderSmall:before {
    position: absolute;
    content: "";
    height: 9px;
    width: 9px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .sliderSmall, input:checked + label + .sliderSmall {
    background-color: #1d327b;
}

input:focus + .sliderSmall, input:focus + label + .sliderSmall {
    box-shadow: 0 0 1px #1d327b;
}

input:checked + .sliderSmall:before, input:checked + label + .sliderSmall:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}
/* Rounded sliders */
.sliderSmall.round {
    border-radius: 24px;
}

.sliderSmall.round:before {
    border-radius: 50%;
}

/* Custom Cbeck Box/Radio to fix some style of sliderswitch */
/* prettyCB for Option that have title and description */
.prettyCB {
    margin: 0 0 30px 0 !important;
    display: block !important;
}

.prettyCB input {
    vertical-align: middle;
}

.prettyCB label span:first-child {
    font-size: 16px;
    line-height: 20px;
    color: #555;
}

.prettyCB label span:nth-of-type(2) {
    font-size: 12px;
    line-height: 16px;
    color: #2d4285;
}

.SliderSwitch.prettyCB label {
    margin-top: -8px;
}

.prettyCBNormal {
    margin: 0 0 30px 0 !important;
    display: block !important;
}

.prettyCBNormal:hover label span:nth-of-type(1) {
    color: #f63;
}

.prettyCBNormal input {
    vertical-align: middle;
}

.prettyCBNormal label span:first-child {
    font-size: 16px;
    line-height: 20px;
    color: #555;
}

.prettyCBNormal label span:nth-of-type(2) {
    font-size: 12px;
    line-height: 16px;
    color: #2d4285;
}

.SliderSwitch.prettyCBNormal label {
    margin-top: -8px;
}



/* prettyCB for Option that only have title */
.prettyCBSingle {
    margin: 0 0 30px 0 !important;
    display: block !important;
}

.prettyCBSingle:hover label span:nth-of-type(1) {
    color: #f63;
}

.prettyCBSingle input {
    vertical-align: middle;
}

.prettyCBSingle label span:first-child {
    font-size: 16px;
    line-height: 20px;
    color: #555;
}

.SliderSwitch.prettyCBSingle label {
}


/* Icon */
.shareTypeIconCommunity, .shareTypeIconMyOrg, .shareTypeIconOneOff, .purposeIcon {
    margin-left: 500px;
    width: 28px;
    height: 28px;
}

.prettyCB .shareTypeIconCommunity, .prettyCB .shareTypeIconMyOrg, .prettyCB .shareTypeIconOneOff, .prettyCB .purposeIcon {
    position: absolute;
    left: 0;
    top: 0;
    margin-left: 0px;
    margin-top: -5px;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 1px solid transparent;
}

.prettyCB .iconSource, .prettyCB .iconSubject {
    margin: 5px;
    width: 25px;
    height: 25px;
}

.prettyCB > div {
    opacity: 0.7;
}

.prettyCB input:checked ~ div {
    opacity: 1.0;
    border: 1px solid #f5871f;
    background-color: #fff9f4;
}

.prettyCB input:checked ~ label > span:nth-of-type(1) {
    color: #dd740b;
}

.prettyCB:hover label > span:nth-of-type(1) {
    color: #f63 !important;
}

.maskDiv {
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #333;
    opacity: 0.5;
}

.itemWithdrawn {
    display: inline;
    position: absolute;
    color: red;
    font-weight: bold;
    padding: 20px;
    transform: rotate(-10deg);
}


.hideBrTag tr > td:nth-child(2) {
    padding: 5px;
}

.hideBrTag tr > td:nth-child(2) > br {
    display: none !important;
}

.hideBrTag td {
    font-size: 14px;
    line-height: 20px;
}

.hideBrTag .deleted {
    padding: 10px;
}

.totalSizeLimitExceeded {
    color: red !important;
}

/* In-page alert and information panels */
.in-page-alert-panel {
    max-width: 800px;
    margin: 18px 10px;
    padding: 10px 30px 10px 70px;
    font-size: 1.1em;
    position: relative;
}

.in-page-alert-panel i {
    position: absolute;
    top: 15px;
    left: 10px;
}

.in-page-alert-help {
    position: absolute;
    top: -5px;
    right: 30px;
}
/* Only applies to the admin when the "HelpItem" user control is used. */
.in-page-alert-panel p {
    color: #333;
}

.in-page-alert-panel a {
    font-weight: bolder;
}

.in-page-alert-title {
    font-size: 1.3em;
}

.in-page-alert-emphasis {
    font-style: italic;
}

.in-page-alert-btn {
    margin: 20px 10px 15px 10px;
}

.in-page-alert-note {
    background-color: #eaf7fd;
    border-left: 6px solid #2d465d;
}

.in-page-alert-note i {
    color: #2d465d;
}

.in-page-alert-warning {
    background-color: #fff8d0;
    border-left: 6px solid #ff9c2b;
}

.in-page-alert-warning i {
    color: #ff9c2b;
}

.in-page-alert-error {
    background-color: #f9e1df;
    border-left: 6px solid #e83724;
}

.in-page-alert-error i {
    color: #e83724;
}

/* Google Icon Sizing */
.material-icons.md-18 {
    font-size: 18px;
}

.material-icons.md-24 {
    font-size: 24px;
}

.material-icons.md-36 {
    font-size: 36px;
}

.material-icons.md-48 {
    font-size: 48px;
}

.in-page-alert-notes {
    background-color: #fff8d0;
}


.disabledButton, .disabledButton:hover {
    color: #ccc !important;
    background-image: url('');
    background-color: #f1f1f1 !important;
    border: 2px solid #eee !important;
}


.BtnOrange, .BtnOrange:link, .BtnOrange:visited {
    font-size: 14px;
    display: inline-block;
    color: #f63;
    background-color: #fff;
    text-align: center;
    padding: 3px 15px 3px 15px;
    text-decoration: none;
    margin: 0 6px;
    border-radius: 3px;
}

a.BtnOrange:hover, a.BtnOrange:active {
    background-color: #f08c3d;
    color: #fff;
}

/* Manf Doc Library */
.manfLogoM {
    color: #000 !important;
    font-weight: bold !important;
    display: inline !important;
    padding: 0 !important;
    background: none !important;
}

.manfLogoM-White {
    color: #fff !important;
    font-weight: bold !important;
    display: inline !important;
    padding: 0 !important;
    background: none !important;
}

.manfLogoD {
    color: #f63 !important;
    font-weight: bold !important;
    display: inline !important;
    padding: 0 !important;
    background: none !important
}
/*PP Dashboard*/
/* Three sections on Dashboard */
.DashboardStats {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Creates three columns of equal width */
    grid-gap: 5px; /* Space between grid items */
}

.DashboardCol3 {
    width: calc(100% - 5px);
}
/* For larger screens where we want 3 columns */
@media (min-width: 1501px) {
    .DashboardStats {
        grid-template-columns: repeat(3, 1fr); /* Creates three columns of equal width */
    }
}
/* For medium screens where we want 2 columns */
@media (max-width: 1500px) and (min-width: 1001px) {
    .DashboardStats {
        grid-template-columns: repeat(2, 1fr); /* Two columns on smaller screens */
    }
}
/* For smaller screens where we want 1 column */
@media (max-width: 1000px) {
    .DashboardStats {
        grid-template-columns: 1fr; /* One column on very small screens */
    }
}
/* Content of dashboard three garphs */
.DashboardCol3 a {
    text-decoration: none !important;
}

.DashboardCol3 .Count {
    display: inline;
    font-weight: bold;
    color: #e98b3a;
    text-decoration: underline;
}

.TopAlertBar.PanelHeader {
    padding: 10px;
    background: #fae1da;
    margin: 7px;
    border: 1px solid #8e8e8e;
    color: black;
    font-size: 12px;
}

.TopAlertBar a {
    font-weight: bold;
}

.TopNoAlertBar.PanelHeader {
    padding: 10px;
    background: #fff;
    margin: 7px;
    border: 1px solid #8e8e8e;
    color: black;
    font-size: 12px;
}

.TopAlertBar.PanelHeader:hover {
    opacity: 0.9;
    border: 1px solid #000;
    background: #fdd3c8;
}

.TopNoAlertBar.PanelHeader:hover {
    opacity: 0.9;
    border: 1px solid #000;
    background: #fdd3c8;
}

.mspecpplogo {
    height: 28px;
    width: auto;
    padding-bottom: 5px;
    padding-top: 9px;
}

.mdocspplogo {
    height: 25px;
    width: auto;
    padding-bottom: 9px;
    padding-top: 8px;
}

.miproductspplogo {
    height: 28px;
    width: auto;
    padding-bottom: 5px;
    padding-top: 9px;
}

.DashboardBigNumber {
    width: fit-content;
    max-width: 120px;
    float: left;
    margin-right: 10px;
}

.Dashboardtext {
    font-size: 10px;
    line-height: 14px;
    padding: 10px 10px 0 10px;
    color: #4e4e50 !important;
}

.ChartMarginTop {
    display: block;
    margin-top: 20px;
}

.iconBell {
    color: #ff7900;
    font-size: 20px !important;
}

.iconCheck {
    color: #66dac2 !important;
    font-size: 20px !important;
}

.DashboardHasBeenSpecified {
    clear: both;
}

.DashboardHasBeenSpecified a {
    text-decoration: none !important;
    font-size: 10px;
}

.TopAlertBar .iconBell {
    color: #ff7900;
    font-size: 20px !important;
}

.DivLink {
}

.DivLink:hover > div {
    background-color: #f1f1f1;
}

.DivNoLink {
}

.DivNoLink:hover > div {
    cursor: auto;
}

.DivNoLink .TopNoAlertBar.PanelHeader:hover {
    opacity: 1;
    border: 1px solid #8e8e8e;
    background: #fff !important;
}

/* Order Confirmation Screen */
.ComfirmMessageSubscribe {
    border: 1px solid #888;
    background-color: #ffeedd;
    padding: 20px;
    margin: 20px 0;
}

/* Responsive Handling for three sections */
@media screen and (max-width: 992px) {
    .DashboardCol3 {
        width: 100% !important;
    }
}

@media screen and (max-width: 600px) {
    .DashboardCol3 {
        width: 100% !important;
    }
}
/* Dashboard message notice */
.DashboardMsg a:link, .DashboardMsg a:visited {
    color: #000;
    text-decoration: none !important;
}

.DashboardMsg a:hover, .DashboardMsg a:active {
    color: #f60;
    text-decoration: underline !important;
}

.DashboardMsg {
    padding: 30px 20px !important;
    font-size: 14px;
    text-align: left;
    background-color: #e7f0fa;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    margin: 26px 0 30px 2px;
    overflow: hidden;
    width: calc(100% - 50px);
    position: relative;
}

.DashboardMsg > div {
    float: left;
    font-size: 14px;
    text-align: left;
    max-width: 90%;
}

.DashboardMsg > div > span {
    display: block;
}

.DashboardMsgClose {
    position: absolute;
    top: 10px;
    right: 10px;
}

a.DashboardMsgClose:hover {
    text-decoration: none !important;
}

a.DashboardMsgClose:link, a.DashboardMsgClose:visited {
    color: #000;
    text-decoration: none;
}

a.DashboardMsgClose:hover, a.DashboardMsgClose:active {
    color: #000;
    text-decoration: none;
}

.DashboardMsgClose span {
    background-color: #fff;
    padding: 0px 7px 0px 7px;
    border: 1px solid #cccccc;
    font-size: 16px;
    line-height: 0;
    border-radius: 3px;
    margin: 3px;
}

.DashboardMsg p {
    margin: 4px 0 0 0;
}
/*PP Dashboard End */


/*Table Handling - Product Partners*/
.DashboardPPWorkSection {
    max-height: 180px;
    overflow: auto;
    border: solid 1px #aaa;
}

.DashboardPPWorkSection .TableStd {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.DashboardPPWorkSection .TableStd > tbody > tr > td:nth-of-type(1) {
    padding-right: 20px;
}

.DashboardPPWorkSection .TableStd > thead > tr > th:nth-of-type(3), .TableCustPPWorkSection > tbody > tr > td:nth-of-type(3) {
    text-align: right;
}
/*Make the number in the 3rd column align right*/
.DashboardPPWorkSection .TableStd > thead > tr > th:nth-of-type(4), .TableCustPPWorkSection > tbody > tr > td:nth-of-type(4) {
    text-align: right;
}
/*Make the size / button in the 4th column align in the middle*/
.DashboardPPWorkSectionHeader {
    font-size: 16px;
    font-weight: bold;
}


/* Icon Pulse - Stops after a time - Black to Blue */
.iconBellPulse {
    -webkit-animation: iconbellpulse1 1s 20 alternate; /* animation name, duration, overall time, plays back & forth */ /* ## Note: to make continuous flashing replace the '10' with 'infinite' ## */
    -animation: iconbellpulse1 1s 20 alternate;
}

@-webkit-keyframes iconbellpulse1 {
    from {
        color: #000;
    }

    to {
        color: #f63;
    }
}

@keyframes iconbellpulse1 {
    from {
        color: #000;
    }

    to {
        color: #f63;
    }
}

.shareModal {
    z-index: 10000 !important;
}

.shareModalContent {
    margin-top: 100px !important;
}

.shareInputText {
    border: 1px solid #8e8e8e !important;
}

.buttonCopy {
    cursor: pointer;
}

.BtnDisabled {
    background-color: #eee;
    color: #aaa;
}

.snapshotLoginPanel {
    width: 400px;
    border: solid 1px #aaa;
    border-radius: 4px;
    margin: auto;
    background-color: #eee;
    margin-top: 100px;
    margin-bottom: 150px;
    padding: 30px 20px;
}


/* Cloud Issue Messages */
.CloudIssueMessageBox {
    width: 90%;
    max-width: 700px;
    margin: 40px auto;
}

.CloudIssueMessageBox h4 {
    font-weight: 700;
    font-size: 20px;
}

.CloudIssueLogoBanner {
    border-bottom: 3px solid #000;
    padding: 25px;
}

.CloudIssueLogoBanner img {
    margin: 0 auto;
}

.CloudIssueMessageBox i {
    text-align: center;
}

.DashboardMessageBox {
    width: calc(100% - 70px) !important;
    margin: 40px 0;
    border: 1px solid #ccc;
    border-left: 4px solid #e98b3a;
    padding: 20px;
    -webkit-box-shadow: 0 0 10px 10px rgb(140 140 140 / 10%);
    -moz-box-shadow: 0 0 10px 10px rgba(140, 140, 140, 0.1);
    box-shadow: 0 0 10px 10px rgb(140 140 140 / 10%);
}

/* TELERIK RAD WINDOW Transparency overrides */
div.RadWindow.RadWindow_Stream .rwCorner,
div.RadWindow.RadWindow_Stream .rwTitlebar,
div.RadWindow.RadWindow_Stream .rwStatusbarRow,
div.RadWindow.RadWindow_Stream .rwFooterCenter 
{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); opacity:100; -moz-opacity:100; display:none; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px;}

div.RadWindow.RadWindow_Stream .rwTitlebar .rwIcon	{display:none;}

div.RadWindow.RadWindow_Stream .rwWindowContent div	{width:100%;}

div.RadWindow.RadWindow_Stream .rwWindowContent .CloseButton	{margin-right:5px;}
div.RadWindow.RadWindow_Stream	{background-color:#ced7e5; border-width:3px; border-style:solid; border-color:#5176B5; padding:3px;}

/* RadEditor Overrides */
.RadEditor	{height:100%;}

/* RadToolTip Overrides */
div.RadToolTip_ImagePopup .rtWrapperTopLeft,
div.RadToolTip_ImagePopup .rtWrapperTopCenter,
div.RadToolTip_ImagePopup .rtWrapperTopRight,
div.RadToolTip_ImagePopup .rtWrapperLeftMiddle,
div.RadToolTip_ImagePopup .rtWrapperRightMiddle,
div.RadToolTip_ImagePopup .rtWrapperBottomLeft,
div.RadToolTip_ImagePopup .rtWrapperBottomCenter,
div.RadToolTip_ImagePopup .rtWrapperBottomRight
{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); opacity:100; -moz-opacity:100; display:none; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px;}

/* Editor Floating Toolbar - Temporary fixing - Mozilla Issue 20170524_cn  */
/* This overrides => html:first-child .RadWindow ul */
.reToolbar {float: left !important; border: none!important;}
.chatlist {
    z-index: 9999998;
    position: absolute;
    top: 65px;
    right: 560px;
}
.chatlistbyspec {
    z-index: 9999998;
    position: fixed;
    top: 40%;
    left: 35%;
}
.chatdetail {
    z-index: 9999999;
}

.top-bar {
    color: white;
    padding: 10px;
    position: relative;
    overflow: hidden;
    min-width: 380px;
    background-color: #a3cfe5;
}
.cursor-move {
    cursor: move;
}
.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently*/
}
.message-summary {
    z-index: 1000px;
    top: 60;
    position: fixed;
    float: right;
    margin-left: 10px;
    min-width: 400px;
}
.img-circle {
    border-radius: 50%;
}
.pull-left {
    float: left !important;
    position: relative;
}

.icon_minim {
    padding: 2px 10px;
}

.msg_container_base {
    background: #fff;
    margin: 0;
    padding: 0;
    max-height: 300px;
    overflow-x: hidden;
}
.msg_system {
    padding-left: 0;
    margin-left: 0;
    background-color: #fff !important;
}
.messagesheader {
    display: block;
    clear: both;
    width: 418px;
    max-width: 416px;
}
.msg_receive {
    padding-left: 0;
    margin-left: 0;
    background-color: #f0f4f8 !important;
}
.msg_sent {
    margin-right: 0;
    background-color: #c7edfc !important;
}
.msg_time_sent {
    font-size: 12px;
    color: #aaa;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    text-align: right;
}
.msg_time_receive {
    font-size: 12px;
    color: #aaa;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    text-align: left;
}
.messages_system {
    background: white;
    padding: 10px;
    max-width: 100%;
}
.messages_system > p {
    font-size: 13px;
    color: #666;
    margin: 0 0 0.2rem 0;
}
.messages_system > time {
    font-size: 11px;
    color: #ccc;
}
.messages {
    padding: 8px;
    border-radius: 6px;
    /*box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);*/
    width: 400px;
    max-width: 400px;
}
.messages > p {
    font-size: 13px;
    margin: 0.1rem 0 0.1rem 0;
}
.msg_container {
    padding: 5px 10px;
    overflow: hidden;
    display: flex;
}

.avatar {
    position: relative;
}
.base_system {
}
.base_receive > .avatar:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border: 5px solid #FFF;
    border-left-color: rgba(0, 0, 0, 0);
    border-bottom-color: rgba(0, 0, 0, 0);
}
.base_sent {
    justify-content: flex-end;
    align-items: flex-end;
}
.base_sent > .avatar:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 0;
    border: 5px solid white;
    border-right-color: transparent;
    border-top-color: transparent;
    box-shadow: 1px 1px 2px rgba(black, 0.2);
}

.msg_sent > time {
    float: right;
}
.msg_breakline {
    border-bottom: 1px solid #bbb;
}
.msg_breaklinetext {
    text-align: center;
    z-index: 1;
    margin-top: -12px;
}
.msg_breaklinetext span {
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 13px;
    color: #aaa;
    background-color: #fff;
    padding: 10px;
}
.msg_nochattext {
    text-align: center;
    z-index: 1;
}
.msg_nochattext span {
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 13px;
    color: #aaa;
    background-color: #fff;
}

.messagenumber {
    color: #fff;
    background-color: red;
    z-index: 5;
    margin-left: -18px;
    margin-top: -8px;
    position: absolute;
    padding: 3px;
    border-radius: 12px;
    font-family: Arial;
    font-size: 12px;
    line-height: 12px;
    min-width: 12px;
    text-align: center;
    font-weight: bold;
}
.messagenumberdashboard {
    color: #fff;
    background-color: red;
    z-index: 5;
    margin-top: -8px;
    position: absolute;
    padding: 3px;
    border-radius: 12px;
    font-family: Arial;
    font-size: 12px;
    line-height: 12px;
    min-width: 12px;
    text-align: center;
    font-weight: bold;
}
.numberunread {
    color: #fff;
    background-color: red;
    z-index: 5;
    margin-left: 0px;
    margin-top: 0px;
    position: absolute;
    padding: 3px;
    border-radius: 12px;
    font-family: Arial;
    font-size: 12px;
    line-height: 12px;
    min-width: 12px;
    text-align: center;
    font-weight: bold;
}

.msg_container_base::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}
.msg_container_base::-webkit-scrollbar {
    width: 12px;
    background-color: #F5F5F5;
}
.msg_container_base::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
}

.btn-group.dropup {
    position: fixed;
    left: 0px;
    bottom: 0;
}

.chat {
    list-style: none;
    margin: 0;
    padding: 0;
}
.chat li {
    margin-bottom: 10px;
    padding: 5px;
    border-bottom: 1px dotted #B3A9A9;
    cursor: pointer;
}
.chat li:hover {
    background-color: #f0f0f0;
}
.chat li.left .chat-body {
    margin-left: 60px;
}
.chat li.right .chat-body {
    margin-right: 60px;
}
.chat li .chat-body p {
    margin: 0;
    color: #777777;
}

.panel .slidedown .glyphicon, .chat .glyphicon {
    margin-right: 5px;
}
.panel-body {
    overflow-y: scroll;
    height: 400px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}
::-webkit-scrollbar {
    width: 12px;
    background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
}

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('/assets/fonts/glyphicons-halflings-regular.eot');
    src: url('/assets/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/assets/fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('/assets/fonts/glyphicons-halflings-regular.woff') format('woff'), url('/assets/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('/assets/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

.glyphicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.glyphicon-comment::before {
    content: "\e111";
}
.glyphicon-minus::before {
    content: "\2212";
}
.glyphicon-unchecked:before {
    content: "\e011";
}
.icon_minim {
    padding: 2px 10px;
}
.glyphicon-remove::before {
    content: "\e014";
}
.glyphicon-edit::before {
    content: "\e065";
}

.form-control {
    display: block;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-size: 14px;
    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-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-radius: 4px;
}
.btn-group-sm > .btn, .btn-sm {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}
.btn-primary {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}

.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0;
}
.input-sm {
    height: 30px !important;
    padding: 0 5px 0 5px !important;
    font-size: 12px;
    line-height: 1.2;
    border-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}
.input-group .form-control, .input-group-addon, .input-group-btn {
    display: table-cell;
}
.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0;
}
.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group > .btn, .input-group-btn:first-child > .dropdown-toggle, .input-group-btn:last-child > .btn-group:not(:last-child) > .btn, .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:first-child > .btn-group:not(:first-child) > .btn, .input-group-btn:first-child > .btn:not(:first-child), .input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group > .btn, .input-group-btn:last-child > .dropdown-toggle {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.input-group-btn > .btn {
    position: relative;
}

.chat_input_disabled_inner {
    vertical-align: bottom;
}
.chat_input:empty:before {
    content: attr(data-placeholder);
    color: #bbb;
}
.chat_input:focus:before {
    content: none;
}
.selectsource {
    min-width: 180px;
    max-width: 300px;
    padding: 5px;
    height: auto !important;
}

.chatlist_link {
    text-decoration: none !important;
}
.chatlist_link strong {
    text-decoration: none !important;
    color: #333 !important;
}
.chatlist_link small {
    color: #777 !important;
}

.chat_input_lines {
    position: relative;
    z-index: 2;
    margin-bottom: 0;
    display: table-cell;
    padding: 3px !important;
    font-size: 16px;
    line-height: 20px;
    border-radius: 3px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    width: 400px;
    height: 180px;
    min-width: 400px;
    min-height: 180px;
    max-width: 400px;
    max-height: 180px;
    overflow-y: auto;
    overflow-wrap: break-word;
}
.chat_input_lines:empty:before {
    content: attr(data-placeholder);
    color: #bbb;
}
.chat_input_lines:focus:before {
    content: none;
}

/* Make the button flash - Stops after a time */
.OutlinePulse, .OutlinePulse:link, .OutlinePulse:visited {
    -webkit-animation: pusate 1s 10 alternate; /* animation name, duration, overall time, plays back & forth */
    -animation: pusate 1s 10 alternate;
}
.OutlinePulse:hover, .OutlinePulse:active {
}

@-webkit-keyframes pusate {
    from {
        color: #36C;
        border: 1px solid #888;
    }

    to {
        border: 1px solid #36C;
        background-color: #8dc9e8;
    }
}
@keyframes pusate {
    from {
        color: #36C;
        border: 1px solid #888;
    }

    to {
        border: 1px solid #36C;
        background-color: #8dc9e8;
    }
}

/* Icon Pulse - Stops after a time - Black to Blue */
.IconPulse {
    -webkit-animation: iconpusate 1s 20 alternate; /* animation name, duration, overall time, plays back & forth */ /* ## Note: to make continuous flashing replace the '10' with 'infinite' ## */
    -animation: iconpusate 1s 20 alternate;
}
.icon-background1 {
    color: #eee !important;
    /*background-color: #ddd;*/
}
.icon-user {
}

@-webkit-keyframes iconpusate {
    from {
        color: #000;
    }

    to {
        color: #f63;
    }
}
@keyframes iconpusate {
    from {
        color: #000;
    }

    to {
        color: #f63;
    }
}

/* -------------------------------------------------------------------- */
/* Modern chat styling for Chat Detail */
/* These rules override and enhance the existing styles in this file for
   the chat window and message elements. They are scoped under
   `.chat-window` to avoid conflicting with other parts of the site. */

/* Chat window container */
.chat-window {
    position: fixed;
    right: 50px;
    min-width: 460px;
    width: 500px;
    z-index: 9990009;
    bottom: auto !important;
}

/* Panel wrapper */
.chat-window .panel {
    position: relative;
    overflow: visible;
    background-color: #fff;
    border: 1px solid #a3cfe5;
    border-radius: 8px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
}

/* Panel heading (top bar) */
.chat-window .panel-heading {
    background-color: #a3cfe5;
    color: #333;
    border-color: #a3cfe5;
    padding: 10px 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.chat-window .panel-heading.panel-heading-chat-closed {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

/* Title inside panel heading */
.chat-window .panel-heading .panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 1.3;
    color: inherit;
    white-space: nowrap;
    overflow: hidden;
}

/* Links and icons inside header */
.chat-window .panel-heading a {
    color: #ffffff;
}

/* Body (message list) */
.chat-window .msg_container_base {
    background-color: #ffffff;
    padding: 12px;
    max-height: 320px;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
}

/* Date divider */
.chat-window .msg_breakline {
    border-bottom: 1px solid #e4e4e4;
    margin: 24px 0 14px;
}
.chat-window .msg_breaklinetext {
    text-align: center;
    margin-top: -14px;
}
.chat-window .msg_breaklinetext span {
    font-size: 12px;
    color: #8a8f98;
    background: #ffffff;
    padding: 0 10px;
}

/* No chat available text */
.chat-window .msg_nochattext {
    text-align: center;
    margin: 20px 0;
}
.chat-window .msg_nochattext span {
    font-size: 13px;
    color: #9aa3ad;
    background: #ffffff;
    padding: 0 10px;
}

/* Message grouping container */
.chat-window .message-group {
    display: flex;
    flex-direction: column;
    margin: 12px 0;
}
.chat-window .message-group.sent {
    align-items: flex-end;
}
.chat-window .message-group.received {
    align-items: flex-start;
}

/* Header above each group (sender name and time) */
.chat-window .message-header {
    font-size: 10px;
    color: #aaa;
    margin-bottom: 2px;
    width: 100%;
}
.chat-window .message-group.sent .message-header {
    text-align: right;
}
.chat-window .message-group.received .message-header {
    text-align: left;
}

/* Hide the inline timestamp within each individual message when grouping */
.chat-window .message-group .msg_time_sent,
.chat-window .message-group .msg_time_receive {
    display: none;
}

/* Base message row layout */
.chat-window .message-group .row.msg_container {
    width: auto;
    max-width: 75%;
    margin: 0;
    padding: 0;
}

/* Individual message bubble (sent & received) */
.chat-window .messages.msg_sent,
.chat-window .messages.msg_receive {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 8px;
    margin: 2px 0;
    max-width: 75%;
    word-wrap: break-word;
}
.chat-window .messages.msg_sent {
    background-color: #d1e9ff;
    align-self: flex-end;
    text-align: left;
    float: right;
    clear: both;
}
.chat-window .messages.msg_receive {
    background-color: #f0f4f8;
    align-self: flex-start;
    text-align: left;
}

/* Remove default width constraints from messages */
.chat-window .messages {
    width: auto;
    max-width: 100%;
    padding: 0;
    border-radius: 0;
}

/* Reset original container paddings and margins for base_sent/base_receive */
.chat-window .base_sent,
.chat-window .base_receive {
    margin: 0;
    padding: 0;
    width: auto;
    display: flex;
}

/* Footer with input and send button */
.chat-window .panel-footer {
    border-top: 1px solid #ddd;
    background-color: #f6f9fc;
    border-radius: 0 0 8px 8px;
}
.chat-window .panel-footer:not(.chat_input_disabled_outer) {
    border-color: #e5edf3;
    padding: 8px 12px;
}
.chat-window .panel-footer.chat_input_disabled_outer {
    border-color: #FFCCCB;
    padding: 16px 12px;
}

/* Image upload icon */
.chat-window .panel-footer .ImgUpload {
    font-size: 18px;
    color: #6c7a89;
    cursor: pointer;
    align-items: center;
}
.chat-window .panel-footer .ImgUpload.fa-spinner {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    transform-origin: 50% 55%;
    cursor: default;
    pointer-events: none;
    padding: 0;
}

/* Content editable text area */
.chat-window .panel-footer .chat_input {
    z-index: 2;
    box-sizing: border-box;
    position: relative;
    cursor: text;
    font-size: 13px;
    line-height: 1.4;
    color: #555;
    background-color: #fff;
    width: auto !important;
    height: 44px;
    padding: 6px 8px;
    margin-bottom: 0;
    border: 1px solid #ced5dd;
    border-radius: 5px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow-y: auto;
    overflow-x: hidden;
    overflow-wrap: break-word;
}
.chat-window .panel-footer .chat_input:empty:before {
    content: attr(data-placeholder);
    color: #a6b2c4;
    font-size: 13px;
}
.chat-window .panel-footer .input-group:not(.chat_input_disabled_inner, .loading) {
    display: grid;
    grid-template-columns: 24px 1fr 60px;
    grid-template-rows: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
}
.chat-window .panel-footer .input-group.chat_input_disabled_inner,
.chat-window .panel-footer .input-group.loading {
    display: block;
    text-align: center;
    width: 100%;
}
.chat-window .panel-footer .input-group.loading {
    height: 44px;
    padding: 8px 12px;
    box-sizing: border-box;
}
.chat-window .panel-footer .input-group.loading * {
    display: none;
}
.chat-window .panel-footer .input-group.loading::before {
    z-index: 10;
}
.chat-window .panel-footer .input-group.loading::after {
    content: "━━━━━ Connecting ━━━━━";
    background-color: #a3cfe5;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    color: #666;
    font-style: italic;
    text-align: center;
    align-content: center;
}

/* Send button */
.chat-window .panel-footer .input-group-btn .btn {
    width: 60px;
    height: 44px;
}

/* Pending messages semi-transparent */
.chat-window .pending {
    opacity: 0.5;
    filter: alpha(opacity=50);
    transition: opacity 0.2s;
}

/* Ensure icons inside the top bar scale nicely */
.chat-window .icon_minim,
.chat-window .icon_close {
    font-size: 14px;
}
/* tooltip box styles */
.tooltipbox {
	z-index: 9999;
	position: absolute;
	background-color: #f7f7f7;
	color: #888;
	border-radius: 2px;
	padding: 5px 8px;
	font-size: 13px;
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 0.3rem;
	max-width: 250px;
}


.tooltipbox-right::after, .tooltipbox-right::before {
	right: 100%;
	top: 1rem;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.tooltipbox-right::after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #f7f7f7;
	border-width: 6px;
	margin-top: -8px;
}

.tooltipbox-right::before {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: rgba(0,0,0,0.2);
	border-width: 7px;
	margin-top: -9px;
}


.tooltipbox-bottom::after, .tooltipbox-bottom::before {
	left: 10px;
	top: 1rem;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.tooltipbox-bottom::after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #f7f7f7;
	border-width: 7px;
	margin-top: -29px;
}

.tooltipbox-bottom::before {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: rgba(0,0,0,0.2);
	border-width: 7px;
	margin-top: -30px;
}


/*.tooltipbox-right:before {
	z-index: 9999;
	position: absolute;
	top: 2px;
	left: -5px;
	widows: 0;
	height: 0;
	display: inline-block;
	content: "";
	border-right: 10px solid #f7f7f7;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	background-color: transparent;
}*/

.tooltipbox-top::after, .tooltipbox-top::before {
	left: 10px;
	top: 1rem;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.tooltipbox-top::after {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #f7f7f7;
	border-width: 7px;
	margin-top: 10px;
}
.tooltipbox-top::before {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: rgba(0,0,0,0.2);
	border-width: 7px;
	margin-top: 11px;
}
/*.tooltipbox-bottom:before {
	z-index: 9999;
	position: absolute;
	top: -15px;
	left: 3px;
	widows: 0;
	height: 0;
	display: inline-block;
	content: "";
	border-bottom: 10px solid #546269;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid transparent;
	background-color: transparent;
}*/

.tooltipbox-left:before {
	position: absolute;
	top: 3px;
	right: -6px;
	widows: 0;
	height: 0;
	display: inline-block;
	content: "";
	border-left: 10px solid #546269;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	background-color: transparent;
}

.tooltipFadeOut {
	/* opacity transition */
	-webkit-transition: all 0.5s linear 0s;
	-moz-transition: all 0.5s linear 0s; /* Firefox 4 */
	-o-transition: all 0.5s linear 0s; /* Safari 和 Chrome */
	transition: all 0.5s linear 0s; /* Opera */
	/* css */
	opacity: 0;
	z-index: -1; /* set z-index to -1 so the text does not block other content */
}


.tooltipbox-red {
	border-color: red !important;
	background-color: #ffd4d4 !important;
	color: #333 !important;
}
.tooltipbox-bottom-red{
}
.tooltipbox-bottom-red::after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #ffd4d4 !important;
}
.tooltipbox-bottom-red::before {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: red !important;
}