.padding
{
    bottom: -29px;
}

div.PageLayout td.Content
{
    width: 100%;
    padding: 0px;
    vertical-align: top;
}

#ShellContainer 
{
    display:none;
}

.left-nav
{
    height: auto;
}
.nomaxwidth
{
    max-width: none;
}
.background {
    overflow:visible;
}

h1.offertitle
{
   color:white;
   padding-top: 170px;
   padding-right: 15px;
   padding-bottom: 10px;
   padding-left: 25px;
}

h1.content-title {
    font-size: 72px;
    font-family: "SegoeUI-Light-final", "Segoe UI Light", "Segoe UI", Segoe, Tahoma, Helvetica, Arial, Sans-Serif;
    line-height: 80px;
    margin-bottom: 0;
    padding-bottom: 5px;
}

.screen
{
    min-height: 0px;
}

.norightpadding
{
    padding-right: 0px;
}

.noleftpadding
{
    padding-left: 0px;
}

.spaceforbanner
{
    margin-top: 40px;
    margin-bottom: 0px;
}

select {
    width: auto;
    border: 1px solid rgb(163, 174, 175); border-image: none; font-size: 17px;
}

#CountrySelection_SelectedRegion
{
 min-width: 260px;
}

.Year {
    width: 120px;
}

.Month {
    width: 140px;
}

.Day {
    width: 70px;
}

.screen .content {
  width: 600px; 
  padding-left:0px;
  padding-top: 60px;
}

.black {
    color: black;
}

h2.black {
    color: black;
}

h2.listitem {
    color: black;
    margin-top:10px;
}

ul.description {
    padding-left: 28px;
}

li.description {
    list-style-type: disc;
}

.darkgray {
    color: #3b3131;
}

.floatleft {
    float: left;
}

.floatleftNoMirror {
    float:left;
}

.help-container {
    position: relative;
    display: inline-block;
    margin-top:10px;
}

#helpdate
{
    left: 15px;
    top: -4px;
}

.o365-theme-base .ms-fcl-tp, .o365-theme-base .ms-fcl-tp-h:hover
{
    color:black;
}

.help-container .help, .help-container .help:hover
{
    color:#0072c6 !important;
}

.help-container .icon-questionmark {
    width: 1.5em;
    height: 1.5em;
    line-height: 1.5em;
    border-radius: 50%;
    text-align: center;
    background: white;
    color: #666;
}

.icon-questionmark-domainname {
    border: 1px;
    border-style: solid;
    color: #666;
    border-radius: 50%;
    width:18px;
    height:18px;
    line-height:18px;
    text-align:center;
    font-size:14px;
}

.help-container {
    margin-top: 0px;                    /* reduce the margin between control (e.g. CountrySelection) and the help info*/
    margin-bottom: 5px;                 /* increase the margin to next control and the help info*/
}

.hipVerificationInput {
    width:320px !important;
}

.ErrorMessage {
    direction:ltr;
}

.field {
    min-width:540px !important;
    width:100% !important;
}

.processing {
    padding-top: 60px;
}

.selection
{
    width: 580px;
}
.contact-type {
    margin-bottom:20px;
}
#SMSVerification {
    margin-bottom:30px;
}

.uploadButton {
    position: relative;
    overflow: hidden;
    margin: 10px;
}
.uploadButton input.uploadField {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

input.AddRegistrationDocument {
    background-color: #0072c6;
    padding: 5px 15px;
    padding-bottom: 12px;
    font-size: 12pt;
    height: 35px;
    text-transform: none;
}

#nonProfitRegistrarTable {
    padding-top: 50px;
    width: 100%;
    border-spacing: 0 5px;
    border-collapse: separate;
}

#nonProfitRegistrarTable td {
    background-color: rgba(153, 180, 217, 0.3);
    padding: 5px;
}

#nonProfitRegistrarTable td.deleteIdentifier {
    text-align: right;
}

#nonProfitRegistrarTable td .ms-Icon {
    font-size: 22px;
}

.nonprofit-legal-identifier-bullets
{
    list-style-type: disc;
}

.nonprofit-legal-identifier-instructions
{
    margin: auto; 
    padding-left: 32px;
}

.PersonIcon {
    float:left; 
    margin-right:20px;
}
.phone-number {
    min-width:440px;
}

div.disambiguationarea {
    text-align: center;
    overflow: hidden;
}

.skuselection {
    display: inline-block;
    width: 260px;
    margin: 10px;
}

.disambiguationtext {
    display: inline-block;
    font-size: 28px;
    font-weight: bold;
}

.sku-icon-arrow-next {
    font-size: 18px;
    line-height: 24px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    text-align: center;
    border: 2px solid;
    margin-left: 8px;
    margin-bottom: 10px;
}
.onmicrosoft {
    position: absolute;
    top: 10px;
    right: 42px;            /* Keep this on the right on purpose, so not using Relative */
    font-size: 17px;
    color: #2271aa;
}

#AdminTrialOnMicrosoftToolTip { 
    top: 10px; 
    right: -18px;           /* Keep this on the right on purpose, so not using Relative */
    position: absolute;
}

.half-visible {
    opacity: 0.5;
}

.disallow-clicks {
    pointer-events: none;
}

.tld {
    width: auto;
}
.preview-container {
    background: rgba(211, 211, 211, 0.3);
    width: 580px;
    height: 40px;
    line-height: 40px;
    margin-bottom: 25px;
    min-width:390px!important;
    text-align: center;
    font-family: "SegoeUI-Light-final", "Segoe UI Light", "Segoe UI", Segoe, Tahoma, Helvetica, Arial, Sans-Serif;
    font-size: 16px;
}

.preview-container .instruction {
    color: #3B3131;
}

.preview-container .preview,
.preview-container .preview {
    padding-left:40px;
    position: relative;
}

.preview-container .preview .checkmark {
    color: #24B24B;
    font-size: 22px;
    position: absolute;
    left: 15px;
 }

.step2 .preview-container .preview .spinnerContainer {
    position: absolute;
    top: 18px;
    left: 17px;
}

.productKey-control {
    text-align:center;
    font-size: 24px; 
    margin-bottom:20px;
}

/* ----------------------------------------------------------*/
/* ----->>> Changes for multiple page view layouts  <<<------*/
/* ----------------------------------------------------------*/

.mpl-layout {
    margin-left: 0px;
    margin-right: 0px;
    line-height: normal;
}

.resp-header-container {
    width: 100%;
    max-width: 1024px;
    padding: 0px;
    margin: 0 auto;
    vertical-align: top;
    position: relative;
}

.resp-header-box {      
    max-width: 550px;
    max-height: 350px;
    min-height: 100px;
    margin-right: 20px;
    display: inline-block;
}

.resp-header-box-text {
    width: 100%;
    font-size: 32px;
    line-height: 40px;
    max-height: 172px;
    min-height: 100px;
    padding-top: 36px;          
    padding-bottom: 32px;
    padding-left: 20px;          
    padding-right: 20px;
    margin-bottom: 0;
    overflow: hidden; 
}

.resp-header-box-text-with-sub {
    width: 100%;
    font-size: 32px;
    line-height: 40px;
    max-height: 172px;
    min-height: 0px;
    padding-top: 18px;
    padding-bottom: 15px;
    padding-left: 20px;          
    padding-right: 20px;
    margin-bottom: 0;
    overflow: hidden;
}

.resp-sub-header-box-text {
    width: 100%;
    font-size: 18px;
    line-height: 22px;
    padding-left: 20px;          
    padding-right: 20px;
    padding-bottom: 10px;
    overflow: hidden;
}

.resp-min-height {
    min-height: calc(100vh - 142px);
}

.resp-content-box {
    width: 640px;           /* fixed size to have consistent behavior screen at 640px and above, with 20px padding at each left and right sides */
    margin: 0 auto;         /* keep the content in the center of the screen */
    padding-top: 100px;     
    padding: 20px 20px 160px 20px;  /* match .screen behavior in signup16.css */
}

.resp-content-contrastbg {
    width:620px;
    padding-top: 18px;
    padding-bottom: 18px;
    padding-left: 18px;
    padding-right: 18px;
    background-color: rgba(255, 255, 255, 0.95);
}

.mpl-title-box-text.gemini {
    font-size: 40px;
    line-height: 42px;
    margin-left: 0px;
    margin-bottom: 20px;
}

.mpl-buttons-box
{
    margin-top: 0px;
}

.Loading-Horizontal-Container {
    wrap-option: true;
}

.mpl-bundle-link {
    margin-left: 20px;
    padding-bottom: 10px;
    font-size: small;
    cursor: pointer;
}

.mpl-bundle-container {
    margin-bottom: 5px;
    font-size: small;
    opacity: 1;
    line-height: normal;
    max-height: none;
}

.mpl-bundle-container hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 2px solid #fff;
    padding: 0;
}

.mpl-bundle-container span {
    margin-left: 20px;
}

li.redeem-key {
    list-style: square;
    font-size: 17px;
    margin: 12px 20px;
}

/* ----------------------------------------------------------*/
/* ---------->>> Changes to override signup16.css <<<--------*/
/* ----------------------------------------------------------*/
.content {
    width: 100%;            /* changed from fixed size 1245px to 100%, so that content fits the container */
    max-width: 1024px;      /* content area will not stretch further beyond 1024 */
}

.left-nav {
    max-width: 1225px;      /* offer title area will not stretch further beyond this limit */
    margin-right: 20px;
}
.left-nav h1 {
    min-height: 100px;      /* control the height of the header bar */
}

h1.offertitle
{
    width: 100%;
    padding-top: 10px;
    min-height: 100px;      
    max-height: 172px;
    line-height: 40px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 36px;          
    padding-bottom: 32px;
    overflow: hidden;
    text-overflow: ellipsis;    
}

.signin-bubble {
    right: 10% !important;     /* adapt to browser change */
}

.screen h1 {
    margin-bottom: 30px;        /* increase the padding at bottom since we changed the margin-top for field to leave enough space for error message */
}

.field {
    margin-top: 3px;            /* reduce from 33px, leaving space for field-validation-error */
}

.text {
    width: 281px;               /* Match new responsive design redline, aligned with .screen .content width (including padding) */
}

.text.with-middle-name {
    width: 181px;               /* Match new responsive design redline, aligned with .screen .content width (including padding) */
}

.text.large {
    width: 582px;               /* Match new responsive design redline, aligned with .screen .content width (including padding) */
}

.field-validation-area {
    min-height: 15px;
    clear: both;
}

.field-validation-error {
    background-color: rgba(255, 255, 255, 0.5); /* match the same background as legal-panel */
}
.UserId {
    width:200px;
    text-align:left;
}
#helpdate
{
    left: 0px;
}

.help-container .icon-questionmark  {
    border-style: solid;                        /* add boarder to help icon to show better for different types of background images, dark or light */
    border-width: 1px;
}

.hideFocus:focus {
    outline: none;
}

.ErrorMessage {
    background-color: rgba(255, 255, 255, 0.7);
    width: 580px;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 6px;         
    padding-right: 6px;
    border:  1px solid;
}

.legal-panel {
    width: 582px;                               /* same as large text control width, to align with form fields */
    background: none;
}

.legal-panel .check-box {
    display: block;
    float: left
}

.legal-panel .check-box-label {
    display: block;
    margin-left: 20px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.legal-panel .check-box-para {
    display: block;
    margin-top: 5px;
    margin-bottom: 5px;
}

.field .info {
   padding-bottom: 30px;                        /* fix bug 2119082, match freemium redline */
}
    .field .info span {
           color:#0072c6;
    }
.field.info.large {
   padding-bottom: 20px;                        
}

.footer .footer-content {
    width: 100%;
    height: inherit;
    border-top-style: solid;
    border-top-color: #A6A6A6;
    border-top-width: 1px;
}

.footer .microsoft {
    margin-left: 20px;
    margin-right: 20px;
}
.footer .o365logo {
    margin-top: 0px;
}
.footer ul {
    margin-left: 0px;
    margin-right: 20px;
    line-height: 20px;
}
.footer li {
    margin: 0 0 0 0px;
    top: 0px;
    line-height: 20px;
}

.shortyDropDown {
    width:250px;
}

.schoolType {
    width: 70%;
    min-width:320px;
}
.homeSchoolType {
    width: 80%;
    min-width:320px;
}
.DomainName {
    width:357px;                        /* why 98%, aligning this with other controls */
    padding-right:135px;
    text-align: left;                   /* make the domain name type from left to right like user ID, this applies to RTL language too */
}
.DomainNameShort {
    width: 40%;
    padding-right: 0;
    text-align: left
}
.DomainTldDropdown {
    float: right;
    width: 58%;
    margin-top: 2px;
}

.RegionDropdownList {
    margin-right: 20px;
}

.StateDropdownList {
    min-width: 100px
}

.OrgRegionDropdownList {
    margin-top: 15px;
    margin-right: 20px;
}

.spaceforname    
{ 
    width: 20px;                        /* space between first name and last name controls */
    margin-top: 2px;
    margin-bottom: 2px;
}

.spaceforpassword    
{ 
    width: 20px;                        /* space between first name and two password controls */
    margin-top: 2px;
    margin-bottom: 2px;
}

.spaceforat    
{ 
    width: 20px;                        /* space between user name and domain name controls */
    margin-top: 10px;
    margin-left: 5px;
    margin-bottom: 2px;
}
.helpwithvalidator
{
    margin-top: 2px;
    min-height: 25px;                   /* match the space between fields, avoid pushing down when validation message shows up, e.g. for CountrySelection */
}

.resp-skype-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/skype-logo-mobile.svg');
    width:320px;
    background-color:white!important;
    background-repeat:no-repeat!important;
}

.resp-madeira-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/dynamics365_logo.svg');
    background-position: 20px 20px;
    width:325px;
    height:94px;
    background-size: 285px 35px;
    background-repeat:no-repeat!important;
}

.resp-d365white-OfferBox {
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/dynamics365_logo_white.svg');
    background-position: 20px 20px;
    width: 325px;
    height: 94px;
    background-size: 285px 35px;
    background-repeat: no-repeat !important;
}


.resp-powerbi-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/powerbi_login_logo.svg');
    background-position: 20px 20px;
    width:310px;
    height:94px;
    background-size: 222px 30px;
    background-repeat:no-repeat!important;
}

.resp-powerapps-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/powerapps_logo.svg');
    background-position: 20px 20px;
    width:330px;
    height:94px;
    background-size: 303px 30px;
    background-repeat:no-repeat!important;
}


.resp-partnercenter-OfferBox {
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/partnercenter_logo.svg');
    background-position: 20px 20px;
    width: 310px;
    height: 94px;
    background-size: 222px 30px;
    background-repeat: no-repeat !important;
}

.resp-flow-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/flow_logo.svg');
    background-position: 20px 20px;
    width:310px;
    height:94px;
    background-size: 235px 30px;
    background-repeat:no-repeat!important;
}

.resp-appsource-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/appsource-logo.svg');
    background-position: 20px 20px;
    width:310px;
    height:94px;
    background-size: 250px 25px;
    background-repeat:no-repeat!important;
}

.resp-stream-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/stream_logo.svg');
    background-position: 20px 20px;
    width:340px;
    height:94px;
    background-size: 320px 35px;
    background-repeat:no-repeat!important;
}

.resp-rms-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/azip_logo.svg');
    background-position: 20px 20px;
    width:404px;
    height:94px;
    background-size: 364px 54px;
    background-repeat:no-repeat!important;
}

.resp-dynamicsops-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/dynamics_365_for_operations_logo.png');
    background-position: 20px 35px;
    width:483px;
    height:94px;
    background-size: 443px 25px;
    background-repeat:no-repeat!important;
}

.resp-dynamicshcm-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/d365_for_talent_logo_technical_preview.svg');
    background-position: 20px 35px;
    width:496px;
    height:94px;
    background-size: 456px 25px;
    background-repeat:no-repeat!important;
}

.resp-dynamics365-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/microsoft_dynamics365_logo_new.svg');
    background-position: 20px 35px;
    width:483px;
    height:94px;
    background-size: 375px 32px;
    background-repeat:no-repeat!important;
}

.resp-riss-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/retailintelligenceandselfservice_logo.svg');
    background-position: 20px 35px;
    width:483px;
    height:94px;
    background-size: 375px 32px;
    background-repeat:no-repeat!important;
}

.resp-rwfm-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/retailworkforcemanagement_logo.svg');
    background-position: 20px 35px;
    width:483px;
    height:94px;
    background-size: 375px 32px;
    background-repeat:no-repeat!important;
}

.resp-partnerDashboard-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/partner_dashboard_logo.svg');
    background-position: 20px 35px;
    width:483px;
    height:94px;
    background-size: 375px 32px;
    background-repeat:no-repeat!important;
}

.resp-msTeams-OfferBox {
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/images/signup/ms_teams_logo.svg');
    background-color: #F3F2F1;
    background-position: 20px 35px;
    width: 483px;
    height: 94px;
    background-size: 375px 32px;
    background-repeat: no-repeat !important;
}

.resp-d365SalesPro-OfferBox {
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/d365_salespro_logo.svg');
    background-position: 20px 20px;
    width: 310px;
    height: 94px;
    background-size: 300px 30px;
    background-repeat: no-repeat !important;
}

.resp-virtualagents-OfferBox {
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/power_virtual_agents_logo.png');
    background-position: 20px 20px;
    width: 933px;
    height: 147px;
    background-color: transparent;
    background-size: 375px 60px;
    background-repeat: no-repeat !important;
}

.resp-azure-OfferBox {
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/ms_azure_logo.png');
    background-position: 20px 20px;
    width: 550px;
    height: 147px;
    background-color: white;
    background-size: 300px 100px;
    background-repeat: no-repeat !important;
}

.inviteothers{
    padding-bottom:13px !important;
}

.field-fullwidth 
{
    width: 582px;               /* Full width for controls like country select in admin trial EmailFirst experience*/
}

.field-halfwidth 
{
    width: 281px;               /* Have the country select aligned with above controls like password */
}

.sms-phone-number {
    max-width:396px;
}

.sms-verification-code {
    width: 483px;
}

.selection .sms-phone-number {
    margin-left: 20px;
    width: 328px;
    float: left;
}

.sms-phone-area {
    margin-right: 97px;        /* make the alignment work for RTL languages */
    float: left;
}

@media (max-width: 1050px) {
    .spaceforbanner {
        margin-top: 0px;
    }
    /* Move signup bubble down */
    .signin-bubble {
        top: 125px;              /* move sign up bubble under the */  
        left: 0px;  /* and shift left, after "One last thing" Title text */
        position:static;
        margin-bottom:15px;
    }
    .signin-bubble .left-side {
        display:inline-block;
        background-color:transparent !important;
        padding:5px;
    }
    .signin-bubble .right-side a {
        background-color:transparent !important;
        color:inherit;
    }
    .signin-bubble .right-side {
        background-color:transparent !important;
        padding:5px;
        color:#0072c6;
    }
    .tip-container {
        display:none;
    }
}

.resp-edmodo-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/edmodo_o365logo.svg');
    background-position: 30px 26px;
    width:384px;
    background-size: 324px 39px;
    background-color:#276bb0!important;
    background-repeat:no-repeat!important;
}

.resp-minecraft-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/minecraft_logo.png');
    width:320px;
    height:110px;
    background-color:#ffffff!important;
    background-repeat:no-repeat!important;
}

.resp-microsoft-OfferBox
{
    background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/microsoft_logo.svg');
    background-position: 30px 20px;
    width:310px;
    height:94px;
    background-size: 250px 54px;
    background-color:#ffffff!important;
    background-repeat:no-repeat!important;
}

/* -----------------------------------------------------------*/
/* --------->>> Mobile view styles below breakpoint <<<-------*/
/* -----------------------------------------------------------*/
@media (max-width: 639px)
{
    /* ----------------------------------------------------------*/
    /* ----->>> Changes for multiple page view layouts  <<<------*/
    /* ----------------------------------------------------------*/
    .mpl-layout {
        margin-left: 0px;
        margin-right: 0px;
    }

    .resp-header-box {
        width: 100%;
        min-height: 40px;
        max-width: initial;
    }

    .resp-header-box-text{
        width: 100%;
        min-height: 40px;
        font-size: 22px;
        max-height:176px;
        line-height: 24px;
        padding-top: 22px;          
        padding-bottom: 26px;
        padding-left: 15px;          
        padding-right: 15px;
        overflow: hidden;
    }

    .resp-header-box-text-with-sub {
        width: 100%;
        font-size: 32px;
        line-height: 40px;
        max-height: 172px;
        min-height: 0px;
        padding-top: 10px;
        padding-bottom: 0px;
        padding-left: 15px;          
        padding-right: 15px;
        margin-bottom: 0;
        overflow: hidden;
    }

    .resp-sub-header-box-text {
        width: 100%;
        font-size: 18px;
        line-height: 22px;
        padding-left: 15px;          
        padding-right: 15px;
        margin-bottom: 10px;
        overflow: hidden;
    }

    .resp-content-box {
        width: 100%;
        padding-top: 0px;    
        padding-left: 2%;          
        padding-right: 2%;
    }

    .resp-content-contrastbg {
        width:100%;
        padding-top: 20px;          
        padding-bottom: 0;
        padding-left: 0;          
        padding-right: 0;
    }

    ::-webkit-scrollbar
    {
        width: 18px;
    }

    .footer ul {
        margin-left: 0;
        margin-right: 10px;
        line-height: 20px;
    }

    /* Ajust the font size for the Title so that the Email input box and top bar can fit into one screen*/
    .mpl-title-box-text.gemini {
        font-size: 36px;
        line-height: 42px;
        margin-bottom: 16px;
        padding-top: 0;
    }

    .mpl-button-next-text {
        font-size: 28px;        /* reduce font size so that "Send text message ->" can fit into 320px screen. */
        line-height: 45px;      /* There are long localization strings that won't fit, which will rely on the wrap behavior with proper line height */
    }

    /* ---------------------------------------------------------------------------------*/
    /* ------->>> Changes to override styles in signup16.css below breakpoint <<<-------*/
    /* ---------------------------------------------------------------------------------*/
   
    .background {
        min-width: 100px;
        overflow:hidden;
    }

    /* Remove background image in the mobile view */
    body {
        background-image: none !important;
    }

    /* Change left top square to a header bar */
    .left-nav {
        width: 100%;
        height: 40px;               /* control the height of the header bar, check redline*/
        max-height: 145px;
    }
    .left-nav h1 {
        width: 100%;
        height: 40px;               /* control the height of the header bar, check redline*/
        min-width: 100px;
        min-height: 33px;           /* control the height of the header bar*/
    }

    /* Adjust font size for Title so that they can fit into 320px screen, such as "Get started", "One last thing", ... */
    .screen h1 {
        font-size: 45px;        /* shrink from 72px */ 
        line-height: 60px;      /* shrink from 80px */ 
    }

    /* Ajust the font size for the text under the Title so that the Email input box and top bar can fit into one screen*/
    h2 {
        font-size: 19px;
        line-height: 26px;
    }


    .floatleft {
        float: none;              /* allow first name .text to take the full width. Check if there is other solutions !!! */
    }

     .floatleftNoMirror {
        float: none;              /* allow first name .text to take the full width. Check if there is other solutions !!! */
    }

    .text {
        width: 100%;              /* All input fields (First name and last name) are in the same width match mobile view experience between 320-640px */
        min-width: 100px;         /* Set minimal width for 320px phone experience */
    }

    .text.with-middle-name {
        width: 100%;              /* Email input box responsive to browser window width */
        min-width: 100px;         /* Set minimal width for 320px phone experience */
    }

    .UserId {
    width:100%;
}

    .text.large {
        width: 100%;            /* Email input box responsive to browser window width */
        min-width: 100px;       /* Set minimal width for 320px phone experience */  
    }

    .DomainTldDropdown {
        width: 100%;
        margin-top: 12px;
    }

    .alternateDomainList {
        margin-right:2px; 
        margin-top: -1px; 
        vertical-align: middle;
    }

    .field.first {
        width: 100% !important;   /* avoid first name and last name fields go beyond content area */
    }

    .field.last {
        width: 100% !important;   /* avoid first name and last name fields go beyond content area */
    }

    .spaceforbanner {
        margin-top: 0px;
    }

    /* Move signup bubble down */
    .signin-bubble {
        top: 125px;              /* move sign up bubble under the */  
        left: 0px;  /* and shift left, after "One last thing" Title text */
        position:static;
    }
    .signin-bubble .left-side {
        display:inline-block;
        background-color:transparent !important;
        padding:5px;
    }
        .signin-bubble .right-side a {
            background-color:transparent !important;
            color:inherit;
        }
        .signin-bubble .right-side {
                background: transparent !important;
                color:#0072c6 ;
                padding:5px;
        }
        

    
    .legal-panel {
        width: 100%;            /* same as content area, align with form fields */
    }

    .tip-container {
        display:none;
    }
    .footer .microsoft {
        margin-left: 10px;
    }

    .footer .o365logo {         /* hide O365 logo on footer for small screen */
        display: none;
    }

    .action {
        font-size: 28px;        /* fix bug 2256110, 3043937 */
    }   

    /* -----------------------------------------------------------------------------------*/
    /* --------->>> Changes to override styles in Adoption.css below breakpoint <<<-------*/
    /* -----------------------------------------------------------------------------------*/
    
    /* Change the text inside the left top square to be center of the header bar, with fixed padding from top */
    h1.offertitle
    {
        width: 100%;
        font-size: 22px;
        line-height:24px;
        min-height: 50px;               /* offer header bar min-height, allow to grow for long strings*/
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 10px;              /* Check redline - 36px ? */
        padding-bottom: 10px;
        overflow: hidden;
    }
    
    .PersonIcon {
        display:none;
    }

    .screen {
        width: 100%;                    /* avoid header bar go beyond the image width */
    }

    .media-force-sixty {
        width: 60% !important;
    }

    /* Move content area to left after passing the breakpoint 640px */
    .screen .content {
      width: 100%;                          
      padding-top: 10px;                    /* reduce the padding on the top so "Start ->" can fit on to most phone */
      padding-left: 20px;      /* Fixed padding on the left */
      padding-right: 20px;     /* Fixed padding on the left */
    }

    .field {
        width: 100% !important;
        min-width: 100px !important;        /* Set minimal width for 320px phone experience, override the 540px defined in adoption.css */
    }

    .screen .field {                        /* affect all fields, such as email, create password, etc. */
        width: 100% !important;
        min-width: 100px !important;        /* Set minimal width for 320px phone experience, override the 540px defined in adoption.css */
    }
    .DomainName {
        padding-left:28px !important;
        text-align: left;
    }
    .DomainNameShort {
        padding-left:28px !important;
        text-align: left;
        width: 40%;
    }
    .text {
        width: 100%;                        /* Match new responsive design redline, aligned with .screen .content width (including padding) */
    }

    .text.with-middle-name {
        width: 100%;                        /* Match new responsive design redline, aligned with .screen .content width (including padding) */
    }

    .text.large {
        width: 100%;                        /* Match new responsive design redline, aligned with .screen .content width (including padding) */
    }

    .Year {
        width: 80px !important;             /* override the width defined in .field */
        font-size:13px;
        margin-bottom: 10px;                /* keep space between Year, Month, Day dropdown boxes in case of wrap*/
    }

    .Month {
        width: 120px !important;            /* override the width defined in .field */
        font-size:13px;
        margin-bottom: 10px;
    }

    .Day {
        width: 70px !important;;
        font-size:13px;
        margin-bottom: 10px;
    }

    .phone-number {
        width:55% !important; 
    }

    .sms-phone-number {
        width: 167px !important;     
    }

    .sms-verification-code {
        width: 100%;
        min-width:281px;
    }

    .sms-phone-area {
        margin-left: 0px;
        margin-right: 0px;
        float: left;                        /* to keep the current experience, keep the phone number on left on mobile devices for both RTL and LTR */
    }

    .selection
    {
        width: 100%;
    }

    .shortyDropDown 
    {
        width:100%;
    }

    .schoolType 
    {
        width: 100%;
    }

    .homeSchoolType 
    {
        width: 100%;
    }

    .screen select 
    {
        width: 100%;                        /* keep dropdown control aligned with other input controls */
    }

    .field-validation-area {
        min-height: 10px;
    }

    .RegionDropdownList {
        margin-right: 3%;
    }

    .StateDropdownList {
        width: 35%;
        min-width: 90px;
        float: right;
    }

    .OrgRegionDropdownList {
        margin-top: 10px;
        margin-right: 3px;
    }

    .spaceforname    
    { 
        height:3px;         /* match password field margin-top, leaving space for error message*/
        margin-top: 0px;   
    }

    .spaceforpassword    
    { 
        height:3px;                        /* space between first name and two password controls */
        margin-top: 0px;
    }   

    .spaceforat {
        position:absolute;
        z-index:100;
    }
    .resp-skype-OfferBox
    {
        background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/skype-logo-mobile.svg');
        width:100%;
        background-color:white!important;
    }

   .resp-edmodo-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/edmodo_o365logo.svg');
       background-position: 20px 12px;
       width:100%;
       background-size: 166px 20px;
       background-repeat:no-repeat!important;
       background-color:#276bb0!important;
    }

   .resp-minecraft-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/minecraft_logo.png');
       width:100%;
       height:72px;
       background-size: 209px 72px;
       background-repeat:no-repeat!important;
       background-color:#ffffff!important;
    }

    .resp-microsoft-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/microsoft_logo.svg');
       background-position: 20px 20px;
       width:100%;
       background-size: 150px 32px;
       background-repeat:no-repeat!important;
       background-color:#ffffff!important;
    }

    .resp-madeira-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/dynamics365_logo.svg');
       background-position: 20px 20px;
       width:100%;
       height:70px;
       background-size: 285px 35px;
       background-repeat:no-repeat!important;
    }

    .resp-d365white-OfferBox {
        background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/dynamics365_logo_white.svg');
        background-position: 20px 20px;
        width: 100%;
        height: 70px;
        background-size: 285px 35px;
        background-repeat: no-repeat !important;
    }

    .resp-powerbi-OfferBox
    {
        background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/powerbi_login_logo.svg');
        background-position: 20px 20px;
        width:100%;
        height:70px;
        background-size: 222px 30px;
        background-repeat:no-repeat!important;
        background-color: #333333;                      /* Grey back ground color to distinguish the white title on mobile devices. */
    } 

    .resp-powerapps-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/powerapps_logo.svg');
       background-position: 20px 20px;
       width:100%;
       height:70px;
       background-color:black;
       background-size: 303px 30px;
       background-repeat:no-repeat!important;
    }
    .resp-flow-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/flow_logo.svg');
       background-position: 20px 20px;
       width:100%;
       height:70px;
       background-size: 235px 30px;
       background-repeat:no-repeat!important;
    }

    .resp-appsource-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/appsource-logo.svg');
       background-position: 20px 20px;
       width:100%;
       height:70px;
       background-size: 251px 25px;
       background-repeat:no-repeat!important;
    }

    .resp-stream-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/stream_logo.svg');
       background-position: 20px 20px;
       width:100%;
       height:70px;
       background-size: 320px 35px;
       background-repeat:no-repeat!important;
    }

    .resp-rms-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/azip_logo.svg');
       background-position: 20px 20px;
       width:100%;
       height:70px;
       background-size: 236px 35px;
       background-repeat:no-repeat!important;
    }

    .resp-dynamicsops-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/dynamics_365_for_operations_logo.png');
       background-position: 20px 27px;
       width:100%;
       height:70px;
       background-size: 300px 17px;
       background-repeat:no-repeat!important;
    }

   .resp-dynamicshcm-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/d365_for_talent_logo_technical_preview.svg');
       background-position: 20px 27px;
       width:100%;
       height:70px;
       background-size: 300px 15px;
       background-repeat:no-repeat!important;
    }

    .resp-dynamics365-OfferBox
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/microsoft_dynamics365_logo_new.svg');
       background-position: 20px 27px;
       width:100%;
       height:70px;
       background-size: 295px 25px;
       background-repeat:no-repeat!important;
    }

    .resp-riss-OfferBox 
    {
       background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/retailintelligenceandselfservice_logo.svg');
       background-position: 20px 27px;
       width:100%;
       height:70px;
       background-size: 295px 25px;
       background-repeat:no-repeat!important;
    }

    .resp-rwfm-OfferBox {
        background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/retailworkforcemanagement_logo.svg');
        background-position: 20px 27px;
        width:100%;
        height:70px;
        background-size: 295px 25px;
        background-repeat:no-repeat!important;
    }

    .resp-virtualagents-OfferBox {
        background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/power_virtual_agents_logo.png');
        background-position: 5px 20px;
        width: 100%;
        height: 70px;
        background-color: transparent;
        background-size: contain;
        background-repeat: no-repeat !important;
    }

    .resp-azure-OfferBox {
        background-image: url('https://cdn.signup.microsoft.com/aloha/1.0.8018.1208/admin/images/offerbox/ms_azure_logo.png');
        background-position: 5px 0px;
        width: 100%;
        height: 70px;
        background-color: wheat;
        background-size: contain;
        background-repeat: no-repeat !important;
    }

    div.disambiguationarea {
        margin-top: 20px;  
    }

    .disambiguationtext 
    {
        margin-top: 10px;  
        display: block;
    }

    .field-fullwidth 
    {
        min-width: 100px;
        width: 100%;               /* Full width for controls like country select in admin trial EmailFirst experience*/
    }

    .field-halfwidth 
    {
        width: 100%;                       /* Have the country select aligned with above controls like password */
        min-width: 100px;
    }
}

/* temp override SuiteShared\src\Server\CommonUI\css\MasterStyles15MVC.css for button templates */
.mpl-button-rectangle-DynamicsOps 
{
    background-color: #0DA5B3;
    border-color: #0DA5B3;
}

.mpl-button-rectangle-Stream {
    background-color: #C30052;
    border-color: #C30052;
}

.mpl-button-rectangle-PowerBI {
    background-color: #F2C811;
    border-color: #F2C811;
}

.aria-only {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

div.consumeremailcheckarea {
    overflow: hidden;
}

.consumeremailcheckselection {
    display: inline-block;
    width: 100%;
    margin: 10px;
}