﻿/*	MAIN.CSS
====================================================
ALL FORMATTING SHOULD BE INCLUDED IN THIS STYLESHEET
====================================================
*/

/*Page Body*/
body {
    font-family: 'Noto Sans', sans-serif;
    margin-left: 60px;
    
}

.parent {text-align:center;}

.container {
    text-align:left; 
    width:100%; 
    height:100%; 
    padding-left:0px;
}

#divParentMain {
    width:98%; 
    oldwidth:990px;
    background-color:white;
    
}

#divMain {
    padding:0 10px;
}

.abbi_new_tab {
    opacity:.5;
}

.abbi_new_tab:hover {
    opacity:1;
}

/*Hyperlink*/
a {text-decoration: none;}
a:link {
    color: #0074E4;
}
a:visited {
    color: #0074E4;
} 
a:active {color: #000000;}
a:hover {
    text-decoration: underline;
    /*font-weight:600;*/
}



.NOSPACINGPADDING { 
    border-spacing: 0px;
    border-collapse: collapse;
}

/*New SIDE Menu Layout Added 11/3/17 B3*/
.sidebar_newmenutxt {
    vertical-align:middle; 
    /*height:30px; */
    height:40px;
    width:26px; 
    margin:0;
    font-size:24px; 
    display:inline-block; 
    /*padding:10px 0;*/
    white-space:nowrap;
    text-align:center;
    color:white;
    
}

/*.sidebar_newmenutxt:hover {
    background-color: black;
}*/


.sidebar_newmenutxt a {
    text-decoration: none;
    color: white;
    font-size: 15px;
}

.sidebar_newmenutxt a:hover {
    text-decoration: underline;
    font-weight:600;
   /* background-color: black;*/
}


.sidebar_newmenutxt a i {
    text-decoration: none;
    color: white;
    font-size: 19px;
    margin-left: 10px;
}


#SideBar label {
    font-size: 14px;
    background-color: white;
    border-bottom: 0px solid lightgray;
    display: none;
}
.sidebar_newmenulbl {
    font-size:14px;
    background-color:white; 
    border-bottom:0px solid lightgray;
}
.sidebar_newmenulbl a {
    text-decoration: none;
    color: white;
    padding-bottom:-2px;
}
#SideBar_Marker {
    color:white;
    font-size:30px;
}


/*td {
    width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}*/



/*New Menu Layout Added 10/10/17 B3*/
.newmenutxt {
    vertical-align: middle;
    height: 20px;
    width: 26px;
    border: 1px solid white;
    margin-top: 1px;
    margin-left: 2px;
    margin-right: 2px;
    font-size: 24px;
    display: inline-block;
    background-color: white;
    padding: 2px 4px 2px 5px;
    white-space: nowrap;
    text-align: center;
}
.v2_unused_newmenutxt {
    vertical-align:middle; 
    height:35px; 
    /*width:26px; */
    border:1px solid white; 
    margin-top:1px; 
    margin-left:2px; 
    margin-right:2px; 
    font-size:40px; 
    display:inline-block; 
    background-color:white; 
    padding:2px 4px 2px 5px;
    white-space:nowrap;
    text-align:center;  
}
.newmenutxt a {
    text-decoration: none;
    color: #2966b8;
}
.newmenulbl {
    font-size: 14px;
    
    border-bottom: 3px solid #2966b8;
    
}
.newmenulbl a {
    text-decoration: none;
    color: black;
    padding-bottom:-2px;
}

/*Multi Check Box Control CSS*/
.mcbMAIN {
    border:solid 1px lightgray;
    border-radius:3px;
}
.mcbMAIN:hover {
    border-color:gray;
}


/*Font Awesome Tweaks*/
.gfa-sub-icon {        
    font-size: 75%;
    margin: 20% 0px 0px 40%;
}

.gfa-sub-icon-inverse {        
    color:white;
    font-size: 60%;
    margin: 30% 0px 0px 50%;
    text-shadow: -1px 0 black, 0 1px 2px black, 1px 0 2px black, 0 -1px black;
}

.gfa-empty-inverse {
  text-shadow: -1px 0 white, 0 1px 2px white, 1px 0 2px white, 0 -1px white;
}

.gfa-empty {
  color:white;
  text-shadow: -1px 0 #2966B8, 0 1px 1px #2966B8, 1px 0 1px #2966B8, 0 -1px #2966B8;
}

.gfa-smaller {
  font-size:75%;
}

.gfa-half {
  font-size:50%;
}

.gfa-quarter {
  font-size:25%;
}
 
.gfa-offset {
  margin:15% 0px 0px 15%;
}

.gfa-offset-top {
  margin:-15% 0px 0px 0px;
}

.gfa-offset-bottom {
  margin:15% 0px 0px 0px;
}

.gfa-offset-left {
  margin:0px 0px 0px -10px;
}

.gfa-offset-right {
  margin:0px 0px 0px 10px;
}

.gfa-offset-lower {
  margin:7% 0px 0px 7%;
}

.gfa-offset-upper {
  margin:-7% 0px 0px -7%;
}

/*Header*/
.logo {margin-left:0px;}

/*Menu*/
.menuOLD {margin-top:-45px; margin-left:-10px; display:inline-block; width:960px}
.menu {width:100%; font-size:14px; background-color:white; padding-bottom:1px; }
.menuleft {background-image:url(../images/_menubgleft.png); height:35px; width:10px; display:inline-block; vertical-align:middle; position:relative; margin-left:0px;}
.menuright {background-image:url(../images/_menubgright.png); height:35px; width:19px; display:inline-block; vertical-align:middle; position:relative;margin-left:-3px;}
.menubg {background-image:url(../images/_menubg.png); background-repeat:repeat-x; height:35px; width:100%; display:inline-block; vertical-align:middle; text-align:left; position:relative; margin-left:-2px; padding-right:-2px;}
.menutxt {vertical-align:middle; height:28px; width:26px; border:3px solid white; margin-top:1px; margin-left:2px; margin-right:2px; overflow:hidden; font-size:24px; display:inline-block; background-color:white; padding:2px 4px 2px 5px;}
.menutxt:hover {
    border:1px solid lightgray;
    text-align:center;
    white-space:normal;
    font-size:14px;
    width:auto;
    height:30px;
}
    .menutxt a {
        text-decoration: none;
        color: #2966b8;
    }/*  #00AEEF;}*/

.menutxtactive {color:#000000;}
.menuLowerCase {font-size:14px;}
.menuLowerCaseMORE {font-size:14px;}

/*Dropdown Menu*/
#sddm{margin:0; padding:0; float:right; margin-top:2px;}
#sddm span {margin: 0; padding: 0; list-style: none;}
#sddm span a {display: inline-table; padding: 0px 5px; color: #2966b8; text-align: center;}
#sddm span a:hover {background:#fff; border: solid thin #ccc; text-decoration:none;}
#sddm div {position: absolute; visibility: hidden; margin: 0; padding: 0; background: #fff; border:solid thin #ccc;}
#sddm div a	{position: relative; display: block; margin: 0; padding: 5px; width: 60px; white-space: nowrap; text-align: left; text-decoration: none; background: #fff; color: #2966b8; font: 12px Calibri}
#sddm div a:hover {background:#2966b8;	color:#fff;}







/*Box Divs*/
/*.box, .todopopup {background-image:url(../images/_boxtop.png); background-repeat:repeat-x; display:inline-table; margin:5px; background-color:White; border:solid 1px #ececec; box-shadow:3px 3px 7px #777; border-radius:6px;}*/
.box, .todopopup {
    display:inline-block; 
    /*overflow:auto; */
    width:auto; 
    /*
    margin-top:5px; 
    margin-bottom:5px;
    */
    background-color:White; 
    /*border:solid 1px #ececec; */
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.infobox, .todopopup {display:inline-table; background-color:White; border:solid thin #ececec;}
.halfboxtop, .todopopuptop {height:30px; width:473.5px; padding:0px; margin:0px; overflow:hidden; text-align:left;}
.quarterboxtop {height:30px; width:740px; padding:0px; margin:0px; overflow:hidden; text-align:left;}
/*.fullboxtop {height:30px; width:958px; padding:0px; margin:0px; overflow:hidden; text-align:left;}*/
.fullboxtop {height:30px; width:100%; padding:0px; margin:0px; overflow:hidden; text-align:left; border-bottom:solid 0px #ececec;}
.labeltext {font-size:18px; color:grey;}
/*.boxtop {height:30px; padding:0px; margin:0px; overflow:hidden; text-align:left;}*/
.boxtop {min-height:30px; text-align:left; border-bottom:solid 0px #ececec; background-color:white; width:100%; white-space:nowrap; overflow:hidden;}
/*.boxbottom {background-image:url(../images/_boxbottom.png); background-repeat:repeat-x; height:33px; padding:0px; margin:0px; overflow:hidden; text-align:left;}*/
.boxbottom {height:33px; padding:0px; margin:0px; overflow:hidden; text-align:left; border-top:solid 2px #ececec; background-color:#eeeeee;}

/*6-24-2020 B3 ADDED  overflow:auto;  to prevent Empty Rule Error on Compile */
.boxtext { overflow:auto; }
.clsSEARCHFIELD { overflow:auto; }
.clsDATAFIELD { overflow:auto; }
.makeLink { overflow:auto; }
.dialogcommandsmall { overflow:auto; }

.occSquare i {margin-right:6px;}

/*Miscellaneous*/
.todo_dropdown {
    width: 150px;
    margin-top: 5px;
    position: absolute;
    left: 850px;
}
.noborder {border:0px;}
.clear {
    margin:0px; 
    padding:0px;
    clear: both;
}

/*Footer*/
/*.footer {text-align:center; width:990px; border-top: #888888 solid 1px; margin-top:20px;}*/
.footer {
    text-align:center; 
    width:100%; 
    border-top: #888888 solid 1px; 
    margin-top:2px; 
    position:fixed; 
    bottom:0; 
    right:0px; 
    background-color:white; 
    padding-top:2px; 
    padding-bottom:2px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size:12px;
}

/*Dialog Content*/
.dialogboxOLD {display:inline-table; margin:5px; background-color:White; border:solid 1px black;}
/*
.dialogbox {display:inline-table; margin:5px; border:solid 1px black;
	background-color:#ECECEC;
	background-image:url(../images/_boxtop.png);
	background-repeat:repeat-x;
	box-shadow:3px 3px 7px #777;
	border-radius:6px;
}

.dialogboxwhite {display:inline-table; margin:5px; border:solid 1px black;
	background-color:White;
	background-image:url(../images/_boxtop.png);
	background-repeat:repeat-x;
	box-shadow:3px 3px 7px #777;
	border-radius:6px;
}

.dialogboxtop {height:30px; padding:0px; margin:0px; overflow:hidden; text-align:left;}
*/


/*COMMENTED out to update style: Vince C*/
/*.dialogbox {
    margin:0px; 
    border:solid 1px black;
	background-color:#ECECEC;
    border-left:solid 1px #ececec; 
    border-right:solid 1px #ececec; 
    border-top:solid 2px #cccccc; 
    border-bottom:solid 8px #dddddd;
	box-shadow:3px 3px 7px #777;
}*/

.dialogbox {
    background-color: white;
    box-shadow: 3px 3px 7px #777;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.dialogboxwhite {display:inline-table; margin:5px; border:solid 1px black;
	background-color:White;
    border-left:solid 1px #ececec; 
    border-right:solid 1px #ececec; 
    border-top:solid 2px #cccccc; 
    border-bottom:solid 8px #dddddd;
	box-shadow:3px 3px 7px #777;
}

.dialogboxtop {height:30px; width:100%; padding:0px; margin:0px; overflow:hidden; text-align:left; border-bottom:solid 2px #dddddd; background-color:white;}


.dialogcontent {
    font-size: 15px;
}
.controlpadding {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.dialogdonecommand {font-size:22px; /*float:right;*/}
.dialogcommand {font-size:18px; white-space:nowrap;}
.dialogcommand_small {font-size:14px;}
.curveborder {border-radius:6px;}
.dropshadow {box-shadow:3px 3px 7px #777;}
.dropshadowL {box-shadow:3px 3px 7px #A7A8AF;}
.topshade {
	background-color:White;
	background-image:url(../images/_boxtop.png);
	background-repeat:repeat-x;
}
.TMClass { font-variant:small-caps; font-size:10px; }

.SectionHeader { font-size:18px; font-weight:bold; }

/* Section defining Milestone Styling */
 .milestone {
    display: block;
    padding-right: 10px;
    margin-top: 4px;
    margin-bottom: 4px;
    float: left;
}
.milestone span {
    cursor: default;
}
#milestoneContent {
    border-top: 1px solid #C2C2C2;
    border-bottom: 2px solid #C2C2C2;
    width: 67%;
    min-width: 365px;
    padding-left: 10px;
    white-space: nowrap;
}
.invisibleMilestone {
    visibility: hidden;
}

/* Dashboard reports */
.dashboardDisplaySubTitle {
   font-style: italic; 
}
table.dashboardDisplay {
   border-spacing: 2px; 
   border-collapse: separate; 
   display: table;  
   margin-bottom: 8px;
}
.dashboardDisplay td { 
   padding: 4px 15px 4px 15px; 
	-moz-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	-webkit-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	-o-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
}
.dashboardDisplay td:not(:first-child) {
    background: #EDF2F2; 
    background-color: #EDF2F2;
    text-align: center;
    white-space: nowrap;
}
.dashboardDisplay td:first-child:not(.noteRow) { 
	background: #E6F7F7; 
	background-color: #E6F7F7; 
	border-left-color: #E6F7F7; 
}
.dashboardDisplay th { 
   padding-right: 12px; 
   padding-left: 12px;
   padding-bottom: 4px;
   font-weight: 500; 
   font-style: italic; 
   text-align: center; 
   font-size: 80%; 
   vertical-align: bottom; 
}
.dashboardDisplay td:not(:first-child):hover { 
   border: 1px solid #393939; 
   padding: 3px 14px 3px 14px; 
}
.dashboardDisplay tr:hover td:not(:first-child) { 
   background: #D4D4D4; 
	background-color: #D4D4D4;           
}
.dashboardDisplay td:not(:first-child):active { 
   border: 1px solid #FFF; 
}
.dashboardDisplay tr:hover td:first-child:not(.noteRow) { 
   border-left: 4px solid #91A5A5; 
   background: #A3C7C7; 
   background-color: #A3C7C7; 
   padding-left: 11px; 
}
.tdClick {
   color: #2966B8;
   text-decoration: none;
   cursor: pointer;
}
.tdZero {
   font-size: 65%;
   font-style: italic;
}
.percentage {
   font-style: italic;
   font-size: 85%;
   white-space: nowrap;
}
div#divSalesConversion  table.dashboardDisplay {
    width: 100%;
}
 
/* Import Styling */
 #divImportContactsDialog {
     text-align:left; 
     padding:4px; 
     user-select: none; 
     -webkit-user-select: none; 
     -moz-user-select: none; 
     -khtml-user-select: none;
 }

 /*WOM Styling*/
 .WOTable {
    width: 100%;
    border: 0;
    border-spacing:0px;
    border-collapse:collapse;
    
}
.WOTable td {
    padding-left: 4px;
    padding-right: 4px;
    border-bottom: 1px solid #eeeeee;
    border-right: 1px solid #eeeeee;
}
.WOTableSubTitle {
    border-bottom: 2px solid gray !important;
    border-right: 2px solid gray !important;
    text-align: center;
    padding-left: 4px;
    padding-right: 4px;
}

 /* overdue tasks block */
 .warning {
     color: #990000 !important;
}
#overdueTasksCount {
    float: right;
    margin-right: 25px;
}
#overdueTasksCount i {
    opacity: 0.75;
    padding-right: 8px;
    padding-top: 3px;
}
#overdueTasksCount i.noTasks {
    visibility: hidden;
    display: none;
}
#overdueTasksCount a {
    font-size: 0.6em;
}
/* Search and Deploy */
#divStepOne {
    padding-top: 8px;
}
#divStepOne label
, #divStepOne label:focus {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline-style: none;
    margin-right: 4px;
}
#divStepTwo a {
    margin-right: 10px;
}

#divNextStepSelection:focus {
    outline: none !important;
    border:1px solid #7F9DB9;
}
.abbiListItem {
    padding-left:4px;
    padding-right:4px;
    color:#0645AD;
}
.abbiListItem:hover {
    background-color:#1E90FF;
    color:white;
}

/*  DataTable to HTML Automatic Styling */
.dt2htmlTitle {
    margin: 0px 55px 25px 25px;
    padding: 12px;
    font-size: 140%;
    font-weight: 600;
    color: #7D6666;
    text-align: left;
}
.dt2htmlSubTitle {
   font-size: 70%; 
   font-style: italic; 
}
table.dt2html {
   /*width: 85%;*/
   margin: 5px 40px 30px 40px; 
   border-collapse: separate; 
   display: table;  
}
.dt2html td { 
   padding: 4px 15px 4px 15px; 
	-moz-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	-webkit-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	-o-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
}
.dt2html td:not(:first-child) {
	background: #EDF2F2; 
	background-color: #EDF2F2;
}
.dt2html td:first-child:not(.dt2htmlnoteRow) { 
	background: #E6F7F7; 
	background-color: #E6F7F7; 
	border-left-color: #E6F7F7; 
}
.dt2html th { 
   padding-right: 12px; 
   padding-left: 12px;
   padding-bottom: 4px;
   font-weight: 500; 
   font-style: italic; 
   font-size: 80%; 
   vertical-align: bottom; 
}
.dt2html td:not(:first-child):hover { 
   border: 1px solid #393939; 
   padding: 3px 14px 3px 14px; 
}
.dt2html tr:hover td:not(:first-child) { 
   background: #D4D4D4; 
	background-color: #D4D4D4;
}
.dt2html td:not(:first-child):active { 
   border: 1px solid #FFF; 
}
.dt2html tr:hover td:first-child:not(.dt2htmlnoteRow) { 
   border-left: 4px solid #91A5A5; 
   background: #A3C7C7; 
   background-color: #A3C7C7; 
   padding-left: 11px; 
}
.dt2htmlException { 
	margin-left: 30px;
}
td.dt2htmlnoteRow:hover {
    background: #D4D4D4;
    background-color: #D4D4D4;
    border: 1px solid #393939;
    padding: 3px 14px 12px 14px;
}
.dt2html .ratio {
    font-weight: bolder;
    font-size:larger;
}

/*Appointment styling*/

#sync-username-hint {
    display:none;
	visibility: collapse;
	transition: ease-in .1s;
}

#sync-username-hint.show-hint {
	visibility: visible;
    display:block;
	transition: ease-in .1s;
}

/* Styling for Master reports editors */
.adv-query-editor {
    font-family: Consolas, monospace;
    /*vertical-align: top;*/
}

li {
    list-style: inside;
}

.filter-outer {
    border:solid 1px black;
    overflow:auto;
    width:350px;
    height:200px;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 5px;
}

.filter-section.open {
    border:solid 1px black;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 5px;
}
.filter-hidden {
    display: none;
}

.hidden {
    display: none;
}


/* Allow for using responsive tables
    Copied from http://colintoh.com/blog/display-table-anti-hero
*/
.table    { display: table }
.tr       { display: table-row }
.thead    { display: table-header-group }
.tbody    { display: table-row-group 
}
.tfoot    { display: table-footer-group }
.col      { display: table-column }
.colgroup { display: table-column-group }
.td, .th   { display: table-cell }
.caption  { display: table-caption }

/*  DataTable to HTML Automatic Styling */
.dt2htmlTitle {
   margin: 0px 55px 25px 25px;
   padding: 12px; 
   font-size: 140%; 
   font-weight: 600;
   color: #7D6666;
   text-align: left;
}
.dt2htmlSubTitle {
   font-size: 70%; 
   font-style: italic; 
}
.table.dt2html {
   /*width: 85%;*/
   margin: 5px 40px 30px 40px; 
   border-collapse: separate; 
   display: table;  
}
.dt2html .td { 
   padding: 4px 15px 4px 15px; 
	-moz-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	-webkit-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	-o-transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
	transition: background 0.3s linear, background-color 0.3s linear, border-left-color 0.5s;
}
.dt2html .td:not(:first-child) {
	background: #EDF2F2; 
	background-color: #EDF2F2;
}
.dt2html .td:first-child:not(.dt2htmlnoteRow) { 
	background: #E6F7F7; 
	background-color: #E6F7F7; 
	border-left-color: #E6F7F7; 
}
.dt2html .th { 
   padding-right: 12px; 
   padding-left: 12px;
   padding-bottom: 4px;
   font-weight: 500; 
   font-style: italic; 
   font-size: 80%; 
   vertical-align: bottom; 
}
.dt2html .td:not(:first-child):hover { 
   border: 1px solid #393939; 
   padding: 3px 14px 3px 14px; 
}
.dt2html .tr:hover td:not(:first-child) { 
   background: #D4D4D4; 
	background-color: #D4D4D4;
}
.dt2html .td:not(:first-child):active { 
   border: 1px solid #FFF; 
}
.dt2html .tr:hover td:first-child:not(.dt2htmlnoteRow) { 
   border-left: 4px solid #91A5A5; 
   background: #A3C7C7; 
   background-color: #A3C7C7; 
   padding-left: 11px; 
}

.td.dt2htmlnoteRow:hover {
    background: #D4D4D4;
    background-color: #D4D4D4;
    border: 1px solid #393939;
    padding: 3px 14px 12px 14px;
}



/*______________________________________________________________________________________________________________*/

/*STYLES ADDED Vince C.*/

/*______________________________________________________________________________________________________________*/

/*RANDOM STYLE ADJUSTMENTS_______________________________________*/

::placeholder {
    color: rgb(192,192,192);
}

.spanPageTitle {
    font-size:18px;
}

.hoverLinks:hover {
    color: white;
    background-color: #0074E4;
}

.noOverFlow {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.disabledLinkStyle {
    pointer-events: none;
    cursor: default;
    color: black;
}

/*Controls long field titles and cause them to wrap after 325px*/
#divContactEdit_FIELDS tr td:first-child,
#divAdvancedSearchDialog_SEARCH_FIELDS tr td:first-child {
    max-width: 325px;
    overflow-wrap: break-word;
}

/*Adjustment form instant answer plugin*/
.wp-block-video video {
    max-width: 50vw;
}

/*Advantage Academy Link Styles*/
#aAcademyLink {
    font-size: 22px;
    color: #1892EB;
    padding-right: 0px;
    display:none;
}

/*NavBar styles*/
.divNavBarSubTitle {
    width: 70%;
    text-align: left;
    border-bottom: 2px solid black;
    padding: 10px 0;
    margin-left: 5px;
}

/*Task dialog styles*/
.taskSectionFormat_SHOW {
    visibility: visible;
    display: grid;
    grid-template-columns: 20% 80%;
    align-items: center;
    margin: 8px 0;
}
.taskSectionFormat_HIDDEN {
    display: none;
    visibility: hidden;
}



/*Custom Scroll Bar_________________________________*/
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: #80808055;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #80808088;
}


/*Buttons__________________________________________*/
.standardButton, .standardButton:link {
    color: white;
    font-size: 13px;
    text-decoration: none;
    padding: 6px 8px;
    border-radius: 4px;
    background-color: #1592E6;
    border: 1px solid #1592E6;
    display: inline-block;
    margin-left: 8px;
}

.standardButton-small, .standardButton-small:link {
    color: white;
    font-size: 10px;
    text-decoration: none;
    padding: 3px 5px;
    border-radius: 4px;
    background-color: #1592E6;
    border: 1px solid #1592E6;
    display: inline-block;
    margin: 0 8px;
}


.standardButton:hover, .standardButton-small:hover {
    background-color: #1592E699;
    text-decoration: none;
    border-color: #1592E699;
}

.standardButton_white, .standardButton_white:link {
    color: black;
    font-size: 13px;
    text-decoration: none;
    padding: 6px;
    border-radius: 4px;
    background-color: white;
    border: 1px solid black;
    display: inline-block;
    margin-right: 8px;
}

.standardButton_white-small, .standardButton_white-small:link {
    color: black;
    font-size: 10px;
    text-decoration: none;
    padding: 3px 5px;
    border-radius: 4px;
    background-color: white;
    border: 1px solid black;
    display: inline-block;
    margin: 0 8px;
}

.standardButton_white:hover, .standardButton_white-small:hover {
    background-color: lightgrey;
    text-decoration: none;
}

.standardSmallButton {
    border: 1px solid lightgrey;
    background: darkgray;
    opacity: .75;
    padding: 1px 4px;
    font-size: 12px;
}

.standardSmallButton:hover {
    background-color: #1592E6;
    text-decoration: none;
}


/*INPUT Styles___________________________________*/

.customTextareaStyle {
    border-radius: 4px;
    color: black;
    padding-left: 4px;
    font-size: 14px;
    font-family: 'Noto Sans';
    border: 1px solid #70707066;
    outline: none;
}

.customSelectStyle {
    border-radius: 4px;
    font-family: 'Noto Sans';
    font-size: 14px;
    outline: none;
    border: 1px solid #70707066;
    height: 34px;
}

/*.customSelectStyle:first-child {
    color:lightgray;
}*/

/*.customSelectStyle > option {
    color: red;
}*/

.customInputStyle {
    border-radius: 4px;
    color: black;
    padding-left: 4px;
    font-size: 14px;
    width: 100%;
    font-family: 'Noto Sans';
    border: 1px solid #70707066;
    outline: none;
    height: 34px;
}

.customCheckboxStyle {
    transform: scale(1.25);
}


.standardSearchResultBox {
    max-height: 200px;
    overflow: auto;
    border: 1px solid lightgrey;
    background-color: white;
    position: relative;
    display: none;
    visibility: hidden;
    padding: 4px;
    font-size: 14px;
}

.standardSearchResultBox_ABSOLUTE {
    max-height: 200px;
    overflow: auto;
    border: 1px solid lightgrey;
    background-color: white;
    position: absolute;
    display: none;
    visibility: hidden;
    padding: 4px;
    font-size: 14px;
}


/*Tabs____________________________________*/
.divTabContainer {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 10px 0;
}

.divTabTitles {
    border: 1px solid lightgrey;
    padding: 12px;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px 25px;
    border-radius: 4px;
}

.basicTabDisplay {
    padding: 2px 10px;
    font-size:15px;
    text-decoration: none;
    border: rgba(145, 154, 163, 0.8) solid 2px;
}

._ACTIVE {
    background-color: #0074E4;
    color: white;
    border: 2px solid rgb(0, 116, 228);
}

.basicTabDisplayContacts {
    text-decoration: none;
    padding: 10px;
}

._ACTIVEContacts {
    border-bottom: 3px solid #0074E4;
    background-color: #C3C3C362;
}

.divBoxTabDesign {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 15px 0;
    text-align: center;
    border-bottom: 3px solid rgba(145, 154, 163, 0.3);
    width: 100%;
}

.divBoxTabDesign a {
    padding: 5px 10px;
    font-size: 15px;
    text-decoration: none;
    margin: 5px;
    color: rgba(145, 154, 163, 0.9);
}

.activeMyDayTab {
    border: solid 2px #0074E4;
    background-color: #0074E4;
    color: white;
}

.basicTabDisplaySUB {
    padding: 2px 10px;
    font-size: 15px;
    text-decoration: none;
    border: rgba(145, 154, 163, 0.8) solid 2px;
}

._ACTIVESUB {
    background-color: #1592E6;
    color: white;
    border: 2px solid #1592E6;
}



/*Grid________________________________________*/

.basicGridDisplayFifth {
    display: grid;
    grid-template-columns: 20% 20% 20% 20% 20%;
}

.basicGridDisplayQuarter {
    display: grid;
    grid-template-columns: 25% 25% 25% 25%;
}

.basicGridDisplayThird {
    display: grid;
    grid-template-columns: 33% 33% 33%;
}



/*Drop Down menus______________________________*/

.dropdownMod {
    position: relative;
    display: inline-block;
}

.dropbtn_plain, .dropbtn_plain:link {
    padding: 2px 20px;
    font-size: 14px;
    border: 1px solid black;
    cursor: pointer;
    border-radius: 4px;
    color: black;
    text-decoration: none;
}

.dropbtn_plain:hover, .dropbtn_plain:link:hover {
    background-color: #d3d3d366;  
}

.dropdownMod:hover .dropbtn_plain {
    background-color: #d3d3d366;
}

.simpleDropMenu {
    position: absolute;
    top: 40px;
    background: white;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 10px;
    z-index:1;
}

.simpleDropMenu a {
    font-size: 14px;
    padding: 3px 5px;
    display: block;
}

/*MOD style Used for ellipsis menus*/
.simpleDropMenu_MOD {
    background: white;
    min-width: 205px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 10px;
}

.simpleDropMenu_MOD a {
    font-size: 13px;
    padding: 3px 5px;
    display: block;
}

.accountToolsDropMenu {
    width: 280px;
    position: absolute;
    background: white;
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 10px 25px;
    padding-top: 0;
}

.accountToolsDropMenu a {
    font-size: 14px;
    padding: 8px 5px 8px 13px;
    display: block;
}

.accountToolsImage_Name_Company {
    border-bottom: 1px solid #e5e5e5;
    margin: 10px;
    display: grid;
    grid-template-columns: 25% 75%;
    text-align: center;
    padding: 10px;
}

/*ABBI MIC slider___________________________________*/

/* The switch - the box around the slider */
.switch_MicIcon {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
}

/* Hide default HTML checkbox */
.switch_MicIcon #input_MicIcon {
    opacity: 0;
    width: 0;
    height: 0;
}

/* The slider */
.slider_MicIcon {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider_MicIcon:before {
    position: absolute;
    content: "";
    height: 17px;
    width: 19px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

#input_MicIcon:checked + .slider_MicIcon {
    background-color: #2196F3;
}

#input_MicIcon:focus + .slider_MicIcon {
    box-shadow: 0 0 1px #2196F3;
}

#input_MicIcon:checked + .slider_MicIcon:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}

/* Rounded sliders */
.slider_MicIcon.round {
    border-radius: 34px;
}

.slider_MicIcon.round:before {
    border-radius: 50%;
}


/*ABBI Report Center slider___________________________________*/

/* The switch - the box around the slider */
.switch_ReportCenter {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
}

/* Hide default HTML checkbox */
.switch_ReportCenter #input_ReportCenter {
    opacity: 0;
    width: 0;
    height: 0;
}

/* The slider */
.slider_ReportCenter {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider_ReportCenter:before {
    position: absolute;
    content: "";
    height: 17px;
    width: 19px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

#input_ReportCenter:checked + .slider_ReportCenter {
    background-color: #2196F3;
}

#input_ReportCenter:focus + .slider_ReportCenter {
    box-shadow: 0 0 1px #2196F3;
}

#input_ReportCenter:checked + .slider_ReportCenter:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}

/* Rounded sliders */
.slider_ReportCenter.round {
    border-radius: 34px;
}

.slider_ReportCenter.round:before {
    border-radius: 50%;
}


/*UPDATE slider _____________________________________*/

.switch_UpdateIcon {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
}

.switch_UpdateIcon #input_UpdateIcon {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider_UpdateIcon {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider_UpdateIcon:before {
    position: absolute;
    content: "";
    height: 17px;
    width: 19px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

#input_UpdateIcon:checked + .slider_UpdateIcon {
    background-color: #2196F3;
}

#input_UpdateIcon:focus + .slider_UpdateIcon {
    box-shadow: 0 0 1px #2196F3;
}

#input_UpdateIcon:checked + .slider_UpdateIcon:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}

.slider_UpdateIcon.round {
    border-radius: 34px;
}

.slider_UpdateIcon.round:before {
    border-radius: 50%;
}


/*Dialog box styles______________________________________________*/

.dialogBox_MAIN-Container {
    position: absolute;
    background-color: white;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 3px 3px 7px #777;
}

.dialogBox_Top-Border {
    background-color: #1592E6;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    height: 10px;
}

.dialogBox_Header-Section {
    height: 45px;
    text-align: left;
    display: grid;
    grid-template-columns: 70% 30%;
    padding: 0 15px;
    box-sizing: content-box;
    align-items: center;
}

.dialogBox_SubHeader-Section {
    font-size: 18px;
    border-bottom: 2px solid #eeeeee;
    color:grey;
    text-align:left;
    padding:0 15px;
    padding-bottom:8px;
}

.dialogBox_Header-Text {
    font-size: 18px;
    color: grey;
    /*margin-left: 5px;*/
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.dialogBox_Header-Container-CloseBtn {
    text-align: right;
}

.dialogBox_Header-CloseBtn, .dialogBox_Header-CloseBtn:link {
    text-decoration: none;
    color: grey;
}


.dialogBox_Content-Container {
    text-align: left;
    background-color: white;
    overflow: auto;
    padding: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.dialogBox_Commands-Container {
    text-align: center;
    height: 50px;
    padding-top: 8px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.dialogBox_Input-Margin {
    margin-bottom: 10px;
}


.dialogbox_Icon-small {
    font-size: 15px;
    margin: 0 8px;
}

.dialogbox_Folder_Icon-Container {
    border-bottom: 1px solid lightgrey;
    display: inline-block;
    margin-left: 20px;
}

.dialogbox_Folder_Contents-Container {
    margin-left: 7.5px;
    padding-bottom: 8px;
    padding-left: 10px;
    border-left: 3px solid rgb(229, 229, 229);
    border-bottom: 3px solid rgb(229, 229, 229);
}

.dialogbox_DocFileItem-Container {
    display: grid;
    grid-template-columns: 45% 45%;
    border-bottom: 1px solid #e5e5e5;
    padding: 5px 0;
    box-sizing: border-box;
}

.dialogbox_DocFileItem-Container-inner {
    display: grid;
    grid-template-columns: 10% auto;
    align-items: center;
}


/*Top Header Styles______________________________________________*/
#divHeader {
    width: 100%;
    background-color: #303B43;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 6px;
    align-items: center;
}

#TopNavBarIconRow {
    display: flex;
    flex-direction: row;
    align-items: center;
}


#TopNavBarIconRow div {
    margin: 10px;
}


#divAmmiHeaderMain {
    width: 600px;
}


#divAMMI_Results {
    font-size: 14px;
    color: #434242;
    position: absolute;
    border-top-width: 65px;
    width: 600px;
    padding: 15px 20px;
    overflow: auto;
    background: white;
    z-index: 1001;
    border: 5.5px solid #e5e5e5;
    text-align: left;
    max-height: 450px;
    outline: none;
}

#AmmiSearchBarIcon {
    position: absolute;
    top: 18px;
    left: 806px;
    font-size: 20px;
    color: darkgrey;
}

#AmmiSearchBarMicrophone {
    position: absolute;
    top: 18px;
    left: 187px;
    font-size: 20px;  
}


/*MY Day page styles ___________________________________________*/

.genericGreyButton {
    border: 2px solid lightgray;
    padding: 5px 5px;
    width: 180px;
}

.genericGreyButton:hover {
    background-color: #d3d3d366;
    text-decoration:none;
}

.divMyDaySectionContainer{
    width:33.1%
}


@media (max-width: 1650px) {
    .divMyDaySectionContainer {
        width: 33%
    }
}

@media (max-width: 1420px) {
    .divMyDaySectionContainer {
        width: 49.5%
    }
}

@media (max-width: 996px) {
    .divMyDaySectionContainer {
        width: 100%
    }
}


.divToDoHeaderButtons a {
    padding: 5px 25px;
    text-decoration: none;
    margin: 0 5px;
    color: rgba(145, 154, 163, 0.9);
    border: rgba(145, 154, 163, 0.8) solid 2px;
    font-weight: 500;
}

.activeMyDayTab {
    border: solid 2px #0074E4;
    background-color: #0074E4;
    color: white;
}




/*Quick Links Menu styles___________________________________*/

.divQuickLinksTitle {
    font-size: 18px;
}

.divQuickLinksIcon {
    font-size: 22px;
    color: grey;
    position: relative;
    top: 2px;
    right: 6px;
}


.divQuickLinksContent {
    position: relative;
    left: 33px;
    padding-top: 15px;
}

.divQuickLinksContent a {
    display: block;
    padding: 10px 0;
    max-width: 135px;
}



/*Settings Page Section___________________________________*/

.setting_menu_section {
    min-width: 250px;
}

.collapsible_Settings_Menu {
    font-size: 18px;
}

.settings_menu_dropdown {
    position: relative;
    left: 25px;
    padding-top: 15px;
}


.settings_menu_dropdown a {
    display: block;
    padding: 10px 0;
    max-width: 190px;
}



/*Activity Pre-Prompt Styles_________________________________*/

.divActivityPrePromptContent {
    padding: 5px 10px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.divActivityPrePromptContent a{
    display: block;
    padding: 3px 5px;
    font-size:14px;
}

.divMockInputBox {
    width: 100%;
    border: 1px solid #70707066;
    font-size: 14px;
    padding: 6px 5px;
    border-radius: 4px;
    cursor:pointer;
}




/*Contact Page______________________________________________*/

#divContactPageHeader {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-top: 15px;
    border-bottom: 1px solid #80808045;
    padding-bottom: 8px;
}

.divIconColumnHistory i {
    font-size: 22px;
    color: darkgray;
    position: relative;
    bottom: 8px;
    width:15px;
}

.arrow-left {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 20px solid #e9e9e995;
}

.linkForContactSelection {
    margin-left: 15px;
}

/*Contact Profile Section__________________________________*/

#divContactIconHolder span {
    padding-right: 6px;
}

.backButtonForContactRecord, .backButtonForContactRecord:link {
    color: black;
    border: 2px solid lightgray;
    text-decoration: none;
    padding: 2px;
    font-size: 12px;
    cursor: pointer;
    border-radius: 4px;
}

.backButtonForContactRecord:hover, .backButtonForContactRecord:link:hover {
    background-color: #d3d3d366;
}


.ContactContent-Icon-Container {
    text-align: center;
    border-bottom: solid 1px #e5e5e5;
    border-top: solid 1px #e5e5e5;
    padding: 5px 0;
    margin-top: 5px;
    display: flex;
    align-items: baseline;
    justify-content: center;
}

.contactActionTabs-Container {
    border-bottom: 1px solid #e5e5e5;
    margin: 0 15px;
}

.contactActionTabs {
    display: flex;
    justify-content: left;
}

.contactActionTabs a {
    text-decoration: none;
    padding: 10px;
}

.contactActionTabs a:hover {
    text-decoration: none;
    cursor: pointer;
    background-color: #C3C3C332;
}

.contactActiveActionTab {
    text-decoration: none;
    cursor: pointer;
    border-bottom: 3px solid #0074E4;
    background-color: #C3C3C362;
}

.adjustMarginBottom-5 {
    margin-bottom:0;
}


.ContactHeader-Container {
    margin: 3px;
    margin-bottom:0;
    padding: 10px;
    background-color: white;
}

.ContactHeader-InnerContainer {
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    align-items: center;
    justify-content: space-between;
}


.ContactContent_MainContainer-Grid {
    display: grid;
    grid-template-columns: 375px auto;
    padding: 3px;
}

.ContactContent_InnerContainer-Grid {
    display: grid;
    /*grid-template-columns: repeat(auto-fit, minmax(550px, 1fr));*/
    grid-template-columns: repeat(12,1fr);
    padding-left: 3px;
    grid-gap: 3px;
}

.ContactContent_WorkOrder-Container {
    grid-column: 1/3;
    overflow-x: auto;
    background: white;
}


.ContactContent_InnerContainer-Grid-item_1 {
    grid-column: 1/7;
}

.ContactContent_InnerContainer-Grid-item_2 {
    grid-column: 7/13;
}


.ContactContent_ContactDetails-Container {
    padding: 16px 0;
    margin: 0 16px;
    display: grid;
    grid-template-columns: 100%;
    font-size: 13px;
}

.ContactContent_ContactDetails_Data-Container {
    display: grid;
    grid-template-columns: 30% 60%;
    column-gap: 15px;
}


@media screen and (max-width: 1650px) {
    .ContactContent_MainContainer-Grid {
        grid-template-columns: 325px auto;
    }
    .ContactContent_InnerContainer-Grid-item_1 {
        grid-column: 1/8;
    }

    .ContactContent_InnerContainer-Grid-item_2 {
        grid-column: 8/13;
    }
    /*.ContactContent_InnerContainer-Grid {
        grid-template-columns: repeat(auto-fit, minmax(550px, 1fr));
    }*/
    /*.ContactContent_InnerContainer-Grid {
        grid-template-columns: repeat(auto-fill, minmax(600px, 400px));
    }*/
}



@media screen and (max-width: 1480px) {
    .ContactContent_InnerContainer-Grid-item_1 {
        grid-column: 1/13;
    }

    .ContactContent_InnerContainer-Grid-item_2 {
        grid-column: 1/13;
    }
    /*.ContactContent_InnerContainer-Grid {
        grid-template-columns: repeat(auto-fit, minmax(550px, 1fr));
    }*/
    /*.ContactContent_InnerContainer-Grid {
        grid-template-columns: repeat(auto-fill, minmax(600px, 400px));
    }*/
}


@media screen and (max-width: 1480px) {
    .ContactContent_MainContainer-Grid {
        grid-template-columns: 325px auto;
    }
    .adjustMarginBottom-5 {
        margin-bottom:3px;
    }
    /*.ContactContent_InnerContainer-Grid {
        grid-template-columns: repeat(auto-fit, minmax(550px, 1fr));
    }*/
    /*.ContactContent_InnerContainer-Grid {
        grid-template-columns: repeat(auto-fill, minmax(600px, 400px));
    }*/
}

@media screen and (max-width: 1040px) {
    /*.ContactContent_InnerContainer-Grid {
        grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
    }*/
}


/*@media (max-width: 1280px) {
}


@media (max-width: 1024px) {
}*/



@media screen and (max-width: 996px) {
    .ContactContent_MainContainer-Grid {
        grid-template-columns: 95%;
        justify-content:center;
    }

    .ContactContent_InnerContainer-Grid {
        padding-left: 0;
    }

    .contactActionTabs {
        flex-wrap:wrap;
    }

    .ContactContent_WorkOrder-Container {
        grid-template-columns: 100%;
        grid-column: auto;
    }
}


/*Property Page______________________________________________*/

.divIconColumnHistory i {
    font-size: 22px;
    color: darkgray;
    position: relative;
    bottom: 8px;
    width:15px;
}

.arrow-left {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 20px solid #e9e9e995;
}

.linkForPropertySelection {
    margin-left: 15px;
}

/*Property Profile Section__________________________________*/


/*Interactive DashBoard Page_____________________________________*/

.divToDoHeaderButtons button {
    padding: 5px 25px;
    margin: 0 5px;
    border: rgba(145, 154, 163, 0.8) solid 2px;
    font-weight: 500;
    font-size: 15px;
    color: rgba(145, 154, 163, 0.9);
    background-color: white;
    font-family: Noto Sans;
    cursor: pointer;
}

.divToDoHeaderButtons button:hover {
    background-color: #0074E4;
    color: white;
    border: 2px solid #0074E4;
}

/*V-Mail Page_____________________________________________________*/

.standardButton_white_VIDEO {
    color: black;
    background-color: #EBEBEB;
    font-size: 15px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    border: 1px solid black;
    width: 175px;
    padding:12px 5px;
}

.standardButton_white_VIDEO:hover {
    background-color: white;
    text-decoration: none;
}

.standardButton_VIDEO {
    color: white;
    background-color: #1592E6;
    font-size: 15px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    width: 175px;
    padding: 13px 5px;
}

.standardButton_VIDEO:hover {
    background-color: #1592E699;
    text-decoration: none;
}

.VmailLandingPageContainer {
    border-radius: 10px;
    padding: 30px 20px;
    margin-bottom: 10px;
    display: grid;
    grid-template-columns: 600px auto;
    background: #EBEBEB;
}

.VmailLandingPageContainer_ColOne {
    padding: 0 45px 0 30px;
    margin: 25px 0;
}

.VmailLandingPageTitle {
    font-size: 2.5rem;
    display: block;
    max-width: 600px;
    margin-bottom:25px;
}

.VmailLandingPageSubTitle {
    font-size: 16px;
    display: block;
    max-width: 600px;
    height: 132px;
}

.VmailLandingPageButtonsContainer {
    display: flex;
    grid-gap:20px;
    flex-direction:row;
    align-items: center;
}

.VmailLandingPageVideoContainer {
    display: flex;
    margin-top: 30px;
    justify-content: flex-start;
}

.VmailLandingPageVideo {
    height: 290px;
    width: 400px;
}

#vRecorder, #vidPreview {
    height: 259px;
    width: 380px;
}

.VmailRecordNewButtonContainer {
    display: flex;
    grid-gap: 20px;
    margin: 10px 0;
    justify-content: center;
    flex-direction: row;
}



@media (max-width: 1101px) {
    .VmailLandingPageContainer {
        grid-template-columns: 500px auto;
    }

    .VmailLandingPageTitle {
        font-size: 2rem
    }

    .VmailLandingPageSubTitle {
        font-size: 16px;
        max-width: 450px;
    }

    .standardButton_white_VIDEO, .standardButton_VIDEO {
        font-size: 12px;
    }

    .VmailLandingPageVideo {
        height: 270px;
        width: 370px;
    }

    #vRecorder, #vidPreview {
        height: 248px;
        width: 345px;
    }
}


@media (max-width: 980px) {
    .VmailLandingPageContainer {
        grid-template-columns: 385px auto;
    }

    .VmailLandingPageTitle {
        font-size: 1.75rem; 
        margin-bottom: 10px;
    }

    .VmailLandingPageSubTitle {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .standardButton_white_VIDEO, .standardButton_VIDEO {
        font-size: 12px;
    }

    .VmailLandingPageVideo, #vRecorder, #vidPreview {
        height: 253px;
        width: 370px;
    }

    #vRecorder, #vidPreview {
        height: 333px;
        width: 370px;
    }

    .VmailRecordNewButtonContainer {
        flex-direction: column;
        align-items: center;
    }
}


@media (max-width: 856px) {
    .VmailLandingPageContainer {
        grid-template-columns: 100%;
        padding: 0 10px;
    }
    .VmailLandingPageContainer_ColOne {
        padding: 0;
    }

    .VmailLandingPageTitle{
        font-size:1.75rem
    }

    .VmailLandingPageSubTitle {
        font-size: 15px;
        padding-right: 0px;
        margin-bottom: 25px;
    }

    .VmailLandingPageButtonsContainer {
        flex-direction: column;
    }

    .VmailLandingPageVideoContainer {
        margin-top: 5px;
        justify-content: center;
        margin-bottom: 10px;
    }

    .VmailLandingPageVideo, #vRecorder, #vidPreview {
        height: 200px;
        width: 300px;
    }  
}

@media (max-width: 620px) {

    .VmailLandingPageVideo, #vRecorder, #vidPreview {
        height: 150px;
        width: 250px;
    }
}


#divLearnHowContainer {
    background: #EBEBEB;
    padding: 10px 20px;
    margin-bottom: 10px;
}

#divLearnHowDetailsContainer {
    border: 2px solid #C3C3C3;
    width: 80%;
    background-color: white;
}

.learnHowTabs {
    display: flex;
}

.learnHowTabs a {
    text-decoration: none;
    padding: 10px;
}

.learnHowTabs a:hover {
    text-decoration: underline;
    cursor: pointer;
}

.learnHowActiveTab {
    text-decoration: none;
    cursor: pointer;
    border-bottom: 3px solid #0074E4;
    background-color: white;
}

.learnHowDetailsList > .learnHowListItems {
    list-style-type: none;
    list-style-position: inside;
    margin: 20px 0;
}

.learnHowDetailsList > .learnHowListItems:before {
    content: "*  ";
}

.VmailHowFromContactSubTitle {
    margin-left: 20px;
}


@media (max-width: 800px) {
    #divLearnHowContainer {
        padding: 10px;      
    }
    .learnHowTabs a {
        padding: 5px;
        font-size: 13px;
    }
    .learnHowTabs a:hover {
        text-decoration: none;
    }
    #divLearnHowDetailsContainer {
        border: 1px solid #C3C3C3;
        width: 100%;
    }
    .learnHowDetailsList {
        padding-inline-start: 15px;
        font-size: 14px;
    }
    .VmailHowFromContactSubTitle {
        margin-left: 10px;
        font-size:14px;
    }
}


/*Landing Page Display________________________________________________________*/


.standardButton_white_LANDING {
    color: black;
    background-color: #EBEBEB;
    font-size: 15px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    border: 1px solid black;
    width: 175px;
    padding: 12px 5px;
}

.standardButton_white_LANDING:hover {
    background-color: white;
    text-decoration: none;
}

.standardButton_LANDING {
    color: white;
    background-color: #1592E6;
    font-size: 15px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    width: 175px;
    padding: 13px 5px;
}

.standardButton_LANDING:hover {
    background-color: #1592E699;
    text-decoration: none;
}

.LandingPageContainer {
    border-radius: 10px;
    padding: 30px 20px;
    margin-bottom: 10px;
    display: grid;
    grid-template-columns: 600px auto;
    background: #EBEBEB;
}

.LandingPageContainer_MOD {
    grid-template-columns: 700px auto;
    border-radius: 10px;
    padding: 30px 20px;
    margin-bottom: 10px;
    display: grid;
    background: #EBEBEB;
}

.LandingPageContainer_ColOne {
    padding: 0 45px 0 30px;
    margin: 25px 0;
    min-height:300px;
}

.LandingPageTitle {
    font-size: 2.5rem;
    display: block;
    max-width: 600px;
    margin-bottom: 25px;
}

.LandingPageSubTitle {
    font-size: 16px;
    display: block;
    max-width: 600px;
    height: 132px;
}

.LandingPageButtonsContainer {
    display: flex;
    grid-gap: 20px;
    flex-direction: row;
    align-items: center;
    margin: 10px 0;
}

.LandingPageVideoContainer {
    display: flex;
    margin-top: 30px;
    justify-content: flex-start;
}

.LandingPageVideo {
    height: 290px;
    width: 400px;
}

.LandingPageVideo_MOD {
    height: 290px;
    width: 400px;
}

.LandingPageGridCol {
    display: grid;
    grid-template-columns: 35% 65%;
    align-items: center;
    margin: 15px 0px;
}


@media (max-width: 1380px) {
    .LandingPageVideo_MOD {
        height: 210px;
        width: 250px;
    }
}

@media (max-width: 1101px) {
    .LandingPageContainer {
        grid-template-columns: 500px auto;
    }
    .LandingPageContainer_MOD {
        grid-template-columns: 600px auto;
    }

    .LandingPageTitle {
        font-size: 2rem
    }

    .LandingPageSubTitle {
        font-size: 16px;
        max-width: 450px;
    }

    .standardButton_white_LANDING, .standardButton_LANDING {
        font-size: 12px;
    }

    .LandingPageVideo {
        height: 270px;
        width: 370px;
    }
    .LandingPageVideo_MOD {
        height: 190px;
        width: 225px;
    }
}


@media (max-width: 980px) {
    .LandingPageContainer {
        grid-template-columns: 385px auto;
    }
    .LandingPageContainer_MOD {
        grid-template-columns: 485px auto;
    }

    .LandingPageTitle {
        font-size: 1.75rem;
        margin-bottom: 10px;
    }

    .LandingPageSubTitle {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .standardButton_white_LANDING, .standardButton_LANDING {
        font-size: 12px;
    }

    .LandingPageVideo {
        height: 253px;
        width: 370px;
    }

    .LandingPageVideo_MOD {
        height: 190px;
        width: 225px;
    }

    .LandingPageButtonsContainer {
        flex-direction: column;
        align-items: center;
    }
}


@media (max-width: 856px) {
    .LandingPageContainer {
        grid-template-columns: 100%;
        padding: 0 10px;
    }
    .LandingPageContainer_MOD {
        grid-template-columns: 100%;
        padding: 0 10px;
    }

    .LandingPageContainer_ColOne {
        padding: 0;
    }

    .LandingPageTitle {
        font-size: 1.75rem
    }

    .LandingPageSubTitle {
        font-size: 15px;
        padding-right: 0px;
        margin-bottom: 25px;
    }

    .LandingPageButtonsContainer {
        flex-direction: column;
    }

    .LandingPageVideoContainer {
        margin-top: 5px;
        justify-content: center;
        margin-bottom: 10px;
    }

    .LandingPageVideo {
        height: 200px;
        width: 300px;
    }
    .LandingPageVideo_MOD {
        height: 175px;
        width: 250px;
    }
}


@media (max-width: 620px) {

    .LandingPageVideo {
        height: 150px;
        width: 250px;
    }
    .LandingPageVideo_MOD {
        height: 150px;
        width: 250px;
    }
}


/*Mailbox Styles_______________________________________*/

.emailMailboxSelect {
    padding: 8px 10px;
    border-radius: 0px 15px 15px 0;
}

.emailMailboxSelect:hover {
    background: rgb(218, 224, 229);
}

.emailMessageListItem:hover {
    background: white;
}

.emailMessageListItem:hover {
    background: rgb(218, 224, 229);
}


.EmailAttachmentFromMailbox {
    -webkit-align-items: center;
    align-items: center;
    background-color: white;
    border: 1px solid rgb(218, 224, 229);
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: inline-flex;
    height: 30px;
    line-height: 20px;
    padding: 10px;
    cursor: pointer;
    margin:2px;
}

.EmailAttachmentFromMailbox:hover {
    background: rgb(218, 224, 229);
}


/*Marketing Styles____________________________________________*/

.MarketingHomePageCard_Container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
    padding: 10px;
    row-gap: 15px;
}


.MarketingHomePageCard_Outside {
    display: flex;
    border: 1px solid white;
    border-radius: 4px;
    padding: 8px;
    background-color: #DAE0E5;
    height:460px;
}

.MarketingHomePageCard_Inside {
    text-align: left;
    width: 500px;
    background-color: white;
    padding: 10px 25px;
    border-radius: 4px;
    border: 1px solid #DAE0E5;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}


.growMarketingCard { 
    transition: all .2s ease-in-out; 
}

.growMarketingCard:hover { 
    transform: scale(1.05); 
}

.customUnorderedList li {
    list-style: outside;
}


.dont-break-out {
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;
    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}


/*EDITOR styles___________________________________________*/

.cke_contents > textarea {
    white-space: pre-wrap;
}

.emailAddedInEditor {
    -webkit-align-items: center;
    align-items: center;
    background-color: #fff;
    border: 1px solid #dadce0;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: inline-flex;
    height: 20px;
    line-height: 20px;
    margin: 2px;
    padding: 10px;
}

.attachmentInEditor {
    background-color: #f5f5f5;
    border: 1px solid transparent;
    font-weight: bold;
    margin: 0px 10px;
    overflow-y: hidden;
    padding: 4px 4px 4px 8px;
    display: inline-block;
    border-radius: 4px;
}

.attachmentIconEditor {
    cursor: pointer;
    font-size: 20px;
    width: 18px;
    height: 22px;
}

.attachmentHiddenInputEditor {
    width: 18px;
    position: absolute;
    left: 0px;
    opacity: 0;
    border: none;
    outline: none;
}

.emailHeaderMaxSetting {
    padding: 8px;
}

.emailHeaderMinSetting {
    max-height: 10px;
    position: absolute;
    z-index: -1;
}

.emailHeaderSubAndAttachment {
    margin: 0;
    margin-left: 5px;
    position: relative;
    -webkit-transition: box-shadow .15s cubic-bezier(0.4,0.0,0.2,1);
    transition: box-shadow .15s cubic-bezier(0.4,0.0,0.2,1);
    padding-bottom: 8px;
    padding-top: 8px;
    border: none;
    -webkit-box-shadow: inset 0 -1px 0 0 rgb(100 121 143 / 12%);
    box-shadow: inset 0 -1px 0 0 rgb(100 121 143 / 12%);
    line-height: 20px;
    min-height: auto;
    padding-left: 0;
    padding-right: 0;
}


/*CHATBOT styles____________________________________________*/

.CHATBOT_dropDownMenu {
    border: 1px solid lightblue;
    border-radius: 40px;
    padding: 10px;
    padding-left: 20px;
    margin: 5px;
    min-width: 150px;
    display: inline-block;
}

.CHATBOT_dropDownMenu a {
    text-decoration: none;
}

.CHATBOT_dropDownMenu div {
    font-size: 90%;
    padding: 3px 0;
}

.CHATBOT_SFButton {
    border: 1px solid lightblue;
    border-radius: 40px;
    padding: 10px;
    padding-left: 20px;
    margin: 5px;
    min-width: 150px;
    display: inline-block;
}

.CHATBOT_SFButton a {
    text-decoration: none;
}

.CHATBOT_pillbutton_grey {
    background-color: #EBEBEB;
    font-size: 14px;
    text-decoration: none;
    border-radius: 25px;
    text-align: center;
    border: 1px solid black;
    padding: 10px;
    display: flex;
    align-items: center;
}

.CHATBOT_pillbutton_grey:hover {
    text-decoration: none;
    background-color: white;
}

.CHATBOT_pillbutton_blue {
    background-color: #1592E6;
    font-size: 14px;
    text-decoration: none;
    border-radius: 25px;
    text-align: center;
    border: 1px solid #1592E6;
    padding: 10px;
    display: flex;
    align-items: center;
}

.CHATBOT_pillbutton_blue:hover{
    text-decoration: none;
    background-color: #1592E699;
    border-color: #1592E699;
}

.CHATBOT_hideButton {
    display:none;
}


/*Confetti dialog styles____________________________________*/

.newLeadWordsSurprise {
    animation-name: example;
    animation-duration: 2s;
    animation-iteration-count: 3;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}

@keyframes example {
    from {
        transform: rotate(360deg) scale(1.5);
    }

    to {
        transform: rotate(0deg) scale(1);
    }
}

/*Template Creator styles______________________________________*/

.divTemplateSectionClass:focus {
    outline: none;
}

.standardTemplateBoxStart {
    height: auto;
    min-height:50px;
    border: 1px dotted lightblue;
    background-color: #d5eaf2;
}


.templateElementsCard {
    font-size: 30px;
    border: 1px solid black;
    padding: 5px;
    margin: 5px;
    text-align: center;
    background-color: white;
    width: 65px;
}

.editStyleTab_SELECTED {
    border: 2px solid black;
    padding: 5px;
    background: white;
    margin: 0 5px;
}

.editStyleTab {
    border: 2px solid black;
    padding: 5px;
    background: rgb(218, 224, 229);
    margin: 0 5px;
}


.slide-placeholder {
    background: #DADADA;
    position: relative;
}

.slide-placeholder:after {
    content: " ";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 15px;
    background-color: #FFF;
}


.columnOptionSelection:hover {
    transform: scale(1.04);
}

.divTemplateSectionClass td{
    min-width:25px;
}

.moveSectionIcon {
    color: #0074E4;
    font-size:22px;
    border: 1px solid black;
    border-radius: 50%;
    background-color: white;
    position:absolute;
}

.moveSectionIcon:hover {
    background-color: lightgrey;
}

/*Sortable styles__________________________________________*/

#sortable_LOGIN_SLIDES {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

#sortable_LOGIN_SLIDES li {
    margin: 3px 3px 3px 0;
    padding: 10px;
    font-size: 80%;
    float: left;
    width: 175px;
    height: 300px;
    text-align: center;
}

#sortable_DASHBOARD_SLIDES {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

#sortable_DASHBOARD_SLIDES li {      
    margin: 10px;
    padding: 10px;
    float: left;
    width: 225px;
    height: 200px;
    border: 1px solid black;
    text-align: center;
    list-style-type: none;
    background: white;
}

#sortable_DASHBOARD_SLIDES li.ui-state-highlight {
    background: rgb(218, 224, 229);
    border-style:dashed;
}



/*RESPONSIVE ADJUSTMENTS__________________________________________*/
/*
320px — 480px: Mobile devices
481px — 768px: iPads, Tablets
769px — 1024px: Small screens, laptops
1025px — 1200px: Desktops, large screens
1201px and more —  Extra large screens, TV
*/

@media (max-width: 1280px) {
    #AmmiSearchBarIcon {
        left: 690px;
    }

    #AmmiSearchBarMicrophone {
        left: 73px;
    }
}

@media (max-width: 1201px) {
    #divAmmiHeaderMain {
        width: 400px;
    }

    #divAMMI_Results {
        width: 400px;
    }

    #AmmiSearchBarIcon {
        left: 490px;
    }
}


@media (max-width: 1024px) {
    #divContactPageHeader {
        display: grid;
        grid-template-columns: 400px;
        grid-row-gap: 15px;
        text-align: left;
    }

    /*#divContactSearchBox {
        margin-left: -16px;
    }*/

    .smartFormSelectOptionsBar {
        height: 45px;
    }
}

@media (max-width: 996px) {

    #divAmmiHeaderMain {
        width: 300px;
    }

    #divAMMI_Results {
        width: 300px;
    }

    #AmmiSearchBarIcon {
        left: 390px;
    }
}


@media (max-width: 850px) {

    #divAmmiHeaderMain {
        width: 200px;
    }

    #divAMMI_Results {
        width: 200px;
    }

    #AmmiSearchBarIcon {
        left: 290px;
    }
}

@media (max-width: 750px) {

    #divAmmiHeaderMain {
        display: none;
    }
}

/*________________________________________________________________________*/


/*BetterDoc's Instant Answer Chatbot Styles*/
.betterdocs-widget-container {
    z-index: 9999
}

.betterdocs-conversation-container, .betterdocs-footer-wrapper, .betterdocs-launcher, .betterdocs-ask-wrapper .betterdocs-ask-submit {
    background-color: #1592E6
}

    .betterdocs-footer-wrapper .bd-ia-feedback-wrap, .betterdocs-footer-wrapper .bd-ia-feedback-response {
        background-color: #1592E6
    }

.betterdocs-header-wrapper .betterdocs-header .inner-container.betterdocs-active-answer .toggle:first-of-type > p, .betterdocs-header-wrapper .betterdocs-header .inner-container.betterdocs-active-ask .toggle:last-of-type > p {
    color: #1592E6
}

.betterdocs-header-wrapper .betterdocs-header .inner-container.betterdocs-active-answer .toggle:first-of-type svg, .betterdocs-header-wrapper .betterdocs-header .inner-container.betterdocs-active-ask .toggle:last-of-type svg {
    fill: #1592E6
}

.betterdocs-header-wrapper .betterdocs-header .inner-container, .betterdocs-footer-wrapper .betterdocs-footer-emo > div {
    background-color: #ffffff
}

.betterdocs-launcher[type=button], .betterdocs-launcher[type=button]:focus {
    background-color: #1592E6
}

.betterdocs-widget-container .betterdocs-launcher[type=button]:hover {
    background-color: #58c7ef !important
}

.betterdocs-footer-wrapper .betterdocs-emo {
    fill: #1592E6
}

.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content h1 {
    font-size: 26px
}

.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content h2 {
    font-size: 24px
}

.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content h3 {
    font-size: 22px
}

.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content h4 {
    font-size: 20px
}

.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content h5 {
    font-size: 18px
}

.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content h6 {
    font-size: 16px
}

.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content,
.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content p,
.betterdocs-messages-container .betterdocs-modal-wrapper .betterdocs-modal-content-container .betterdocs-ia-content strong {
    font-size: 16px
}

.betterdocs-widget-container .betterdocs-launcher {
    width: 30px;
    height: 30px;
}

.betterdocs-widget-container {
    max-width: 75vw;
    right: 25px;
    bottom: 25px;
}
 /*Settings Tables*/
 table.tblSetttings {
	border: 0;
	width: 100%;
}

.tblSetttings tr:hover td{ 
	background: #F0F0F0; 
	background-color: #F0F0F0;
}

/*Custom Font Awesome Styles*/
<style>
  .fa-stack.small {
    font-size: 0.5em;
  }
  i {
    vertical-align: middle;
  }
  
</style>