﻿/*-----------------------------------------------------------------------------------------------------*/
/*                                             LAYOUT                                                  */
/*-----------------------------------------------------------------------------------------------------*/
#logo                       { float:left; margin:0;}
#divHeader                  { background:#303030; border-bottom:1px solid #222222; left: 0; right: 0; top: 0;
                              width:100%; height:73px; position:fixed; z-index:5;}
#divHeaderContent           { margin:0px auto; width:925px; }
#divHeaderContent._orchid    { margin:0px auto; width:900px; }
#divHeaderContent._123pet   { width: 920px; }
#divBody                    { width:100%; height:100%; position:relative; } 
#divMain                    { margin:100px auto 0 auto; width:900px; }

.section        { background: #FAFAFA; border: 1px solid #C0C0C0; margin:0px auto; padding:20px; width: 850px; }
.sub-section    { background: #ffffff; border: 1px solid #d5d5d5; padding:0; width: 800px; }
.sub-section .heading   
                { background:#efefef; border-bottom:1px solid #dddddd; display:block; font-family:"Museo 300", Serif; font-size:16pt; padding:10px; }
.sub-section .content   
                { padding:10px; }
.floating-title { border-bottom:1px solid #777777; color:#444444; display:block; font-size:20pt; margin:30px 10px 20px 0px; padding:10px 0; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); width:60%; } 
p.warn, span.warn
                { color: #C44D58; }
                
.ui-product .content-wrapper    { margin:0 auto; padding:20px; width:960px; }
.ui-product .content-section    { background-color:#F1F1F1; border:1px solid #E5E5E5; margin-bottom:50px; padding:30px; }

#bodyFooter		 { font-size:10pt; text-align:center; margin:50px auto; }
#bodyFooter span { margin:0 6px; }

.no-select  { -webkit-touch-callout: none; -webkit-user-select: none;  -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                      DIALOGS                                                        */
/*-----------------------------------------------------------------------------------------------------*/
.alert-dialog, .action-dialog-summary
                               { font-size: 16px; line-height: 22px;  margin: 15px 20px 0 20px; }
.alert-dialog                  { width: 400px; }
.ui-button.button              { font-size: 10.5pt; padding:0; }         
.dialog.icon                   { padding: 0 5px 0 0; }

.adMessage                     { padding-bottom: 15px; }
.adInputContainer              { text-align: center; }
.ui-dialog .ui-dialog-buttonpane button.left { float: left; margin-left: 1em; margin-right: 0; }

/*-----------------------------------------------------------------------------------------------------*/
/*									        ACTION DIALOGS  			                               */
/*-----------------------------------------------------------------------------------------------------*/
#ActionDialogEmailAlreadyInUsePasswordEntry { padding: 12px 0 8px 0; }
#ActionDialogEmailAlreadyInUsePasswordEntry p { width: 400px; }
#ActionDialogEmailAlreadyInUsePasswordEntry .adInputContainer { text-align: left; }
#ActionDialogEmailAlreadyInUsePasswordEntry .adInputContainer label { padding-right: 15px; word-wrap: break-word; }
#ActionDialogEmailAlreadyInUsePasswordEntry .adInputContainer input { width: 185px; }

/* --------------------------------------*/
/*           Loading Dialogs             */
/* --------------------------------------*/
.loading-message		{ background:none; }
.loading-message p		{ color:#616763; font-size:17pt; font-family:"PT Sans", Arial, sans-serif; text-align:center; }
.loading-message img	{ }

/*-----------------------------------------------------------------------------------------------------*/
/*                                      NAVIGATION                                                     */
/*-----------------------------------------------------------------------------------------------------*/
ul.main-navigation              { float:right; margin:0; padding:0px; }
ul.main-navigation li           { display:inline-block; float:left;  list-style:none; }
ul.main-navigation li a         { border-right:1px solid #363636; border-left:1px solid #272727; display:inline-block; height:73px; position:relative; text-decoration:none; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3); width:80px; }  
ul.main-navigation li a span.name
                                { bottom:6px; color:#dddddd; font-family:"PT Sans"; font-size:13pt; position:absolute; text-align:center;  width:100%;}
ul.main-navigation li a span.icon   
                                { color:#cccccc; display:block; font-size:32px; text-align:center; padding-top:10px; width:100%; }
ul.main-navigation li a:hover   { background:rgba(255, 255, 255, 0.1); }
ul.main-navigation li a:hover span  { color:#eeeeee; }


/*-----------------------------------------------------------------------------------------------------*/
/*                                      FORM FIELDS                                                    */
/*-----------------------------------------------------------------------------------------------------*/
input, 
textarea                        { background-color:#fdfdfd; padding:5px 3px; border:1px solid #ccc; font-size:12.5px; letter-spacing:1px;}
input:hover,
textarea:hover                  { background-color:#fff; border:1px solid #aaa; }
input:focus,
textarea:focus                  { background-color:#fff; border:1px solid #aaa; }


.focusField                     { color:#444; background-color:#fff; border:1px solid #c05489 !important; outline:none;}
.idleField                      { color:#666; background-color:#eee; border:1px solid #ccc !important; outline:none;}
.enteredField                   { color:#444; background-color:#eee; border:1px solid #aaa; outline:none;}
.formItemLabel                  { color:#ddd; font-size:13pt;}
.defaultInfoField               { letter-spacing:1px; background-color:#fcfcfc; border:1px solid #ccc !important; font-style:italic; outline:none;}
.date-range                     { cursor: pointer; display: inline-block; font-family: "Museo 300", san-serif; font-size: 22px; margin: 5px 0 0; padding: 10px;}
.date-range .date               { padding:0px 5px; }
.date-range .icon               { color:#666666; }


/*-----------------------------------------------------------------------------------------------------*/
/*                                      FORMS                                                          */
/*-----------------------------------------------------------------------------------------------------*/
.form-section                       { background:#f8f8f8; border:1px solid #ddd; margin:10px 0 10px; padding:5px 18px 10px; }
.form-section.small                 { margin: 10px 0; padding: 10px 20px 15px; }                                     
.form-section p                     { font-size:10pt; margin:10px 0 0 0 !important; padding:0px; }
.form-section input:not([type='checkbox']) { width: 98%;  margin: 0 0 5px; padding: 7px 5px; font-size: 13px; }
.form-section .half                 { width: 55%; }
.form-section .check                { padding: 10px 0 0;}
.form-section-inline                { display:inline-block; }
.form-section-inline.half           { display: inline-block; width: 45%;  margin: 0 5px 0 0; }
.form-section-inline.half .k-dropdown  { width:100%; }
.form-section h1                    { padding-left: 0; margin-top: 6px; }
.form-section-inner-container       { margin: 0 16px 8px 16px; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                     PAST DUE MESSAGE                                                */
/*-----------------------------------------------------------------------------------------------------*/
.past-due-notice            { background:#fadcd9; padding:0px; margin-bottom: 15px; }
.past-due-notice .header    { background:#AF4E47; border-bottom:1px solid #933125; color:#ffffff; display:block; padding:8px; text-align:center;
                              text-shadow: 1px 1px 1px rgba(133, 39, 27, 1); }
.past-due-notice p          { display:block; margin:10px auto; text-align:center; width:75%; }
.past-due-notice a          { color:#D13924; text-decoration:underline; }

#pastDueNote                {width:862px; margin: 0px 0 18px 0; padding: 10px; background: #fbf7ce;border: 1px solid #e7d363;color: #645D36; font-size:10pt; text-align:center;}
#pastDueNote a              {text-decoration:underline; color:#8f7b0e;}


/*-----------------------------------------------------------------------------------------------------*/
/*                                         LOGIN PAGE                                                  */
/*-----------------------------------------------------------------------------------------------------*/

#divLogin                   { background-color:#222; height:180px; width:240px; padding:10px 20px; 
                              border:1px solid #444; position:absolute; right:0px;  margin:0 30px 0 0;  z-index:3; }
#login-page-center          { background:#ffffff; border:1px solid #c5c5c5; min-height:500px;  margin:100px auto 20px auto; padding:40px; position:relative; width:900px; }                         
.login-page-form, 
.forgot-password-form       { color:#ddd; background-color:#222; border:1px solid #aaa;  margin:50px 0 0 0; padding:30px 40px 10px 40px;
                              -webkit-border-radius: 9px; -moz-border-radius: 9px;  border-radius: 9px;   }
.login-page-form._123pet,
.forgot-password-form._123pet
                            { border-color: transparent; margin-top: 20px; }
.login-page-form input[type='email'],
.forgot-password-form input[type='email']
                            { margin:0 0 10px 0; width:250px;} 
.login-page-form input[type='password']
                            { width:250px; }                               
#login-page-left            { float:left; width:345px; }
#login-page-left._123pet    { background-color: #222; border-radius: 9px; }
#login-page-right           { float:right; width:470px; }
.login-page-logo            { display:block; margin:10px auto 0; max-width:320px; }
.login-page-logo._saloniris  { margin: 10px 15px 0 auto; }
.login-page-logo._inkbook    { margin: 10px 0 0 10px; }
.login-page-logo._123pet     { margin: 20px 10px 0 12px; }
.login-page-logo._orchid     { margin: 10px 0 0 0; }
#login-page-right h1        { font-family:"Museo 300", Serif; font-size:16pt; padding:30px 0; }
.login-page-features        { border-bottom:1px solid #bbbbbb; padding:20px 0; width:100%; }
.login-page-features .feature   { border-left:1px solid #bbbbbb; float:left; height:125px; padding:5px 15px; position:relative; width:120px; }
.login-page-features .feature:first-child   { border:none;}
.login-page-features div img    { margin:5px auto; }
.login-page-features div p      { font-family:"PT Sans", Arial, Sans-Serif; font-size:10pt; padding:0px; position:absolute; bottom:5px; text-align:center; width:126px; }
#login-page-right h2        { font-family:"Museo 300", Serif; font-size:13pt; margin:30px 0 20px 0; }
#login-page-right a         { display:inline-block; margin:20px auto; }
.create-account-button-container	{ text-align:left; }

.login-button               { height:38px; width:100%; }
.login-remember-user        {    margin: 11px 10px 0 0;  vertical-align: inherit;   display: initial;} 
#loggedin-button-section    { margin:40px auto; width:180px;  text-align:center;} 
#loggedin-button-section a  { width:120px; margin:20px;}
.account-button-section     { height:60px; margin:20px auto 0 auto; text-align:center; width:200px }
.account-button-section a   { color:#ddd; text-decoration:none; }
.account-button-section a:hover { color:#f0f0f0; text-decoration:underline;  }

#standard-user-message      { width:500px; }
#standard-user-message h1   { font-size:16pt; margin:10px 0 20px 0; }
#standard-user-message p    { font-size:12pt; line-height:14pt; margin:5px 0; }
#standard-user-message .button{ margin:20px auto; width:200px; }

#ccLastFour                 { margin-left: 5px; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                    PASSWORD RESET                                                   */
/*-----------------------------------------------------------------------------------------------------*/
.dark-content-box           { background-color:#222; color:#eeeeee; width:400px; padding:10px 20px; 
                              border:1px solid #444; margin:0 auto;  z-index:3;
                              -webkit-border-radius: 9px; -webkit-border-radius: 9px;
                              -moz-border-radius: 9px; -moz-border-radius: 9px;
                              border-radius: 9px; border-radius: 9px;  
                              box-shadow: 0 0 7px rgba(0,0,0,0.4); -webkit-box-shadow: 0 0 7px rgba(0,0,0,0.4); 
                              -moz-box-shadow: 0 0 7px rgba(0,0,0,0.4);}
.reset-password-invalid-title   { margin:15px 5px; }
.reset-password-invalid-message { font-size:12pt; line-height:14pt; margin:0 5px 30px 5px; }
.reset-password-invalid-button  { display:block; margin:0px auto 20px auto !important; width:250px; }
a.reset-password-goback         { display:block; margin:0px auto 10px auto; }
#NewPasswordForm .label         { display:inline-block; margin-right:10px; text-align:right; width:150px; }
#NewPasswordForm input          { width:200px; }
#submit-reset-password          { margin:20px auto; width:200px; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                 TOO REGISTER USER ACCOUNT                                           */
/*-----------------------------------------------------------------------------------------------------*/

.too-register-message-content-box    { background-color:#ffffff; border:1px solid #cccccc; box-sizing:border-box; color:#444444; margin:20px auto; max-width:600px; padding:50px; width: 90%; }
.too-register-invalid-title          { margin:15px 5px; }
.too-register-invalid-message        { font-size:12pt; line-height:14pt; margin:0 5px 30px 5px; }
.too-register-invalid-button         { display:block; margin:0px auto 20px auto !important; width:90%; }
.too-register-license                { margin:20px 0 0 58px !important; padding: 5px;}
.too-register-page-logo              { margin:10px auto 0; display:block; max-width:320px; }
#TOORegisterForm h1                  { margin:20px 0 10px 0; }
#TOORegisterUserAccount p            { margin:10px auto 20px auto; }
#TOORegisterUserAccount .label       { display:inline-block; margin-right:10px; text-align:right; width:183px; }
#TOORegisterUserAccount input        { width:225px; }
#submit-too-register-user-account    { margin:20px auto; width:200px; }


/*-----------------------------------------------------------------------------------------------------*/
/*                                     LOGIN AREA                                                      */
/*-----------------------------------------------------------------------------------------------------*/
.home-login-box-links       { width:100px; margin:5px 0;}
.home-login-box-links a     { color:#ddd; text-decoration:none; }
.home-login-box-links a:hover   { text-decoration:underline;}
#aLogOutAccount             { font-size:9pt; position:relative; display:inline-block; float:right; top:35px; right:45px;}
.aLoginButton               { width:120px; padding:7px 0px; float:right;}
.aContinueLoggedInButton    { width:100px; position:relative; right:20px; top:20px; float:right;}
#loggedin-label             { color:#aaa; text-align:center; margin:45px 0 0 0;}
#username-label             { color:#ccc; text-align:center; margin:5px 0 0 0; word-wrap: break-word;}
#divPageContent             { width:1024px; padding:20px 50px; margin:0 auto;}
#PasswordResetRequestForm       { padding: 5px 30px 20px 30px; }
#PasswordResetRequestForm p     { font-size:16px;}
#PasswordResetRequestForm .k-dropdown { margin:10px 0; width: 100%; }
#PasswordResetRequestForm input { width:100%; margin:15px 0; }
.development                { margin:10px auto; text-align:center; width:200px; color: #333; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                     OVERVIEW                                                        */
/*-----------------------------------------------------------------------------------------------------*/
.account-overview-half          { height:145px; margin:10px 0; position:relative; width:49%; }
.account-overview-half p        { font-family:"Museo 300", Serif; font-size:18pt; }
.account-overview-half .note    { display:block; font-family:"PT Sans", Arial, Sans-Serif; font-size:10pt; margin-top:10px; width:210px; }
.account-overview-half .billing-estimate-note   { font-size:0.9em; bottom:10px; position:absolute;}
.account-overview-half #viewBillDetails         { display:block; position:absolute; top:50px; right:10px;  }
.account-overview-half #viewBillDetails.process-payment {margin: 3px 0px 0px 15px;position: absolute;top: 77px;left: 3px;width: 25%;}

#ProcessPayment.account-button      {position:absolute; top:50px; right:15px}

/*------Services Shared------*/
.service-overview   { float:left; height:310px; margin:0px 5px 15px 0; padding:0; position:relative; width: 215px; }
.services .service-overview:nth-child(4n) { margin-right:0px; }
.service-overview .heading   
                    { display:block; font-family:"Museo 300", Serif; font-size:16pt; height:25px; line-height:18pt; padding:15px; }
.service-overview .content
                    { padding:10px; }
.service-overview .content p
                    { font-size:13pt; line-height:15pt; text-align:center; }
.service-overview .content a
                    { bottom:20px; font-size:12pt; left:37px; padding:9px; position:absolute; width:120px; }
.service-overview .content a .icon
                    { font-size:10.5pt; padding:0px 5px; }
.service-overview .content .price-note
                    { color:#999999; font-size:10pt; margin:0px 0 20px 0; padding:0px; }
.service-overview .content .starting-at-note
					{ color:#999999; font-size:10pt; height:15px; margin:6px 0 0px 0; padding:0px; }
                    
 /*-----Active Services-----*/
 .service-overview.active           { background: #ffffff; border:1px solid #95C22B; box-shadow: 0 0 3px rgba(100,100,100,0.2); 
                                       -webkit-box-shadow: 0 0 3px rgba(100,100,100,0.2); -moz-box-shadow: 0 0 3px rgba(100,100,100,0.2); }
 .service-overview.active .heading  { border-bottom:1px solid #7db101; color:#f5f5f5; text-align:center; text-shadow: 1px 1px 0px rgba(120, 150, 55, 0.5);                                    
                                      background:#B0C77A;}
 .service-overview.active .content .price    
                                    { color:#B9D576; font-size:26pt; font-weight:bold; line-height:26pt; margin:10px 0 0 0; padding:0px; }
 .service-overview.suspended           { border: 1px solid #933125; }
 .service-overview.suspended .heading  { background:#AF4E47; border-bottom:1px solid #933125;  text-shadow: 1px 1px 0 rgba(175, 78, 71, 0.5); }

 /*-----Inactive Services-----*/
 .service-overview.inactive { background:rgba(250, 250, 250, .4); border: 1px dashed #bebebe;}
 .service-overview.inactive:hover
                            { }
 .service-overview.inactive .heading  
                            { border-bottom:1px solid #dddddd; color:#7e7e7e; font-size:15pt; height:80px; text-align:center; 
                              background:-moz-linear-gradient(center top , #f3f3f3, #efefef) repeat scroll 0 0 transparent; 
                              filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f3f3', endColorstr='#efefef'); 
                              background-image: -ms-linear-gradient(top left, #f3f3f3, #efefef);
                              background: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#efefef)); 
                              background-image: -o-linear-gradient(#f3f3f3,#efefef)}
.service-overview.inactive .content .price    
                            { color:#aaaaaa; font-size:20pt; font-weight:bold; line-height:26pt; margin:20px 0 0 0; padding:0px; }
.service-overview.inactive .content .price.free { font-size:16pt; font-weight: normal; }
.service-overview.inactive .content .price.free.description { font-size:17px; line-height:18pt; margin-top: 20px; }
.button.service-signup      { font-size:13.5pt !important; }
 
/*-----Manage Services-----*/
.service-details-container  
                       { margin: 0px auto; width: 400px; }
.service-details       { margin-bottom: 10px;}
.service-details h1    { font-size: 13pt;}
.service-details ul    { border: 1px solid #eee; margin:0; padding:0; }
.service-details ul.summary 
                       { margin-top: 10px; }

    .service-details ul li {
        background-color: #fafafa;
        clear: both;
    }
    .service-details ul.details-list li {
        border-top: 1px solid #ebebeb;
    }

.service-details ul li:first-child
                       { border-top: none; }
.service-details ul li .label
                       { float: left; font-size: 13px; padding-left: 10px; }
.service-details ul li .content
                       { display: inline-block; float: right; font-size: 14px; padding: 5px 10px 5px 5px; }
.service-details ul li .icon
                       { display: inline-block; float: left; font-size: 25px; margin-left: 10px; margin-top: 5px; }
.service-details ul li .edit-service.icon
                       { cursor: pointer; font-size: 18px; margin-left: 4px; }
.service-details ul li .edit-olb-name.icon
                        { cursor: pointer; font-size:14px; float:none; }
.service-details ul.summary li .content
                       { float:none; margin: 0 5px; width:330px; }
.service-actions       { }
.service-actions .button
                       { font-size: 10.5pt; margin: 0.5em 0.4em 0.5em 0; padding: 6px; width: 115px; }
.service-actions .button.small
                       { width: 100px;  }
.service-actions .button .icon
                       { font-size: 10.5pt;  padding: 0 5px; }
.feature-list          { font-size: 13px; list-style-type: disc; }     
          
#cancelReason .k-dropdown       { margin-bottom:6px; margin-left: 5px; width:55%; }
#cancelReason textarea          { font-size: 13px; height:50px; margin-left: 5px; width:80%; }

.cloud-note    { margin: 0 0 0 45px; display:inline-block }

/*-----Add Services-----*/
 
.add-service-section            { margin: 20px; width: 350px; height: 315px; position:relative;}
.add-service-section h2         { font-family: "Museo 300",Georgia,Serif; font-size: 15pt; padding-left: 0; }     
.add-service-section table      { border: 1px solid #d0d0d0; margin: 10px 0; width: 100%; }
.add-service-section table td   { padding: 0.4em; font-size: 0.85em;}
.add-service-section table td.currency
                                { text-align: right; }
.add-service-section table .total-line 
                                { background: none repeat scroll 0 0 #eee; font-weight: bold; }
.add-service-section table .total-line td
                                { border-top: 1px solid #ddd; }
.add-service-section .note      { background-color: #f0f0f0; border: 1px solid #ddd; bottom: 0;  padding: 5px;  position: absolute; }
.add-service-section .note p    { color: #777777; font-size: 9pt; line-height: 11pt; }
.add-service-section a.help:hover{ text-decoration:none; }
.add-service-section .icon      { color: #4c4c4c; padding: 0 0 0 3px; font-size: 18px;}
.billing-terms                  { margin: 0 20px; }
.billing-terms label            { font-size: 0.78em; }
.billing-terms.small            { margin: 15px 0 0 0; }
.billing-terms.small label      { font-size: 1em; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                     USERS                                                           */
/*-----------------------------------------------------------------------------------------------------*/                   
.users        { /*margin: 0 auto; width: 825px;*/}
.user-list    { width: 240px; height: 340px; word-wrap: break-word;}
.user-list.no-scroll
              { height: auto;}
.user-list ul { margin:0; padding: 0;}
.user-list ul li:first-child .user-item 
              { border-top: 1px solid #C0C0C0; border-radius: 4px 0 0 0; -webkit-border-radius: 4px 0 0 0; -moz-border-radius: 4px 0 0 0;}
.user-list ul li:last-child .user-item
              { border-bottom: none;  border-radius: 0 0 0 4px; 
                -webkit-border-radius: 0 0 0 4px; -moz-border-radius:0 0 0 4px;}
.user-list .mCSB_container
              { margin:0;}     
.user-list .mCustomScrollBox > .mCSB_scrollTools
              { background-color: #FCFCFB;  border-left: 1px solid #ddd; border-top: 1px solid #c0c0c0;}
.user-list .mCS_no_scrollbar ul li:last-child .user-item
              {  border-radius: 0;  -webkit-border-radius: 0; -moz-border-radius:0;}                                                      
.user-item    { border-top: 1px solid #ddd; border-left: 1px solid #C0C0C0; background-color: #fff; height: 55px; overflow: hidden;  }
.user-item:hover 
              { background-color:#fdfdfd;}
.user-item.selected    
              { background-color: #adcfec; }
.user-item .content  
              { padding: 10px 25px 15px 15px; color: #333; text-decoration: none;  text-align: right;}
.user-item .content p
              { margin: 0; padding: 0; }  
.user-item .content p.small
              { color: #a0a0a0; font-size: 12px;}   
.user-item-tab .content .icon
			  { color:#686868; }
.user-item.selected .content p.small
			  { color:#666666; }
.user-item .add-user .content p 
              { color: #ebebeb; float: right; }  
.user-item .add-user .content span.icon 
              {color: #ebebeb; padding: 0 10px; }                     
.user-item a:hover
              { text-decoration: none;}  
.user-item.add
              { border-bottom: 1px solid #c0c0c0; border-top: 1px solid #c0c0c0;}
.user-item.add.no-scroll
              { border-radius: 0 0 0 4px;  -webkit-border-radius: 0 0 0 4px; -moz-border-radius:0 0 0 4px; border-bottom: 1px solid #c0c0c0; border-top: 1px solid #ddd;}     
.user-item.add.button
              { margin: 0; padding:10px 0 0 0; height:45px; }
                 
.user-item.account				{ }  
.user-item.employee				{ background-color:#f0f0f0; }  
                  
.user-detail-container
              { background-color: #FCFCFB; border: 1px solid #C0C0C0; min-height: 395px; width: 600px; position: relative;}
.user-info    { padding: 20px 20px 25px; }


.user-info .user-section  
              { min-height: 120px; }                 
.user-info .user-section .detail
              { width: 425px; float: left;}                      
.user-info .user-section span.icon   
              { color:#666; display:block; font-size:45px;  width:60px; height: 100px; float: left;  text-align: left; }       
.user-info .user-section a span.icon   
              { font-size: 14px; float: right; height: auto; padding: 0 0 0 5px; width: auto; }                          
.user-info .user-section h2.heading
              { color:#666; }                 
.user-info .user-section p
              { color:#666; }   
.user-info .user-section.top  
              { min-height: 50px; margin-bottom: 15px;}
.user-info .user-section.top .detail
              { float: right; text-align: right; width:300px; }          
.user-info .user-section.top .employee-detail
              { float: left; text-align: left; width:150px; }
.user-info .user-section.top .employee-detail a span.icon 
			  { display:inline; float:none; }          
 .user-info .user-section.top p
              { padding:0; }                           
.user-info .admin-actions
              { float:right;}
.user-info .admin-actions a
              { width:120px; padding:7px 0px; }      
.user-info .user-actions
              { position: absolute; bottom: 0; right:0; padding: 10px 15px;}        
.user-info .user-actions a
              { width:120px; padding:7px 0px;} 
.add-user.form-section
              { margin: 0;}

#updateUserEmailField	{ min-width: 190px; }

#password-change-form.form-section { margin:10px 0 0 0; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                     BUSINESS INFO                                                   */
/*-----------------------------------------------------------------------------------------------------*/ 

#BusinessInformation		{ margin-bottom:12px; float:left; height:191px; width:330px;  }
#BusinessInformation.cloud-messaging,
#EndUser.cloud-messaging    {height:221px}
#BusinessInformation h1		{ margin-bottom:25px; }
#EndUser			{ float:left; height:191px; width:462px; margin-left:20px;   position: relative; }
#EndUser .button	{ float:right; margin:0px; width:122px;    position: absolute;  right: 25px;   top: 180px;}
#EndUser.cloud-messaging .button {top: 205px}

.businessinfo-field			{ font-size:12pt; margin:22px 0 0; padding:0; }

/*The exclusions prevent kendo drop down lists from being styled*/
.businessinfo-field span:not(.k-dropdown):not(.k-dropdown-wrap):not(.k-input):not(.k-select):not(.k-icon) 
                        	{ font-weight:bold; display:inline-block; width:125px; margin-right:6px; text-align:right; }


#timeZoneSection           { margin-top: 15px; }
#timeZone-list             { width: auto !important; }
/*#timeZoneSection .k-dropdown    { width: 500px !important;}*/
.businessinfo-field a		{ color:#333; font-size:10pt; margin-left:2px; text-decoration:underline; }

.business-address-container	{ float:right; margin-top:10px; max-width:170px; text-align:left; overflow:hidden;}
.business-address-container p	{ max-height:70px; }
.business-contact-container	{ float:left; margin-top:10px; width:290px; text-align:left; }
.business-contact-container p { padding:2px 5px; max-height:70px;   word-break: break-all; overflow:hidden; }
.business-contact-container span { display:inline-block; font-weight:bold; text-align:right; width:50px; }

.business-address-container h2, .business-contact-container h2 { font-weight:bold; }

.businessinfo-container a.icon { color:#666; font-size:16px; height: auto; padding:0 0 0 5px; width:auto; }
.businessinfo-container a.icon:hover { text-decoration:none; }

#businessInfoTabs			{ border:1px solid #C0C0C0; padding:0 1px; margin-top:15px; }

.businessinfo-content-half	{ float:left; width:56%; margin:8px 0px; }
.businessinfo-content-half:first-of-type	{ width:42% }
.businessinfo-content-half .half	{ float:left; width:41%; }
.businessinfo-content-half .half:nth-child(2n+1)	{ width:53%; }
.businessinfo-content-half span	{ display:inline-block; font-weight:bold; margin-right:4px; text-align:right; width:108px; }
.businessinfo-content-half .half span	{ width:79px; }
.businessinfo-content-half .half:nth-child(2n+1) span	{ width:86px; }

#businessInfoTabs .button		{ width:150px; float:right;  }

.businessinfo-modify-container .form-label { font-family: "Museo 300","Georgia",Serif; font-size: 13pt; letter-spacing: 0.5px; margin: 5px 0 0; padding: 0; }
.businessinfo-modify-container input	{ margin-bottom:6px; width:92%; }
.businessinfo-modify-container .k-dropdown	{ margin-bottom:6px; width:95%; }
.businessinfo-modify-container .modify-half { float:left; margin-right:9px; height:62px; width:47%; }
#businessInfoRegionForm		{ height:130px; }
#businessInfoRegionForm	.k-dropdown	{ width:230px; }
.form-label-right {float: right;color: #717171;font-size: 12px;margin-right: 12px;}

#divButtonStrip #changeOwnerLink                     { position:relative; top: 35%; font-size: 10.5pt; }
.businessinfo-modify-container #policiesAgreement    { position:relative; margin: 20px 0 5px 0;}
.businessinfo-modify-container #policiesAgreement span  { display:inline-block; margin: 0 0 0 10px; position:absolute;}
/*-----------------------------------------------------------------------------------------------------*/
/*                                     BILLING                                                         */
/*-----------------------------------------------------------------------------------------------------*/
#AmountDue                          { margin-bottom:25px; }

#CardOnFile                         { margin:0 auto; padding:30px 20px; }
#cardOnFileNote                     { float:left; margin:10px 20px 0px 50px; width:200px; }
#cardOnFileNote p                   { font-family:"Museo 300", Serif; font-size:14pt; line-height:17pt; text-align:right; }
#ChangeCreditCardOnFile				{ width:110px !important; }

.credit-card-on-file                { background:#fdfdfd; border:#ddd 1px solid; float:left;  margin:0px; padding:10px; width: 284px; }
.credit-card-on-file img            { float:left; padding:10px; }
.credit-card-on-file .card-info     { float:left; }
.credit-card-on-file .card-info h3  { margin:0px; }
.credit-card-on-file .card-info p   { margin:0px; }
.no-card-on-file                    { background:#fdfdfd; border:#ddd 1px solid; height:60px; margin:0px 20px 0px 130px; padding:10px; width:400px; }
.no-card-on-file:hover              { background:#fefefe; border:#ccc 1px solid; cursor:pointer; }
.no-card-on-file img                { float:left; padding:8px 10px; }
.no-card-on-file h3                 { line-height: 20px; margin: 0; padding: 0;}
.account-button                     { display:inline-block !important; margin:5px 0 0 25px !important; padding:15px 10px !important; width:90px !important; }
#PaymentDetails                     { margin-top:25px; }
#PaymentDetails h1                  { float:left; font-family:"Museo 300", Serif; font-size:17pt; margin:10px; }
#PaymentDetailsDateRange            { float:right;  }
.date-range .k-dropdown-wrap        { border-radius: 0;  -webkit-border-radius: 0; -moz-border-radius: 0; }
.date-range .k-dropdown-wrap .k-input      
                                    { padding: 5px 20px 5px 15px;}
.date-range .k-dropdown-wrap .k-select      
                                    { font-size: 25px; padding: 5px 8px; }
.date-range .k-dropdown             { width: inherit; }       
.k-dropdown .k-dropdown-wrap.k-state-border-down
                                    { padding-bottom: 0; }                           
#BillDate-list .k-list .k-item      { font-size: 18px; }
.input-read-only                    { background:#f2f2f2;
                                      background:-moz-linear-gradient(center top , #fefefe, #f2f2f2) repeat scroll 0 0 transparent; 
                                      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fefefe', endColorstr='#f2f2f2'); 
                                      background-image: -ms-linear-gradient(top left, #fefefe, #f2f2f2);
                                      background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#f2f2f2)); 
                                      background-image: -o-linear-gradient(#fefefe,#f2f2f2);
                                      border: 1px solid #ccc; color: #333333;  font-size: 16px; letter-spacing: 1px;  margin-right: 10px; 
                                      padding: 5px 20px 5px 7px; text-shadow: 0 1px #f1f1f1;}
.input-read-only.left               { margin-right: 10px; }                                     
p.read-only-label                   { color: #666666; font-size: 11px; letter-spacing: 1px; text-transform: uppercase; }
#RetryProcessCreditCard.account-button  {margin: 5px -20px 0 20px !important}
/*-----------------------------------------------------------------------------------------------------*/
/*                                     HELP                                                            */
/*-----------------------------------------------------------------------------------------------------*/
.section.help .heading .icon
                    { font-size:24pt; padding:0 5px 0 0; color: #666; vertical-align: middle; }
.section.help .heading  
                    { display: block;font-family: "Museo 300", Serif;font-size: 16pt;padding: 10px 10px 25px 0; text-decoration: underline;}
.section.help .sub-section p
                    { margin: 7px 0; font-size: 17pt; }
.section.help .sub-section a
                    { margin: 0; }
.section.help .sub-section span.small
                    { font-size: 11pt; font-family:'PT Sans', Verdana, Sans-Serif; }
.section.help .sub-section p.small
                    { font-size: 13pt; font-family:'PT Sans', Verdana, Sans-Serif; }

#forgotPasswordSection          {margin: 25px auto;}
.section.help .account-overview-half    {width:45%; margin: 15px 0 0 25px;}
.section.help .account-overview-half p  {font-size:15pt}
.vertical-divider                       {left: 50%;top: 10%;bottom: 10%;border-left: 1px solid rgb(133, 133, 133);height: 162px;float: left; }
.section.help .icon:hover               {color:#888888}

/* Forgot Password */
.forgot-password                        { margin:20px}
#forgotPasswordProcess.forgot-password  {display: inline-block;}
.forgot-password #passwordDescription div:first-of-type {width: 79%;}
.forgot-password .description           {font-size: 15px;margin: 0 32px 0 0;}
.forgot-password #retrievePassword      {padding: 13px 17px;}
.forgot-password .small                 {max-height: 180px;overflow-y: auto;background-color: #EFEFEF;padding: 10px;}
.forgot-password label                  {float: right;margin: 10px 0px;}
.forgot-password .button                {float:left; margin: 0px 5px 0 5px; font-size: 12pt;}
.forgot-password .ui-dialog-buttons     {float:right}
#overrideCode                           {width: 100%;display: block;margin: 0 auto 15px;text-align: center;padding: 10px 0 0;}


#PaymentDetailsInformation      { margin:40px 0px 20px 0px; }
.billing-details-main           { background:#f1f1f1; border:1px solid #dddddd; padding:7px 10px; margin:20px auto 0px auto; position:relative; width:85%; }
.billing-details-main .title    { float:left; font-family:"Museo 300", Serif; font-size:15pt; margin:0px 0px 0px 30px; width:300px; }
.billing-details-main.expandable .title { margin-left:0px; }
.billing-details-main .amount   { float:right; font-size:14pt; font-family:"Museo 300", Serif; margin-right:20px; text-align:right; width:100px; }
.billing-details-main .expand   { color:#888888; display:block; float:left; font-size:14pt; padding:5px }
.billing-details-main .expand:hover { color:#999999; text-decoration:none; }
.billing-details-subsection     { background:#f5f5f5; border:1px solid #dddddd; border-top:0px; margin:0px auto; padding:10px; width:85%;}
.billing-details-subsection .line-item    { border-bottom:1px solid #e0e0e0; margin:0px auto; padding:3px 0; width:100%;  }
.billing-details-subsection .line-item:last-child { border:0px; }
.billing-details-subsection .line-item .description { display:block; float:left; font-size:11pt; margin-left:30px; }
.billing-details-subsection .line-item .description .note   { display:block; font-size:0.8em; margin:2px 0; }
.billing-details-subsection .line-item .amount      { display:block; float:right; font-size:11pt; margin-right:20px; text-align:right;  }

/* Help Popup Dialogs */
.help-info-box                      { background-color:#fafafa; border:1px solid #ddd; clear:both; margin:20px 0 20px 0; padding:13px; position:relative; }
.help-info-box.small                { margin:5px auto; padding:0px; width:150px; }
.help-info-box p                    { font-size:16px; }
.help-info-box .icon-image          { color:#666; float:left; margin: 7px 10px 0; }
.helpItem.icon-image                { color:#666; float:left; font-weight:normal !important; margin:0; }
.helpItem                           { cursor:pointer; }
.helpItemTitle                      { font-family:"Museo 500"; font-size:18px; margin:10px 0;}

.help .icon         { color:#888888; padding-left:5px; vertical-align:middle; }
.help .icon:hover   { color:#aaaaaa; }
.help:hover         { text-decoration:none; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                     ACCOUNT CREATION                                                */
/*-----------------------------------------------------------------------------------------------------*/
.create-account-form                { background-color: #efefef; border: 1px solid #ddd;  border-radius: 9px 9px 9px 9px; 
                                      margin: 50px 0 0;  padding: 30px 25px 10px; min-height: 175px;}
.create-account-form .field-label   { color: #222; font-family: "Museo 300",Serif; padding: 5px 0 10px;}
.create-account-form .center        { text-align:center;}
.create-account-form .form-section p{ font-size: 15px; }                                 
.create-account-form input          { color: #4c4c4c; font-size: 18px;  padding: 8px 5px; text-align: left; width: 96%;}     
.create-account-form input.large    { font-size: 20px;  padding: 8px 5px; text-align: center; }     
.create-account-form .button        { font-size: 16px; margin: 15px 0;  } 
.create-account-form .icon          { color: #4c4c4c; padding: 0 0 0 3px;   }                        
.create-account-form .field-label .help:hover
                                    { text-decoration: none; }
.create-account-form .setup-complete-button
                                    {  margin: 20px auto; text-align: center;  width: 180px; }
.create-account-form.account-creation   { margin:10px 0 0;}
.create-account-form._123pet        { border-color: transparent; border-radius: 0; }
.account-creation                   { margin: 15px 0 0; }
p.account-creation._123pet          { padding: 20px; color: #ddd; }
.messaging-setup-complete-settings  { margin-top:45px; }

/*-----------------------------------------------------------------------------------------------------*/
/*                                     Update/Upgrade                                                  */
/*-----------------------------------------------------------------------------------------------------*/

#currentVersion .account-overview-half p   {font-size:15pt;}
#currentVersion .account-overview-half      {margin:10px auto; width:100%; display:inline-table; padding: 0 0 10px 0}
#currentVersion .account-overview-half .left    {margin:0 0 0 145px}


#update                             {margin: 25px auto;}
#update p, #upgrade p                           {text-align: center; }
#update h1                          {font-size:18px}

.updateUpgradeVersion                      {text-align:center;}
.updateUpgradeVersion table                     {display:table; }
.updateUpgradeVersion p                    {font-size: 18px; margin:0}
.updateUpgradeVersion .button              {width:10%; font-size:13.5pt; display: inline-block; padding:9px;  }
.updateUpgradeVersion .update-price               {margin: 0 20px;}
.updateUpgradeVersion .update-section       {padding:7px 10px}
.update-section, #update .updateUpgradeVersion .update-section                      {background: #f1f1f1;border: 1px solid #dddddd;padding: 20px;margin:15px auto;position: relative;width: 85%; text-align:center}
.has-current-version.update-section     {text-align:center; padding:20px;}
.has-current-version .icon              {margin: 0 15px;font-size: 30px;vertical-align: middle; color: #adc96e;}
#update .updateUpgradeVersion .update-section.purchase                {padding:10px}

#update-upgrade-billing-charge-summary           { float:left; margin:20px; width:350px; }
#update-upgrade-billing-charge-summary h2        { font-family:"Museo 300", Georgia, Serif; font-size:15pt; }
#update-upgrade-billing-charge-summary table     { border:1px solid #d0d0d0; margin:20px 0; width:100%; }
#update-upgrade-billing-charge-summary table td  { padding:5px; }
#update-upgrade-billing-charge-summary table td.amount  { text-align:right; }
#update-upgrade-billing-charge-summary .tax-line     { background-color:rgba(0, 0, 0, 0.04); }
#update-upgrade-billing-charge-summary .tax-line td  {  border-top: 1px solid #ccc;  border-bottom: 1px solid #ccc; }
#update-upgrade-billing-charge-summary .total-line   { background:#e0e0e0; border-top:1px solid #d0d0d0; font-weight:bold; }
#update-upgrade-billing-cancellation-description     { background-color:#f0f0f0; margin:60px 0 0 0; padding:5px; }
#update-upgrade-billing-cancellation-description p   { color:#777; font-size:9pt; line-height:11pt; }
#update-upgrade-billing-form                 { float:right; width:350px; margin:20px}
#update-upgrade-billing-form h2              { font-family:"Museo 300", Georgia, Serif; font-size:15pt; margin:0px 0 0px 0px; padding:0px; }
#update-upgrade-billing-policies             { margin:10px 0px; }
#udpate-upgrade-billing-policies tbody       { vertical-align: top; }
#update-upgrade-billing-policies label       { font-size:9pt; }
#update-upgrade-billing-form  label            {margin:5px 0 0}
#update-upgrade-billing-form .form-section.small,
#update-upgrade-billing-form .form-section  {margin:0 0 10px}
#update-upgrade-billing-form .checkbox-container    { margin:10px 0px; }


.billing-info-section #promoCodeSection .button                   {width: 80px}

.update-section li                                  { text-align:left}
#freeUpdate p                                       {text-align:left; font-size:14px;}
.hidden                                             {display:none}

.update-section.table                               { display:table}
.update-section .item-description                   {text-align:left; padding:5px 0; font-size:18px; display:table-cell; width:58%}
.update-section .custom-quote                            {text-align:right; font-size:15px;display:table-cell}
.update-section .buy-item                         {display:table-cell;text-align:right;}
.update-section .item-row                           {display:table-row}
#freeUpdate h1                                      {font-size:21px; line-height: 18pt;}
.updateUpgradeVersion.table .button                       {   width: 39%;}
.update-section.table .item-price                         {font-size:18px;display:table-cell;text-align:right;}
#InvoiceSummary #invoiceDetails                             {display: inline-block;width: 100%}
#invoiceDetails .left                                   {width: 50%;}
#invoiceDetails .label                              {font-weight: bold;margin: 0 15px;}

#orderFailed li                                     {margin:10px 25px}

/*-----------------------------------------------------------------------------------------------------*/
/*                                Online Booking Advertisement                                         */
/*-----------------------------------------------------------------------------------------------------*/
#OnlineBookingAd                { float:left; width:400px;  position:relative; }
#OnlineBookingAd h1             { font-family:"Museo 300", Serif; font-size:17pt; margin: 0 0 10px 0; }
#OnlineBookingAd h2             { font-family:"Museo 300", Serif; font-size:14pt; }
#OnlineBookingAd ul             { float:left; font-size:10pt; margin:10px 0 30px 0; padding:0 0 0 19px; text-indent:0px; width:170px; list-style-type: disc; }
#OnlineBookingAd p              { font-size:15px; margin: 0 0 40px 0;}
#OnlineBookingAd .promo-paragraph              { font-size:15px; margin: 0 0 5px 0;}
#OnlineBookingAdInnerContainer	{ position:relative; }
#OnlineBookingPromoImage        { position:absolute; right:0px; top:40px; width: 258px; height: 228px;}
#OnlineBookingSignup            { float: left;font-size: 11pt;margin: 0 15px 0 40px;padding: 5px;width: 120px;}
#OnlineBookingSignupSetting            {float:left; font-size: 11pt;margin: 0 15px 0 11px;padding: 15px;width: 120px;}
#exitOnlineBookingPromo         { display:block !important; float:left; font-size:11pt; margin:0 0 0 35px; padding:5px 0; width:120px; float:left}
#OnlineBookingCloudUpgrade      { float: left;font-size: 11pt;margin: 0 15px 0 40px;padding: 5px;width: 120px; }

/*-----------------------------------------------------------------------------------------------------*/
/*									   TRIAL EXPIRED PAGE				                               */
/*-----------------------------------------------------------------------------------------------------*/
.large-two-line-button          { display:block;  font-family:"Museo 300"; padding:10px !important; font-size:23px !important; line-height:28px; margin:10px auto !important; text-decoration:none; text-align:center; width:40%; min-width:260px;  }
.large-two-line-button span     { font-size:15px !important; line-height:15px; }
#trialExpiredListContainer		{ background-color: #F1F1F1; border: 1px solid #E5E5E5; margin:20px auto; padding:20px; width: 80%; }
#trialExpiredContainer          {padding: 50px;}
#trialExpiredContainer  h1      {color: #666; font-family: "Museo 300", "Georgia", Serif;font-size: 19pt;line-height: 22pt;padding: 20px 0 0px;}
#trialExpiredContainer	ul		{ list-style-type: disc; width:40%;}
#trialExpiredActivityContainer	{ background-color: #F1F1F1; border: 1px solid #E5E5E5; margin:0 100px 40px; padding:14px 20px; } 
#trialExpiredActivityContainer p		{ font-family:"Museo 300"; font-size:20px; margin:6px 0; text-align:center; }
#trialExpiredActivityContainer .profit	{ font-family:"Museo 300"; font-size:30px; color:#7BB160; }
#trialExpiredActivityContainer span		{ font-family:"Museo 500";  }
#trialExpiredClosing			{ font-family:"Museo 300"; font-size:24px; line-height:26px; margin:25px 10px; }
#trialExpiredOpening			{ font-size:11pt; line-height:18pt; margin:15px; text-align:center; }
.center                         {text-align:center;}
.message-content-box            {background-color: #ffffff;border: 1px solid #cccccc;box-sizing: border-box;color: #444444;padding: 50px;}

.small-font {
    font-size: 0.8em;
}

/*-----------------------------------------------------------------------------------------------------*/
/*									        PASSWORD ENTRY				                               */
/*-----------------------------------------------------------------------------------------------------*/
#passwordEntry > div           { text-align: right; }
#passwordEntry input.password-input { box-sizing: border-box; margin: 0; }
#passwordEntry #viewPasswordContainer { font-size: 8pt; margin-left: 5px; }
#passwordEntry #viewPasswordContainer input { margin: 0 2px 1px; vertical-align: middle; }
#passwordEntry #viewPasswordContainer label { margin: 0; }

/*-----------------------------------------------------------------------------------------------------*/
/*									   Mobile Login Page     			                               */
/*-----------------------------------------------------------------------------------------------------*/
@media only screen and (max-device-width: 480px) {

    /* login form */
    #login-page-right                               { display: none; width:0px; }
    #login-page-left                                { width: 100%; }
    .login-page-logo                                { width: 70%; }
    #login-page-center                              { padding: 33px 0; display: block; height:auto; min-height:350px; max-height:800px; width:100%; background: none; border:none;  margin: 0 auto; }
    #divMain                                        { width:100%; margin: 0;}
    .login-page-form                                { padding:20px 15px; border:none; -webkit-box-shadow: none; box-shadow: none; -moz-box-shadow: nonw; background-color:#e2e2e2; color:#333 !important; }
    .login-page-form input[type='email'],
    .login-page-form input[type='password']         { width: 98%; font-size:16px; }
        .custom-checkbox.dark > input:active + .box     {     border-color: #aaa;    background-color: #ddd;}
    .custom-checkbox.dark > .box                    { border: 1px solid #ccc; background-color: #fdfdfd;}       
    .custom-checkbox.dark > .box > .tick            {     border-bottom: 2px solid #666;  border-left: 2px solid #666;}
    .account-button-section a,
    .account-button-section a:active,
    #username-label,
    #loggedin-label                                  { color:#333}

    /* TOORegisterUserAccount*/
    .too-register-message-content-box {
        display: block;
        height: auto;
        min-height: 350px;
        width: 100%;
        background: none;
        border: none;
        margin: 10px auto;
        padding: 5px;
    }

    #TOORegisterForm h1              { font-size:16px ;} 
    .too-register-invalid-title      { margin:10px 5px; font-size: 14px;}
    .too-register-invalid-message    { margin:0 5px 15px 5px; font-size:15px; line-height:14px;  }
    .too-register-invalid-button     { display:block; margin:0px auto 10px auto; width:90%; }
    .too-register-license            { font-size: 14px;}
    #TOORegisterUserAccount input    { width:55%; }
    #TOORegisterForm h1              { font-size:15px;}
    #TOORegisterUserAccount p        { margin:5px auto 10px auto; font-size: 14px; }
    #TOORegisterUserAccount .label   { display:inline-block; margin-right:10px; font-size:14px; text-align:right; width:35%; }
    too-register-page-logo           { width: 70%; }

    #bodyFooter                      { margin: 20px auto;}
    .ui-dialog                       { width: 90% !important;}
}



