Ultimo theme compatibility

Here's a primer to get OneStepCheckout styling started on Ultimo Magento 2 theme:

xxxx

You can place this isnide OneStepCheckout css or create a separate script and address OneStepCheckout layout handler checkout_onestepcheckout_iosc or just override the OneStepCheckout default css file in theme context

More information on Magento 2 frontend development can be found on Mgento devdocs areas: https://devdocs.magento.com/guides/v2.2/frontend-dev-guide/bk-frontend-dev-guide.html

/* ultimo m2 primer */
.checkout-container {
margin: 20px;
}
.opc-wrapper .fieldset>.field label, .fieldset>.field:not(.choice)>.label {
padding: 0px 15px 0 0 !important;
float: none !important;
width: auto !important;
text-align: left !important;
margin: 0 0 8px !important;
}

.fieldset>.field>.control {
width: inherit !important;
float: none !important;
/* width: 74.2%; */
/* float: left; */
}
input[type="text"], input[type="password"], input[type="url"], input[type="tel"], input[type="search"], input[type="number"], input[type="datetime"], input[type="email"] {
background: #ffffff;
background-clip: padding-box;
border: 1px solid #c2c2c2;
border-radius: 1px;
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 14px;
height: 32px;
line-height: 1.42857143;
padding: 0 9px;
vertical-align: baseline;
width: auto !important;
box-sizing: border-box;
}

.opc-wrapper .fieldset>.field.required>label:after, .opc-wrapper .fieldset>.field._required>label:after {
margin: 0 0 0 5px !important;
position: unset !important;
top: 0px !important;
}
.fieldset>.field, .fieldset>.fields>.field {
margin: 0 0 20px !important;
}

#customer-email-fieldset input#customer-email {
width: 100% !important;
}
#customer-email-fieldset div.field {
margin-bottom: 0px !important;
}
fieldset.street div.control label, header.page-header {
display: none;
}
#maincontent {
margin-right: auto;
margin-left: auto;
padding-left: 15px;
padding-right: 15px;
}
@media (min-width: 768px) {
#maincontent {
width: 750px;
}
}
@media (min-width: 992px) {
#maincontent {
width: 970px;
}
}
@media (min-width: 1200px) {
#maincontent {
width: 1170px;
}
}

.header-container .hp-blocks-holder .hp-block {
padding: 15px 0px 15px 0px;
}

/* ultimo m2 primer end */

You can place this isnide OneStepCheckout css or create a separate script and address OneStepCheckout layout handler checkout_onestepcheckout_iosc or just override the OneStepCheckout default css file in theme context

More information on Magento 2 frontend development can be found on Mgento devdocs areas: https://devdocs.magento.com/guides/v2.2/frontend-dev-guide/bk-frontend-dev-guide.html