/*-----------------------------------------------------------------------------------------------------*/
/*                                     ACCOUNT LAYOUT                                                  */
/*-----------------------------------------------------------------------------------------------------*/
.header-strip					{ height:73px; background:#303030; border-bottom: 1px solid #222222; }
.header-strip .content-wrapper	{ padding:0; }
#productLogo					{ float:left; }
#logIn, #logOut  		    	{ float:right; margin-top:17px; width:60px; }
.main-wrapper					{ background: #e2e2e2; }
#contentContainer				{ background:#fafafa; border:1px solid #c0c0c0; }
.new-account-info-container     { float:left; margin:15px 30px 0 15px; width: 370px; }
.new-account-info-container p   { margin:0px 0 15px; }
.new-account-info-container .checkbox-container { margin: 10px 0; }
.new-account-info-container .form-label { font-family: "Museo 300","Georgia",Serif; font-size: 13pt; letter-spacing: 0.5px; margin: 5px 0 0; padding: 0; }
.new-account-info-container .form-label.small   { font-family: "PT Sans","Arial", sans-serif; font-size: 11pt; letter-spacing: 0.5px; margin: 20px 0 3px; padding: 0; }
.new-account-info-container .field-note { font-size: 9pt; margin: 0 0 10px; padding: 0 3px;}
.new-account-info-container input	{ width:98%; }
.new-account-info-container input[type='radio'] { width: auto; float:left}
.new-account-promo-container        { float:left; width:480px;}
.new-account-promo-container img    { display:block; margin:20px auto 10px; }
.new-account-promo-container .promo-center  { font-size:14pt; font-family:'Museo 300', Georgia, serif; line-height:21pt; margin:26px 0 10px; text-align:center; }
.new-account-info-container .field-note .icon { font-size: 12pt;}
.new-account-info-container.updateMessaging {margin: 15px auto 30px auto; float:none; width:657px;background-color: #F1F1F1;border: 1px solid #E5E5E5;padding: 20px;}

.small-back-link	            { color:#777777; display:block; font-size:9.5pt; font-family:'PT Sans', Verdana, sans-serif; margin-top:16px; text-decoration:underline; }

#PasswordResetRequestPopup       { padding:20px 10px; }
#PasswordResetRequestPopup p     { font-size:16px;}
#PasswordResetRequestPopup input { width:98%; margin:15px 0; }

.remote-access-step-container { float:left; margin:15px 40px 0 0; width: 370px; }
.remote-access-step-container p { margin:0px 0 15px; }
#remote-access-promo-container { float:left; width:500px; }
#remote-access-promo-container img { display:block; margin:30px auto 10px; }
#remote-access-promo-container .promo-center	{ font-size:14pt; font-family:'Museo 300', Georgia, serif; line-height:21pt; margin:26px 0 10px; text-align:center; }
#RemoteAccessCode-label		{ color:#888888; float:left; font-size:13pt; margin:11px 15px 10px; text-align:right; width:50px; }
#RemoteAccessCode				{ color:#707070; float:left; font-size:18pt; height:30px; letter-spacing:3px; margin:10px 0; padding:3px 10px; width:100px;}
#ProcessRemoteAccessCode	    { float:left; margin:10px 10px; width:100px; padding:9px 13px; }
#promoCodeSection input         { display:inline-block; margin:0px 20px 0px 0px; width:170px; }
#promoCodeSection .button       { display:inline-block; width:100px; }
#policiesAgreement              { margin:11px 0px; padding:0px; width:100%; }
#policiesAgreementCancelCloud   { margin:15px 0px; padding:0px; width:100%; margin-bottom: 0px;}
#policiesAgreement input        { vertical-align: middle; width:15px; }

#verifyBillingForm #changePaymentInfo   { float:left; width:90px; }
#verifyBillingForm #createAccount       { float:right; width:150px; }

#RemoteAccountFound {margin: 30px auto;padding: 15px 10px;width: 150px;}
#remoteAccessAccountComplete  {background-color: #F1F1F1;border: 1px solid #E5E5E5;margin: 15px 30px 0 20px;min-height: 220px;padding: 20px 20px 40px 20px;width: 350px;float: left;}
#remoteAccessAccountComplete.messaging-service-mode	{ width:auto; min-height:60px; }
#remoteAccessAccountComplete.messaging-service-mode p	{ font-size:16px; }
.add-daysmart-account {background-color: #F1F1F1;border: 1px solid #E5E5E5;margin: 15px 30px 0 20px;min-height: 200px;padding:20px;width: 350px;float: left;}
.add-daysmart-account #logIn {margin: 30px auto;padding: 15px 10px;width: 150px;float: none;}

.new-account-center-content         { padding:0px 30px 0 10px;}
.new-account-center-content h1      { color:#666; font-family:"Museo 300", "Georgia", Serif; font-size:19pt; line-height:22pt; padding:20px 0 0px; }
.new-account-center-content .subtitle { color: #666; }
.new-account-info-container h3      { font-family:"Museo 300", "Georgia", serif; font-size:22px; padding:25px 0 8px; }
#OnlineBookingAccountFound {margin: 30px auto;padding: 15px 10px;width: 150px;}
#RemoteSetupComplete {margin: 30px auto;padding: 15px 10px;width: 150px;}
#OLBSetupComplete {margin: 30px auto;padding: 15px 10px;width: 150px;}
#OLBCustomDomainSetupComplete {margin: 30px auto;padding: 15px 10px;width: 150px;}
.forgot-password-input          { margin:10px; width:325px; }

/* Cloud Account Creation Form */
.new-account-info-container #cloudSignupBoothrenterCheck input { margin-right: 10px; margin-top: 0; }
.new-account-info-container #cloudSignupBoothrenterCheck > label:not(:first-of-type) { margin: 7px 0; }
#completeCloudTrialSignup       { margin:30px 0 0; }

.cloud-trial-input-error		{ background:#F4e8e8;  border:1px solid #DC9090; margin:0px 0px 20px; padding:10px 5px; }
.cloud-trial-input-error p.form-label.small	{ color:#A82323; margin:0px; }

.cloud-promo-code#promoCodeSection .button      {margin:0 0;}

#createCloudAccountSetup input.button { width: 100%; }

/* Cloud Account Creation Promo */
#CloudPromoBody                         { width: 50%; float: right;}
#CloudPromo .half-bullet-list           { float:left; margin-top:10px; margin-bottom: 25px; width: 50%; }
.half-bullet-list ul                    { color:#777; font-size:10pt; list-style-type: disc; margin:0px !important; padding-left:25px;  }
#CloudPromo h2                          { margin:20px 0 0px 0; }
#CloudPromo p                           { color:#777; text-align:justify; line-height: 15pt; width: 95%; }
#CloudPromo img                         { display:block; margin:10px auto 0px auto; }
#CloudPromo span.asterisk               { font-family: Tahoma,Sans-Serif; font-size: 10pt;} 
#CloudPromo span.small                  { color: #777777; float: right; } 
#CloudPromo .promo-center               { text-align: center; width: auto; color:#666;margin: 30px 0 5px; font-family:"Museo 300", "Georgia", Serif; font-size:16pt;line-height: 21pt;}
#CloudPromo .promo-center span          { color:#777; font-size:14pt; }

#subscriptionBillingNote                { margin: 0 0 5px 5px; }
#subscriptionBillingNote .note span     { display: inline-block; }
.add-service-container #subscriptionBillingNote { margin: 0 0 0px 20px}

/*to fix issue with DMS not showing the prices on smaller screens*/
@media only screen and (max-width: 1012px)
{
    #messageSignup img                  { width: 320px; }
}

@media only screen and (max-width: 768px) 
{
    #contentContainer   { border:0px; padding:25px 0 0 0; width:100%; }
    #contentContainer .cloud-cost-label     { display:block; margin-top: 25px; }

    #promoContainer     { display:none !important; }

    .ui-product .content-wrapper { border:0px; min-width:340px; width:92%; }
    .ui-product .content-section.new-account-info-container { background-color:transparent; box-sizing:border-box; border:0px; margin:0px; padding:20px; width:100%; }

    #logIn { margin-right: 15px; }
    
    .new-account-info-container .form-label { margin-top:15px; }
    
    #createCloudAccountSetup input:not([type='radio']):not([type='checkbox']),
    .new-account-info-container input:not([type='radio']):not([type='checkbox']),
    .new-account-info-container .form-section input:not([type='radio']):not([type='checkbox']),
    .new-account-info-container a.button { box-sizing:border-box; font-size:16px; height:auto; width:98%; }
    
    #createCloudAccountSetup input:not([type='radio']):not([type='checkbox']),
    .new-account-info-container input:not([type='radio']):not([type='checkbox']),
    .new-account-info-container .form-section input:not([type='radio']):not([type='checkbox']),
    .new-account-info-container a.button,
    #RemoteAccessCode { padding:12px; }

    .new-account-info-container a.button { padding-top: 18px; }
    
    .new-account-center-content h1  { text-align:center; }

    #RemoteAccessCode { width: 53%; }
    #ProcessRemoteAccessCode { width: 32%; }
    #RemoteAccessCode, #ProcessRemoteAccessCode { height: 55px; margin: 0 5px 0 15px; }
    #RemoteAccessCode-label { float: none; margin-top: 0; text-align: left; white-space: nowrap; width: auto; }
        
    .k-dropdown { background-color: transparent; visibility: hidden; width: 100%; }
    .k-dropdown-wrap, .k-animation-container { display: none !important; }
    .k-dropdown select { background-color: #fdfdfd; border-color: rgb(204,204,204); display: block !important; font-size: 16px; height: 48px; padding-left: 8px; -webkit-appearance: menulist-button; visibility: visible; width: 98% !important; }

    #promoCodeSection input { box-sizing:border-box; padding: 12px; }
    #promoCodeSection .button { padding: 13px 10px 10px; }
    #promoCodeSection input#promoCode { margin: 0; width: 63% !important; }
    #promoCodeSection input#promoCode + a { clear: right; float: right; margin: 0 8px 0 0; }
    
    .account-step-wrapper .content-section  { background-color:transparent; border:0px; box-sizing:border-box; margin:20px 0px; padding:30px 0; width:100%; }

    #cloudPromoInputContainer * { vertical-align: middle; }

    .cloud-promo-code { margin-bottom: 5px; }

    #verifyBillingForm #createAccount, #RemoteSetupComplete { width: 100%; }
}