body
{
    /* font-family: arial, verdana, geneva, tahoma, sans-serif;
    font-size: 12px;
    margin: 0px;
    background-color: #91B0D3;
    text-align: center;
    font-weight: normal; */
    font-family: "Outfit", arial;
    line-height: 1.25em;
}

/* page fade css */
/*.fade-section {
    opacity: 0;
    transition: opacity 0.1s ease-in-out;
}

.fade-section.fade-in {
    opacity: 1;
}*/

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
}

.fs-5 {font-size: 1.10rem !important;}

.fs-small {font-size:0.80rem;}

.cardbackground { background: #f7f7f7; padding:12px; }

#css_tabs.nav-tabs .nav-link.active {
    background-color: #f7f7f7;
}

.style30 {
    font-weight: normal;
}
.permblue {
    font-weight: bold;
    font-size: 14px;
    color: #0066CC;
    background-color:#EBEBEB;
}

.greentext
{
    font-size: 12px;
    color: #0E7309;
    font-weight: bold;
}

.redtext
{
    font-size: 12px;
    color: #AD0A0A;
    font-weight: bold;
}

a.largeblue:link, a.largeblue:visited, a.largeblue:active
{
    color: #1E569B;
    text-decoration: none;
    font-weight: normal;
    font-size: 14px;
    font-weight: bold;
}

a.largeblue:hover
{
    color: #3A73BA;
    text-decoration:underline;
    font-size: 14px;
    font-weight: bold;
}

a.redlink:link, a.redlink:visited, a.redlink:active
{
    color: #B60303;
    text-decoration: none;
    font-weight: normal;
    font-size: 12px;
    font-weight: bold;
}

a.redlink:hover
{
    color: #830202;
    text-decoration:underline;
    font-size: 12px;
    font-weight: bold;
}


#userbox
{
    float: right;
    /*border: 2px solid #6A7074;*/
    width: 227px;
    /*background: #555C61; */
    background: url(/admin/images/usertop.gif) top left no-repeat;
    padding: 7px 2px 6px 2px;
    margin: 12px;
    height: 64px;
}
#userbox p {margin: 0; color: #FFFFFF; font-weight: bold; font-size: 13px; padding-left: 2px;}
#userbox a:link, #userbox a:visited {
    margin-top: 16px;
    padding: 1px 0;
    color: #D8D8D8;
    font-weight: bold;
    font-size: 13px;
}
#userbox a:hover {
    background: none;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 13px;
}


.fontsmallgrey {
    font-size: 11px;
    color: #6D6D6D;
}

.fontsmallblack {
    font-size: 11px;
    color: #000000;
    font-weight: bold;
}

.fontblue13 {
    color: #000099;
}

.blue14 {
    color: #0E4F8C;
    font-size: 14px;
    font-weight: bold;
}

.tdgreyback
{
    background: url(/admin/images/greyslice.gif);
    background-color: #E3E3E3;
    padding: 8px 0px 7px 12px;
}

#leftnav {
    /*background: url("/admin/images/leftnavslice.gif");*/
    /*background-color: #D8E7FD;
    padding: 4px 4px 4px 9px;*/
    border: 1px solid #9AB9ED;
    margin-top: -3px;
}

/*--- left sub navigation --- */
#subnav {
    margin: 0;
    padding: 0px;
    list-style: none;
    text-align: left;
}
#subnav li {
    margin: 0px;
    padding: 0px;
    border-bottom: 1px dotted #DCDCDC;
}
#subnav li.active {
    /*background: url(../img/subnav_hover.gif) repeat-x top left;*/
}
#subnav li.active a {
    color: #FFFFFF;
    background: #93BB3A url(/admin/images/arrowactive.gif) no-repeat 100% 50%;
}
#subnav a {
    display: block;
    margin: 0;
    padding: 5px 18px 5px 25px;
    font-weight: bold;
    font-size: 9pt;
    text-decoration: none;
    background: #FFFFFF url(/admin/images/arrownorm.gif) no-repeat 100% 50%;
    color: #0A3F98;
}
#subnav a:hover {
    color: #0A3F98;
    background: #D0DFF7 url(/admin/images/arrowhover.gif) no-repeat 100% 50%;
    font-weight: bold;
}
/*--- end left nav --- */

#leftinfo {
    /*background-image: url('/admin/images/error_title.gif');*/
    border-top: 2px #2555B2 solid;
    border-bottom: 2px #2555B2 solid;
    /*width:200px;*/
    background-color:#C7D8F8;
    color: #2555B2;
    font-weight: bold;
    font-size: 15px;
    padding: 6px 6px 6px 8px;
    margin: 0px;
}

.leftinfotext {
    color: #000000;
    font-weight: bold;
    font-size: 12px;
    margin: 5px 0px 55px 0px;
}

#leftnavheaderadmin {
    background: url(/admin/images/leftnav_header_admin.gif) no-repeat;
    height: 34px;
    margin: 0px 0px -5px 0px;
    padding: 8px 0px 0px 14px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 14px;
}

.leftslice {
    width: 9px;
    background: url("/admin/images/leftslice.gif");
}

.rightslice {
    width: 9px;
    background: url("/admin/images/rightslice.gif");
}

#topheader {
    height: 80px;
    /*background-color: #062E73;    */
    background: #273238 url("/admin/images/backtop.jpg") top left repeat-x;
}

#cmsheader {
    float:left;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 25px;
    margin: 12px 0px 0px 20px;
}

#rightheader {
    float: right;
    text-align: right;
    width: 350px;
    margin: 15px 18px 0px 0px;
    color: #FFFFFF;
    font-size: 11px;
}



#submaincontent {
    border: 8px solid #E0D9B8;
    padding: 0px;
    background-color: #FFFFFF;
    margin-right: 12px;
}

#submaintable
{
    margin:20px;
    clear: left;
}

#submaincontent h1{
    background: #F5F9FF url("/admin/images/submainh1slice.gif") top left repeat-x;
    height: 57px;
    padding: 0px 10px 0px 12px;
    font-size: 22px;
    margin-top:5px;
    border-bottom: 1px solid #C4E3FF;
}

#rightcontent {
    border: 8px solid #E0D9B8;
    padding: 0px;
    background-color: #FFFFFF;
}

.rightyellowbox
{
    border: 2px solid #E2DCA0;
    background-color: #F6F2C9;
    margin: 5px;
    padding: 5px;
}

.rightyellowbox p
{
    margin: 0px;
    font-size: 12px;
}

.rightyellowbox h1
{
    margin: 0px 0px 8px 0px;
    font-size: 18px;
    font-weight: bold;
    color: #292A2B;
}

.rightbluebox
{
    border: 2px solid #A6D0E8;
    background-color: #E3F1F9;
    margin: 5px;
    padding: 5px;
}

.rightbluebox p
{
    margin: 0px;
    font-size: 12px;
}

.rightbluebox h1
{
    margin: 0px 0px 8px 0px;
    font-size: 18px;
    font-weight: bold;
    color: #498CE9;
}

#submain {
    padding: 12px 12px 10px 8px;
    /*border-top: 2px solid #EEEEEE;
    border-right: 3px solid #E5E4E4;
    border-bottom: 3px solid #E5E4E4;
    border-left: 2px solid #EEEEEE;
    background: #FBFBFB;*/
}

#formtable {
    /*border: 3px solid #B7C8DA;*/

}

#formtable2 {
    /*border: 3px solid #B7C8DA;*/
    width: 98%;
}

#formtablewide {
    /*border: 3px solid #B7C8DA;*/
    width: 98%;
}

#formtabletop {
    height:25px;
    background: #7C8288 url("/admin/images/formtabletopslice.gif") top left repeat-x;
    border-bottom:1px solid #C4E3FF;
}

.redfont
{
    font-size: 12px;
    color: #CC0000;
    font-weight: bold;
}

.greenfont
{
    font-size: 12px;
    color: #009933;
    font-weight: bold;
}

/*====== Top Tabs =========================*/

#navtop1 {
    float:left;
    width:100%;
    background-color: #273238;
    font-size:95%;
    line-height:normal;
    border-bottom: 4px solid #93BB3A;
}
#navtop1 ul {
    margin:0px;
    padding:2px 20px 0;
    list-style:none;
}
#navtop1 li {
    float:left;
    background:url("/admin/images/left.gif") no-repeat left top;
    margin:0;
    padding:0 2px 0 9px;
    list-style:none;
}
#navtop1 a {
    float:left;
    display:block;
    background:url("/admin/images/right.jpg") no-repeat right top;
    padding:8px 11px 6px 2px;
    text-decoration:none;
    font-weight:bold;
    color:#A8A8A8;
}
/* Commented Backslash Hack
hides rule from IE5-Mac \*/
#navtop1 a {float:none;}
/* End IE5-Mac hack */
#navtop1 a:hover {
    color:#FFFFFF;
}
#navtop1 #current {
    background-image:url("/admin/images/left_on.jpg");
}
#navtop1 #current a {
    background-image:url("/admin/images/right_on.jpg");
    color:#FFFFFF;
    /*padding: 0px 0px -2px 0px;*/
}

#navtopsecondary {
    /*background-color: #D3D3D3; */
    background: url("/admin/images/backsecondary.gif") top left repeat-x;
    line-height:normal;
    border-bottom: 3px solid #B4D368;
    height: 32px;
    padding: 3px 17px 3px 19px;
    text-align: left;
}

#navtopsecondary a
{
    font-weight: bold;
    color: #232527;
    /*padding: 3px 3px 3px 3px;
    background-color: #A9CA56;*/
}

#navtopsecondary a:hover
{
    font-weight: bold;
    color: #000000;
    text-decoration: underline;
    /*padding: 3px 3px 3px 3px;
    background-color: #719425;*/
}

/*  end top nav ---*/
#contentFrame {
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 35px;
    padding-bottom: 15px;
}




a.white:link, a.white:visited, a.white:active
{
    color: #FFFFFF;
    text-decoration: underline;
    font-weight: normal;
    padding: 0px 3px 2px 3px;
    background-color: #062E73;
}

a.white:hover
{
    color: #FFFFFF;
    text-decoration:underline;
    padding: 0px 3px 2px 3px;
    background-color: #23519E;
}

a.whitefooter:link, a.whitefooter:visited, a.whitefooter:active
{
    color: #FFFFFF;
    text-decoration: none;
    font-weight: normal;
    padding: 3px 3px 3px 3px;
    background-color: #5A5F65;
}

a.whitefooter:hover
{
    color: #FFFFFF;
    text-decoration:none;
    padding: 3px 3px 3px 3px;
    background-color: #232527;
}

a.small:link, a.small:visited, a.small:active
{
    color: #0B53B6;
    text-decoration: none;
    font-weight: normal;
    padding: 2px;
    font-size: 10px;
}

a.small:hover
{
    color: #0B53B6;
    text-decoration:underline;
    font-size: 10px;
}
/*------*/
a.addnew:link, a.addnew:visited, a.addnew:active
{
    color: #0B53B6;
    text-decoration: none;
    font-weight: normal;
    font-size: 9pt;
    font-weight: bold;
}

a.addnew:hover
{
    color: #FFFFFF;
    font-size: 9pt;
    font-weight: bold;
    text-decoration:none;
    background-color: #0A3F98;
    padding: 2px;
}

a.non:link, a.non:visited, a.non:active, a.non:hover
{
    color: #8B8B8B;
    text-decoration: none;
    font-weight: normal;
    background-color: transparent;
}

/* Forms -------------------------------- */


/* Form Items, Buttons etc. ---------------- */



.btn_med {
    border: 1px outset;
    cursor: pointer;
    font-size:17px;
    font-weight: bold;
    margin: 0px 0px 0px 1px;
    padding: 1px 1px 1px 1px;
    background-image: url(/admin/images/button2.gif);
    width:96px;
    height: 28px;
}

.btn_close {
    border: 1px outset;
    cursor: pointer;
    font-size:17px;
    font-weight: bold;
    margin: 0px 0px 0px 1px;
    padding: 1px 1px 1px 1px;
    background-image: url(/admin/images/button2.gif);
    width:96px;
    height: 28px;
}

.btn_med2 {
    border: 1px outset;
    cursor: pointer;
    font-size:13px;
    font-weight: bold;
    margin: 0px 0px 0px 1px;
    padding: 1px 1px 1px 1px;
    background-image: url(/admin/images/button2.gif);
    width:175px;
    height: 28px;
}

.btn_wide {
    border: 1px outset;
    cursor: pointer;
    font-size:13px;
    font-weight: bold;
    margin: 0px 0px 0px 1px;
    padding: 1px 1px 1px 1px;
    background-image: url(/admin/images/button2.gif);
    width:250px;
    height: 28px;
}


.inputbox {
    /*width:170px; */
    border-top: 2px solid #DDDDDD outset;
    border-right: 1px solid #DDDDDD;
    border-left: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
    font-size: 14px;
    color: #3E4148;
    background-color: #F7F7F7;
    height: 22px;
}

.inputsmall {
    /*width:170px; */
    border-top: 2px solid #DDDDDD outset;
    border-right: 1px solid #DDDDDD;
    border-left: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
    font-size: 11px;
    color: #3E4148;
    background-color: #F7F7F7;
    height: 22px;
}

.selectlarge{
    width:170px;
    border-top: 2px solid #DDDDDD outset;
    border-right: 1px solid #DDDDDD;
    border-left: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
    font-size: 11px;
    color: #3E4148;
    background-color: #F7F7F7;
    height: 70px;
}

.selectsmall {
    /*width:170px; */
    border-top: 2px solid #DDDDDD outset;
    border-right: 1px solid #DDDDDD;
    border-left: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
    font-size: 12px;
    color: #3E4148;
    background-color: #F7F7F7;
}


/* Validation Styles ---------------------------- */

#error {
    background-color:#FCBABA;
    color: #BF0606;
}

#errorsmall {
    border-top: 2px #BF0606 solid;
    border-bottom: 2px #BF0606 solid;
    width:400px;
    background-color:#FCBABA;
    color: #BF0606;
    font-weight: bold;
    font-size: 17px;
    padding:6px 6px 6px 8px;
    margin: 5px 0px 5px 0px;
}

.errortext {
    color: #000000;
    font-weight: bold;
    font-size: 14px;
    margin: 5px 0px 5px 28px;
}


#fieldsetmain
{
    margin-top:8px;
    border: 3px solid #CCCCCC;
}

#fieldsetmain2
{

    margin-top:8px;
    border: 3px solid #CCCCCC;
}

#fieldsetmain3
{
    width:96%;
    margin-top:8px;
    border: 3px solid #CCCCCC;
}

#submitinfo {
    background: #F2F2F0 url(/admin/images/submitback.gif) top left repeat-x;
    height: 65px;
    width: 100%;
    text-align: center;
}

#submitinfo a:link, #submitinfo a:visited, #submitinfo a:active {
    color: #2167A7;
    font-weight: bold;
    text-decoration: none;
}
#submitinfo a:hover {
    color: #FFFFFF;
    font-weight: bold;
    text-decoration: none;
    background: #B60707;
}

#webmailmessage {
    /*background-image: url('/admin/images/error_title.gif');*/
    border: 2px dotted #E9BD46;
    width:610px;
    background-color:#FBF5C0;
    color: #191918;
    padding: 15px;
}

#webmailmessage p  {
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    line-height: 20px;
}

#pagemessage {
    /*background-image: url('/admin/images/error_title.gif');*/
    border: 2px dotted #E9BD46;
    width:700px;
    background-color:#FBF5C0;
    color: #191918;
    padding: 15px;
}

#pagemessage p  {
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    line-height: 18px;
}

#pagemessage a:link, #pagemessage a:visited, #pagemessage a:active {
    color: #2167A7;
    font-weight: bold;
    text-decoration: none;
}
#pagemessage a:hover {
    color: #FFFFFF;
    font-weight: bold;
    text-decoration: none;
    background: #B60707;
}

#pagemessagegrey {
    /*background-image: url('/admin/images/error_title.gif');*/
    border: 2px dotted #C4C4C4;
    width:550px;
    background-color:#F3F4F4;
    color: #191918;
    padding: 15px;
}

#pagemessagegrey p  {
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    line-height: 18px;
}

#pagemessagegrey a:link, #pagemessagegrey a:visited, #pagemessagegrey a:active {
    color: #2167A7;
    font-weight: bold;
    text-decoration: none;
}
#pagemessagegrey a:hover {
    color: #FFFFFF;
    font-weight: bold;
    text-decoration: none;
    background: #B60707;
}

#pagewarning {
    /*background-image: url('/admin/images/error_title.gif');*/
    border: 2px dotted #BF0606;
    width:700px;
    background-color:#FCBABA;
    color: #191918;
    padding: 15px;
}

#pagewarning p  {
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    line-height: 18px;
}

#webstatsmessage {
    /*background-image: url('/admin/images/error_title.gif');*/
    border: 2px dotted #E9BD46;
    width:750px;
    background-color:#FBF5C0;
    color: #191918;
    padding: 15px;
    font-weight:normal;
}

#webstatsmessage p  {
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    line-height: 18px;
}

.greymessage {
    /*background-image: url('/admin/images/error_title.gif');*/
    border: 1px dotted #D5D5D5;
    width:96%;
    background-color:#F1F1F1;
    color: #191918;
    padding: 6px 12px 6px 12px;
}

.greymessage p  {
    color: #000000;
    font-size: 12px;
    font-weight: normal;
    line-height: 15px;
}

#infogrey {
    /*background-image: url('/admin/images/error_title.gif');*/
    border-top: 2px #D9D9D9 solid;
    border-bottom: 2px #D9D9D9 solid;
    width:585px;
    background-color:#F1F0F0;
    color: #848383;
    font-weight: bold;
    font-size: 14px;
    padding: 6px 6px 6px 14px;
    margin: 5px 0px 5px 0px;
}

#infogrey p {
    color: #000000;
    font-size: 11px;
    font-weight: bold;
}

#searchresults {
    /*background-image: url('/admin/images/error_title.gif');*/
    border-top: 2px #2555B2 solid;
    border-bottom: 2px #2555B2 solid;
    width: 98%;
    background-color:#C7D8F8;
    color: #2555B2;
    font-weight: bold;
    font-size: 17px;
    padding: 6px 6px 6px 8px;
    margin: 5px 0px 5px 0px;
}

.searchresultslarge
{
    color: #2555B2;
    font-weight: bold;
    font-size: 17px;
}

#searchresults li, td {
}

/**********************/
/* Link Button Styles */
/**********************/


.linkbutton:link, .linkbutton:visited, .linkbutton:active {
    background-image: url(/admin/images/button_background_over2.gif);
    padding:3px;
    padding-left:10px;
    padding-right:10px;
    background-position: center;
    color: #FFFFFF;
    text-decoration: none;
    border:1px solid #23519E;
    font-weight:bold;
    font-size: 11px;
    line-height:20px;
    background-color: #23519E;
}
.linkbutton:hover {
    border:1px solid #3C69B6;
    background-image: url(/admin/images/button_background.gif);
    background-color: #23519E;
    font-size: 11px;
    color: #FFFFFF;
}

.linkbuttondisabled:link, .linkbuttondisabled:visited, .linkbuttondisabled:active, .linkbuttondisabled:hover {
    background-image: url(/admin/images/button_disabled.gif);
    padding:3px;
    padding-left:10px;
    padding-right:10px;
    background-position: center;
    color: #9F9F9F;
    text-decoration: none;
    border:1px solid #C0C0C0;
    font-weight:bold;
    font-size: 11px;
    line-height:20px;
    background-color: #f38528;
}


/*===== table styles ====*/
td.contentHeaderBlue2 {
    color: #FFFFFF;
    font-size: 13px;
    border-bottom: 2px solid #212121;
    border-top: 1px solid #949494;
    padding: 5px 0px 6px 8px;
    background-color: #F3F8FF;
    background: url(/admin/images/tabletopblack.gif);
}

td.contentHeaderRed {
    color: #FFFFFF;
    font-size: 13px;
    border-bottom: 2px solid #680601;
    border-top: 1px solid #949494;
    padding: 5px 0px 6px 8px;
    background-color: #F3F8FF;
    background: url(/admin/images/tabletopred.gif);
}

td.contentBottom {
    border-bottom: 1px solid #CFDDE9;
    font-size: 12px;
    padding:2px;
}

.contentBottom a:link, .contentBottom a:visited {
    padding: 2px;
    color: #3281CA;
    font-weight: bold;
    font-size: 12px;
}
.contentBottom a:hover {
    padding: 2px;
    background: #015BB0;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 12px;
}

.gridrowContent TD
{
    padding: 6px 3px 6px 5px;
    background-color: transparent;
    height: 27px;
    border-bottom: 1px solid #E9F0F7;
    font-weight: normal;
}

.gridrowoverContent TD
{
    padding: 6px 3px 6px 5px;
    background-color: #EFF7FF;
    height: 27px;
    border-bottom: 1px solid #E9F0F7;
    font-weight: normal;
}

.clientinfo {
    color: #FFFFFF;
    font-size: 13px;
    font-weight: bold;
    background: url(/admin/images/clientback.gif) top no-repeat;
}

.selectgrouping {
    width:50px;
    border-top: 2px solid #DDDDDD outset;
    border-right: 1px solid #DDDDDD;
    border-left: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
    font-size: 16px;
    font-weight: bold;
    color: #3E4148;
    background-color: #F7F7F7;
    height: 70px;
}

#dhtmltooltip{
    position: absolute;
    left: -300px;
    font-size: 10px;
    font-weight: bold;
    width: 150px;
    border: 1px solid #A4A3A3;
    padding: 4px;
    background-color: #F4F4F4;
    visibility: hidden;
    z-index: 100;
    text-align: left;
    /*Remove below line to remove shadow. Below line should always appear last within this CSS*/
    /*filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=108); */
}

#tooltipheader
{
    font-size: 13px;
    font-weight: bold;
}

#dhtmlpointer{
    position:absolute;
    left: -300px;
    z-index: 101;
    visibility: hidden;
}

.tdgraynormaldk {
    padding: 4px 3px 4px 4px;
    background-color: #E9F0F7;
    border-bottom: 3px solid #E9F0F7;
    font-weight: normal;
    font-size: 11px;
}

.tdrednormaldk {
    padding: 4px 3px 4px 4px;
    background-color: #FBD1CF;
    border-bottom: 1px solid #FBD1CF;
    font-weight: normal;
    font-size: 11px;
}

.tdgraynormaldk2 {
    padding: 6px 3px 5px 4px;
    background-color: #F2F7FB;
    border-bottom: 1px solid #DEE7F0;
    font-weight: normal;
    font-size: 11px;
}

.tdgraynormal {
    padding: 4px 3px 4px 4px;
    background-color: #FFFFFF;
    border-bottom: 1px solid #E9F0F7;
    font-weight: normal;
    font-size: 11px;
}

.tdrednormal {
    padding: 4px 3px 4px 4px;
    background-color: #FEEAE9;
    border-bottom: 1px solid #FEEAE9;
    font-weight: normal;
    font-size: 11px;
}

.tdgraynormal2 {
    padding: 6px 3px 5px 4px;
    background-color: #FFFFFF;
    border-bottom: 1px solid #DEE7F0;
    font-weight: normal;
}

.tdwebstats {
    background-color: #93BB3A;
    font-weight: normal;
    font-size:16px;
    color: #FFFFFF;
}

.tdwebstatsnormal {
    background-color: #FFFFFF;
    font-weight: normal;
    font-size:13px;
    color: #000000;
}

.tdwebstatsheader {
    background-color: #C7E778;
    font-weight: bold;
    font-size:13px;
    color: #000000;
}

.tooltiptable
{
    font-size: 10px;
    border-bottom: 1px solid #CCCCCC;
}

#tooltipheader
{
    font-size: 13px;
    font-weight: bold;
}

#addinventoryinfo {
    font-size: 13px;
    font-weight: bold;
}

/*--- welcome page items --*/
#dashboardinternal
{
    padding: 65px 14px 0px 77px;
    font-size: 12px;
    font-weight: normal;
    color: #333333;
}
.dashboardnotes
{
    margin:10px 0px 0px 5px;
    font-size:11px;
    border: 1px solid #DBE7F3;
    background:#EFF5FA;
    padding:4px;
}
#dashboardupgrades
{
    background: url("/admin/images/dashboard_upgrades.jpg") no-repeat;
    width: 760px;
    height: 175px;
    padding: 80px 14px 0px 82px;
    margin: 0px;
}
#dashboardleads
{
    background: url("/admin/images/dashboard_leads.jpg") no-repeat;
    width: 405px;
    height: 155px;
    margin: 0px;
}

#dashboardlinks
{
    background: url("/admin/images/dashboard_links.jpg") no-repeat;
    width: 405px;
    height: 155px;
    margin: 0px;
}
#dashboardcalendar
{
    background: url("/admin/images/dashboard_calendar.jpg") no-repeat;
    width: 405px;
    height: 155px;
    margin: 0px;
}
#dashboardnews
{
    background: url("/admin/images/dashboard_news.jpg") no-repeat;
    width: 405px;
    height: 155px;
    margin: 0px;
}
#dashboarddocs
{
    background: url("/admin/images/dashboard_docs.jpg") no-repeat;
    width: 405px;
    height: 155px;
    margin: 0px;
}
#dashboardmisc
{
    background: url("/admin/images/dashboard_misc.jpg") no-repeat;
    width: 405px;
    height: 155px;
    margin: 0px;
}
#welcomestart
{
    background: url("/admin/images/welcomestart.jpg") no-repeat;
    width: 405px;
    height: 145px;
    margin: 0px;
}

#welcomedesign
{
    background: url("/admin/images/welcomedesign.jpg") no-repeat;
    width: 405px;
    height: 165px;
    margin: 0px;
}

#welcomesupport
{
    background: url("/admin/images/welcomesupport.jpg") no-repeat;
    width: 405px;
    height: 145px;
    margin: 0px;
}

#welcomepageinternal
{
    padding: 65px 14px 0px 77px;
    font-size: 12px;
    font-weight: normal;
    color: #333333;
}

#support
{
    background: url("/admin/images/back_support_rightside.jpg") no-repeat;
    width: 500px;
    height: 340px;
    margin: 0px;
}

#supportright
{
    padding: 45px 14px 0px 45px;
    font-size: 12px;
    font-weight: normal;
    color: #333333;
}

#supportright h2
{
    font-size: 14px;
    font-weight: bold;
    color: #333333;
    margin-bottom: 3px;
}

#welcomestats
{
    background: url("/admin/images/welcomestats.jpg") no-repeat;
    width: 375px;
    height: 500px;
    margin: 0px;
}

#welcomepageright
{
    padding: 75px 14px 0px 45px;
    font-size: 12px;
    font-weight: normal;
    color: #333333;
}

#welcomepagerightheader
{
    font-size: 14px;
    font-weight: bold;
    color: #333333;
    margin-bottom: 3px;
}

a.welcome:link, a.welcome:visited, a.welcome:active {
    font-weight: bold;
    font-size: 13px;
    text-decoration: underline;
    color: #487BB5;
}
a.welcome:hover {
    color: #6998CD;
    text-decoration: underline;
    font-size: 13px;
}

#emailmarketmessage {
    /*background-image: url('/admin/images/error_title.gif');*/
    border: 2px dotted #E9BD46;
    width:660px;
    background-color:#FBF5C0;
    color: #191918;
    padding: 15px;
}

#emailmarketmessage p  {
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    line-height: 20px;
}

#emailmarketmessage a  {
    color: #1658A2;
    font-size: 14px;
    font-weight: bold;
    line-height: 20px;
}

/*  price table */
#pricing {
    border-left: 1px solid #868F98;
}

#tryplan {
    font-size: 19px;
    color: #000000;
    /*background-color: #232323;*/
    margin: 0;
    padding: 12px 3px 0px 13px;
    text-align: left;
    height: 35px;
    width: 98%;
}

#featureheader {
    font-size: 15px;
    font-weight: bold;
    color: #FFFFFF;
    background: url(//admin/images/feature_slice.gif) repeat-x;
    background-color: #232323;
    padding-left: 7px;
    text-align: left;
    height: 25px;
}

#featureheader1 {
    font-size: 15px;
    font-weight: bold;
    color: #FFFFFF;
    /*background: url(//admin/images/feature_slice.gif) repeat-x;*/
    background-color: #232323;
    padding-left: 12px;
    text-align: left;
    height: 25px;
}

#subcat {
    font-size: 13px;
    font-weight: bold;
    color: #FFFFFF;
    background: url(//admin/images/feature_slice2.gif) repeat-x;
    background-color: #5B8ECD;
    padding-left: 12px;
    text-align: left;
    height: 13px;
}

#itemrow {
    background-color: #FDFDD3;
    padding-bottom: 7px;
    font-size: 14px;
    font-weight: normal;
}

#tryplan strong { color: #FFBF23; }

.support {
    margin: 0 auto;
    border-top: 3px solid #868F98;
}

.unlimited { color: #F52E0D; }

.rowhead {
    font-size: 15px;
    color: #2E3539;
    text-align: left;
    font-weight: bold;
    padding-left: 12px;
}

.pricingover {
    background-color: #E7F1FE;
    border: 1px dotted #B6BCC1;
}

.plan-names td { font-size: 18px; font-weight: bold; color: #000;
    background-position: bottom;
    background-repeat: repeat-x;
    padding-top: 7px;
    padding-bottom: 7px;
}

.plan-names td, .plan-specs td, .plan-prices td, .plan-signup td {
    background-color: #FAFAFA;
    border-right: 1px solid #868F98;
}

.plan-specs td, .plan-prices td {
    border-bottom: 1px dotted #B6BCC1;
}

.plan-signup td {
    border-bottom: 3px solid #868F98;
}

.plan-prices td strong { font-size: 20px; }
.plan-prices td strong sup { font-size: 11px; }

#smallprice { font-size: 13px; }

.plan-taglines td {
    border-right: 1px solid #B6BCC1;
    border-bottom: 1px dotted #B6BCC1;
    font-size: 10px;
}

.plan-details td {
    border-right: 1px solid #B6BCC1;
    border-bottom: 1px dotted #B6BCC1;
    font-size: 10px;
    vertical-align: middle;
}

.support-plans {
    font-weight: bold;
}

.support-prices strong {
    font-size: 13px;
}

#bottom td {
    border-bottom: 3px solid #C2C7CB;
}

#signup-info {
    font-size: 15px;
    text-align: center;
}


#pagedef {
    font-size: 10px;
    color: #414B56;
}

/*  end price table---*/
.clear {
    clear:both;
}

.subitemheader {
    float:left; padding:4px; margin-bottom:2px;  width:98%; border: solid 1px #E1EAF3; background-color: #EFF7FF;
}

/* for hoempage mouseovers in topheader of homepage */
.goback a, .goback a:link, .goback a:visited {
    position: relative;
    display: block;
    width: 122px;
    height: 36px;
    overflow: hidden;
    background-position: 0 0;
    margin:0px;
}
.goback a:hover
{
    background-position:  0 38px;
    margin: 0px;
}

#gobacknow
{
    background-image: url(/admin/images/goback_small.gif);
}

#dripgreen {
    background-color: #339900;
    color: #FFFFFF;
    font-size:11px;
    font-weight: bold;
    padding-left: 5px;
}

#dripsentdisabled {
    background-color: #E59696;
    color: #000000;
    font-size:11px;
    font-weight: bold;
    padding-left: 5px;
}

#dripgrey {
    background-color: #CCCCCC;
    color: #000000;
    font-size:11px;
    font-weight: bold;
    padding-left: 5px;
}

#dripgreydark {
    background-color: #6A6A6A;
    color: #FFFFFF;
    font-size:11px;
    font-weight: bold;
    padding-left: 5px;
}

#dripyellow {
    background-color: #FFCC00;
    color: #000000;
    font-size:11px;
    font-weight: bold;
    padding-left: 5px;
}

#dripred {
    background-color: #CC0000;
    color: #FFFFFF;
    font-size:11px;
    font-weight: bold;
    padding-left: 5px;
}
.landing_button {
    background-color:#c4e3ff;
    padding:15px 15px 15px 5px;
    border-radius:10px;
    position:relative;
    border: solid 1px #336088;
    margin:0px 0px 25px 0px;
}
.landing_button span {
    font-size:28px;
    color:#336088;
    font-weight:bold;
    position:absolute;
    top:5px;
    left:5px;
}
.landing_button h2 {
    font-size:22px;
    color:#336088;
    font-weight:bold;
    margin:0px 60px 0px 60px;
    padding:0px;
    border:none;
    height:auto;
    background-color:transparent;
}
.landing_button p {
    margin:0px 60px 0px 60px;
    font-size:16px;
    color:#000;
}
.landing_button button {
    border-radius:5px;
    padding:5px;
    position:absolute;
    bottom:5px;
    right:5px;
}
.radio-inline {
    margin-left:15px;
}
textarea.form-control {
    height: 100px;
}
.table>tbody>tr>td, .table>tbody>tr>th {
    font-size:15px;
}
.bootbox-body {
    font-size:22px;
}

.dd {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 18px;
    line-height: 20px;
}

.dd-list {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}
.dd-list .dd-list {
    padding-left: 50px;
}

.dd-item,
.dd-empty,
.dd-placeholder {
    display: block;
    position: relative;
    margin: 3px 0px;
    padding: 0 3px;
    min-height: 20px;
    font-size: 18px;
    line-height: 20px;
    border: 1px solid #ccc;
    border-radius: 3px;
}
.dd-handle {
    display: inline-block;
    padding: 5px 10px;
    color: #333;
    text-decoration: none;
    font-weight: bold;
    background: #fafafa;
    box-sizing: border-box;
    width:50px;
}
.dd-content {
    display: inline-block;
    width:89%;
}
.dd-handle:hover {
    color: #2ea8e5;
    background: #fff;
}

.dd-item > button {
    position: absolute;
    left: 45px;
    top:5px;
    z-index:100;
    cursor: pointer;
    width: 25px;
    height: 20px;
    margin: 5px 0;
    padding: 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    border: 0;
    background: transparent;
    font-size: 12px;
    line-height: 1;
    text-align: center;
    font-weight: bold;
}
.dd-item > button:before {
    display: block;
    position: absolute;
    width: 100%;
    text-align: center;
    text-indent: 0;
}
.dd-item > button.dd-expand:before {
    content: '+';
}
.dd-item > button.dd-collapse:before {
    content: '-';
}

.dd-expand {
    display: none;
}

.dd-collapsed .dd-list,
.dd-collapsed .dd-collapse {
    display: none;
}

.dd-collapsed .dd-expand {
    display: block;
}

.dd-empty,
.dd-placeholder {
    margin: 5px 0;
    padding: 0;
    min-height: 30px;
    background: #f2fbff;
    border: 1px dashed #b6bcbf;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.dd-empty {
    border: 1px dashed #bbb;
    min-height: 100px;
    background-color: #e5e5e5;
    background-size: 60px 60px;
    background-position: 0 0, 30px 30px;
}

.dd-dragel {
    position: absolute;
    pointer-events: none;
    z-index: 9999;
}
.dd-dragel > .dd-item .dd-handle {
    margin-top: 0;
}
.dd-dragel .dd-handle {
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.1);
}

.dd-nochildren .dd-placeholder {
    display: none;
}
.dd-content button {
    margin-top:-5px;
}

#nestable .form-control {
    padding-left:42px;
    height:40px;
    background-color:#fff;
}
.nav-item.active {
    background-color: #000000 !important;
}
.nav-item.active a{
    color: #ffffff !important;
    font-weight:bold;
}
a {
    color: inherit;
    text-decoration: none;
}
.small {
    font-size:11px;
}
#directory-tree, #directory-tree ul, #file-directory-tree, #file-directory-tree ul {
    list-style: none;
}
.directory:hover, .file-directory:hover {
    cursor:pointer;
}
.is-invalid {
    width: 100%;
    margin-top: 0rem;
    font-size: .875em;
    color: #dc3545;
}
.form-control-color {
    width: 100%;
}
.alert-info {
    color: inherit;
}
.colour-box {
    min-width:100px;

}
/* tiny-mce styles */
/* remove invalid domain message */
.tox-notification { display: none !important }

.tox .gallery-image-box {
    border:1px solid #cccccc;
    margin:10px;
    padding:3px;
    font-size:10px;
}
.tox .gallery-image {
    max-width:150px;
    display:block;
    margin-left:auto;
    margin-right:auto;
}
.tox .gallery-image-box:hover {
    border:1px solid #000000;
    cursor:pointer;
}
.tox .gallery-image-box.active {
    border:2px solid #198754;
}
.tox .tox-dialog--width-lg {
    height: 750px !important;
}
.lender-logo {
    border: 1px solid #ccc;
    margin: 10px;
    padding: 5px;
    position: relative;
    height:100px;
}
.lender-logo:hover {
    cursor:pointer;
}
.lender-logo img {
    max-height:100%;
    max-width:100%;
}
.lender-logo input {
    position: absolute;
    top:40%;
    left:10px;
}
.lender-logos {
    list-style: none;
}
.column-scroll {
    height: 100vh;
}
.column-scroll > .col-md-6 {
    height: 100%;
    overflow-y: scroll;
    overflow-x:hidden;
}
.social_image {
    width:25px;
}
#sortable2 {
    min-width:200px;
    min-height: 200px;
    padding-bottom:200px;
}
.card {
    min-height:200px;
}
.wizard-icon {
    border: 1px solid #cccccc;
    margin:2px;
}
#icon-select-container img {
    max-width:100%;
}
#icon-select-container img:hover {
    cursor:pointer;
}
#icon-select-container p {
    font-size:10px;
}
.image-select-button:hover {
    cursor: pointer;
}
.section-preview {
    background-color:#ffffff;
    margin:10px;
    padding:5px;
    max-height:500px;
    overflow-y: hidden;
}
#section-list {
    padding:10px;
    list-style-type: none;
    font-weight: bold;
}
#section-list li span {
    cursor:pointer;
}

#section-selector-menu li a {
    cursor:pointer;
}
#section-preview-display {
    zoom: 50%;
    max-height: 99vh;
    overflow: auto;
}
.rating { 
      border: none;
      margin-right: 49px;
}
.myratings{

  font-size: 85px;
  color: green;
}

.rating > [id^="star"] { display: none; } 
.rating > label:before { 
  margin: 5px;
  font-size: 2.25em;
  display: inline-block;
  content: "\F588";
}

.rating > .half:before { 
  content: "\F587";
  position: absolute;
}

.rating > label { 
  color: #ddd; 
 float: right; 
}

/***** CSS Magic to Highlight Stars on Hover *****/

.rating > [id^="star"]:checked ~ label, /* show gold star when clicked */
.rating:not(:checked) > label:hover, /* hover current star */
.rating:not(:checked) > label:hover ~ label { color: #FFD700;  } /* hover previous stars in list */

.rating > [id^="star"]:checked + label:hover, /* hover current star when changing rating */
.rating > [id^="star"]:checked ~ label:hover,
.rating > label:hover ~ [id^="star"]:checked ~ label, /* lighten current selection */
.rating > [id^="star"]:checked ~ label:hover ~ label { color: #FFED85;  }

/* loader icon */
.lds-dual-ring {
  display: inline-block;
  width: 80px;
  height: 80px;
}
.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 64px;
  height: 64px;
  margin: 8px;
  border-radius: 50%;
  border: 6px solid #000;
  border-color: #000 transparent #000 transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
#meta_description {
    resize: none;
}

#count_message_title, #count_message_description {
/*  margin-top: -45px;*/
  margin-right: 10px;
}

.header-item {
    display:inline-block;
    border: px #ccc solid;
    padding:5px;
    margin:5px;
}
.header-item:hover{
    cursor:pointer;
}
.footer-element, .header-element{
    position:relative;
}
.column-hover {
    display:none;
    color:#ffffff;
    font-size:20px;
    font-weight:bold;
    text-align:center;
    position: absolute;
    width:100%;
    height:100%;
    background-color: rgba(0,0,0,0.70);
    cursor:pointer;
    margin-left: -16px;
    margin-top: -16px;
}
#edit-render, #add-render {
    padding: 0.375rem 0.75rem;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.25rem;
}

.mce-notification {display: none !important;}

#aceeditor {
    position: relative;
    width:100%;
    height:500px;
}
#ace-container {
    background-color:#141414;
    padding:5px;
}
.nav-item {
  margin-top: 1em;
}

table {
    background-color:#ffffff;
}

.tree{
  --spacing : 1.5rem;
  --radius  : 10px;
}

.tree li{
  display      : block;
  position     : relative;
  padding-left : calc(2 * var(--spacing) - var(--radius) - 2px);
}

.tree ul{
  margin-left  : calc(var(--radius) - var(--spacing));
  padding-left : 0;
}

.tree ul li{
  border-left : 2px solid #ddd;
}

.tree ul li:last-child{
  border-color : transparent;
}

.tree ul li::before{
  content      : '';
  display      : block;
  position     : absolute;
  top          : calc(var(--spacing) / -2);
  left         : -2px;
  width        : calc(var(--spacing) + 2px);
  height       : calc(var(--spacing) + 1px);
  border       : solid #ddd;
  border-width : 0 0 2px 2px;
}

.tree summary{
  display : block;
  cursor  : pointer;
}

.tree summary::marker,
.tree summary::-webkit-details-marker{
  display : none;
}

.tree summary:focus{
  outline : none;
}

.tree summary:focus-visible{
  outline : 1px dotted #000;
}

.tree li::after,
.tree summary::before{
  content       : '';
  display       : block;
  position      : absolute;
  top           : calc(var(--spacing) / 2 - var(--radius));
  left          : calc(var(--spacing) - var(--radius) - 1px);
  width         : calc(2 * var(--radius));
  height        : calc(2 * var(--radius));
  border-radius : 25%;
  background    : #ddd  center url('/admin/images/link-45deg.svg');
}

.tree summary::before{
  z-index    : 1;
  background : #ffc107 url('/admin/images/expand-collapse.svg') 0 0;
}

.tree details[open] > summary::before{
  background-position : calc(-2 * var(--radius)) 0;
}
.tree a {
    color:#0d6efd;
}
[data-bs-toggle="tooltip"] {
    margin-top:-8px;
}

input[type="radio"].is-invalid {
    width:1em;
}
input[type="checkbox"].is-invalid {
    width:1em;
}
.select2-container .select2-search--inline .select2-search__field {
    box-sizing: border-box;
    border: none;
    font-size: 100%;
    margin-top: 5px;
    margin-left: 5px;
    padding: 0;
    max-width: 100%;
    resize: none;
    height: 25px;
    vertical-align: bottom;
    font-family:inherit;
    overflow: hidden;
    word-break: keep-all;
}
.spam-word, .spam-word-static {
    border: 1px solid #ccc;
    margin: 1px;
    padding: 3px;
    position: relative;
    display:inline-block;
    list-style: none;
    background:#FFFFFF;
}

.spam-word:hover {
    cursor: pointer;
}

.nav-link {
    display: block;
    padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
    font-size: var(--bs-nav-link-font-size);
    font-weight: bold;
    color: #9d9d9d;
    text-decoration: none;
    background: 0 0;
    border: 0;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

  #gotoTop {
            position: fixed;
            bottom: 20px;
            right: 20px;
            width: 60px;
            height: 60px;
            background-color: #007bff;
            color: white;
            display: flex; /* Ensure Flexbox is properly applied */
            align-items: center; /* Vertically center content */
            justify-content: center; /* Horizontally center content */
            border-radius: 5px;
            cursor: pointer;
            z-index: 1000;
        }

        #gotoTop i {
            font-size: 40px; /* Increase the icon size for better visibility */
            margin: 0; /* Remove any default margin that might impact centering */
            padding: 0; /* Remove any default padding that might impact centering */
            line-height: 1; /* Keep line-height from affecting the centering */
        }

.dt-search {
    text-align: right;
    margin-bottom:10px;
}
.dt-length label {
    margin-left: 5px;
}

.nav-tabs .nav-link.active {
  color: var(--bs-nav-tabs-link-active-color);
  background-color: #e8e8e8;
  border-color: var(--bs-nav-tabs-link-active-border-color);
}
.bi-bluesky::before {
    content: "";
    background-color: currentColor;
    -webkit-mask: url("https://www.roarcdn.com/images/social/bluesky.svg") no-repeat 50% 50%;
    mask: url("https://www.roarcdn.com/images/social/bluesky.svg") no-repeat 50% 50%;
    -webkit-mask-size: cover;
    mask-size: cover;
    height: 16px;
    width: 16px;
}

.otp_input {
    width:50px;
    height:75px;
    text-align: center;
    border:none;
    background-color:#ccc;
    padding:5px;
    margin:5px;
    font-size: 30px;
}
#verify_submit:focus {
    color: var(--bs-btn-hover-color);
    background-color: var(--bs-btn-hover-bg);
    border-color: var(--bs-btn-hover-border-color);
    outline: 0;
    box-shadow: var(--bs-btn-focus-box-shadow);
}

div.dt-buttons>.dt-button, div.dt-buttons>div.dt-button-split .dt-button {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    margin-left: .167em;
    margin-right: .167em;
    margin-bottom: .333em;
    padding: .5em 1em;
    border: 1px solid #1a1e21;
    border-radius: .25rem;
    cursor: pointer;
    font-size: .88em;
    line-height: 1.6em;
    color: #ffffff;
    white-space: nowrap;
    overflow: hidden;
    background-color: #1c1f23;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-decoration: none;
    outline: none;
    text-overflow: ellipsis;
}
div.dt-buttons>.dt-button:hover:not(.disabled), div.dt-buttons>div.dt-button-split .dt-button:hover:not(.disabled) {
    color: #ffffff;
    background-color: #1c1f23;
    border-color: #1a1e21;
}
.dt-input{
    margin-right:5px;
    margin-left:5px;
}
div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover {
    color: #ffffff !important;
    border: 1px solid #1a1e21;
    background-color: #1c1f23;
}
div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover {
    color: #ffffff !important;
    border: 1px solid #1a1e21;
    background-color: #1c1f23;
}
div.dt-container .dt-paging .dt-paging-button:hover {
    color: #ffffff !important;
    border: 1px solid #1a1e21;
    background-color: #1c1f23;
    background: #1c1f23;
}
.nav-item.active {
    background: #000000 !important;
}

#working {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    padding-top: 50px;
    background-color: rgba(0, 0, 0, 0.5);

    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
#working-message{
    width: 32em;
    max-width: 90%;
    padding: 5em;
    border-radius: 5px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    text-align: center;
    transform: scale(0.9);
    transition: transform 0.3s ease;
    z-index: 9999;
}

.spinner_d9Sa{
    transform-origin:center
}
.spinner_qQQY{
    animation:spinner_ZpfF 18s linear infinite
}
.spinner_pote{
    animation:spinner_ZpfF 1.5s linear infinite
}
@keyframes spinner_ZpfF{
    100%{
        transform:rotate(360deg)
    }
}

.input_updated{
    border-color: #198754 !important;
    box-shadow: 0 0 0 .25rem rgba(25, 135, 84, .75) !important;
}

.blink {
    animation: blink 2s infinite; /* Adjust duration and iteration as needed */
}
@keyframes blink {
    0% { 
        opacity: 1;
        color:#ffc107;
    }
    50% { 
        opacity: 1;
        color:#000000; 
    }
    100% { 
        opacity: 1;
        color:#ffc107;
    }
}

.form-control.is-invalid, .was-validated .form-control:invalid:focus {
    border-color: var(--bs-form-invalid-border-color) !important;
    box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25) !important;
}

.urbo .carousel-control-prev, .urbo .carousel-control-next {
    top: 0% !important;
}
.btn-warning-subtle {
    background-color:#ffda6a;
    border-color:#ffda6a;
}
.btn-warning-subtle:hover {
    background-color:#ffcd39;
    border-color:#ffcd39;
}

/*-------------------------------------------------------*/
/*-------------------------------------------------------*/
/* **************NEW EMBED WIZARD*********************** */
/*-------------------------------------------------------*/
/*-------------------------------------------------------*/

:root {
    --bs-primary: #3b82f6;
    --bs-body-bg: #f8fafc;
    --bs-card-border-radius: 0.5rem;
}
body { font-family: "Outfit", arial; background-color: var(--bs-body-bg); color: #1e293b; }

.extra-small { font-size:0.85rem; }

/* Stepper UI */
.stepper-wrapper { display: flex; justify-content: space-between; position: relative; margin-bottom: 0.5rem; }
.stepper-line { position: absolute; top: 16px; left: 0; right: 0; height: 3px; background: #e2e8f0; z-index: 1; }
.stepper-line-progress { height: 100%; background: var(--bs-primary); transition: width 0.4s ease; }
.step-node { width: 32px; height: 32px; border-radius: 50%; background: #fff; border: 3px solid #e2e8f0; display: flex; align-items: center; justify-content: center; z-index: 2; font-weight: 700; font-size: 0.85rem; color: #94a3b8; transition: 0.3s; cursor: pointer; }
.step-node.active { border-color: var(--bs-primary); background: var(--bs-primary); color: #fff; }
.step-node.completed { border-color: var(--bs-primary); background: var(--bs-primary); color: #fff; }

/* Card Design System */
.card-wizard { border: 1px solid #DDDDDD; border-radius: var(--bs-card-border-radius); box-shadow: 0 1px 3px rgba(0,0,0,0.04); background: #fff; margin-bottom: 1.5rem; overflow: hidden; transition: all 0.3s ease; }

/* Accordion Header Style */
.card-header-label { 
    padding: 0.75rem 1.0rem; 
    font-size: 0.95rem; 
    font-weight: 600; 
    color: #6b7280; 
    text-transform: uppercase; 
    letter-spacing: 0.05em; 
    background-color: #f3f3f3; 
    border-bottom: 1px solid #DDDDDD;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    user-select: none;
}

.chevron-icon { transition: transform 0.3s ease; color: #94a3b8; }
.card-wizard.closed .chevron-icon { transform: rotate(-90deg); }
.card-wizard.closed .card-header-label { border-bottom: none; }



.setting-item { display: flex; align-items: center; padding: 0.9rem 1.0rem; gap: 1rem; border-bottom: 1px solid #f8fafc; }
.setting-item:last-child { border-bottom: none; }

/* Icon Boxes */
.icon-box { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0; }
.setting-content { flex-grow: 1; }
.setting-title { font-weight: 600; font-size: 0.95rem; color: #343434; margin-bottom: 0.1rem; }
.setting-desc { font-size: 0.8rem; color: #64748b; }
.value-badge { background: #f1f5f9; padding: 4px 5px; border-radius: 4px; font-size: 0.75rem; font-weight: 600; color: #475569; min-width: 40px; text-align: center; }

/* Widget Type Selection Grid */
.widget-type-container { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.type-option { cursor: pointer; position: relative; }
.type-card { border: 2px solid #f1f5f9; border-radius: 1rem; padding: 1.25rem 0.5rem; text-align: center; background: #fff; transition: all 0.2s ease; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.type-label { font-size: 0.7rem; font-weight: 700; color: #64748b; text-transform: uppercase; margin-top: 10px; }
.type-check { position: absolute; top: -10px; right: -10px; width: 28px; height: 28px; background: #10b981; color: #fff; border-radius: 50%; display: none; align-items: center; justify-content: center; font-size: 1.1rem; z-index: 5; box-shadow: 0 2px 4px rgba(0,0,0,0.15); }

/* Icon Mocks */
.mock-icon-wrap { height: 32px; display: flex; align-items: center; justify-content: center; color: #94a3b8; }
.carousel-mock { display: flex; align-items: center; gap: 4px; }
.carousel-mock .shape { width: 12px; height: 4px; background: currentColor; border-radius: 2px; }
.block-mock { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; width: 22px; }
.block-mock .shape { width: 10px; height: 10px; background: currentColor; border-radius: 2px; }
.list-mock { display: flex; flex-direction: column; gap: 3px; width: 22px; }
.list-mock .shape { width: 100%; height: 4px; background: currentColor; border-radius: 2px; }
.modal-mock { width: 24px; height: 18px; border: 2px solid currentColor; border-radius: 3px; position: relative; display: flex; align-items: center; justify-content: center; }
.modal-mock::after { content: ''; width: 100%; height: 6px; border-top: 2px solid currentColor; position: absolute; top: 0; }
.badge-mock { width: 24px; height: 28px; border: 2.5px solid currentColor; border-radius: 4px 4px 12px 12px; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.badge-mock::before { content: '★'; font-size: 10px; line-height: 1; margin-top: -2px; }
.badge-mock::after { content: ''; width: 10px; height: 2.5px; background: currentColor; border-radius: 1px; }

/* Active State logic */
.type-input:checked + .type-card { border-color: var(--bs-primary); background-color: #f0f7ff; }
.type-input:checked + .type-card .type-label, .type-input:checked + .type-card .mock-icon-wrap { color: var(--bs-primary); }
.type-input:checked + .type-card .type-check { display: flex; }

/* Layout Scroller */
.layout-scroller-container { 
    position: relative; display: flex; align-items: center; padding: 0 40px; 
}
.layout-scroller { 
    /*display: flex; 
    overflow-x: auto; 
    scroll-snap-type: x mandatory; 
    scroll-behavior: smooth;
    -ms-overflow-style: none; scrollbar-width: none;
    width: 100%;*/

    display: flex;
    overflow: hidden;         /* Hides the inactive cards */
    width: 100%;              /* Adjust as needed */
    position: relative;       /* Required for jQuery .position() calculations */
    scroll-behavior: auto;    /* Let jQuery handle the smooth animation */
    padding: 0;              /* Remove any padding pushing items left */
    margin: 0;
    -ms-overflow-style: none; 
    scrollbar-width: none;
}
.layout-scroller::-webkit-scrollbar { display: none; }
.layout-item { 
    /*min-width: 100%; scroll-snap-align: center; display: flex; justify-content: center; padding: 10px 0; */
    flex: 0 0 100%;           /* Prevents shrinking; keeps items at 100% width */
    box-sizing: border-box;
    width: 100%;
    padding: 10px;
    margin:0;
    /*margin-left:10px;*/
}

.layout-radio-label { cursor: pointer; position: relative; width: 100%; max-width: 340px; }
.layout-preview-frame { 
    width: 100%; height: 230px; background: #fff; border: 2px solid #dfe1e3; 
    border-radius: 1rem; display: flex; align-items: center; justify-content: center; 
    overflow: hidden; transition: all 0.2s ease; position: relative;
}
.layout-preview-frame img { 
    max-width: 100%; max-height: 100%; width: auto; height: auto; 
    object-fit: scale-down; padding: 12px;
}
.layout-input:checked + .layout-preview-frame { border-color: var(--bs-primary); background-color: #f0f7ff; }
.layout-input:checked + .layout-preview-frame + .type-check { display: flex; }

/* Layout Number Badge */
.layout-number-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: #d1fae5; 
    color: #065f46; 
    border: 2px solid #059669; 
    font-weight: 700;
    font-size: 0.85rem;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    z-index: 2;
}

/* Pagination Dots */
.scroller-dots { display: flex; justify-content: center; gap: 8px; margin-top: 15px; flex-wrap: wrap; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: #e2e8f0; transition: all 0.3s ease; cursor: pointer; }
.dot.active { background: var(--bs-primary); width: 20px; border-radius: 4px; }

.scroller-btn { 
    position: absolute; width: 34px; height: 34px; background: #fff; border: 1px solid #e2e8f0; 
    border-radius: 50%; display: flex; align-items: center; justify-content: center; 
    cursor: pointer; z-index: 5; color: #64748b; transition: 0.2s; box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.btn-prev { left: 0; }
.btn-next { right: 0; }

/* Stepper & Segmented Controls */
.badge-source { background-color: #eff6ff; color: #3b82f6; border: 1px solid #dbeafe; font-weight: 500; padding: 0.5rem 0.8rem; border-radius: 0.75rem; display: inline-flex; align-items: center; gap: 0.6rem; font-size: 0.85rem; }
.badge-source .btn-close-chip { cursor: pointer; font-size: 0.75rem; opacity: 0.6; }
.badge-source svg { flex-shrink: 0; }

.star-segment-group .btn-check:checked + .btn { background-color: #f0f7ff; border-color: var(--bs-primary); color: var(--bs-primary); font-weight: 600; }
.star-segment-group .btn { border-color: #e2e8f0; color: #64748b; padding: 0.6rem 0.4rem; font-size: 0.8rem; display: flex; align-items: center; justify-content: center; gap: 4px; }

/* Coloris Input Styling */
#bgColorPicker { cursor: pointer !important; }
.clr-field,.clr-field *,.clr-field button { cursor: pointer !important; }
.color-picker, .color-picker:hover { cursor: pointer; caret-color: transparent; }

.coloris-input { 
    width: 115px; 
    text-align: left; 
    border: 1px solid #e2e8f0; 
    border-radius: 0.375rem; 
    padding: 0.35rem 36px 0.25rem 0.5rem; 
    font-size: 0.9rem; 
    font-weight: 500; 
    color: #475569; 
    background-color: #fff; 
}
.coloris-input:focus { outline: none; border-color: var(--bs-primary); }

.clr-field { display: flex; align-items: center; position: relative; color: inherit; }
.clr-field button {
    width: 22px;
    height: 22px;
    border-radius: 4px;
    right: 6px; 
    position: absolute;
    border: 1px solid #e2e8f0 !important; 
    outline: none !important;
    box-shadow: none !important;
}
.clr-field button:focus { outline: none; }

/* Custom Back Button Hover */
#btnBack:hover { background-color: #f1f5f9 !important; color: #334155 !important; border-color: #cbd5e1 !important; }

/* NEW TOGGLE SWITCH STYLES */
.toggle-checkbox { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
.toggle-label { position: relative; display: block; width: 48px; height: 26px; background-color: #e2e8f0; border-radius: 9999px; cursor: pointer; transition: background-color 0.3s ease; }
.toggle-label::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; background-color: white; border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,0.1); transition: transform 0.3s ease; }
.toggle-checkbox:checked + .toggle-label { background-color: var(--bs-primary); }
.toggle-checkbox:checked + .toggle-label::after { transform: translateX(22px); }
.toggle-checkbox:checked + .toggle-label::before { content: "✓"; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); color: white; font-size: 12px; font-weight: bold; opacity: 0; animation: fadeIn 0.3s forwards; }
@keyframes fadeIn { to { opacity: 1; } }

/* THEME BUTTONS */
.theme-btn-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; width: 100%; }
.theme-btn { position: relative; border: 2px solid transparent; border-radius: 0.75rem; padding: 0.75rem 0.25rem; text-align: center; font-size: 0.75rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; box-shadow: 0 1px 2px rgba(0,0,0,0.05); caret-color: transparent; }
.theme-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.05); }
.theme-btn.active { border-color: var(--bs-primary); transform: scale(0.98); }
.theme-btn .check-icon { position: absolute; top: 4px; right: 4px; font-size: 0.7rem; display: none; }
.theme-btn.active .check-icon { display: block; }

/* Custom Color Row Animation */
#customColorRow { max-height: 0; overflow: hidden; transition: max-height 0.4s ease-out, opacity 0.3s ease; opacity: 0; }
#customColorRow.show { max-height: 100px; opacity: 1; }

/* Condensed Rows */
.condensed-row { display: flex; border-bottom: 1px solid #f8fafc; }
.condensed-row .setting-item { border-bottom: none; flex: 1; }
.condensed-row .setting-item:first-child { border-right: 1px solid #f8fafc; }

/* FONT WEIGHT SEPARATE BUTTONS */
/*.weight-btn-group { display: flex; gap: 8px; width: 100%; margin-top: 8px; }
.weight-input { display: none; }
.weight-label { flex: 1; text-align: center; padding: 8px 4px; font-size: 0.85rem; color: #1e293b; background-color: #f1f5f9; border: 2px solid transparent; border-radius: 0.5rem; cursor: pointer; transition: 0.2s; display: flex; flex-direction: row-reverse; align-items: center; justify-content: center; gap: 6px; position: relative; }
.weight-label:hover { background-color: #e2e8f0; }
.weight-input:checked + .weight-label { background-color: #f0f7ff; border-color: var(--bs-primary); color: var(--bs-primary); }
.weight-label .bi-check-lg { position: absolute; top: -10px; right: -10px; width: 28px; height: 28px; background: #10b981; color: #fff; border-radius: 50%; display: none; align-items: center; justify-content: center; font-size: 1.1rem; z-index: 5; box-shadow: 0 2px 4px rgba(0,0,0,0.15); }
.weight-input:checked + .weight-label .bi-check-lg { display: flex; }*/

/* MODAL POSITION GRID */
.position-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; width: 100%; margin-top: 8px; }
.position-input { display: none; }
.position-label { 
    text-align: center; padding: 10px 4px; font-size: 0.85rem; color: #64748b; 
    background-color: #fff; border: 2px solid #f1f5f9; border-radius: 0.5rem; 
    cursor: pointer; transition: 0.2s; display: flex; flex-direction: row-reverse; align-items: center; justify-content: center; gap: 6px; position: relative;
}
.position-label:hover { border-color: #e2e8f0; }
.position-input:checked + .position-label { border-color: var(--bs-primary); background-color: #f0f7ff; color: var(--bs-primary); font-weight: 600; }
.position-label .bi-check-lg { position: absolute; top: -10px; right: -10px; width: 28px; height: 28px; background: #10b981; color: #fff; border-radius: 50%; display: none; align-items: center; justify-content: center; font-size: 1.1rem; z-index: 5; box-shadow: 0 2px 4px rgba(0,0,0,0.15); margin-bottom: 0; }
.position-input:checked + .position-label .bi-check-lg { display: flex; }

/* Badge Width Slider Row */
#badgeWidthSliderRow { max-height: 100px; overflow: hidden; transition: max-height 0.3s ease, opacity 0.3s ease; opacity: 1; }
#badgeWidthSliderRow.hidden { max-height: 0; opacity: 0; border-bottom: none !important; padding-top: 0; padding-bottom: 0; }

/* Typeahead Styling */
.typeahead-wrapper { position: relative; width: 100%; }
.typeahead-list { 
    position: absolute; top: 100%; left: 0; right: 0; background: #fff; 
    border: 1px solid #e2e8f0; border-radius: 0.5rem; box-shadow: 0 4px 6px rgba(0,0,0,0.1); 
    max-height: 200px; overflow-y: auto; z-index: 1000; display: none; margin-top: 4px; padding: 0; list-style: none;
}
.typeahead-list.show { display: block; }
.typeahead-item { padding: 10px 12px; cursor: pointer; font-size: 0.9rem; color: #1e293b; border-bottom: 1px solid #f8fafc; }
.typeahead-item:last-child { border-bottom: none; }
.typeahead-item:hover { background-color: #f0f7ff; color: var(--bs-primary); }
.typeahead-schema-hint { font-size: 0.7rem; color: #94a3b8; display: block; margin-top: 2px; }
.fallback-msg { font-size: 0.75rem; color: #64748b; margin-top: 6px; display: none; }
.fallback-msg.show { display: block; }

.wizard-page { display: none; animation: slideUp 0.3s ease-out; }
.wizard-page.active { display: block; }
@keyframes slideUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.invalid {
    border-color: #dc3545 !important;
    padding-right: calc(1.5em + .75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}
.error-message {
    display:none;
    width: 100%;
    margin-top: .25rem;
    font-size: .875em;
    color: #dc3545;
}

.badge-source {
    cursor: pointer;
    border: 1px solid #e2e8f0;
    background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
    color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important;
}
.badge-source i {
    display:none;
}
.badge-source.checked {
    border-color: var(--bs-primary);
}
.badge-source.checked i {
    display:inline-block;
    color: #3b82f6;
}

.weight-input, .size-input, .colour-input {
    position: relative;
    border: 1px solid #dddddd;
    border-radius: .5rem;
    padding: 1.25rem 0.5rem;
    text-align: center;
    background: #fff;
    height: 80px;
    margin-bottom:10px;
}
.weight-input label, .size-input label, .colour-input label {
    position: absolute;
    top: 5;
    left: 50%;
    transform: translateX(-50%);
    font-size: .875rem;
    min-width:100px;
    font-weight:500;
}
.weight-input select {
    position: absolute;
    top: 30;
    left: 50%;
    transform: translateX(-50%);
    font-size: .875rem;
    width:90%;
}
.size-input input {
    position: absolute;
    top: 30;
    left: 50%;
    transform: translateX(-50%);
    font-size: .875rem;
    width:90%;
}
.colour-input input {
    position: absolute;
    top: 30;
    left: 50%;
    transform: translateX(-50%);
    font-size: .875rem;
    width:90%;
}
.colour-input .clr-field {
    position: absolute;
    top: 30;
    left: 50%;
    transform: translateX(-50%);
    font-size: .875rem;
    width:90%;
}
.colour-input .clr-field button {
    position: absolute;
    top: 16;
    right: 8;
    z-index:2;
}
.colour-input .clr-field input {
    position: absolute;
    top: 0;
    width:100%;
    z-index:1;
    background-color:#f8fafc;
}
.urbo-star {
    width: 1rem;
    height: 1rem;
    color: #FBBC05;
}
#preview {
    position: relative;
    width: 100%;
    min-height: 500px;
    overflow: hidden;
    border-radius: var(--bs-border-radius); 
    background-image: radial-gradient(#e9ecef 1px, transparent 0);
    background-size: 20px 20px;
    display: flex;
    flex-direction: column;
}
#preview .urbo-widget.urbo-modal .urbo-modal-host {
    position: absolute !important;
    inset: 0 !important; /* Shorthand for top:0, right:0, bottom:0, left:0 */
    width: auto !important; /* Overrides the previous 100% */
    height: auto !important; /* Overrides the previous 100% */
    z-index: 10 !important;
    box-sizing: border-box !important; /* Ensures padding doesn't push it out of bounds */
}
#preview .urbo-widget.urbo-modal .urbo-modal-wrap {
    max-width: 450px !important; /* Ensure the wrapper is large enough to hold the card */
}

#preview .urbo-widget.urbo-modal .urbo-modal-card {
    width: 100% !important; /* Force the card to respect the wrapper's boundaries */
}

@media (min-width: 992px) {
    #control-column,
    #preview-column {
        /* Lock height to viewport minus ~120px to account for your top header and padding */
        max-height: calc(100vh - 120px); 
        overflow-y: auto;
        padding-right: 10px; /* Keeps content from rubbing against the scrollbar */
    }

    /* Style the scrollbars to match the UI nicely */
    #control-column::-webkit-scrollbar,
    #preview-column::-webkit-scrollbar {
        width: 8px;
    }
    #control-column::-webkit-scrollbar-track,
    #preview-column::-webkit-scrollbar-track {
        background: transparent;
    }
    #control-column::-webkit-scrollbar-thumb,
    #preview-column::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 4px;
    }
}
.auth-button {
    background-color: #0373af;
    border-color: #0373af;
}
.auth-button:hover {
    background-color: #0381c3;
    border-color: #0381c3;
}
.auth-link {
    color: #0373af;
    font-weight: 500;
}
.auth-link:hover {
    text-decoration: underline;
}
.footer-links {
    list-style: none;
    padding-left:0px;
}
.footer-links li {
    margin-bottom:15px;
}
.footer-links a {
    color:#ffffff;
    opacity:0.8;
    font-size: 1rem;
}
.footer-links a:hover {
    opacity:1;
}
.faded {
    opacity: .75;
}
.offcanvas {
    z-index: 1060 !important;
}

.offcanvas-backdrop {
    z-index: 1055 !important;
}

.urbo-avatar{
  width: var(--urbo-avatar-size, 44px);
  height: var(--urbo-avatar-size, 44px);
  flex: 0 0 auto;
  container-type: inline-size;
  padding:5px;
}
.urbo-avatar-text {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: flex; 
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  padding:10px;
}