/** * @version Octo 1.x * @package Octo Template Framework * @url https://www.octopoos.com * @editor Octopoos - www.octopoos.com * @author Alexandre Lapoux - v_1.0.2 * @copyright Copyright (C) 2019 Octopoos. All Rights Reserved. * @license GNU General Public License version 2 or later; see _LICENSE.php **/ /* ----------------------------------------------------------------------------- ------------------------------- Generic ---------------------------------------- ----------------------------------------------------------------------------- */ :root { --form-color: #333; --form-color-focus: #333; --form-color-hover: #333; --form-color-active: #fff; --form-color-disabled: #adadad; --form-background: #f0f0f0; --form-background-focus: #e3e3e3; --form-background-hover: #e3e3e3; --form-background-active: #000; --form-background-disabled: #ccc; --form-border: #0003; --form-border-focus: #0003; --form-border-hover: #0003; --form-border-active: #0003; --form-border-disabled: #adadad; --form-color-required: #f62875; --form-background-required: #fff; --form-border-required: #f62875; --form-color-required-hover: #fff; --form-background-required-hover: #f62875; --form-border-required-hover: #f62875; } body, input, textarea, select, button { font-size: 15px; line-height: 20px; } .no-result { text-align: center; } .o-input input,.o-input label,.o-input select,.o-input textarea{-ms-touch-action:manipulation;touch-action:manipulation;} .o-input fieldset{border:none;} .o-input ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color:var(--form-color-disabled);opacity:1; } .o-input ::-moz-placeholder { /* Firefox 19+ */ color:var(--form-color-disabled);opacity:1; } .o-input :-ms-input-placeholder { /* IE 10+ */ color:var(--form-color-disabled);opacity:1; } .o-input :-moz-placeholder { /* Firefox 18- */ color:var(--form-color-disabled);opacity:1; } /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-required ------------------------------- ----------------------------------------------------------------------------- */ .o-required .o-label span:after{content:"*";color:var(--form-color);font-size:18px;padding:0 2px;top:0;position:relative;} /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-label ---------------------------------- ----------------------------------------------------------------------------- */ .o-label{font-size:15px;line-height:20px;min-height:40px;padding:0;color:var(--form-color);} .o-label{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;} .o-label.o-label-top{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding-top:10px;} .o-label.o-label-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center;} .o-label.o-label-bottom{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding-bottom:10px;} .o-field > .o-label{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;line-height:20px;padding-top:10px;} /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-link ----------------------------------- ----------------------------------------------------------------------------- */ .o-link{font-size:15px;line-height:20px;min-height:40px;padding:0;color:var(--form-color);} .o-link{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;} /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-input ---------------------------------- ----------------------------------------------------------------------------- */ .o-input{font-size:15px;line-height:20px;padding:0;color:var(--form-color);} .o-input{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-grid;display:grid;list-style:none;position:relative;grid-auto-flow:dense;-ms-grid-rows:auto;grid-template-rows:auto;width:100%;grid-column-gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-grid-columns:1fr;grid-template-columns:1fr;} .o-helper .o-tabs-right .o-input{-ms-grid-columns:1fr;grid-template-columns:1fr;} .o-helper .o-input,.o-help .o-input,.o-helper .o-tabs-right .o-help .o-input{-ms-grid-columns:1fr 16px;grid-template-columns:1fr 16px;} .o-input p{-ms-grid-column:1;grid-column:1;} .o-input-top .o-input{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding-top:10px;} .o-input-center .o-input{-webkit-box-align:center;-ms-flex-align:center;align-items:center;} .o-input-bottom .o-input{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding-bottom:10px;} /* Container 1280 + padding 16*2 */ @media (max-width:1312px){ .o-helper .o-input{-ms-grid-columns:1fr;grid-template-columns:1fr;} .o-help .o-input{-ms-grid-columns:1fr 16px;grid-template-columns:1fr 16px;} [class^="o-colwidth-"] > .o-field .o-input,[class*=" o-colwidth-"]> .o-field .o-input{-ms-grid-columns:1fr 16px;grid-template-columns:1fr 16px;} } /* Large devices (desktops, less than 1200px) (lg)*/ @media (max-width:1199px){ .o-colwidth-100\@lg > .o-field:not(.o-help) .o-input{-ms-grid-columns:1fr;grid-template-columns:1fr;} } /* Medium devices (tablets, less than 992px) (md)*/ @media (max-width:991px){ .o-colwidth-100\@md > .o-field:not(.o-help) .o-input{-ms-grid-columns:1fr;grid-template-columns:1fr;} } /* Small devices (landscape phones, less than 768px) (sm)*/ @media (max-width:767px){ .o-colwidth-100\@sm > .o-field:not(.o-help) .o-input{-ms-grid-columns:1fr;grid-template-columns:1fr;} } /* Extra small devices (portrait phones, less than 533px) (xs)*/ @media (max-width:532px){ .o-colwidth-100\@xs > .o-field:not(.o-help) .o-input{-ms-grid-columns:1fr;grid-template-columns:1fr;} .o-help .o-input,[class^="o-colwidth-"] > .o-field .o-input,[class*=" o-colwidth-"]> .o-field .o-input{-ms-grid-columns:1fr;grid-template-columns:1fr;} .o-help .o-input .o-help-icon{position:absolute;top:-28px;right:0;} } /* ----------------------------------------------------------------------------- ------------------------------- input [type="text"] [type="password"] ---------- ----------------------------------------------------------------------------- */ .o-input input[type="text"],.o-input input[type="password"]{border:none;color:var(--form-color);background:var(--form-background);-webkit-box-shadow:inset 1px 0 0 var(--form-border),inset -1px 0 0 var(--form-border),inset 0 -1px 0 var(--form-border),inset 0 1px 0 var(--form-border);box-shadow:inset 1px 0 0 var(--form-border),inset -1px 0 0 var(--form-border),inset 0 -1px 0 var(--form-border),inset 0 1px 0 var(--form-border);height:40px;padding:0 16px;} .o-input input[type="text"],.o-input input[type="password"]{display:block;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;border-radius:0;} .o-input input[type="text"]:hover,.o-input input[type="password"]:hover{color:var(--form-color-hover);background:var(--form-background-hover);-webkit-box-shadow:inset 1px 0 0 var(--form-border-hover),inset -1px 0 0 var(--form-border-hover),inset 0 -2px 0 var(--form-border-hover),inset 0 1px 0 var(--form-border-hover);box-shadow:inset 1px 0 0 var(--form-border-hover),inset -1px 0 0 var(--form-border-hover),inset 0 -2px 0 var(--form-border-hover),inset 0 1px 0 var(--form-border-hover);} .o-input input[type="text"]:focus,.o-input input[type="password"]:focus{color:var(--form-color-focus);background:var(--form-background-focus);-webkit-box-shadow:inset 1px 0 0 var(--form-border-focus),inset -1px 0 0 var(--form-border-focus),inset 0 -2px 0 var(--form-border-focus),inset 0 1px 0 var(--form-border-focus);box-shadow:inset 1px 0 0 var(--form-border-focus),inset -1px 0 0 var(--form-border-focus),inset 0 -2px 0 var(--form-border-focus),inset 0 1px 0 var(--form-border-focus);} .o-input input[disabled],.o-input input[disabled]:hover,.o-input input[disabled]:focus{cursor:not-allowed;color:var(--form-color-disabled);background:var(--form-background-disabled);-webkit-box-shadow:inset 1px 0 0 var(--form-border-disabled),inset -1px 0 0 var(--form-border-disabled),inset 0 -1px 0 var(--form-border-disabled),inset 0 1px 0 var(--form-border-disabled);box-shadow:inset 1px 0 0 var(--form-border-disabled),inset -1px 0 0 var(--form-border-disabled),inset 0 -1px 0 var(--form-border-disabled),inset 0 1px 0 var(--form-border-disabled);} /* ----------------------------------------------------------------------------- ------------------------------- input [type="text"] is-search ------------------ ----------------------------------------------------------------------------- */ .o-input input[type="text"].is-search,.o-input input[type="text"].is-search:hover,.o-input input[type="text"].is-search:focus{-webkit-transition:.2s ease-in-out;-o-transition:.2s ease-in-out;transition:.2s ease-in-out;-webkit-transition-property:color,background-color,border;-o-transition-property:color,background-color,border;transition-property:color,background-color,border;-webkit-appearance:none;-moz-appearance:none;height:40px;vertical-align:middle;display:inline-block;background-repeat:no-repeat;background-position:calc(100% - 5px) 50%;} .o-input input[type="text"].is-search{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMzMzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsMTJhNSw1LDAsMSwxLDUtNUE1LDUsMCwwLDEsMTQsMTJabTAtOGEzLDMsMCwxLDAsMywzQTMsMywwLDAsMCwxNCw0WiIvPjxwYXRoIGQ9Ik0xOCwxNGExLDEsMCwwLDEtLjgzLS40NWwtMS4zNC0yYTEsMSwwLDAsMSwxLjY3LTEuMWwxLjMzLDJhMSwxLDAsMCwxLS4yOCwxLjM4QS45NC45NCwwLDAsMSwxOCwxNFoiLz48L3N2Zz4=');} .o-input input[type="text"].is-search.is-filter{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMzMzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNNSw1SDFBMSwxLDAsMCwxLDEsM0g1QTEsMSwwLDAsMSw1LDVaIi8+PHBhdGggZD0iTTYsOUgxQTEsMSwwLDAsMSwxLDdINkExLDEsMCwwLDEsNiw5WiIvPjxwYXRoIGQ9Ik04LDEzSDFhMSwxLDAsMCwxLDAtMkg4YTEsMSwwLDAsMSwwLDJaIi8+PHBhdGggZD0iTTE0LDEyYTUsNSwwLDEsMSw1LTVBNSw1LDAsMCwxLDE0LDEyWm0wLThhMywzLDAsMSwwLDMsM0EzLDMsMCwwLDAsMTQsNFoiLz48cGF0aCBkPSJNMTgsMTRhMSwxLDAsMCwxLS44My0uNDVsLTEuMzQtMmExLDEsMCwwLDEsMS42Ny0xLjFsMS4zMywyYTEsMSwwLDAsMS0uMjgsMS4zOEEuOTQuOTQsMCwwLDEsMTgsMTRaIi8+PC9zdmc+');} .o-input input[type="text"].is-search[disabled]{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjYWRhZGFkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsMTJhNSw1LDAsMSwxLDUtNUE1LDUsMCwwLDEsMTQsMTJabTAtOGEzLDMsMCwxLDAsMywzQTMsMywwLDAsMCwxNCw0WiIvPjxwYXRoIGQ9Ik0xOCwxNGExLDEsMCwwLDEtLjgzLS40NWwtMS4zNC0yYTEsMSwwLDAsMSwxLjY3LTEuMWwxLjMzLDJhMSwxLDAsMCwxLS4yOCwxLjM4QS45NC45NCwwLDAsMSwxOCwxNFoiLz48L3N2Zz4=');} .o-input input[type="text"].is-search.is-filter[disabled]{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjYWRhZGFkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNNSw1SDFBMSwxLDAsMCwxLDEsM0g1QTEsMSwwLDAsMSw1LDVaIi8+PHBhdGggZD0iTTYsOUgxQTEsMSwwLDAsMSwxLDdINkExLDEsMCwwLDEsNiw5WiIvPjxwYXRoIGQ9Ik04LDEzSDFhMSwxLDAsMCwxLDAtMkg4YTEsMSwwLDAsMSwwLDJaIi8+PHBhdGggZD0iTTE0LDEyYTUsNSwwLDEsMSw1LTVBNSw1LDAsMCwxLDE0LDEyWm0wLThhMywzLDAsMSwwLDMsM0EzLDMsMCwwLDAsMTQsNFoiLz48cGF0aCBkPSJNMTgsMTRhMSwxLDAsMCwxLS44My0uNDVsLTEuMzQtMmExLDEsMCwwLDEsMS42Ny0xLjFsMS4zMywyYTEsMSwwLDAsMS0uMjgsMS4zOEEuOTQuOTQsMCwwLDEsMTgsMTRaIi8+PC9zdmc+');} /* ----------------------------------------------------------------------------- ------------------------------- input [type="number"] -------------------------- ----------------------------------------------------------------------------- */ .o-input input[type=number]{-moz-appearance:textfield;} .o-input input::-webkit-inner-spin-button,.o-input input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;} .o-input input::-o-inner-spin-button,.o-input input::-o-outer-spin-button{-o-appearance:none;margin:0} .o-input input[type="number"]{border:none;color:var(--form-color);background:var(--form-background);-webkit-box-shadow:inset 1px 0 0 var(--form-border),inset -1px 0 0 var(--form-border),inset 0 -1px 0 var(--form-border),inset 0 1px 0 var(--form-border);box-shadow:inset 1px 0 0 var(--form-border),inset -1px 0 0 var(--form-border),inset 0 -1px 0 var(--form-border),inset 0 1px 0 var(--form-border);font-size:16px;line-height:20px;height:40px;padding:0 16px;} .o-input input[type="number"]{display:block;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;border-radius:0;} .o-input input[type="number"]:hover{color:var(--form-color-hover);background:var(--form-background-hover);-webkit-box-shadow:inset 1px 0 0 var(--form-border-hover),inset -1px 0 0 var(--form-border-hover),inset 0 -2px 0 var(--form-border-hover),inset 0 1px 0 var(--form-border-hover);box-shadow:inset 1px 0 0 var(--form-border-hover),inset -1px 0 0 var(--form-border-hover),inset 0 -2px 0 var(--form-border-hover),inset 0 1px 0 var(--form-border-hover);} .o-input input[type="number"]:focus{color:var(--form-color-focus);background:var(--form-background-focus);-webkit-box-shadow:inset 1px 0 0 var(--form-border-focus),inset -1px 0 0 var(--form-border-focus),inset 0 -2px 0 var(--form-border-focus),inset 0 1px 0 var(--form-border-focus);box-shadow:inset 1px 0 0 var(--form-border-focus),inset -1px 0 0 var(--form-border-focus),inset 0 -2px 0 var(--form-border-focus),inset 0 1px 0 var(--form-border-focus);} /* https://stackoverflow.com/questions/26024771/styling-a-input-type-number .number-wrapper { position: relative; } .number-wrapper:after, .number-wrapper:before { position: absolute; right: 5px; width: 1.6em; height: .9em; font-size: 10px; pointer-events: none; background: #fff; } .number-wrapper:after { color: blue; content: "\25B2"; margin-top: 1px; } .number-wrapper:before { color: red; content: "\25BC"; margin-bottom: 5px; bottom: -.5em; }*/ /* ----------------------------------------------------------------------------- ------------------------------- select ----------------------------------------- ----------------------------------------------------------------------------- */ .o-input select{color:var(--form-color);background:var(--form-background);border-color:var(--form-border);border-style:solid;border-width:1px;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;border-radius:0;text-transform:none;max-width:100%;width:100%;padding:0 24px 0 16px;-webkit-transition:.2s ease-in-out;-o-transition:.2s ease-in-out;transition:.2s ease-in-out;-webkit-transition-property:color,background-color,border;-o-transition-property:color,background-color,border;transition-property:color,background-color,border;-webkit-appearance:none;-moz-appearance:none;height:40px;vertical-align:middle;display:inline-block;background-repeat:no-repeat;background-position:calc(100% - 5px) 50%;} .o-input select optgroup{font-weight:bold;} .o-input select:focus{outline:none;background-color:var(--form-background-focus);color:var(--form-color-focus);border-color:var(--form-border-focus);} .o-input select:hover{outline:none;background-color:var(--form-background-hover);color:var(--form-color-hover);border-color:var(--form-border-hover);} .o-input select[disabled],.o-input select[disabled]:focus,.o-input select[disabled]:hover{cursor:not-allowed;background-color:var(--form-background-disabled);color:var(--form-color-disabled);border-color:var(--form-border-disabled);} .o-input select::-ms-expand{display:none} .o-input select option{color:var(--form-color);} .o-input select{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMzMzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsOWExLDEsMCwwLDEtLjcxLS4yOWwtNC00YTEsMSwwLDAsMSwxLjQyLTEuNDJMMTQsNi41OWwzLjI5LTMuM2ExLDEsMCwxLDEsMS40MiwxLjQybC00LDRBMSwxLDAsMCwxLDE0LDlaIi8+PC9zdmc+');} .o-input select.is-filter{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMzMzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNNSw1SDFBMSwxLDAsMCwxLDEsM0g1QTEsMSwwLDAsMSw1LDVaIi8+PHBhdGggZD0iTTYsOUgxQTEsMSwwLDAsMSwxLDdINkExLDEsMCwwLDEsNiw5WiIvPjxwYXRoIGQ9Ik04LDEzSDFhMSwxLDAsMCwxLDAtMkg4YTEsMSwwLDAsMSwwLDJaIi8+PHBhdGggZD0iTTE0LDlhMSwxLDAsMCwxLS43MS0uMjlsLTQtNGExLDEsMCwwLDEsMS40Mi0xLjQyTDE0LDYuNTlsMy4yOS0zLjNhMSwxLDAsMSwxLDEuNDIsMS40MmwtNCw0QTEsMSwwLDAsMSwxNCw5WiIvPjwvc3ZnPg==');} .o-input select.is-ordering{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMzMzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsMTVhMSwxLDAsMCwxLS43MS0uMjlsLTQtNGExLDEsMCwwLDEsMS40Mi0xLjQyTDE0LDEyLjU5bDMuMjktMy4zYTEsMSwwLDAsMSwxLjQyLDEuNDJsLTQsNEExLDEsMCwwLDEsMTQsMTVaIi8+PHBhdGggZD0iTTE4LDdhMSwxLDAsMCwxLS43MS0uMjlMMTQsMy40MWwtMy4yOSwzLjNBMSwxLDAsMCwxLDkuMjksNS4yOWw0LTRhMSwxLDAsMCwxLDEuNDIsMGw0LDRhMSwxLDAsMCwxLDAsMS40MkExLDEsMCwwLDEsMTgsN1oiLz48L3N2Zz4=');} .o-input select[disabled]{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjYWRhZGFkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsOWExLDEsMCwwLDEtLjcxLS4yOWwtNC00YTEsMSwwLDAsMSwxLjQyLTEuNDJMMTQsNi41OWwzLjI5LTMuM2ExLDEsMCwxLDEsMS40MiwxLjQybC00LDRBMSwxLDAsMCwxLDE0LDlaIi8+PC9zdmc+');} .o-input select.is-filter:disabled{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjYWRhZGFkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNNSw1SDFBMSwxLDAsMCwxLDEsM0g1QTEsMSwwLDAsMSw1LDVaIi8+PHBhdGggZD0iTTYsOUgxQTEsMSwwLDAsMSwxLDdINkExLDEsMCwwLDEsNiw5WiIvPjxwYXRoIGQ9Ik04LDEzSDFhMSwxLDAsMCwxLDAtMkg4YTEsMSwwLDAsMSwwLDJaIi8+PHBhdGggZD0iTTE0LDlhMSwxLDAsMCwxLS43MS0uMjlsLTQtNGExLDEsMCwwLDEsMS40Mi0xLjQyTDE0LDYuNTlsMy4yOS0zLjNhMSwxLDAsMSwxLDEuNDIsMS40MmwtNCw0QTEsMSwwLDAsMSwxNCw5WiIvPjwvc3ZnPg==');} .o-input select.is-ordering:disabled{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjYWRhZGFkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsMTVhMSwxLDAsMCwxLS43MS0uMjlsLTQtNGExLDEsMCwwLDEsMS40Mi0xLjQyTDE0LDEyLjU5bDMuMjktMy4zYTEsMSwwLDAsMSwxLjQyLDEuNDJsLTQsNEExLDEsMCwwLDEsMTQsMTVaIi8+PHBhdGggZD0iTTE4LDdhMSwxLDAsMCwxLS43MS0uMjlMMTQsMy40MWwtMy4yOSwzLjNBMSwxLDAsMCwxLDkuMjksNS4yOWw0LTRhMSwxLDAsMCwxLDEuNDIsMGw0LDRhMSwxLDAsMCwxLDAsMS40MkExLDEsMCwwLDEsMTgsN1oiLz48L3N2Zz4=');} /* ----------------------------------------------------------------------------- ------------------------------- select chosen ---------------------------------- ----------------------------------------------------------------------------- */ .o-input .chzn-container-single .chzn-single { color: var(--form-color); background: #fff; border:none; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; border-radius: 0; text-transform: none; max-width: 100%; width: 100%; padding: 0 24px 0 16px; -webkit-transition: .2s ease-in-out; -o-transition: .2s ease-in-out; transition: .2s ease-in-out; -webkit-transition-property: color,background-color,border; -o-transition-property: color,background-color,border; transition-property: color,background-color,border; -webkit-appearance: none; -moz-appearance: none; height: 40px; vertical-align: middle; display: inline-block; background-repeat: no-repeat; background-position: calc(100% - 5px) 50%; -webkit-box-shadow: inset 1px 0 0 #e2e2e2,inset -1px 0 0 #e2e2e2,inset 0 -1px 0 #e2e2e2,inset 0 1px 0 #e2e2e2; box-shadow: inset 1px 0 0 #e2e2e2,inset -1px 0 0 #e2e2e2,inset 0 -1px 0 #e2e2e2,inset 0 1px 0 #e2e2e2; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .o-input .chzn-container-single .chzn-single:focus{outline:none;background-color:var(--form-background-focus);color:var(--form-color-focus);border-color:var(--form-border-focus);} .o-input .chzn-container-single .chzn-single:hover{outline:none;background-color:var(--form-background-hover);color:var(--form-color-hover);border-color:var(--form-border-hover);} .o-input .chzn-container-single .chzn-single:hover { outline: none; background-color: #fff; color: #4a4850; border: none; -webkit-box-shadow: inset 1px 0 0 #e2e2e2,inset -1px 0 0 #e2e2e2,inset 0 -2px 0 #0097AA,inset 0 1px 0 #e2e2e2; box-shadow: inset 1px 0 0 #e2e2e2,inset -1px 0 0 #e2e2e2,inset 0 -2px 0 #0097AA,inset 0 1px 0 #e2e2e2; } .o-input .chzn-container-single .chzn-single span { display: block; overflow: hidden; margin-right: 26px; text-overflow: ellipsis; white-space: nowrap; height: auto; font-size: 16px; line-height: 20px; } .o-input .chzn-container-single .chzn-single div b { display: block; width: 100%; height: 100%; background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMzMzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsOWExLDEsMCwwLDEtLjcxLS4yOWwtNC00YTEsMSwwLDAsMSwxLjQyLTEuNDJMMTQsNi41OWwzLjI5LTMuM2ExLDEsMCwxLDEsMS40MiwxLjQybC00LDRBMSwxLDAsMCwxLDE0LDlaIi8+PC9zdmc+');} .o-input .chzn-container-single .chzn-single div { position: absolute; top: 12px; right: 4px; display: block; width: 20px; height: 20px; } .chzn-container .chzn-results li.active-result{ position: relative; min-height: 32px; padding: 12px 8px 12px 44px; line-height: 16px; } .chzn-container .chzn-results li.active-result[class^="octo-"]::before,.chzn-container .chzn-results li.active-result[class*=" octo-"]::before { font-size: 32px; position: absolute; left: 4px; top: 4px; } /* ----------------------------------------------------------------------------- ------------------------------- query ui selectmenu ---------------------------- ----------------------------------------------------------------------------- */ .o-input > .ui-selectmenu-button{height:40px;padding:0 16px;color:var(--form-color);background:#eee;border:none;-webkit-box-sizing:border-box;box-sizing:border-box;line-height:20px;width:100%;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;} .o-input > .ui-selectmenu-button .ui-selectmenu-text{font-size:15px;line-height:20px;white-space:nowrap;width:1px;} .o-input > .ui-selectmenu-button.ui-selectmenu-disabled{color:#ddd;} .o-input > .ui-selectmenu-button .ui-icon{text-indent:0;} .o-input > .ui-selectmenu-button .ui-selectmenu-text{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;} .o-input.o-large .ui-selectmenu-button{height:48px;} .o-input.o-large .ui-selectmenu-icon:not(.octo-arrow-down-2){font-size:26px;} .ui-selectmenu-menu{padding:0;background:rgb(255,255,255);color:var(--form-color);-webkit-box-shadow:0 13px 13px rgba(0,0,0,.15);box-shadow:0 13px 13px rgba(0,0,0,.15);} .ui-menu .ui-menu-item-wrapper{position:relative;padding:8px 16px;line-height:24px;} .ui-menu .ui-state-focus,.ui-menu .ui-state-active{margin:0;background:rgb(0,0,0);color:#fff;} .ui-overflow > ul{max-height:160px;} /* ----------------------------------------------------------------------------- ------------------------------- bootstrap select ------------------------------- ----------------------------------------------------------------------------- */ .o-input > .bootstrap-select.btn-group:not(.input-group-btn){height:40px;background:none;border:none;-webkit-box-sizing:border-box;box-sizing:border-box;line-height:20px;width:100%;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;float:none;margin:0;} .o-input > .bootstrap-select .dropdown-toggle{color:var(--form-color);background:var(--form-background);border-color:var(--form-border);border-style:solid;border-width:1px;height:40px;padding:0 24px 0 16px;-webkit-box-sizing:border-box;box-sizing:border-box;line-height:20px;width:100%;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border-radius:0;} .o-input > .bootstrap-select.disabled .dropdown-toggle{color:var(--form-color-disabled);background:var(--form-background-disabled);border-color:var(--form-border-disabled);} .o-input > .bootstrap-select.btn-group > .dropdown-menu,.o-input > .bootstrap-select .dropdown-toggle > span{font-size:15px;line-height:20px;} .o-input > .bootstrap-select .dropdown-toggle > span{white-space:nowrap;width:1px;} .o-input > .bootstrap-select .dropdown-toggle > span{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;} .o-input > .bootstrap-select.btn-group.open .btn.dropdown-toggle{outline:none;-webkit-box-shadow:none;box-shadow:none;outline:none!important;} .o-input > .bootstrap-select .dropdown-toggle.bs-placeholder:focus,.o-input > .bootstrap-select.open .dropdown-toggle.bs-placeholder{color:var(--form-color-focus);background:var(--form-background-focus);border-color:var(--form-border-focus);} .o-input > .bootstrap-select .dropdown-toggle.bs-placeholder:hover{color:var(--form-color-hover);background:var(--form-background-hover);border-color:var(--form-border-hover);} .o-input > .bootstrap-select .dropdown-toggle:focus{outline:none!important;} .o-input > .bootstrap-select .dropdown-menu{background-color:var(--form-background);border-color:var(--form-border);border-style:solid;border-width:1px;border-top-width:0;padding:0;margin:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none;background-clip:border-box;} .o-input > .bootstrap-select.dropup .dropdown-menu{border-bottom-width:0;border-top-width:1px;} .o-input > .bootstrap-select .dropdown-menu > li > a{color:var(--form-color);display:-webkit-box;display:-ms-flexbox;display:flex;padding:0 16px;clear:both;font-weight:normal;line-height:20px;white-space:nowrap;height:40px;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;} .o-input > .bootstrap-select .dropdown-menu > li > a:focus,.o-input > .bootstrap-select .dropdown-submenu:focus > a{color:var(--form-color-focus);background:var(--form-background-focus);background-repeat:no-repeat;-webkit-filter:none;filter:none;} .o-input > .bootstrap-select .dropdown-menu > li > a:hover,.o-input > .bootstrap-select .dropdown-submenu:hover > a{color:var(--form-color-hover);background:var(--form-background-hover);background-repeat:no-repeat;-webkit-filter:none;filter:none;} .o-input > .bootstrap-select .dropdown-menu > li.selected > a{color:var(--form-color-active);background:var(--form-background-active);background-repeat:no-repeat;-webkit-filter:none;filter:none;} .o-input > .bootstrap-select .dropdown-menu .divider{height:1px;margin:0;overflow:hidden;background-color:var(--form-background);border-bottom-color:var(--form-border);border-bottom-style:solid;border-bottom-width:1px;} .o-input > .bootstrap-select .dropdown-menu .dropdown-header{line-height:40px;padding:0 16px;background:var(--form-background-disabled);color:var(--form-color);} .o-input > .bootstrap-select.btn-group .dropdown-menu li a.opt{padding-left:32px;} .o-input > .bootstrap-select.btn-group .dropdown-toggle .bs-caret{position:absolute;top:0;right:0;bottom:0;width:24px;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;} .o-input > .bootstrap-select.btn-group .dropdown-toggle .caret{display:block;height:16px;width:19px;position:relative;top:auto;right:auto;bottom:auto;left:auto;margin:0;padding:0;vertical-align:top;border:none;background-position:0 0;background-repeat:no-repeat;background-size:cover;} .o-input > .bootstrap-select.btn-group .dropdown-toggle .caret{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMzMzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsOWExLDEsMCwwLDEtLjcxLS4yOWwtNC00YTEsMSwwLDAsMSwxLjQyLTEuNDJMMTQsNi41OWwzLjI5LTMuM2ExLDEsMCwxLDEsMS40MiwxLjQybC00LDRBMSwxLDAsMCwxLDE0LDlaIi8+PC9zdmc+');} .o-input > .bootstrap-select.btn-group.is-filter .dropdown-toggle .caret{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMDAwMDAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNNSw1SDFBMSwxLDAsMCwxLDEsM0g1QTEsMSwwLDAsMSw1LDVaIi8+PHBhdGggZD0iTTYsOUgxQTEsMSwwLDAsMSwxLDdINkExLDEsMCwwLDEsNiw5WiIvPjxwYXRoIGQ9Ik04LDEzSDFhMSwxLDAsMCwxLDAtMkg4YTEsMSwwLDAsMSwwLDJaIi8+PHBhdGggZD0iTTE0LDlhMSwxLDAsMCwxLS43MS0uMjlsLTQtNGExLDEsMCwwLDEsMS40Mi0xLjQyTDE0LDYuNTlsMy4yOS0zLjNhMSwxLDAsMSwxLDEuNDIsMS40MmwtNCw0QTEsMSwwLDAsMSwxNCw5WiIvPjwvc3ZnPg==');} .o-input > .bootstrap-select.btn-group.is-ordering .dropdown-toggle .caret{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMzMzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsMTVhMSwxLDAsMCwxLS43MS0uMjlsLTQtNGExLDEsMCwwLDEsMS40Mi0xLjQyTDE0LDEyLjU5bDMuMjktMy4zYTEsMSwwLDAsMSwxLjQyLDEuNDJsLTQsNEExLDEsMCwwLDEsMTQsMTVaIi8+PHBhdGggZD0iTTE4LDdhMSwxLDAsMCwxLS43MS0uMjlMMTQsMy40MWwtMy4yOSwzLjNBMSwxLDAsMCwxLDkuMjksNS4yOWw0LTRhMSwxLDAsMCwxLDEuNDIsMGw0LDRhMSwxLDAsMCwxLDAsMS40MkExLDEsMCwwLDEsMTgsN1oiLz48L3N2Zz4=');} .o-input > .bootstrap-select.btn-group.disabled .dropdown-toggle .caret{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjYWRhZGFkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsOWExLDEsMCwwLDEtLjcxLS4yOWwtNC00YTEsMSwwLDAsMSwxLjQyLTEuNDJMMTQsNi41OWwzLjI5LTMuM2ExLDEsMCwxLDEsMS40MiwxLjQybC00LDRBMSwxLDAsMCwxLDE0LDlaIi8+PC9zdmc+');} .o-input > .bootstrap-select.btn-group.is-filter.disabled .dropdown-toggle .caret{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjYWRhZGFkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNNSw1SDFBMSwxLDAsMCwxLDEsM0g1QTEsMSwwLDAsMSw1LDVaIi8+PHBhdGggZD0iTTYsOUgxQTEsMSwwLDAsMSwxLDdINkExLDEsMCwwLDEsNiw5WiIvPjxwYXRoIGQ9Ik04LDEzSDFhMSwxLDAsMCwxLDAtMkg4YTEsMSwwLDAsMSwwLDJaIi8+PHBhdGggZD0iTTE0LDlhMSwxLDAsMCwxLS43MS0uMjlsLTQtNGExLDEsMCwwLDEsMS40Mi0xLjQyTDE0LDYuNTlsMy4yOS0zLjNhMSwxLDAsMSwxLDEuNDIsMS40MmwtNCw0QTEsMSwwLDAsMSwxNCw5WiIvPjwvc3ZnPg==');} .o-input > .bootstrap-select.btn-group.is-ordering.disabled .dropdown-toggle .caret{background-image:url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjYWRhZGFkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE5IDE2Ij48cGF0aCBkPSJNMTQsMTVhMSwxLDAsMCwxLS43MS0uMjlsLTQtNGExLDEsMCwwLDEsMS40Mi0xLjQyTDE0LDEyLjU5bDMuMjktMy4zYTEsMSwwLDAsMSwxLjQyLDEuNDJsLTQsNEExLDEsMCwwLDEsMTQsMTVaIi8+PHBhdGggZD0iTTE4LDdhMSwxLDAsMCwxLS43MS0uMjlMMTQsMy40MWwtMy4yOSwzLjNBMSwxLDAsMCwxLDkuMjksNS4yOWw0LTRhMSwxLDAsMCwxLDEuNDIsMGw0LDRhMSwxLDAsMCwxLDAsMS40MkExLDEsMCwwLDEsMTgsN1oiLz48L3N2Zz4=');} /* ----------------------------------------------------------------------------- ------------------------------- noUi Slider ------------------------------------ ----------------------------------------------------------------------------- */ .o-input .noUi-target,.o-input .noUi-target *{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-ms-touch-action:none;touch-action:none;-ms-user-select:none;-moz-user-select:none;user-select:none;-moz-box-sizing:border-box;box-sizing:border-box} .o-input .noUi-target{position:relative;direction:ltr} .o-input .noUi-base{width:100%;height:100%;position:relative;z-index:1} .o-input .noUi-connect{position:absolute;right:0;top:0;left:0;bottom:0} .o-input .noUi-origin{position:absolute;height:0;width:0} .o-input .noUi-handle{position:relative;z-index:1} .o-input .noUi-state-tap .noUi-connect,.o-input .noUi-state-tap .noUi-origin{-webkit-transition:top .3s,right .3s,bottom .3s,left .3s;transition:top .3s,right .3s,bottom .3s,left .3s} .o-input .noUi-state-drag *{cursor:inherit!important} .o-input .noUi-base,.o-input .noUi-handle{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} .o-input .noUi-horizontal{height:18px} .o-input .noUi-horizontal .noUi-handle{width:34px;height:28px;left:-17px;top:-6px} .o-input .noUi-vertical{width:18px} .o-input .noUi-vertical .noUi-handle{width:28px;height:34px;left:-6px;top:-17px} .o-input .noUi-target{background:#FAFAFA;border-radius:4px;border:1px solid #D3D3D3;box-shadow:inset 0 1px 1px #F0F0F0,0 3px 6px -5px #BBB} .o-input .noUi-connect{background:#3FB8AF;border-radius:4px;box-shadow:inset 0 0 3px rgba(51,51,51,.45);-webkit-transition:background 450ms;transition:background 450ms} .o-input .noUi-draggable{cursor:ew-resize} .o-input .noUi-vertical .noUi-draggable{cursor:ns-resize} .o-input .noUi-handle{border:1px solid #D9D9D9;border-radius:3px;background:#FFF;cursor:default;box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #EBEBEB,0 3px 6px -3px #BBB} .o-input .noUi-active{box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #DDD,0 3px 6px -3px #BBB} .o-input .noUi-handle:after,.o-input .noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#E8E7E6;left:14px;top:6px} .o-input .noUi-handle:after{left:17px} .o-input .noUi-vertical .noUi-handle:after,.o-input .noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px} .o-input .noUi-vertical .noUi-handle:after{top:17px} .o-input [disabled] .noUi-connect{background:#B8B8B8} .o-input [disabled] .noUi-handle,.o-input [disabled].noUi-handle,.o-input [disabled].noUi-target{cursor:not-allowed} .o-input .noUi-pips,.o-input .noUi-pips *{-moz-box-sizing:border-box;box-sizing:border-box} .o-input .noUi-pips{position:absolute;color:#999} .o-input .noUi-value{position:absolute;white-space:nowrap;text-align:center} .o-input .noUi-value-sub{color:#ccc;font-size:10px} .o-input .noUi-marker{position:absolute;background:#CCC} .o-input .noUi-marker-large,.o-input .noUi-marker-sub{background:#AAA} .o-input .noUi-pips-horizontal{padding:10px 0;height:80px;top:100%;left:0;width:100%} .o-input .noUi-value-horizontal{-webkit-transform:translate3d(-50%,50%,0);transform:translate3d(-50%,50%,0)} .o-input .noUi-marker-horizontal.noUi-marker{margin-left:-1px;width:2px;height:5px} .o-input .noUi-marker-horizontal.noUi-marker-sub{height:10px} .o-input .noUi-marker-horizontal.noUi-marker-large{height:15px} .o-input .noUi-pips-vertical{padding:0 10px;height:100%;top:0;left:100%} .o-input .noUi-value-vertical{-webkit-transform:translate3d(0,50%,0);transform:translate3d(0,50%,0);padding-left:25px} .o-input .noUi-marker-vertical.noUi-marker{width:5px;height:2px;margin-top:-1px} .o-input .noUi-marker-vertical.noUi-marker-sub{width:10px} .o-input .noUi-marker-vertical.noUi-marker-large{width:15px} .o-input .noUi-tooltip{display:block;position:absolute;border:1px solid #D9D9D9;border-radius:3px;background:#fff;color:#000;padding:5px;text-align:center;white-space:nowrap} .o-input .noUi-horizontal .noUi-tooltip{-webkit-transform:translate(-50%,0);transform:translate(-50%,0);left:50%;bottom:120%} .o-input .noUi-vertical .noUi-tooltip{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);top:50%;right:120%} /* ----------------------------------------------------------------------------- ------------------------------- [type="checkbox"] ------------------------------ ----------------------------------------------------------------------------- */ .o-input-2 > input[type="checkbox"]:checked,.o-input-2 > input[type="checkbox"]:indeterminate{border-color:#000;background-color:#000;} .o-input-2 > input[type="checkbox"]:focus{border-color:#ddd;background-color:transparent;} .o-input-2 > input[type="checkbox"]:checked:focus,.o-input-2 > input[type="checkbox"]:indeterminate:focus{border-color:#000;background-color:#000;} .o-input-2 > input[type="checkbox"]{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;border-radius:0;} .o-input-2 > input[type="checkbox"]:checked{background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23fff%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");} .o-input-2.o-medium > input[type="checkbox"]:checked{background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2220%22%20height%3D%2215%22%20viewBox%3D%220%200%2020%2015%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23fff%22%20points%3D%2218.33%200.00%2C%206.67%2010.83%2C%201.67%206.67%2C%20-0.00%207.50%2C%206.67%2015.00%2C%2020.00%200.83%2C%2018.33%200.00%22%20%2F%3E%0A%3C%2Fsvg%3E%0A%0A");} .o-input-2.o-large > input[type="checkbox"]:checked{background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2220%22%20height%3D%2215%22%20viewBox%3D%220%200%2020%2015%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23fff%22%20points%3D%2218.33%200.00%2C%206.67%2010.83%2C%201.67%206.67%2C%20-0.00%207.50%2C%206.67%2015.00%2C%2020.00%200.83%2C%2018.33%200.00%22%20%2F%3E%0A%3C%2Fsvg%3E%0A%0A");} .o-input-2 > input[type="checkbox"]{display:inline-block;height:16px;width:16px;overflow:hidden;vertical-align:middle;-webkit-appearance:none;-moz-appearance:none;background-color:transparent;background-repeat:no-repeat;background-position:50% 50%;border:1px solid #ccc;-webkit-transition:.2s ease-in-out;-o-transition:.2s ease-in-out;transition:.2s ease-in-out;-webkit-transition-property:background-color,border;-o-transition-property:background-color,border;transition-property:background-color,border;} .o-input-2.o-medium > input[type="checkbox"]{height:24px;width:24px;} .o-input-2.o-large > input[type="checkbox"]{height:32px;width:32px;} .o-input-2 > input[type="checkbox"]:focus{outline:0;} /* ----------------------------------------------------------------------------- ------------------------------- [type="radio"] --------------------------------- ----------------------------------------------------------------------------- */ .o-input-2 > input[type="radio"]:checked,.o-input-2 > input[type="radio"]:indeterminate{border-color:#000;background-color:#000;} .o-input-2 > input[type="radio"]:focus{border-color:#ddd;background-color:transparent;} .o-input-2 > input[type="radio"]:checked:focus,.o-input-2 > input[type="radio"]:indeterminate:focus{border-color:#000;background-color:#000;} .o-input-2 > input[type="radio"]{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;border-radius:50%;cursor:pointer;} .o-input-2 > input[type="radio"]:checked{background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23fff%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%224%22%20%2F%3E%0A%3C%2Fsvg%3E");} .o-input-2.o-medium > input[type="radio"]:checked{background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23fff%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%226%22%20%2F%3E%0A%3C%2Fsvg%3E");} .o-input-2.o-large > input[type="radio"]:checked{background-image:url("data:image/svgxml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23fff%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%228%22%20%2F%3E%0A%3C%2Fsvg%3E");} .o-input-2 > input[type="radio"]{display:inline-block;height:16px;width:16px;overflow:hidden;vertical-align:middle;-webkit-appearance:none;-moz-appearance:none;background-color:transparent;background-repeat:no-repeat;background-position:50% 50%;border:1px solid #ddd;-webkit-transition:.2s ease-in-out;-o-transition:.2s ease-in-out;transition:.2s ease-in-out;-webkit-transition-property:background-color,border;-o-transition-property:background-color,border;transition-property:background-color,border;} .o-input-2.o-medium > input[type="radio"]{height:24px;width:24px;} .o-input-2.o-large > input[type="radio"]{height:32px;width:32px;} .o-input-2 > input[type="radio"]:focus{outline:0;} /* ----------------------------------------------------------------------------- ------------------------------- textarea --------------------------------------- ----------------------------------------------------------------------------- */ .o-field.o-textarea > .o-label{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;line-height:40px;} .o-input textarea{border:none;color:var(--form-color);background:var(--form-background);-webkit-box-shadow:inset 1px 0 0 var(--form-border),inset -1px 0 0 var(--form-border),inset 0 -1px 0 var(--form-border),inset 0 1px 0 var(--form-border);box-shadow:inset 1px 0 0 var(--form-border),inset -1px 0 0 var(--form-border),inset 0 -1px 0 var(--form-border),inset 0 1px 0 var(--form-border);-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;border-radius:0;overflow-y:hidden;width:100%!important;padding:10px 16px;-webkit-transition:.2s ease-in-out;-o-transition:.2s ease-in-out;transition:.2s ease-in-out;-webkit-transition-property:color,background-color,border;-o-transition-property:color,background-color,border;transition-property:color,background-color,border;vertical-align:top;overflow-x:auto;display:block;min-width:100%;} .o-input textarea:hover{color:var(--form-color-hover);background:var(--form-background-hover);-webkit-box-shadow:inset 1px 0 0 var(--form-border-hover),inset -1px 0 0 var(--form-border-hover),inset 0 -2px 0 var(--form-border-hover),inset 0 1px 0 var(--form-border-hover);box-shadow:inset 1px 0 0 var(--form-border-hover),inset -1px 0 0 var(--form-border-hover),inset 0 -2px 0 var(--form-border-hover),inset 0 1px 0 var(--form-border-hover);} .o-input textarea:focus{color:var(--form-color-focus);background:var(--form-background-focus);-webkit-box-shadow:inset 1px 0 0 var(--form-border-focus),inset -1px 0 0 var(--form-border-focus),inset 0 -2px 0 var(--form-border-focus),inset 0 1px 0 var(--form-border-focus);box-shadow:inset 1px 0 0 var(--form-border-focus),inset -1px 0 0 var(--form-border-focus),inset 0 -2px 0 var(--form-border-focus),inset 0 1px 0 var(--form-border-focus);} /* ----------------------------------------------------------------------------- ------------------------------- o-toolbar --------------------------------------- ----------------------------------------------------------------------------- */ .o-toolbar{display:-ms-grid;display:grid;-ms-grid-columns:(minmax(140px,200px))[6];grid-template-columns:repeat(6,minmax(140px,200px));grid-gap:16px;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;} .o-helper .o-toolbar{margin-right:24px;} @media (max-width:1199px){ .o-toolbar{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4,1fr);margin-right:0;} } @media (max-width:991px){ } @media (max-width:767px){ .o-toolbar{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr);} } @media (max-width:532px){ .o-toolbar{;margin-right:0;} } /* ---------------------------- item_x ----------------------- */ .o-input .item_x{display:-ms-grid;display:grid;list-style:none;position:relative;grid-auto-flow:dense;-ms-grid-rows:auto;grid-template-rows:auto;-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr);width:100%;grid-gap:16px;} .o-input .item_x .o-toolbar{-ms-grid-columns:(auto)[4];grid-template-columns:repeat(4,auto);} .o-input .item_x .cck-loading-more > div{display:-ms-grid;display:grid;-ms-grid-columns:(auto)[4];grid-gap:8px;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;grid-template-columns:repeat(4,auto);} .o-input.o-input-top{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding-top:10px;} /* ---------------------------- field-calendar (joomla) ----------------------- */ .o-input .field-calendar{width:100%;} .o-input .field-calendar .input-append{display:-ms-grid;display:grid;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-ms-grid-columns:1fr 32px;grid-template-columns:1fr 32px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;} .o-input .field-calendar .input-append button{border:none;background:none;cursor:pointer;} .o-input .field-calendar .input-append button{color:#000;} .o-input .field-calendar .input-append button:hover{color:#eee;} /* ---------------------------- remaining-chars ----------------------- */ .remaining-chars{position:absolute;top:0;font-size:10px;right:28px;color:#000;line-height:14px;} .o-tabs-right > .tab-content .remaining-chars{right:4px;} .o-tabs-right > .tab-content .o-help .remaining-chars{right:28px;} /* Extra small devices (portrait phones, less than 533px) (xs)*/ /* Container 1280 + padding 16*2 */ @media (max-width:1312px){ .remaining-chars{right:4px;} .o-help .remaining-chars{right:28px;} } @media (max-width:532px){ .o-help .remaining-chars{right:4px;} } /*------------------------------------------- ------------------- TABS -------------------- ---------------------------------------------*/ [class^="o-tabs"],[class^="o-tabs"] .nav.nav-tabs.cck-tabs{display:-ms-grid;display:grid;list-style:none;position:relative;grid-auto-flow:dense;-ms-grid-rows:auto;grid-template-rows:auto;-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr);-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;padding:0;margin:0;} [class^="o-tabs"]{grid-gap:16px;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs{grid-gap:8px;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs{-ms-grid-columns:(auto)[16];grid-template-columns:repeat(16,auto);margin-right:24px;} .o-tabs-bottom > .nav.nav-tabs.cck-tabs{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;} .o-tabs-left{-ms-grid-columns:auto 1fr;grid-template-columns:auto 1fr;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;} .o-tabs-left > .nav.nav-tabs.cck-tabs{margin-right:0;-ms-grid-columns:1fr;grid-template-columns:1fr;-ms-flex-line-pack:start;align-content:flex-start;} .o-tabs-right{-ms-grid-columns:1fr auto;grid-template-columns:1fr auto;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;} .o-tabs-right > .nav.nav-tabs.cck-tabs{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;margin-right:24px;-ms-grid-columns:1fr;grid-template-columns:1fr;-ms-flex-line-pack:start;align-content:flex-start;} [class^="o-tabs"] .tab-content{overflow:unset;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs::after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;} .o-tabs-left > .nav.nav-tabs.cck-tabs::after{bottom:0;left:auto;right:0;top:0;height:auto;width:1px;} .o-tabs-right > .nav.nav-tabs.cck-tabs::after{bottom:0;left:0;right:auto;top:0;height:auto;width:1px;} .o-tabs-bottom > .nav.nav-tabs.cck-tabs::after{content:"";position:absolute;bottom:auto;top:0;left:0;right:0;height:1px;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li > a{padding:0 16px;text-decoration:none;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;line-height:16px;min-height:40px;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-line-pack:center;align-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;text-align:center;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li a::after{border-width:1px;border-style:solid;content:'';display:block;position:absolute;z-index:-1;top:0;bottom:0;-webkit-transition:.2s ease-in-out;-o-transition:.2s ease-in-out;transition:.2s ease-in-out;-webkit-transition-property:background-color,border-color,height,right,-webkit-box-shadow;transition-property:background-color,border-color,height,right,-webkit-box-shadow;-o-transition-property:background-color,border-color,box-shadow,height,right;transition-property:background-color,border-color,box-shadow,height,right;transition-property:background-color,border-color,box-shadow,height,right,-webkit-box-shadow;left:0;right:0;z-index:-1;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs::after{background:var(--form-border);} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li > a{color:var(--form-color-disabled);} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li a::after{background-color:var(--form-background);border-color:var(--form-border);border-bottom-width:0;} .o-tabs-left > .nav.nav-tabs.cck-tabs > li a::after{background-color:var(--form-background);border-color:var(--form-border);border-bottom-width:1px;border-right-width:0;} .o-tabs-right > .nav.nav-tabs.cck-tabs > li a::after{background-color:var(--form-background);border-color:var(--form-border);border-bottom-width:1px;border-left-width:0;} .o-tabs-bottom > .nav.nav-tabs.cck-tabs > li a::after{background-color:var(--form-background);border-color:var(--form-border);border-bottom-width:1px;border-top-width:0;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li:hover a,[class^="o-tabs"] .nav.nav-tabs.cck-tabs > li.active a{color:var(--form-color);} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li:hover a::after,[class^="o-tabs"] .nav.nav-tabs.cck-tabs > li.active a::after{background-color:var(--form-background-hover);} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li.cck-tab-required > a{color:var(--form-color-required);} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li.cck-tab-required a::after{background-color:var(--form-background-required);border-color:var(--form-border-required);border-bottom-width:0;} .o-tabs-left > .nav.nav-tabs.cck-tabs > li.cck-tab-required a::after{background-color:var(--form-background-required);border-color:var(--form-border-required);border-bottom-width:1px;border-right-width:0;} .o-tabs-right > .nav.nav-tabs.cck-tabs > li.cck-tab-required a::after{background-color:var(--form-background-required);border-color:var(--form-border-required);border-bottom-width:1px;border-left-width:0;} .o-tabs-bottom > .nav.nav-tabs.cck-tabs > li.cck-tab-required a::after{background-color:var(--form-background-required);border-color:var(--form-border-required);border-bottom-width:1px;border-top-width:0;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li.cck-tab-required:hover a,[class^="o-tabs"] .nav.nav-tabs.cck-tabs > li.cck-tab-required.active a{color:var(--form-color-required-hover) !important;} [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li.cck-tab-required:hover a::after,[class^="o-tabs"] .nav.nav-tabs.cck-tabs > li.cck-tab-required.active a::after{background-color:var(--form-background-required-hover);} /* Container 1280 + padding 16*2 */ @media (max-width:1312px){ [class^="o-tabs"] .nav.nav-tabs.cck-tabs{margin-right:0;} .o-tabs > .nav.nav-tabs.cck-tabs,.o-tabs-bottom > .nav.nav-tabs.cck-tabs{-ms-grid-columns:(1fr)[11];grid-template-columns:repeat(11,1fr);-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;} .o-tabs > .nav.nav-tabs.cck-tabs > li a::after,.o-tabs-bottom > .nav.nav-tabs.cck-tabs > li a::after{border-bottom-width:1px;} .o-tabs-bottom .nav.nav-tabs.cck-tabs > li a::after{border-top-width:1px;} } /* Large devices (desktops, less than 1200px) (lg)*/ @media (max-width:1199px){ [class^="o-tabs"] .nav.nav-tabs.cck-tabs > li > a { padding: 0 4px;} } /* Medium devices (tablets, less than 992px) (md)*/ @media (min-width:992px){ .o-tabs-left > .nav.nav-tabs.cck-tabs{margin-top: 40px;} } @media (max-width:991px){ .o-tabs > .nav.nav-tabs.cck-tabs,.o-tabs-bottom > .nav.nav-tabs.cck-tabs{-ms-grid-columns:(1fr)[5];grid-template-columns:repeat(5,1fr);-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;} .o-tabs-left .o-tabs > .nav.nav-tabs.cck-tabs::after, .o-tabs-right .o-tabs > .nav.nav-tabs.cck-tabs::after{height: 0;} } /* Small devices (landscape phones, less than 768px) (sm)*/ @media (max-width:767px){ .o-tabs-left,.o-tabs-right{-ms-grid-columns:1fr;grid-template-columns:1fr;} .o-tabs-left > .nav.nav-tabs.cck-tabs,.o-tabs-right > .nav.nav-tabs.cck-tabs{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr);-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0;} .o-tabs-left > .nav.nav-tabs.cck-tabs > li a::after{border-right-width:1px;} .o-tabs-right > .nav.nav-tabs.cck-tabs > li a::after{border-left-width:1px;} [class^="o-tabs"] > .nav.nav-tabs.cck-tabs::after{display: none;} [class^="o-tabs"] [class^="o-tabs"] > .nav.nav-tabs.cck-tabs::after{bottom:auto;left:0;right:0;top:-8px;height:1px;width:auto; display: block;} } /* Extra small devices (portrait phones, less than 533px) (xs)*/ @media (max-width:532px){ [class^="o-tabs"] > .nav.nav-tabs.cck-tabs{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr);-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;} } /* TODO */ /*------------------------------------------- ------------------- TABS -------------------- ---------------------------------------------*/ /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-tabs- -------------------------------- ----------------------------------------------------------------------------- */ /* Normal devices (desktops, more than 1200px) (n)*/ @media (min-width:1200px){ .o-form-100 > [class^="o-tabs"]{-ms-grid-columns:calc( 100% - 16px ) 1fr;grid-template-columns:calc( 100% - 16px ) 1fr;} .o-form-99 > [class^="o-tabs"]{-ms-grid-columns:calc( 99% - 16px ) 1fr;grid-template-columns:calc( 99% - 16px ) 1fr;} .o-form-98 > [class^="o-tabs"]{-ms-grid-columns:calc( 98% - 16px ) 1fr;grid-template-columns:calc( 98% - 16px ) 1fr;} .o-form-97 > [class^="o-tabs"]{-ms-grid-columns:calc( 97% - 16px ) 1fr;grid-template-columns:calc( 97% - 16px ) 1fr;} .o-form-96 > [class^="o-tabs"]{-ms-grid-columns:calc( 96% - 16px ) 1fr;grid-template-columns:calc( 96% - 16px ) 1fr;} .o-form-95 > [class^="o-tabs"]{-ms-grid-columns:calc( 95% - 16px ) 1fr;grid-template-columns:calc( 95% - 16px ) 1fr;} .o-form-94 > [class^="o-tabs"]{-ms-grid-columns:calc( 94% - 16px ) 1fr;grid-template-columns:calc( 94% - 16px ) 1fr;} .o-form-93 > [class^="o-tabs"]{-ms-grid-columns:calc( 93% - 16px ) 1fr;grid-template-columns:calc( 93% - 16px ) 1fr;} .o-form-92 > [class^="o-tabs"]{-ms-grid-columns:calc( 92% - 16px ) 1fr;grid-template-columns:calc( 92% - 16px ) 1fr;} .o-form-91 > [class^="o-tabs"]{-ms-grid-columns:calc( 91% - 16px ) 1fr;grid-template-columns:calc( 91% - 16px ) 1fr;} .o-form-90 > [class^="o-tabs"]{-ms-grid-columns:calc( 90% - 16px ) 1fr;grid-template-columns:calc( 90% - 16px ) 1fr;} .o-form-89 > [class^="o-tabs"]{-ms-grid-columns:calc( 89% - 16px ) 1fr;grid-template-columns:calc( 89% - 16px ) 1fr;} .o-form-88 > [class^="o-tabs"]{-ms-grid-columns:calc( 88% - 16px ) 1fr;grid-template-columns:calc( 88% - 16px ) 1fr;} .o-form-87 > [class^="o-tabs"]{-ms-grid-columns:calc( 87% - 16px ) 1fr;grid-template-columns:calc( 87% - 16px ) 1fr;} .o-form-86 > [class^="o-tabs"]{-ms-grid-columns:calc( 86% - 16px ) 1fr;grid-template-columns:calc( 86% - 16px ) 1fr;} .o-form-85 > [class^="o-tabs"]{-ms-grid-columns:calc( 85% - 16px ) 1fr;grid-template-columns:calc( 85% - 16px ) 1fr;} .o-form-84 > [class^="o-tabs"]{-ms-grid-columns:calc( 84% - 16px ) 1fr;grid-template-columns:calc( 84% - 16px ) 1fr;} .o-form-83 > [class^="o-tabs"]{-ms-grid-columns:calc( 83% - 16px ) 1fr;grid-template-columns:calc( 83% - 16px ) 1fr;} .o-form-82 > [class^="o-tabs"]{-ms-grid-columns:calc( 82% - 16px ) 1fr;grid-template-columns:calc( 82% - 16px ) 1fr;} .o-form-81 > [class^="o-tabs"]{-ms-grid-columns:calc( 81% - 16px ) 1fr;grid-template-columns:calc( 81% - 16px ) 1fr;} .o-form-80 > [class^="o-tabs"]{-ms-grid-columns:calc( 80% - 16px ) 1fr;grid-template-columns:calc( 80% - 16px ) 1fr;} .o-form-79 > [class^="o-tabs"]{-ms-grid-columns:calc( 79% - 16px ) 1fr;grid-template-columns:calc( 79% - 16px ) 1fr;} .o-form-78 > [class^="o-tabs"]{-ms-grid-columns:calc( 78% - 16px ) 1fr;grid-template-columns:calc( 78% - 16px ) 1fr;} .o-form-77 > [class^="o-tabs"]{-ms-grid-columns:calc( 77% - 16px ) 1fr;grid-template-columns:calc( 77% - 16px ) 1fr;} .o-form-76 > [class^="o-tabs"]{-ms-grid-columns:calc( 76% - 16px ) 1fr;grid-template-columns:calc( 76% - 16px ) 1fr;} .o-form-75 > [class^="o-tabs"]{-ms-grid-columns:calc( 75% - 16px ) 1fr;grid-template-columns:calc( 75% - 16px ) 1fr;} .o-form-74 > [class^="o-tabs"]{-ms-grid-columns:calc( 74% - 16px ) 1fr;grid-template-columns:calc( 74% - 16px ) 1fr;} .o-form-73 > [class^="o-tabs"]{-ms-grid-columns:calc( 73% - 16px ) 1fr;grid-template-columns:calc( 73% - 16px ) 1fr;} .o-form-72 > [class^="o-tabs"]{-ms-grid-columns:calc( 72% - 16px ) 1fr;grid-template-columns:calc( 72% - 16px ) 1fr;} .o-form-71 > [class^="o-tabs"]{-ms-grid-columns:calc( 71% - 16px ) 1fr;grid-template-columns:calc( 71% - 16px ) 1fr;} .o-form-70 > [class^="o-tabs"]{-ms-grid-columns:calc( 70% - 16px ) 1fr;grid-template-columns:calc( 70% - 16px ) 1fr;} .o-form-69 > [class^="o-tabs"]{-ms-grid-columns:calc( 69% - 16px ) 1fr;grid-template-columns:calc( 69% - 16px ) 1fr;} .o-form-68 > [class^="o-tabs"]{-ms-grid-columns:calc( 68% - 16px ) 1fr;grid-template-columns:calc( 68% - 16px ) 1fr;} .o-form-67 > [class^="o-tabs"]{-ms-grid-columns:calc( 67% - 16px ) 1fr;grid-template-columns:calc( 67% - 16px ) 1fr;} .o-form-66 > [class^="o-tabs"]{-ms-grid-columns:calc( 66% - 16px ) 1fr;grid-template-columns:calc( 66% - 16px ) 1fr;} .o-form-65 > [class^="o-tabs"]{-ms-grid-columns:calc( 65% - 16px ) 1fr;grid-template-columns:calc( 65% - 16px ) 1fr;} .o-form-64 > [class^="o-tabs"]{-ms-grid-columns:calc( 64% - 16px ) 1fr;grid-template-columns:calc( 64% - 16px ) 1fr;} .o-form-63 > [class^="o-tabs"]{-ms-grid-columns:calc( 63% - 16px ) 1fr;grid-template-columns:calc( 63% - 16px ) 1fr;} .o-form-62 > [class^="o-tabs"]{-ms-grid-columns:calc( 62% - 16px ) 1fr;grid-template-columns:calc( 62% - 16px ) 1fr;} .o-form-61 > [class^="o-tabs"]{-ms-grid-columns:calc( 61% - 16px ) 1fr;grid-template-columns:calc( 61% - 16px ) 1fr;} .o-form-60 > [class^="o-tabs"]{-ms-grid-columns:calc( 60% - 16px ) 1fr;grid-template-columns:calc( 60% - 16px ) 1fr;} .o-form-59 > [class^="o-tabs"]{-ms-grid-columns:calc( 59% - 16px ) 1fr;grid-template-columns:calc( 59% - 16px ) 1fr;} .o-form-58 > [class^="o-tabs"]{-ms-grid-columns:calc( 58% - 16px ) 1fr;grid-template-columns:calc( 58% - 16px ) 1fr;} .o-form-57 > [class^="o-tabs"]{-ms-grid-columns:calc( 57% - 16px ) 1fr;grid-template-columns:calc( 57% - 16px ) 1fr;} .o-form-56 > [class^="o-tabs"]{-ms-grid-columns:calc( 56% - 16px ) 1fr;grid-template-columns:calc( 56% - 16px ) 1fr;} .o-form-55 > [class^="o-tabs"]{-ms-grid-columns:calc( 55% - 16px ) 1fr;grid-template-columns:calc( 55% - 16px ) 1fr;} .o-form-54 > [class^="o-tabs"]{-ms-grid-columns:calc( 54% - 16px ) 1fr;grid-template-columns:calc( 54% - 16px ) 1fr;} .o-form-53 > [class^="o-tabs"]{-ms-grid-columns:calc( 53% - 16px ) 1fr;grid-template-columns:calc( 53% - 16px ) 1fr;} .o-form-52 > [class^="o-tabs"]{-ms-grid-columns:calc( 52% - 16px ) 1fr;grid-template-columns:calc( 52% - 16px ) 1fr;} .o-form-51 > [class^="o-tabs"]{-ms-grid-columns:calc( 51% - 16px ) 1fr;grid-template-columns:calc( 51% - 16px ) 1fr;} .o-form-50 > [class^="o-tabs"]{-ms-grid-columns:calc( 50% - 16px ) 1fr;grid-template-columns:calc( 50% - 16px ) 1fr;} .o-form-49 > [class^="o-tabs"]{-ms-grid-columns:calc( 49% - 16px ) 1fr;grid-template-columns:calc( 49% - 16px ) 1fr;} .o-form-48 > [class^="o-tabs"]{-ms-grid-columns:calc( 48% - 16px ) 1fr;grid-template-columns:calc( 48% - 16px ) 1fr;} .o-form-47 > [class^="o-tabs"]{-ms-grid-columns:calc( 47% - 16px ) 1fr;grid-template-columns:calc( 47% - 16px ) 1fr;} .o-form-46 > [class^="o-tabs"]{-ms-grid-columns:calc( 46% - 16px ) 1fr;grid-template-columns:calc( 46% - 16px ) 1fr;} .o-form-45 > [class^="o-tabs"]{-ms-grid-columns:calc( 45% - 16px ) 1fr;grid-template-columns:calc( 45% - 16px ) 1fr;} .o-form-44 > [class^="o-tabs"]{-ms-grid-columns:calc( 44% - 16px ) 1fr;grid-template-columns:calc( 44% - 16px ) 1fr;} .o-form-43 > [class^="o-tabs"]{-ms-grid-columns:calc( 43% - 16px ) 1fr;grid-template-columns:calc( 43% - 16px ) 1fr;} .o-form-42 > [class^="o-tabs"]{-ms-grid-columns:calc( 42% - 16px ) 1fr;grid-template-columns:calc( 42% - 16px ) 1fr;} .o-form-41 > [class^="o-tabs"]{-ms-grid-columns:calc( 41% - 16px ) 1fr;grid-template-columns:calc( 41% - 16px ) 1fr;} .o-form-40 > [class^="o-tabs"]{-ms-grid-columns:calc( 40% - 16px ) 1fr;grid-template-columns:calc( 40% - 16px ) 1fr;} .o-form-39 > [class^="o-tabs"]{-ms-grid-columns:calc( 39% - 16px ) 1fr;grid-template-columns:calc( 39% - 16px ) 1fr;} .o-form-38 > [class^="o-tabs"]{-ms-grid-columns:calc( 38% - 16px ) 1fr;grid-template-columns:calc( 38% - 16px ) 1fr;} .o-form-37 > [class^="o-tabs"]{-ms-grid-columns:calc( 37% - 16px ) 1fr;grid-template-columns:calc( 37% - 16px ) 1fr;} .o-form-36 > [class^="o-tabs"]{-ms-grid-columns:calc( 36% - 16px ) 1fr;grid-template-columns:calc( 36% - 16px ) 1fr;} .o-form-35 > [class^="o-tabs"]{-ms-grid-columns:calc( 35% - 16px ) 1fr;grid-template-columns:calc( 35% - 16px ) 1fr;} .o-form-34 > [class^="o-tabs"]{-ms-grid-columns:calc( 34% - 16px ) 1fr;grid-template-columns:calc( 34% - 16px ) 1fr;} .o-form-33 > [class^="o-tabs"]{-ms-grid-columns:calc( 33% - 16px ) 1fr;grid-template-columns:calc( 33% - 16px ) 1fr;} .o-form-32 > [class^="o-tabs"]{-ms-grid-columns:calc( 32% - 16px ) 1fr;grid-template-columns:calc( 32% - 16px ) 1fr;} .o-form-31 > [class^="o-tabs"]{-ms-grid-columns:calc( 31% - 16px ) 1fr;grid-template-columns:calc( 31% - 16px ) 1fr;} .o-form-30 > [class^="o-tabs"]{-ms-grid-columns:calc( 30% - 16px ) 1fr;grid-template-columns:calc( 30% - 16px ) 1fr;} .o-form-29 > [class^="o-tabs"]{-ms-grid-columns:calc( 29% - 16px ) 1fr;grid-template-columns:calc( 29% - 16px ) 1fr;} .o-form-28 > [class^="o-tabs"]{-ms-grid-columns:calc( 28% - 16px ) 1fr;grid-template-columns:calc( 28% - 16px ) 1fr;} .o-form-27 > [class^="o-tabs"]{-ms-grid-columns:calc( 27% - 16px ) 1fr;grid-template-columns:calc( 27% - 16px ) 1fr;} .o-form-26 > [class^="o-tabs"]{-ms-grid-columns:calc( 26% - 16px ) 1fr;grid-template-columns:calc( 26% - 16px ) 1fr;} .o-form-25 > [class^="o-tabs"]{-ms-grid-columns:calc( 25% - 16px ) 1fr;grid-template-columns:calc( 25% - 16px ) 1fr;} .o-form-24 > [class^="o-tabs"]{-ms-grid-columns:calc( 24% - 16px ) 1fr;grid-template-columns:calc( 24% - 16px ) 1fr;} .o-form-23 > [class^="o-tabs"]{-ms-grid-columns:calc( 23% - 16px ) 1fr;grid-template-columns:calc( 23% - 16px ) 1fr;} .o-form-22 > [class^="o-tabs"]{-ms-grid-columns:calc( 22% - 16px ) 1fr;grid-template-columns:calc( 22% - 16px ) 1fr;} .o-form-21 > [class^="o-tabs"]{-ms-grid-columns:calc( 21% - 16px ) 1fr;grid-template-columns:calc( 21% - 16px ) 1fr;} .o-form-20 > [class^="o-tabs"]{-ms-grid-columns:calc( 20% - 16px ) 1fr;grid-template-columns:calc( 20% - 16px ) 1fr;} .o-form-19 > [class^="o-tabs"]{-ms-grid-columns:calc( 19% - 16px ) 1fr;grid-template-columns:calc( 19% - 16px ) 1fr;} .o-form-18 > [class^="o-tabs"]{-ms-grid-columns:calc( 18% - 16px ) 1fr;grid-template-columns:calc( 18% - 16px ) 1fr;} .o-form-17 > [class^="o-tabs"]{-ms-grid-columns:calc( 17% - 16px ) 1fr;grid-template-columns:calc( 17% - 16px ) 1fr;} .o-form-16 > [class^="o-tabs"]{-ms-grid-columns:calc( 16% - 16px ) 1fr;grid-template-columns:calc( 16% - 16px ) 1fr;} .o-form-15 > [class^="o-tabs"]{-ms-grid-columns:calc( 15% - 16px ) 1fr;grid-template-columns:calc( 15% - 16px ) 1fr;} .o-form-14 > [class^="o-tabs"]{-ms-grid-columns:calc( 14% - 16px ) 1fr;grid-template-columns:calc( 14% - 16px ) 1fr;} .o-form-13 > [class^="o-tabs"]{-ms-grid-columns:calc( 13% - 16px ) 1fr;grid-template-columns:calc( 13% - 16px ) 1fr;} .o-form-12 > [class^="o-tabs"]{-ms-grid-columns:calc( 12% - 16px ) 1fr;grid-template-columns:calc( 12% - 16px ) 1fr;} .o-form-11 > [class^="o-tabs"]{-ms-grid-columns:calc( 11% - 16px ) 1fr;grid-template-columns:calc( 11% - 16px ) 1fr;} .o-form-10 > [class^="o-tabs"]{-ms-grid-columns:calc( 10% - 16px ) 1fr;grid-template-columns:calc( 10% - 16px ) 1fr;} .o-form-9 > [class^="o-tabs"]{-ms-grid-columns:calc( 9% - 16px ) 1fr;grid-template-columns:calc( 9% - 16px ) 1fr;} .o-form-8 > [class^="o-tabs"]{-ms-grid-columns:calc( 8% - 16px ) 1fr;grid-template-columns:calc( 8% - 16px ) 1fr;} .o-form-7 > [class^="o-tabs"]{-ms-grid-columns:calc( 7% - 16px ) 1fr;grid-template-columns:calc( 7% - 16px ) 1fr;} .o-form-6 > [class^="o-tabs"]{-ms-grid-columns:calc( 6% - 16px ) 1fr;grid-template-columns:calc( 6% - 16px ) 1fr;} .o-form-5 > [class^="o-tabs"]{-ms-grid-columns:calc( 5% - 16px ) 1fr;grid-template-columns:calc( 5% - 16px ) 1fr;} .o-form-4 > [class^="o-tabs"]{-ms-grid-columns:calc( 4% - 16px ) 1fr;grid-template-columns:calc( 4% - 16px ) 1fr;} .o-form-3 > [class^="o-tabs"]{-ms-grid-columns:calc( 3% - 16px ) 1fr;grid-template-columns:calc( 3% - 16px ) 1fr;} .o-form-2 > [class^="o-tabs"]{-ms-grid-columns:calc( 2% - 16px ) 1fr;grid-template-columns:calc( 2% - 16px ) 1fr;} .o-form-1 > [class^="o-tabs"]{-ms-grid-columns:calc( 1% - 16px ) 1fr;grid-template-columns:calc( 1% - 16px ) 1fr;} } /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-fields- -------------------------------- ----------------------------------------------------------------------------- */ [class*="o-form-"] > .o-field{display:-ms-grid;display:grid;list-style:none;position:relative;} [class*="o-form-"] > .o-field > .o-input:first-child{-ms-grid-column-span:2;grid-column:span 2;} .o-field[data-access]::before { content: ""; position: absolute; left: 0; top: 30px; width: 10px; background: #323232; height: 2px; } .o-field[data-access]::after { opacity: 0; content: attr(data-access); position: absolute; left: 0; font-size: 9px; text-transform: uppercase; line-height: 12px; padding: 0px 3px; color: #fff; background: #323232; top: 30px; -webkit-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease; letter-spacing: 1px; } .o-field[data-access]:hover::after { opacity: 1; } /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-fields- -------------------------------- ----------------------------------------------------------------------------- */ .o-form-1 > .o-field{-ms-grid-columns:1% auto;grid-template-columns:1% auto;} .o-form-2 > .o-field{-ms-grid-columns:2% auto;grid-template-columns:2% auto;} .o-form-3 > .o-field{-ms-grid-columns:3% auto;grid-template-columns:3% auto;} .o-form-4 > .o-field{-ms-grid-columns:4% auto;grid-template-columns:4% auto;} .o-form-5 > .o-field{-ms-grid-columns:5% auto;grid-template-columns:5% auto;} .o-form-6 > .o-field{-ms-grid-columns:6% auto;grid-template-columns:6% auto;} .o-form-7 > .o-field{-ms-grid-columns:7% auto;grid-template-columns:7% auto;} .o-form-8 > .o-field{-ms-grid-columns:8% auto;grid-template-columns:8% auto;} .o-form-9 > .o-field{-ms-grid-columns:9% auto;grid-template-columns:9% auto;} .o-form-10 > .o-field{-ms-grid-columns:10% auto;grid-template-columns:10% auto;} .o-form-11 > .o-field{-ms-grid-columns:11% auto;grid-template-columns:11% auto;} .o-form-12 > .o-field{-ms-grid-columns:12% auto;grid-template-columns:12% auto;} .o-form-13 > .o-field{-ms-grid-columns:13% auto;grid-template-columns:13% auto;} .o-form-14 > .o-field{-ms-grid-columns:14% auto;grid-template-columns:14% auto;} .o-form-15 > .o-field{-ms-grid-columns:15% auto;grid-template-columns:15% auto;} .o-form-16 > .o-field{-ms-grid-columns:16% auto;grid-template-columns:16% auto;} .o-form-17 > .o-field{-ms-grid-columns:17% auto;grid-template-columns:17% auto;} .o-form-18 > .o-field{-ms-grid-columns:18% auto;grid-template-columns:18% auto;} .o-form-19 > .o-field{-ms-grid-columns:19% auto;grid-template-columns:19% auto;} .o-form-20 > .o-field{-ms-grid-columns:20% auto;grid-template-columns:20% auto;} .o-form-21 > .o-field{-ms-grid-columns:21% auto;grid-template-columns:21% auto;} .o-form-22 > .o-field{-ms-grid-columns:22% auto;grid-template-columns:22% auto;} .o-form-23 > .o-field{-ms-grid-columns:23% auto;grid-template-columns:23% auto;} .o-form-24 > .o-field{-ms-grid-columns:24% auto;grid-template-columns:24% auto;} .o-form-25 > .o-field{-ms-grid-columns:25% auto;grid-template-columns:25% auto;} .o-form-26 > .o-field{-ms-grid-columns:26% auto;grid-template-columns:26% auto;} .o-form-27 > .o-field{-ms-grid-columns:27% auto;grid-template-columns:27% auto;} .o-form-28 > .o-field{-ms-grid-columns:28% auto;grid-template-columns:28% auto;} .o-form-29 > .o-field{-ms-grid-columns:29% auto;grid-template-columns:29% auto;} .o-form-30 > .o-field{-ms-grid-columns:30% auto;grid-template-columns:30% auto;} .o-form-31 > .o-field{-ms-grid-columns:31% auto;grid-template-columns:31% auto;} .o-form-32 > .o-field{-ms-grid-columns:32% auto;grid-template-columns:32% auto;} .o-form-33 > .o-field{-ms-grid-columns:33% auto;grid-template-columns:33% auto;} .o-form-34 > .o-field{-ms-grid-columns:34% auto;grid-template-columns:34% auto;} .o-form-35 > .o-field{-ms-grid-columns:35% auto;grid-template-columns:35% auto;} .o-form-36 > .o-field{-ms-grid-columns:36% auto;grid-template-columns:36% auto;} .o-form-37 > .o-field{-ms-grid-columns:37% auto;grid-template-columns:37% auto;} .o-form-38 > .o-field{-ms-grid-columns:38% auto;grid-template-columns:38% auto;} .o-form-39 > .o-field{-ms-grid-columns:39% auto;grid-template-columns:39% auto;} .o-form-40 > .o-field{-ms-grid-columns:40% auto;grid-template-columns:40% auto;} .o-form-41 > .o-field{-ms-grid-columns:41% auto;grid-template-columns:41% auto;} .o-form-42 > .o-field{-ms-grid-columns:42% auto;grid-template-columns:42% auto;} .o-form-43 > .o-field{-ms-grid-columns:43% auto;grid-template-columns:43% auto;} .o-form-44 > .o-field{-ms-grid-columns:44% auto;grid-template-columns:44% auto;} .o-form-45 > .o-field{-ms-grid-columns:45% auto;grid-template-columns:45% auto;} .o-form-46 > .o-field{-ms-grid-columns:46% auto;grid-template-columns:46% auto;} .o-form-47 > .o-field{-ms-grid-columns:47% auto;grid-template-columns:47% auto;} .o-form-48 > .o-field{-ms-grid-columns:48% auto;grid-template-columns:48% auto;} .o-form-49 > .o-field{-ms-grid-columns:49% auto;grid-template-columns:49% auto;} .o-form-50 > .o-field{-ms-grid-columns:50% auto;grid-template-columns:50% auto;} .o-form-51 > .o-field{-ms-grid-columns:51% auto;grid-template-columns:51% auto;} .o-form-52 > .o-field{-ms-grid-columns:52% auto;grid-template-columns:52% auto;} .o-form-53 > .o-field{-ms-grid-columns:53% auto;grid-template-columns:53% auto;} .o-form-54 > .o-field{-ms-grid-columns:54% auto;grid-template-columns:54% auto;} .o-form-55 > .o-field{-ms-grid-columns:55% auto;grid-template-columns:55% auto;} .o-form-56 > .o-field{-ms-grid-columns:56% auto;grid-template-columns:56% auto;} .o-form-57 > .o-field{-ms-grid-columns:57% auto;grid-template-columns:57% auto;} .o-form-58 > .o-field{-ms-grid-columns:58% auto;grid-template-columns:58% auto;} .o-form-59 > .o-field{-ms-grid-columns:59% auto;grid-template-columns:59% auto;} .o-form-60 > .o-field{-ms-grid-columns:60% auto;grid-template-columns:60% auto;} .o-form-61 > .o-field{-ms-grid-columns:61% auto;grid-template-columns:61% auto;} .o-form-62 > .o-field{-ms-grid-columns:62% auto;grid-template-columns:62% auto;} .o-form-63 > .o-field{-ms-grid-columns:63% auto;grid-template-columns:63% auto;} .o-form-64 > .o-field{-ms-grid-columns:64% auto;grid-template-columns:64% auto;} .o-form-65 > .o-field{-ms-grid-columns:65% auto;grid-template-columns:65% auto;} .o-form-66 > .o-field{-ms-grid-columns:66% auto;grid-template-columns:66% auto;} .o-form-67 > .o-field{-ms-grid-columns:67% auto;grid-template-columns:67% auto;} .o-form-68 > .o-field{-ms-grid-columns:68% auto;grid-template-columns:68% auto;} .o-form-69 > .o-field{-ms-grid-columns:69% auto;grid-template-columns:69% auto;} .o-form-70 > .o-field{-ms-grid-columns:70% auto;grid-template-columns:70% auto;} .o-form-71 > .o-field{-ms-grid-columns:71% auto;grid-template-columns:71% auto;} .o-form-72 > .o-field{-ms-grid-columns:72% auto;grid-template-columns:72% auto;} .o-form-73 > .o-field{-ms-grid-columns:73% auto;grid-template-columns:73% auto;} .o-form-74 > .o-field{-ms-grid-columns:74% auto;grid-template-columns:74% auto;} .o-form-75 > .o-field{-ms-grid-columns:75% auto;grid-template-columns:75% auto;} .o-form-76 > .o-field{-ms-grid-columns:76% auto;grid-template-columns:76% auto;} .o-form-77 > .o-field{-ms-grid-columns:77% auto;grid-template-columns:77% auto;} .o-form-78 > .o-field{-ms-grid-columns:78% auto;grid-template-columns:78% auto;} .o-form-79 > .o-field{-ms-grid-columns:79% auto;grid-template-columns:79% auto;} .o-form-80 > .o-field{-ms-grid-columns:80% auto;grid-template-columns:80% auto;} .o-form-81 > .o-field{-ms-grid-columns:81% auto;grid-template-columns:81% auto;} .o-form-82 > .o-field{-ms-grid-columns:82% auto;grid-template-columns:82% auto;} .o-form-83 > .o-field{-ms-grid-columns:83% auto;grid-template-columns:83% auto;} .o-form-84 > .o-field{-ms-grid-columns:84% auto;grid-template-columns:84% auto;} .o-form-85 > .o-field{-ms-grid-columns:85% auto;grid-template-columns:85% auto;} .o-form-86 > .o-field{-ms-grid-columns:86% auto;grid-template-columns:86% auto;} .o-form-87 > .o-field{-ms-grid-columns:87% auto;grid-template-columns:87% auto;} .o-form-88 > .o-field{-ms-grid-columns:88% auto;grid-template-columns:88% auto;} .o-form-89 > .o-field{-ms-grid-columns:89% auto;grid-template-columns:89% auto;} .o-form-90 > .o-field{-ms-grid-columns:90% auto;grid-template-columns:90% auto;} .o-form-91 > .o-field{-ms-grid-columns:91% auto;grid-template-columns:91% auto;} .o-form-92 > .o-field{-ms-grid-columns:92% auto;grid-template-columns:92% auto;} .o-form-93 > .o-field{-ms-grid-columns:93% auto;grid-template-columns:93% auto;} .o-form-94 > .o-field{-ms-grid-columns:94% auto;grid-template-columns:94% auto;} .o-form-95 > .o-field{-ms-grid-columns:95% auto;grid-template-columns:95% auto;} .o-form-96 > .o-field{-ms-grid-columns:96% auto;grid-template-columns:96% auto;} .o-form-97 > .o-field{-ms-grid-columns:97% auto;grid-template-columns:97% auto;} .o-form-98 > .o-field{-ms-grid-columns:98% auto;grid-template-columns:98% auto;} .o-form-99 > .o-field{-ms-grid-columns:99% auto;grid-template-columns:99% auto;} .o-form-100 > .o-field{-ms-grid-columns:100%;grid-template-columns:100%;} .o-grid.o-form-100 > .o-field > .o-input:first-child{-ms-grid-column-span:1;grid-column:span 1;} /* Normal devices (desktops, more than 1200px) (n)*/ @media (min-width:1200px){ .o-form-1\@n > .o-field{-ms-grid-columns:1% auto;grid-template-columns:1% auto;} .o-form-2\@n > .o-field{-ms-grid-columns:2% auto;grid-template-columns:2% auto;} .o-form-3\@n > .o-field{-ms-grid-columns:3% auto;grid-template-columns:3% auto;} .o-form-4\@n > .o-field{-ms-grid-columns:4% auto;grid-template-columns:4% auto;} .o-form-5\@n > .o-field{-ms-grid-columns:5% auto;grid-template-columns:5% auto;} .o-form-6\@n > .o-field{-ms-grid-columns:6% auto;grid-template-columns:6% auto;} .o-form-7\@n > .o-field{-ms-grid-columns:7% auto;grid-template-columns:7% auto;} .o-form-8\@n > .o-field{-ms-grid-columns:8% auto;grid-template-columns:8% auto;} .o-form-9\@n > .o-field{-ms-grid-columns:9% auto;grid-template-columns:9% auto;} .o-form-10\@n > .o-field{-ms-grid-columns:10% auto;grid-template-columns:10% auto;} .o-form-11\@n > .o-field{-ms-grid-columns:11% auto;grid-template-columns:11% auto;} .o-form-12\@n > .o-field{-ms-grid-columns:12% auto;grid-template-columns:12% auto;} .o-form-13\@n > .o-field{-ms-grid-columns:13% auto;grid-template-columns:13% auto;} .o-form-14\@n > .o-field{-ms-grid-columns:14% auto;grid-template-columns:14% auto;} .o-form-15\@n > .o-field{-ms-grid-columns:15% auto;grid-template-columns:15% auto;} .o-form-16\@n > .o-field{-ms-grid-columns:16% auto;grid-template-columns:16% auto;} .o-form-17\@n > .o-field{-ms-grid-columns:17% auto;grid-template-columns:17% auto;} .o-form-18\@n > .o-field{-ms-grid-columns:18% auto;grid-template-columns:18% auto;} .o-form-19\@n > .o-field{-ms-grid-columns:19% auto;grid-template-columns:19% auto;} .o-form-20\@n > .o-field{-ms-grid-columns:20% auto;grid-template-columns:20% auto;} .o-form-21\@n > .o-field{-ms-grid-columns:21% auto;grid-template-columns:21% auto;} .o-form-22\@n > .o-field{-ms-grid-columns:22% auto;grid-template-columns:22% auto;} .o-form-23\@n > .o-field{-ms-grid-columns:23% auto;grid-template-columns:23% auto;} .o-form-24\@n > .o-field{-ms-grid-columns:24% auto;grid-template-columns:24% auto;} .o-form-25\@n > .o-field{-ms-grid-columns:25% auto;grid-template-columns:25% auto;} .o-form-26\@n > .o-field{-ms-grid-columns:26% auto;grid-template-columns:26% auto;} .o-form-27\@n > .o-field{-ms-grid-columns:27% auto;grid-template-columns:27% auto;} .o-form-28\@n > .o-field{-ms-grid-columns:28% auto;grid-template-columns:28% auto;} .o-form-29\@n > .o-field{-ms-grid-columns:29% auto;grid-template-columns:29% auto;} .o-form-30\@n > .o-field{-ms-grid-columns:30% auto;grid-template-columns:30% auto;} .o-form-31\@n > .o-field{-ms-grid-columns:31% auto;grid-template-columns:31% auto;} .o-form-32\@n > .o-field{-ms-grid-columns:32% auto;grid-template-columns:32% auto;} .o-form-33\@n > .o-field{-ms-grid-columns:33% auto;grid-template-columns:33% auto;} .o-form-34\@n > .o-field{-ms-grid-columns:34% auto;grid-template-columns:34% auto;} .o-form-35\@n > .o-field{-ms-grid-columns:35% auto;grid-template-columns:35% auto;} .o-form-36\@n > .o-field{-ms-grid-columns:36% auto;grid-template-columns:36% auto;} .o-form-37\@n > .o-field{-ms-grid-columns:37% auto;grid-template-columns:37% auto;} .o-form-38\@n > .o-field{-ms-grid-columns:38% auto;grid-template-columns:38% auto;} .o-form-39\@n > .o-field{-ms-grid-columns:39% auto;grid-template-columns:39% auto;} .o-form-40\@n > .o-field{-ms-grid-columns:40% auto;grid-template-columns:40% auto;} .o-form-41\@n > .o-field{-ms-grid-columns:41% auto;grid-template-columns:41% auto;} .o-form-42\@n > .o-field{-ms-grid-columns:42% auto;grid-template-columns:42% auto;} .o-form-43\@n > .o-field{-ms-grid-columns:43% auto;grid-template-columns:43% auto;} .o-form-44\@n > .o-field{-ms-grid-columns:44% auto;grid-template-columns:44% auto;} .o-form-45\@n > .o-field{-ms-grid-columns:45% auto;grid-template-columns:45% auto;} .o-form-46\@n > .o-field{-ms-grid-columns:46% auto;grid-template-columns:46% auto;} .o-form-47\@n > .o-field{-ms-grid-columns:47% auto;grid-template-columns:47% auto;} .o-form-48\@n > .o-field{-ms-grid-columns:48% auto;grid-template-columns:48% auto;} .o-form-49\@n > .o-field{-ms-grid-columns:49% auto;grid-template-columns:49% auto;} .o-form-50\@n > .o-field{-ms-grid-columns:50% auto;grid-template-columns:50% auto;} .o-form-51\@n > .o-field{-ms-grid-columns:51% auto;grid-template-columns:51% auto;} .o-form-52\@n > .o-field{-ms-grid-columns:52% auto;grid-template-columns:52% auto;} .o-form-53\@n > .o-field{-ms-grid-columns:53% auto;grid-template-columns:53% auto;} .o-form-54\@n > .o-field{-ms-grid-columns:54% auto;grid-template-columns:54% auto;} .o-form-55\@n > .o-field{-ms-grid-columns:55% auto;grid-template-columns:55% auto;} .o-form-56\@n > .o-field{-ms-grid-columns:56% auto;grid-template-columns:56% auto;} .o-form-57\@n > .o-field{-ms-grid-columns:57% auto;grid-template-columns:57% auto;} .o-form-58\@n > .o-field{-ms-grid-columns:58% auto;grid-template-columns:58% auto;} .o-form-59\@n > .o-field{-ms-grid-columns:59% auto;grid-template-columns:59% auto;} .o-form-60\@n > .o-field{-ms-grid-columns:60% auto;grid-template-columns:60% auto;} .o-form-61\@n > .o-field{-ms-grid-columns:61% auto;grid-template-columns:61% auto;} .o-form-62\@n > .o-field{-ms-grid-columns:62% auto;grid-template-columns:62% auto;} .o-form-63\@n > .o-field{-ms-grid-columns:63% auto;grid-template-columns:63% auto;} .o-form-64\@n > .o-field{-ms-grid-columns:64% auto;grid-template-columns:64% auto;} .o-form-65\@n > .o-field{-ms-grid-columns:65% auto;grid-template-columns:65% auto;} .o-form-66\@n > .o-field{-ms-grid-columns:66% auto;grid-template-columns:66% auto;} .o-form-67\@n > .o-field{-ms-grid-columns:67% auto;grid-template-columns:67% auto;} .o-form-68\@n > .o-field{-ms-grid-columns:68% auto;grid-template-columns:68% auto;} .o-form-69\@n > .o-field{-ms-grid-columns:69% auto;grid-template-columns:69% auto;} .o-form-70\@n > .o-field{-ms-grid-columns:70% auto;grid-template-columns:70% auto;} .o-form-71\@n > .o-field{-ms-grid-columns:71% auto;grid-template-columns:71% auto;} .o-form-72\@n > .o-field{-ms-grid-columns:72% auto;grid-template-columns:72% auto;} .o-form-73\@n > .o-field{-ms-grid-columns:73% auto;grid-template-columns:73% auto;} .o-form-74\@n > .o-field{-ms-grid-columns:74% auto;grid-template-columns:74% auto;} .o-form-75\@n > .o-field{-ms-grid-columns:75% auto;grid-template-columns:75% auto;} .o-form-76\@n > .o-field{-ms-grid-columns:76% auto;grid-template-columns:76% auto;} .o-form-77\@n > .o-field{-ms-grid-columns:77% auto;grid-template-columns:77% auto;} .o-form-78\@n > .o-field{-ms-grid-columns:78% auto;grid-template-columns:78% auto;} .o-form-79\@n > .o-field{-ms-grid-columns:79% auto;grid-template-columns:79% auto;} .o-form-80\@n > .o-field{-ms-grid-columns:80% auto;grid-template-columns:80% auto;} .o-form-81\@n > .o-field{-ms-grid-columns:81% auto;grid-template-columns:81% auto;} .o-form-82\@n > .o-field{-ms-grid-columns:82% auto;grid-template-columns:82% auto;} .o-form-83\@n > .o-field{-ms-grid-columns:83% auto;grid-template-columns:83% auto;} .o-form-84\@n > .o-field{-ms-grid-columns:84% auto;grid-template-columns:84% auto;} .o-form-85\@n > .o-field{-ms-grid-columns:85% auto;grid-template-columns:85% auto;} .o-form-86\@n > .o-field{-ms-grid-columns:86% auto;grid-template-columns:86% auto;} .o-form-87\@n > .o-field{-ms-grid-columns:87% auto;grid-template-columns:87% auto;} .o-form-88\@n > .o-field{-ms-grid-columns:88% auto;grid-template-columns:88% auto;} .o-form-89\@n > .o-field{-ms-grid-columns:89% auto;grid-template-columns:89% auto;} .o-form-90\@n > .o-field{-ms-grid-columns:90% auto;grid-template-columns:90% auto;} .o-form-91\@n > .o-field{-ms-grid-columns:91% auto;grid-template-columns:91% auto;} .o-form-92\@n > .o-field{-ms-grid-columns:92% auto;grid-template-columns:92% auto;} .o-form-93\@n > .o-field{-ms-grid-columns:93% auto;grid-template-columns:93% auto;} .o-form-94\@n > .o-field{-ms-grid-columns:94% auto;grid-template-columns:94% auto;} .o-form-95\@n > .o-field{-ms-grid-columns:95% auto;grid-template-columns:95% auto;} .o-form-96\@n > .o-field{-ms-grid-columns:96% auto;grid-template-columns:96% auto;} .o-form-97\@n > .o-field{-ms-grid-columns:97% auto;grid-template-columns:97% auto;} .o-form-98\@n > .o-field{-ms-grid-columns:98% auto;grid-template-columns:98% auto;} .o-form-99\@n > .o-field{-ms-grid-columns:99% auto;grid-template-columns:99% auto;} .o-form-100\@n > .o-field{-ms-grid-columns:100%;grid-template-columns:100%;} .o-grid.o-form-100\@n > .o-field > .o-input:first-child{-ms-grid-column-span:1;grid-column:span 1;} } /* Large devices (desktops, less than 1200px) (lg)*/ @media (max-width:1199px){ .o-form-1\@lg > .o-field{-ms-grid-columns:1% auto;grid-template-columns:1% auto;} .o-form-2\@lg > .o-field{-ms-grid-columns:2% auto;grid-template-columns:2% auto;} .o-form-3\@lg > .o-field{-ms-grid-columns:3% auto;grid-template-columns:3% auto;} .o-form-4\@lg > .o-field{-ms-grid-columns:4% auto;grid-template-columns:4% auto;} .o-form-5\@lg > .o-field{-ms-grid-columns:5% auto;grid-template-columns:5% auto;} .o-form-6\@lg > .o-field{-ms-grid-columns:6% auto;grid-template-columns:6% auto;} .o-form-7\@lg > .o-field{-ms-grid-columns:7% auto;grid-template-columns:7% auto;} .o-form-8\@lg > .o-field{-ms-grid-columns:8% auto;grid-template-columns:8% auto;} .o-form-9\@lg > .o-field{-ms-grid-columns:9% auto;grid-template-columns:9% auto;} .o-form-10\@lg > .o-field{-ms-grid-columns:10% auto;grid-template-columns:10% auto;} .o-form-11\@lg > .o-field{-ms-grid-columns:11% auto;grid-template-columns:11% auto;} .o-form-12\@lg > .o-field{-ms-grid-columns:12% auto;grid-template-columns:12% auto;} .o-form-13\@lg > .o-field{-ms-grid-columns:13% auto;grid-template-columns:13% auto;} .o-form-14\@lg > .o-field{-ms-grid-columns:14% auto;grid-template-columns:14% auto;} .o-form-15\@lg > .o-field{-ms-grid-columns:15% auto;grid-template-columns:15% auto;} .o-form-16\@lg > .o-field{-ms-grid-columns:16% auto;grid-template-columns:16% auto;} .o-form-17\@lg > .o-field{-ms-grid-columns:17% auto;grid-template-columns:17% auto;} .o-form-18\@lg > .o-field{-ms-grid-columns:18% auto;grid-template-columns:18% auto;} .o-form-19\@lg > .o-field{-ms-grid-columns:19% auto;grid-template-columns:19% auto;} .o-form-20\@lg > .o-field{-ms-grid-columns:20% auto;grid-template-columns:20% auto;} .o-form-21\@lg > .o-field{-ms-grid-columns:21% auto;grid-template-columns:21% auto;} .o-form-22\@lg > .o-field{-ms-grid-columns:22% auto;grid-template-columns:22% auto;} .o-form-23\@lg > .o-field{-ms-grid-columns:23% auto;grid-template-columns:23% auto;} .o-form-24\@lg > .o-field{-ms-grid-columns:24% auto;grid-template-columns:24% auto;} .o-form-25\@lg > .o-field{-ms-grid-columns:25% auto;grid-template-columns:25% auto;} .o-form-26\@lg > .o-field{-ms-grid-columns:26% auto;grid-template-columns:26% auto;} .o-form-27\@lg > .o-field{-ms-grid-columns:27% auto;grid-template-columns:27% auto;} .o-form-28\@lg > .o-field{-ms-grid-columns:28% auto;grid-template-columns:28% auto;} .o-form-29\@lg > .o-field{-ms-grid-columns:29% auto;grid-template-columns:29% auto;} .o-form-30\@lg > .o-field{-ms-grid-columns:30% auto;grid-template-columns:30% auto;} .o-form-31\@lg > .o-field{-ms-grid-columns:31% auto;grid-template-columns:31% auto;} .o-form-32\@lg > .o-field{-ms-grid-columns:32% auto;grid-template-columns:32% auto;} .o-form-33\@lg > .o-field{-ms-grid-columns:33% auto;grid-template-columns:33% auto;} .o-form-34\@lg > .o-field{-ms-grid-columns:34% auto;grid-template-columns:34% auto;} .o-form-35\@lg > .o-field{-ms-grid-columns:35% auto;grid-template-columns:35% auto;} .o-form-36\@lg > .o-field{-ms-grid-columns:36% auto;grid-template-columns:36% auto;} .o-form-37\@lg > .o-field{-ms-grid-columns:37% auto;grid-template-columns:37% auto;} .o-form-38\@lg > .o-field{-ms-grid-columns:38% auto;grid-template-columns:38% auto;} .o-form-39\@lg > .o-field{-ms-grid-columns:39% auto;grid-template-columns:39% auto;} .o-form-40\@lg > .o-field{-ms-grid-columns:40% auto;grid-template-columns:40% auto;} .o-form-41\@lg > .o-field{-ms-grid-columns:41% auto;grid-template-columns:41% auto;} .o-form-42\@lg > .o-field{-ms-grid-columns:42% auto;grid-template-columns:42% auto;} .o-form-43\@lg > .o-field{-ms-grid-columns:43% auto;grid-template-columns:43% auto;} .o-form-44\@lg > .o-field{-ms-grid-columns:44% auto;grid-template-columns:44% auto;} .o-form-45\@lg > .o-field{-ms-grid-columns:45% auto;grid-template-columns:45% auto;} .o-form-46\@lg > .o-field{-ms-grid-columns:46% auto;grid-template-columns:46% auto;} .o-form-47\@lg > .o-field{-ms-grid-columns:47% auto;grid-template-columns:47% auto;} .o-form-48\@lg > .o-field{-ms-grid-columns:48% auto;grid-template-columns:48% auto;} .o-form-49\@lg > .o-field{-ms-grid-columns:49% auto;grid-template-columns:49% auto;} .o-form-50\@lg > .o-field{-ms-grid-columns:50% auto;grid-template-columns:50% auto;} .o-form-51\@lg > .o-field{-ms-grid-columns:51% auto;grid-template-columns:51% auto;} .o-form-52\@lg > .o-field{-ms-grid-columns:52% auto;grid-template-columns:52% auto;} .o-form-53\@lg > .o-field{-ms-grid-columns:53% auto;grid-template-columns:53% auto;} .o-form-54\@lg > .o-field{-ms-grid-columns:54% auto;grid-template-columns:54% auto;} .o-form-55\@lg > .o-field{-ms-grid-columns:55% auto;grid-template-columns:55% auto;} .o-form-56\@lg > .o-field{-ms-grid-columns:56% auto;grid-template-columns:56% auto;} .o-form-57\@lg > .o-field{-ms-grid-columns:57% auto;grid-template-columns:57% auto;} .o-form-58\@lg > .o-field{-ms-grid-columns:58% auto;grid-template-columns:58% auto;} .o-form-59\@lg > .o-field{-ms-grid-columns:59% auto;grid-template-columns:59% auto;} .o-form-60\@lg > .o-field{-ms-grid-columns:60% auto;grid-template-columns:60% auto;} .o-form-61\@lg > .o-field{-ms-grid-columns:61% auto;grid-template-columns:61% auto;} .o-form-62\@lg > .o-field{-ms-grid-columns:62% auto;grid-template-columns:62% auto;} .o-form-63\@lg > .o-field{-ms-grid-columns:63% auto;grid-template-columns:63% auto;} .o-form-64\@lg > .o-field{-ms-grid-columns:64% auto;grid-template-columns:64% auto;} .o-form-65\@lg > .o-field{-ms-grid-columns:65% auto;grid-template-columns:65% auto;} .o-form-66\@lg > .o-field{-ms-grid-columns:66% auto;grid-template-columns:66% auto;} .o-form-67\@lg > .o-field{-ms-grid-columns:67% auto;grid-template-columns:67% auto;} .o-form-68\@lg > .o-field{-ms-grid-columns:68% auto;grid-template-columns:68% auto;} .o-form-69\@lg > .o-field{-ms-grid-columns:69% auto;grid-template-columns:69% auto;} .o-form-70\@lg > .o-field{-ms-grid-columns:70% auto;grid-template-columns:70% auto;} .o-form-71\@lg > .o-field{-ms-grid-columns:71% auto;grid-template-columns:71% auto;} .o-form-72\@lg > .o-field{-ms-grid-columns:72% auto;grid-template-columns:72% auto;} .o-form-73\@lg > .o-field{-ms-grid-columns:73% auto;grid-template-columns:73% auto;} .o-form-74\@lg > .o-field{-ms-grid-columns:74% auto;grid-template-columns:74% auto;} .o-form-75\@lg > .o-field{-ms-grid-columns:75% auto;grid-template-columns:75% auto;} .o-form-76\@lg > .o-field{-ms-grid-columns:76% auto;grid-template-columns:76% auto;} .o-form-77\@lg > .o-field{-ms-grid-columns:77% auto;grid-template-columns:77% auto;} .o-form-78\@lg > .o-field{-ms-grid-columns:78% auto;grid-template-columns:78% auto;} .o-form-79\@lg > .o-field{-ms-grid-columns:79% auto;grid-template-columns:79% auto;} .o-form-80\@lg > .o-field{-ms-grid-columns:80% auto;grid-template-columns:80% auto;} .o-form-81\@lg > .o-field{-ms-grid-columns:81% auto;grid-template-columns:81% auto;} .o-form-82\@lg > .o-field{-ms-grid-columns:82% auto;grid-template-columns:82% auto;} .o-form-83\@lg > .o-field{-ms-grid-columns:83% auto;grid-template-columns:83% auto;} .o-form-84\@lg > .o-field{-ms-grid-columns:84% auto;grid-template-columns:84% auto;} .o-form-85\@lg > .o-field{-ms-grid-columns:85% auto;grid-template-columns:85% auto;} .o-form-86\@lg > .o-field{-ms-grid-columns:86% auto;grid-template-columns:86% auto;} .o-form-87\@lg > .o-field{-ms-grid-columns:87% auto;grid-template-columns:87% auto;} .o-form-88\@lg > .o-field{-ms-grid-columns:88% auto;grid-template-columns:88% auto;} .o-form-89\@lg > .o-field{-ms-grid-columns:89% auto;grid-template-columns:89% auto;} .o-form-90\@lg > .o-field{-ms-grid-columns:90% auto;grid-template-columns:90% auto;} .o-form-91\@lg > .o-field{-ms-grid-columns:91% auto;grid-template-columns:91% auto;} .o-form-92\@lg > .o-field{-ms-grid-columns:92% auto;grid-template-columns:92% auto;} .o-form-93\@lg > .o-field{-ms-grid-columns:93% auto;grid-template-columns:93% auto;} .o-form-94\@lg > .o-field{-ms-grid-columns:94% auto;grid-template-columns:94% auto;} .o-form-95\@lg > .o-field{-ms-grid-columns:95% auto;grid-template-columns:95% auto;} .o-form-96\@lg > .o-field{-ms-grid-columns:96% auto;grid-template-columns:96% auto;} .o-form-97\@lg > .o-field{-ms-grid-columns:97% auto;grid-template-columns:97% auto;} .o-form-98\@lg > .o-field{-ms-grid-columns:98% auto;grid-template-columns:98% auto;} .o-form-99\@lg > .o-field{-ms-grid-columns:99% auto;grid-template-columns:99% auto;} .o-form-100\@lg > .o-field{-ms-grid-columns:100%;grid-template-columns:100%;} .o-grid.o-form-100\@lg > .o-field > .o-input:first-child{-ms-grid-column-span:1;grid-column:span 1;} } /* Medium devices (tablets, less than 992px) (md)*/ @media (max-width:991px){ .o-form-1\@md > .o-field{-ms-grid-columns:1% auto;grid-template-columns:1% auto;} .o-form-2\@md > .o-field{-ms-grid-columns:2% auto;grid-template-columns:2% auto;} .o-form-3\@md > .o-field{-ms-grid-columns:3% auto;grid-template-columns:3% auto;} .o-form-4\@md > .o-field{-ms-grid-columns:4% auto;grid-template-columns:4% auto;} .o-form-5\@md > .o-field{-ms-grid-columns:5% auto;grid-template-columns:5% auto;} .o-form-6\@md > .o-field{-ms-grid-columns:6% auto;grid-template-columns:6% auto;} .o-form-7\@md > .o-field{-ms-grid-columns:7% auto;grid-template-columns:7% auto;} .o-form-8\@md > .o-field{-ms-grid-columns:8% auto;grid-template-columns:8% auto;} .o-form-9\@md > .o-field{-ms-grid-columns:9% auto;grid-template-columns:9% auto;} .o-form-10\@md > .o-field{-ms-grid-columns:10% auto;grid-template-columns:10% auto;} .o-form-11\@md > .o-field{-ms-grid-columns:11% auto;grid-template-columns:11% auto;} .o-form-12\@md > .o-field{-ms-grid-columns:12% auto;grid-template-columns:12% auto;} .o-form-13\@md > .o-field{-ms-grid-columns:13% auto;grid-template-columns:13% auto;} .o-form-14\@md > .o-field{-ms-grid-columns:14% auto;grid-template-columns:14% auto;} .o-form-15\@md > .o-field{-ms-grid-columns:15% auto;grid-template-columns:15% auto;} .o-form-16\@md > .o-field{-ms-grid-columns:16% auto;grid-template-columns:16% auto;} .o-form-17\@md > .o-field{-ms-grid-columns:17% auto;grid-template-columns:17% auto;} .o-form-18\@md > .o-field{-ms-grid-columns:18% auto;grid-template-columns:18% auto;} .o-form-19\@md > .o-field{-ms-grid-columns:19% auto;grid-template-columns:19% auto;} .o-form-20\@md > .o-field{-ms-grid-columns:20% auto;grid-template-columns:20% auto;} .o-form-21\@md > .o-field{-ms-grid-columns:21% auto;grid-template-columns:21% auto;} .o-form-22\@md > .o-field{-ms-grid-columns:22% auto;grid-template-columns:22% auto;} .o-form-23\@md > .o-field{-ms-grid-columns:23% auto;grid-template-columns:23% auto;} .o-form-24\@md > .o-field{-ms-grid-columns:24% auto;grid-template-columns:24% auto;} .o-form-25\@md > .o-field{-ms-grid-columns:25% auto;grid-template-columns:25% auto;} .o-form-26\@md > .o-field{-ms-grid-columns:26% auto;grid-template-columns:26% auto;} .o-form-27\@md > .o-field{-ms-grid-columns:27% auto;grid-template-columns:27% auto;} .o-form-28\@md > .o-field{-ms-grid-columns:28% auto;grid-template-columns:28% auto;} .o-form-29\@md > .o-field{-ms-grid-columns:29% auto;grid-template-columns:29% auto;} .o-form-30\@md > .o-field{-ms-grid-columns:30% auto;grid-template-columns:30% auto;} .o-form-31\@md > .o-field{-ms-grid-columns:31% auto;grid-template-columns:31% auto;} .o-form-32\@md > .o-field{-ms-grid-columns:32% auto;grid-template-columns:32% auto;} .o-form-33\@md > .o-field{-ms-grid-columns:33% auto;grid-template-columns:33% auto;} .o-form-34\@md > .o-field{-ms-grid-columns:34% auto;grid-template-columns:34% auto;} .o-form-35\@md > .o-field{-ms-grid-columns:35% auto;grid-template-columns:35% auto;} .o-form-36\@md > .o-field{-ms-grid-columns:36% auto;grid-template-columns:36% auto;} .o-form-37\@md > .o-field{-ms-grid-columns:37% auto;grid-template-columns:37% auto;} .o-form-38\@md > .o-field{-ms-grid-columns:38% auto;grid-template-columns:38% auto;} .o-form-39\@md > .o-field{-ms-grid-columns:39% auto;grid-template-columns:39% auto;} .o-form-40\@md > .o-field{-ms-grid-columns:40% auto;grid-template-columns:40% auto;} .o-form-41\@md > .o-field{-ms-grid-columns:41% auto;grid-template-columns:41% auto;} .o-form-42\@md > .o-field{-ms-grid-columns:42% auto;grid-template-columns:42% auto;} .o-form-43\@md > .o-field{-ms-grid-columns:43% auto;grid-template-columns:43% auto;} .o-form-44\@md > .o-field{-ms-grid-columns:44% auto;grid-template-columns:44% auto;} .o-form-45\@md > .o-field{-ms-grid-columns:45% auto;grid-template-columns:45% auto;} .o-form-46\@md > .o-field{-ms-grid-columns:46% auto;grid-template-columns:46% auto;} .o-form-47\@md > .o-field{-ms-grid-columns:47% auto;grid-template-columns:47% auto;} .o-form-48\@md > .o-field{-ms-grid-columns:48% auto;grid-template-columns:48% auto;} .o-form-49\@md > .o-field{-ms-grid-columns:49% auto;grid-template-columns:49% auto;} .o-form-50\@md > .o-field{-ms-grid-columns:50% auto;grid-template-columns:50% auto;} .o-form-51\@md > .o-field{-ms-grid-columns:51% auto;grid-template-columns:51% auto;} .o-form-52\@md > .o-field{-ms-grid-columns:52% auto;grid-template-columns:52% auto;} .o-form-53\@md > .o-field{-ms-grid-columns:53% auto;grid-template-columns:53% auto;} .o-form-54\@md > .o-field{-ms-grid-columns:54% auto;grid-template-columns:54% auto;} .o-form-55\@md > .o-field{-ms-grid-columns:55% auto;grid-template-columns:55% auto;} .o-form-56\@md > .o-field{-ms-grid-columns:56% auto;grid-template-columns:56% auto;} .o-form-57\@md > .o-field{-ms-grid-columns:57% auto;grid-template-columns:57% auto;} .o-form-58\@md > .o-field{-ms-grid-columns:58% auto;grid-template-columns:58% auto;} .o-form-59\@md > .o-field{-ms-grid-columns:59% auto;grid-template-columns:59% auto;} .o-form-60\@md > .o-field{-ms-grid-columns:60% auto;grid-template-columns:60% auto;} .o-form-61\@md > .o-field{-ms-grid-columns:61% auto;grid-template-columns:61% auto;} .o-form-62\@md > .o-field{-ms-grid-columns:62% auto;grid-template-columns:62% auto;} .o-form-63\@md > .o-field{-ms-grid-columns:63% auto;grid-template-columns:63% auto;} .o-form-64\@md > .o-field{-ms-grid-columns:64% auto;grid-template-columns:64% auto;} .o-form-65\@md > .o-field{-ms-grid-columns:65% auto;grid-template-columns:65% auto;} .o-form-66\@md > .o-field{-ms-grid-columns:66% auto;grid-template-columns:66% auto;} .o-form-67\@md > .o-field{-ms-grid-columns:67% auto;grid-template-columns:67% auto;} .o-form-68\@md > .o-field{-ms-grid-columns:68% auto;grid-template-columns:68% auto;} .o-form-69\@md > .o-field{-ms-grid-columns:69% auto;grid-template-columns:69% auto;} .o-form-70\@md > .o-field{-ms-grid-columns:70% auto;grid-template-columns:70% auto;} .o-form-71\@md > .o-field{-ms-grid-columns:71% auto;grid-template-columns:71% auto;} .o-form-72\@md > .o-field{-ms-grid-columns:72% auto;grid-template-columns:72% auto;} .o-form-73\@md > .o-field{-ms-grid-columns:73% auto;grid-template-columns:73% auto;} .o-form-74\@md > .o-field{-ms-grid-columns:74% auto;grid-template-columns:74% auto;} .o-form-75\@md > .o-field{-ms-grid-columns:75% auto;grid-template-columns:75% auto;} .o-form-76\@md > .o-field{-ms-grid-columns:76% auto;grid-template-columns:76% auto;} .o-form-77\@md > .o-field{-ms-grid-columns:77% auto;grid-template-columns:77% auto;} .o-form-78\@md > .o-field{-ms-grid-columns:78% auto;grid-template-columns:78% auto;} .o-form-79\@md > .o-field{-ms-grid-columns:79% auto;grid-template-columns:79% auto;} .o-form-80\@md > .o-field{-ms-grid-columns:80% auto;grid-template-columns:80% auto;} .o-form-81\@md > .o-field{-ms-grid-columns:81% auto;grid-template-columns:81% auto;} .o-form-82\@md > .o-field{-ms-grid-columns:82% auto;grid-template-columns:82% auto;} .o-form-83\@md > .o-field{-ms-grid-columns:83% auto;grid-template-columns:83% auto;} .o-form-84\@md > .o-field{-ms-grid-columns:84% auto;grid-template-columns:84% auto;} .o-form-85\@md > .o-field{-ms-grid-columns:85% auto;grid-template-columns:85% auto;} .o-form-86\@md > .o-field{-ms-grid-columns:86% auto;grid-template-columns:86% auto;} .o-form-87\@md > .o-field{-ms-grid-columns:87% auto;grid-template-columns:87% auto;} .o-form-88\@md > .o-field{-ms-grid-columns:88% auto;grid-template-columns:88% auto;} .o-form-89\@md > .o-field{-ms-grid-columns:89% auto;grid-template-columns:89% auto;} .o-form-90\@md > .o-field{-ms-grid-columns:90% auto;grid-template-columns:90% auto;} .o-form-91\@md > .o-field{-ms-grid-columns:91% auto;grid-template-columns:91% auto;} .o-form-92\@md > .o-field{-ms-grid-columns:92% auto;grid-template-columns:92% auto;} .o-form-93\@md > .o-field{-ms-grid-columns:93% auto;grid-template-columns:93% auto;} .o-form-94\@md > .o-field{-ms-grid-columns:94% auto;grid-template-columns:94% auto;} .o-form-95\@md > .o-field{-ms-grid-columns:95% auto;grid-template-columns:95% auto;} .o-form-96\@md > .o-field{-ms-grid-columns:96% auto;grid-template-columns:96% auto;} .o-form-97\@md > .o-field{-ms-grid-columns:97% auto;grid-template-columns:97% auto;} .o-form-98\@md > .o-field{-ms-grid-columns:98% auto;grid-template-columns:98% auto;} .o-form-99\@md > .o-field{-ms-grid-columns:99% auto;grid-template-columns:99% auto;} .o-form-100\@md > .o-field{-ms-grid-columns:100%;grid-template-columns:100%;} .o-grid.o-form-100\@md > .o-field > .o-input:first-child{-ms-grid-column-span:1;grid-column:span 1;} } /* Small devices (landscape phones, less than 768px) (sm)*/ @media (max-width:767px){ .o-form-1\@sm > .o-field{-ms-grid-columns:1% auto;grid-template-columns:1% auto;} .o-form-2\@sm > .o-field{-ms-grid-columns:2% auto;grid-template-columns:2% auto;} .o-form-3\@sm > .o-field{-ms-grid-columns:3% auto;grid-template-columns:3% auto;} .o-form-4\@sm > .o-field{-ms-grid-columns:4% auto;grid-template-columns:4% auto;} .o-form-5\@sm > .o-field{-ms-grid-columns:5% auto;grid-template-columns:5% auto;} .o-form-6\@sm > .o-field{-ms-grid-columns:6% auto;grid-template-columns:6% auto;} .o-form-7\@sm > .o-field{-ms-grid-columns:7% auto;grid-template-columns:7% auto;} .o-form-8\@sm > .o-field{-ms-grid-columns:8% auto;grid-template-columns:8% auto;} .o-form-9\@sm > .o-field{-ms-grid-columns:9% auto;grid-template-columns:9% auto;} .o-form-10\@sm > .o-field{-ms-grid-columns:10% auto;grid-template-columns:10% auto;} .o-form-11\@sm > .o-field{-ms-grid-columns:11% auto;grid-template-columns:11% auto;} .o-form-12\@sm > .o-field{-ms-grid-columns:12% auto;grid-template-columns:12% auto;} .o-form-13\@sm > .o-field{-ms-grid-columns:13% auto;grid-template-columns:13% auto;} .o-form-14\@sm > .o-field{-ms-grid-columns:14% auto;grid-template-columns:14% auto;} .o-form-15\@sm > .o-field{-ms-grid-columns:15% auto;grid-template-columns:15% auto;} .o-form-16\@sm > .o-field{-ms-grid-columns:16% auto;grid-template-columns:16% auto;} .o-form-17\@sm > .o-field{-ms-grid-columns:17% auto;grid-template-columns:17% auto;} .o-form-18\@sm > .o-field{-ms-grid-columns:18% auto;grid-template-columns:18% auto;} .o-form-19\@sm > .o-field{-ms-grid-columns:19% auto;grid-template-columns:19% auto;} .o-form-20\@sm > .o-field{-ms-grid-columns:20% auto;grid-template-columns:20% auto;} .o-form-21\@sm > .o-field{-ms-grid-columns:21% auto;grid-template-columns:21% auto;} .o-form-22\@sm > .o-field{-ms-grid-columns:22% auto;grid-template-columns:22% auto;} .o-form-23\@sm > .o-field{-ms-grid-columns:23% auto;grid-template-columns:23% auto;} .o-form-24\@sm > .o-field{-ms-grid-columns:24% auto;grid-template-columns:24% auto;} .o-form-25\@sm > .o-field{-ms-grid-columns:25% auto;grid-template-columns:25% auto;} .o-form-26\@sm > .o-field{-ms-grid-columns:26% auto;grid-template-columns:26% auto;} .o-form-27\@sm > .o-field{-ms-grid-columns:27% auto;grid-template-columns:27% auto;} .o-form-28\@sm > .o-field{-ms-grid-columns:28% auto;grid-template-columns:28% auto;} .o-form-29\@sm > .o-field{-ms-grid-columns:29% auto;grid-template-columns:29% auto;} .o-form-30\@sm > .o-field{-ms-grid-columns:30% auto;grid-template-columns:30% auto;} .o-form-31\@sm > .o-field{-ms-grid-columns:31% auto;grid-template-columns:31% auto;} .o-form-32\@sm > .o-field{-ms-grid-columns:32% auto;grid-template-columns:32% auto;} .o-form-33\@sm > .o-field{-ms-grid-columns:33% auto;grid-template-columns:33% auto;} .o-form-34\@sm > .o-field{-ms-grid-columns:34% auto;grid-template-columns:34% auto;} .o-form-35\@sm > .o-field{-ms-grid-columns:35% auto;grid-template-columns:35% auto;} .o-form-36\@sm > .o-field{-ms-grid-columns:36% auto;grid-template-columns:36% auto;} .o-form-37\@sm > .o-field{-ms-grid-columns:37% auto;grid-template-columns:37% auto;} .o-form-38\@sm > .o-field{-ms-grid-columns:38% auto;grid-template-columns:38% auto;} .o-form-39\@sm > .o-field{-ms-grid-columns:39% auto;grid-template-columns:39% auto;} .o-form-40\@sm > .o-field{-ms-grid-columns:40% auto;grid-template-columns:40% auto;} .o-form-41\@sm > .o-field{-ms-grid-columns:41% auto;grid-template-columns:41% auto;} .o-form-42\@sm > .o-field{-ms-grid-columns:42% auto;grid-template-columns:42% auto;} .o-form-43\@sm > .o-field{-ms-grid-columns:43% auto;grid-template-columns:43% auto;} .o-form-44\@sm > .o-field{-ms-grid-columns:44% auto;grid-template-columns:44% auto;} .o-form-45\@sm > .o-field{-ms-grid-columns:45% auto;grid-template-columns:45% auto;} .o-form-46\@sm > .o-field{-ms-grid-columns:46% auto;grid-template-columns:46% auto;} .o-form-47\@sm > .o-field{-ms-grid-columns:47% auto;grid-template-columns:47% auto;} .o-form-48\@sm > .o-field{-ms-grid-columns:48% auto;grid-template-columns:48% auto;} .o-form-49\@sm > .o-field{-ms-grid-columns:49% auto;grid-template-columns:49% auto;} .o-form-50\@sm > .o-field{-ms-grid-columns:50% auto;grid-template-columns:50% auto;} .o-form-51\@sm > .o-field{-ms-grid-columns:51% auto;grid-template-columns:51% auto;} .o-form-52\@sm > .o-field{-ms-grid-columns:52% auto;grid-template-columns:52% auto;} .o-form-53\@sm > .o-field{-ms-grid-columns:53% auto;grid-template-columns:53% auto;} .o-form-54\@sm > .o-field{-ms-grid-columns:54% auto;grid-template-columns:54% auto;} .o-form-55\@sm > .o-field{-ms-grid-columns:55% auto;grid-template-columns:55% auto;} .o-form-56\@sm > .o-field{-ms-grid-columns:56% auto;grid-template-columns:56% auto;} .o-form-57\@sm > .o-field{-ms-grid-columns:57% auto;grid-template-columns:57% auto;} .o-form-58\@sm > .o-field{-ms-grid-columns:58% auto;grid-template-columns:58% auto;} .o-form-59\@sm > .o-field{-ms-grid-columns:59% auto;grid-template-columns:59% auto;} .o-form-60\@sm > .o-field{-ms-grid-columns:60% auto;grid-template-columns:60% auto;} .o-form-61\@sm > .o-field{-ms-grid-columns:61% auto;grid-template-columns:61% auto;} .o-form-62\@sm > .o-field{-ms-grid-columns:62% auto;grid-template-columns:62% auto;} .o-form-63\@sm > .o-field{-ms-grid-columns:63% auto;grid-template-columns:63% auto;} .o-form-64\@sm > .o-field{-ms-grid-columns:64% auto;grid-template-columns:64% auto;} .o-form-65\@sm > .o-field{-ms-grid-columns:65% auto;grid-template-columns:65% auto;} .o-form-66\@sm > .o-field{-ms-grid-columns:66% auto;grid-template-columns:66% auto;} .o-form-67\@sm > .o-field{-ms-grid-columns:67% auto;grid-template-columns:67% auto;} .o-form-68\@sm > .o-field{-ms-grid-columns:68% auto;grid-template-columns:68% auto;} .o-form-69\@sm > .o-field{-ms-grid-columns:69% auto;grid-template-columns:69% auto;} .o-form-70\@sm > .o-field{-ms-grid-columns:70% auto;grid-template-columns:70% auto;} .o-form-71\@sm > .o-field{-ms-grid-columns:71% auto;grid-template-columns:71% auto;} .o-form-72\@sm > .o-field{-ms-grid-columns:72% auto;grid-template-columns:72% auto;} .o-form-73\@sm > .o-field{-ms-grid-columns:73% auto;grid-template-columns:73% auto;} .o-form-74\@sm > .o-field{-ms-grid-columns:74% auto;grid-template-columns:74% auto;} .o-form-75\@sm > .o-field{-ms-grid-columns:75% auto;grid-template-columns:75% auto;} .o-form-76\@sm > .o-field{-ms-grid-columns:76% auto;grid-template-columns:76% auto;} .o-form-77\@sm > .o-field{-ms-grid-columns:77% auto;grid-template-columns:77% auto;} .o-form-78\@sm > .o-field{-ms-grid-columns:78% auto;grid-template-columns:78% auto;} .o-form-79\@sm > .o-field{-ms-grid-columns:79% auto;grid-template-columns:79% auto;} .o-form-80\@sm > .o-field{-ms-grid-columns:80% auto;grid-template-columns:80% auto;} .o-form-81\@sm > .o-field{-ms-grid-columns:81% auto;grid-template-columns:81% auto;} .o-form-82\@sm > .o-field{-ms-grid-columns:82% auto;grid-template-columns:82% auto;} .o-form-83\@sm > .o-field{-ms-grid-columns:83% auto;grid-template-columns:83% auto;} .o-form-84\@sm > .o-field{-ms-grid-columns:84% auto;grid-template-columns:84% auto;} .o-form-85\@sm > .o-field{-ms-grid-columns:85% auto;grid-template-columns:85% auto;} .o-form-86\@sm > .o-field{-ms-grid-columns:86% auto;grid-template-columns:86% auto;} .o-form-87\@sm > .o-field{-ms-grid-columns:87% auto;grid-template-columns:87% auto;} .o-form-88\@sm > .o-field{-ms-grid-columns:88% auto;grid-template-columns:88% auto;} .o-form-89\@sm > .o-field{-ms-grid-columns:89% auto;grid-template-columns:89% auto;} .o-form-90\@sm > .o-field{-ms-grid-columns:90% auto;grid-template-columns:90% auto;} .o-form-91\@sm > .o-field{-ms-grid-columns:91% auto;grid-template-columns:91% auto;} .o-form-92\@sm > .o-field{-ms-grid-columns:92% auto;grid-template-columns:92% auto;} .o-form-93\@sm > .o-field{-ms-grid-columns:93% auto;grid-template-columns:93% auto;} .o-form-94\@sm > .o-field{-ms-grid-columns:94% auto;grid-template-columns:94% auto;} .o-form-95\@sm > .o-field{-ms-grid-columns:95% auto;grid-template-columns:95% auto;} .o-form-96\@sm > .o-field{-ms-grid-columns:96% auto;grid-template-columns:96% auto;} .o-form-97\@sm > .o-field{-ms-grid-columns:97% auto;grid-template-columns:97% auto;} .o-form-98\@sm > .o-field{-ms-grid-columns:98% auto;grid-template-columns:98% auto;} .o-form-99\@sm > .o-field{-ms-grid-columns:99% auto;grid-template-columns:99% auto;} .o-form-100\@sm > .o-field{-ms-grid-columns:100%;grid-template-columns:100%;} .o-grid.o-form-100\@sm > .o-field > .o-input:first-child{-ms-grid-column-span:1;grid-column:span 1;} } /* Extra small devices (portrait phones, less than 533px) (xs)*/ @media (max-width:532px){ .o-form-1\@xs > .o-field{-ms-grid-columns:1% auto;grid-template-columns:1% auto;} .o-form-2\@xs > .o-field{-ms-grid-columns:2% auto;grid-template-columns:2% auto;} .o-form-3\@xs > .o-field{-ms-grid-columns:3% auto;grid-template-columns:3% auto;} .o-form-4\@xs > .o-field{-ms-grid-columns:4% auto;grid-template-columns:4% auto;} .o-form-5\@xs > .o-field{-ms-grid-columns:5% auto;grid-template-columns:5% auto;} .o-form-6\@xs > .o-field{-ms-grid-columns:6% auto;grid-template-columns:6% auto;} .o-form-7\@xs > .o-field{-ms-grid-columns:7% auto;grid-template-columns:7% auto;} .o-form-8\@xs > .o-field{-ms-grid-columns:8% auto;grid-template-columns:8% auto;} .o-form-9\@xs > .o-field{-ms-grid-columns:9% auto;grid-template-columns:9% auto;} .o-form-10\@xs > .o-field{-ms-grid-columns:10% auto;grid-template-columns:10% auto;} .o-form-11\@xs > .o-field{-ms-grid-columns:11% auto;grid-template-columns:11% auto;} .o-form-12\@xs > .o-field{-ms-grid-columns:12% auto;grid-template-columns:12% auto;} .o-form-13\@xs > .o-field{-ms-grid-columns:13% auto;grid-template-columns:13% auto;} .o-form-14\@xs > .o-field{-ms-grid-columns:14% auto;grid-template-columns:14% auto;} .o-form-15\@xs > .o-field{-ms-grid-columns:15% auto;grid-template-columns:15% auto;} .o-form-16\@xs > .o-field{-ms-grid-columns:16% auto;grid-template-columns:16% auto;} .o-form-17\@xs > .o-field{-ms-grid-columns:17% auto;grid-template-columns:17% auto;} .o-form-18\@xs > .o-field{-ms-grid-columns:18% auto;grid-template-columns:18% auto;} .o-form-19\@xs > .o-field{-ms-grid-columns:19% auto;grid-template-columns:19% auto;} .o-form-20\@xs > .o-field{-ms-grid-columns:20% auto;grid-template-columns:20% auto;} .o-form-21\@xs > .o-field{-ms-grid-columns:21% auto;grid-template-columns:21% auto;} .o-form-22\@xs > .o-field{-ms-grid-columns:22% auto;grid-template-columns:22% auto;} .o-form-23\@xs > .o-field{-ms-grid-columns:23% auto;grid-template-columns:23% auto;} .o-form-24\@xs > .o-field{-ms-grid-columns:24% auto;grid-template-columns:24% auto;} .o-form-25\@xs > .o-field{-ms-grid-columns:25% auto;grid-template-columns:25% auto;} .o-form-26\@xs > .o-field{-ms-grid-columns:26% auto;grid-template-columns:26% auto;} .o-form-27\@xs > .o-field{-ms-grid-columns:27% auto;grid-template-columns:27% auto;} .o-form-28\@xs > .o-field{-ms-grid-columns:28% auto;grid-template-columns:28% auto;} .o-form-29\@xs > .o-field{-ms-grid-columns:29% auto;grid-template-columns:29% auto;} .o-form-30\@xs > .o-field{-ms-grid-columns:30% auto;grid-template-columns:30% auto;} .o-form-31\@xs > .o-field{-ms-grid-columns:31% auto;grid-template-columns:31% auto;} .o-form-32\@xs > .o-field{-ms-grid-columns:32% auto;grid-template-columns:32% auto;} .o-form-33\@xs > .o-field{-ms-grid-columns:33% auto;grid-template-columns:33% auto;} .o-form-34\@xs > .o-field{-ms-grid-columns:34% auto;grid-template-columns:34% auto;} .o-form-35\@xs > .o-field{-ms-grid-columns:35% auto;grid-template-columns:35% auto;} .o-form-36\@xs > .o-field{-ms-grid-columns:36% auto;grid-template-columns:36% auto;} .o-form-37\@xs > .o-field{-ms-grid-columns:37% auto;grid-template-columns:37% auto;} .o-form-38\@xs > .o-field{-ms-grid-columns:38% auto;grid-template-columns:38% auto;} .o-form-39\@xs > .o-field{-ms-grid-columns:39% auto;grid-template-columns:39% auto;} .o-form-40\@xs > .o-field{-ms-grid-columns:40% auto;grid-template-columns:40% auto;} .o-form-41\@xs > .o-field{-ms-grid-columns:41% auto;grid-template-columns:41% auto;} .o-form-42\@xs > .o-field{-ms-grid-columns:42% auto;grid-template-columns:42% auto;} .o-form-43\@xs > .o-field{-ms-grid-columns:43% auto;grid-template-columns:43% auto;} .o-form-44\@xs > .o-field{-ms-grid-columns:44% auto;grid-template-columns:44% auto;} .o-form-45\@xs > .o-field{-ms-grid-columns:45% auto;grid-template-columns:45% auto;} .o-form-46\@xs > .o-field{-ms-grid-columns:46% auto;grid-template-columns:46% auto;} .o-form-47\@xs > .o-field{-ms-grid-columns:47% auto;grid-template-columns:47% auto;} .o-form-48\@xs > .o-field{-ms-grid-columns:48% auto;grid-template-columns:48% auto;} .o-form-49\@xs > .o-field{-ms-grid-columns:49% auto;grid-template-columns:49% auto;} .o-form-50\@xs > .o-field{-ms-grid-columns:50% auto;grid-template-columns:50% auto;} .o-form-51\@xs > .o-field{-ms-grid-columns:51% auto;grid-template-columns:51% auto;} .o-form-52\@xs > .o-field{-ms-grid-columns:52% auto;grid-template-columns:52% auto;} .o-form-53\@xs > .o-field{-ms-grid-columns:53% auto;grid-template-columns:53% auto;} .o-form-54\@xs > .o-field{-ms-grid-columns:54% auto;grid-template-columns:54% auto;} .o-form-55\@xs > .o-field{-ms-grid-columns:55% auto;grid-template-columns:55% auto;} .o-form-56\@xs > .o-field{-ms-grid-columns:56% auto;grid-template-columns:56% auto;} .o-form-57\@xs > .o-field{-ms-grid-columns:57% auto;grid-template-columns:57% auto;} .o-form-58\@xs > .o-field{-ms-grid-columns:58% auto;grid-template-columns:58% auto;} .o-form-59\@xs > .o-field{-ms-grid-columns:59% auto;grid-template-columns:59% auto;} .o-form-60\@xs > .o-field{-ms-grid-columns:60% auto;grid-template-columns:60% auto;} .o-form-61\@xs > .o-field{-ms-grid-columns:61% auto;grid-template-columns:61% auto;} .o-form-62\@xs > .o-field{-ms-grid-columns:62% auto;grid-template-columns:62% auto;} .o-form-63\@xs > .o-field{-ms-grid-columns:63% auto;grid-template-columns:63% auto;} .o-form-64\@xs > .o-field{-ms-grid-columns:64% auto;grid-template-columns:64% auto;} .o-form-65\@xs > .o-field{-ms-grid-columns:65% auto;grid-template-columns:65% auto;} .o-form-66\@xs > .o-field{-ms-grid-columns:66% auto;grid-template-columns:66% auto;} .o-form-67\@xs > .o-field{-ms-grid-columns:67% auto;grid-template-columns:67% auto;} .o-form-68\@xs > .o-field{-ms-grid-columns:68% auto;grid-template-columns:68% auto;} .o-form-69\@xs > .o-field{-ms-grid-columns:69% auto;grid-template-columns:69% auto;} .o-form-70\@xs > .o-field{-ms-grid-columns:70% auto;grid-template-columns:70% auto;} .o-form-71\@xs > .o-field{-ms-grid-columns:71% auto;grid-template-columns:71% auto;} .o-form-72\@xs > .o-field{-ms-grid-columns:72% auto;grid-template-columns:72% auto;} .o-form-73\@xs > .o-field{-ms-grid-columns:73% auto;grid-template-columns:73% auto;} .o-form-74\@xs > .o-field{-ms-grid-columns:74% auto;grid-template-columns:74% auto;} .o-form-75\@xs > .o-field{-ms-grid-columns:75% auto;grid-template-columns:75% auto;} .o-form-76\@xs > .o-field{-ms-grid-columns:76% auto;grid-template-columns:76% auto;} .o-form-77\@xs > .o-field{-ms-grid-columns:77% auto;grid-template-columns:77% auto;} .o-form-78\@xs > .o-field{-ms-grid-columns:78% auto;grid-template-columns:78% auto;} .o-form-79\@xs > .o-field{-ms-grid-columns:79% auto;grid-template-columns:79% auto;} .o-form-80\@xs > .o-field{-ms-grid-columns:80% auto;grid-template-columns:80% auto;} .o-form-81\@xs > .o-field{-ms-grid-columns:81% auto;grid-template-columns:81% auto;} .o-form-82\@xs > .o-field{-ms-grid-columns:82% auto;grid-template-columns:82% auto;} .o-form-83\@xs > .o-field{-ms-grid-columns:83% auto;grid-template-columns:83% auto;} .o-form-84\@xs > .o-field{-ms-grid-columns:84% auto;grid-template-columns:84% auto;} .o-form-85\@xs > .o-field{-ms-grid-columns:85% auto;grid-template-columns:85% auto;} .o-form-86\@xs > .o-field{-ms-grid-columns:86% auto;grid-template-columns:86% auto;} .o-form-87\@xs > .o-field{-ms-grid-columns:87% auto;grid-template-columns:87% auto;} .o-form-88\@xs > .o-field{-ms-grid-columns:88% auto;grid-template-columns:88% auto;} .o-form-89\@xs > .o-field{-ms-grid-columns:89% auto;grid-template-columns:89% auto;} .o-form-90\@xs > .o-field{-ms-grid-columns:90% auto;grid-template-columns:90% auto;} .o-form-91\@xs > .o-field{-ms-grid-columns:91% auto;grid-template-columns:91% auto;} .o-form-92\@xs > .o-field{-ms-grid-columns:92% auto;grid-template-columns:92% auto;} .o-form-93\@xs > .o-field{-ms-grid-columns:93% auto;grid-template-columns:93% auto;} .o-form-94\@xs > .o-field{-ms-grid-columns:94% auto;grid-template-columns:94% auto;} .o-form-95\@xs > .o-field{-ms-grid-columns:95% auto;grid-template-columns:95% auto;} .o-form-96\@xs > .o-field{-ms-grid-columns:96% auto;grid-template-columns:96% auto;} .o-form-97\@xs > .o-field{-ms-grid-columns:97% auto;grid-template-columns:97% auto;} .o-form-98\@xs > .o-field{-ms-grid-columns:98% auto;grid-template-columns:98% auto;} .o-form-99\@xs > .o-field{-ms-grid-columns:99% auto;grid-template-columns:99% auto;} .o-form-100\@xs > .o-field{-ms-grid-columns:100%;grid-template-columns:100%;} .o-grid.o-form-100\@xs > .o-field > .o-input:first-child{-ms-grid-column-span:1;grid-column:span 1;} } /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-fgap ----------------------------------- ----------------------------------------------------------------------------- */ .o-fgap-0\@n > .o-field{grid-gap:0px} .o-fgap-1\@n > .o-field{grid-gap:1px} .o-fgap-2\@n > .o-field{grid-gap:2px} .o-fgap-3\@n > .o-field{grid-gap:3px} .o-fgap-4\@n > .o-field{grid-gap:4px} .o-fgap-5\@n > .o-field{grid-gap:5px} .o-fgap-6\@n > .o-field{grid-gap:6px} .o-fgap-7\@n > .o-field{grid-gap:7px} .o-fgap-8\@n > .o-field{grid-gap:8px} .o-fgap-9\@n > .o-field{grid-gap:9px} .o-fgap-10\@n > .o-field{grid-gap:10px} .o-fgap-11\@n > .o-field{grid-gap:11px} .o-fgap-12\@n > .o-field{grid-gap:12px} .o-fgap-13\@n > .o-field{grid-gap:13px} .o-fgap-14\@n > .o-field{grid-gap:14px} .o-fgap-15\@n > .o-field{grid-gap:15px} .o-fgap-16\@n > .o-field{grid-gap:16px} .o-fgap-17\@n > .o-field{grid-gap:17px} .o-fgap-18\@n > .o-field{grid-gap:18px} .o-fgap-19\@n > .o-field{grid-gap:19px} .o-fgap-20\@n > .o-field{grid-gap:20px} .o-fgap-21\@n > .o-field{grid-gap:21px} .o-fgap-22\@n > .o-field{grid-gap:22px} .o-fgap-23\@n > .o-field{grid-gap:23px} .o-fgap-24\@n > .o-field{grid-gap:24px} .o-fgap-25\@n > .o-field{grid-gap:25px} .o-fgap-26\@n > .o-field{grid-gap:26px} .o-fgap-27\@n > .o-field{grid-gap:27px} .o-fgap-28\@n > .o-field{grid-gap:28px} .o-fgap-29\@n > .o-field{grid-gap:29px} .o-fgap-30\@n > .o-field{grid-gap:30px} .o-fgap-31\@n > .o-field{grid-gap:31px} .o-fgap-32\@n > .o-field{grid-gap:32px} .o-fgap-33\@n > .o-field{grid-gap:33px} .o-fgap-34\@n > .o-field{grid-gap:34px} .o-fgap-35\@n > .o-field{grid-gap:35px} .o-fgap-36\@n > .o-field{grid-gap:36px} .o-fgap-37\@n > .o-field{grid-gap:37px} .o-fgap-38\@n > .o-field{grid-gap:38px} .o-fgap-39\@n > .o-field{grid-gap:39px} .o-fgap-40\@n > .o-field{grid-gap:40px} .o-fgap-41\@n > .o-field{grid-gap:41px} .o-fgap-42\@n > .o-field{grid-gap:42px} .o-fgap-43\@n > .o-field{grid-gap:43px} .o-fgap-44\@n > .o-field{grid-gap:44px} .o-fgap-45\@n > .o-field{grid-gap:45px} .o-fgap-46\@n > .o-field{grid-gap:46px} .o-fgap-47\@n > .o-field{grid-gap:47px} .o-fgap-48\@n > .o-field{grid-gap:48px} /* Large devices (desktops, less than 1200px) (lg)*/ @media (max-width:1199px){ .o-fgap-0\@lg > .o-field{grid-gap:0px} .o-fgap-1\@lg > .o-field{grid-gap:1px} .o-fgap-2\@lg > .o-field{grid-gap:2px} .o-fgap-3\@lg > .o-field{grid-gap:3px} .o-fgap-4\@lg > .o-field{grid-gap:4px} .o-fgap-5\@lg > .o-field{grid-gap:5px} .o-fgap-6\@lg > .o-field{grid-gap:6px} .o-fgap-7\@lg > .o-field{grid-gap:7px} .o-fgap-8\@lg > .o-field{grid-gap:8px} .o-fgap-9\@lg > .o-field{grid-gap:9px} .o-fgap-10\@lg > .o-field{grid-gap:10px} .o-fgap-11\@lg > .o-field{grid-gap:11px} .o-fgap-12\@lg > .o-field{grid-gap:12px} .o-fgap-13\@lg > .o-field{grid-gap:13px} .o-fgap-14\@lg > .o-field{grid-gap:14px} .o-fgap-15\@lg > .o-field{grid-gap:15px} .o-fgap-16\@lg > .o-field{grid-gap:16px} .o-fgap-17\@lg > .o-field{grid-gap:17px} .o-fgap-18\@lg > .o-field{grid-gap:18px} .o-fgap-19\@lg > .o-field{grid-gap:19px} .o-fgap-20\@lg > .o-field{grid-gap:20px} .o-fgap-21\@lg > .o-field{grid-gap:21px} .o-fgap-22\@lg > .o-field{grid-gap:22px} .o-fgap-23\@lg > .o-field{grid-gap:23px} .o-fgap-24\@lg > .o-field{grid-gap:24px} .o-fgap-25\@lg > .o-field{grid-gap:25px} .o-fgap-26\@lg > .o-field{grid-gap:26px} .o-fgap-27\@lg > .o-field{grid-gap:27px} .o-fgap-28\@lg > .o-field{grid-gap:28px} .o-fgap-29\@lg > .o-field{grid-gap:29px} .o-fgap-30\@lg > .o-field{grid-gap:30px} .o-fgap-31\@lg > .o-field{grid-gap:31px} .o-fgap-32\@lg > .o-field{grid-gap:32px} .o-fgap-33\@lg > .o-field{grid-gap:33px} .o-fgap-34\@lg > .o-field{grid-gap:34px} .o-fgap-35\@lg > .o-field{grid-gap:35px} .o-fgap-36\@lg > .o-field{grid-gap:36px} .o-fgap-37\@lg > .o-field{grid-gap:37px} .o-fgap-38\@lg > .o-field{grid-gap:38px} .o-fgap-39\@lg > .o-field{grid-gap:39px} .o-fgap-40\@lg > .o-field{grid-gap:40px} .o-fgap-41\@lg > .o-field{grid-gap:41px} .o-fgap-42\@lg > .o-field{grid-gap:42px} .o-fgap-43\@lg > .o-field{grid-gap:43px} .o-fgap-44\@lg > .o-field{grid-gap:44px} .o-fgap-45\@lg > .o-field{grid-gap:45px} .o-fgap-46\@lg > .o-field{grid-gap:46px} .o-fgap-47\@lg > .o-field{grid-gap:47px} .o-fgap-48\@lg > .o-field{grid-gap:48px} } /* Medium devices (tablets, less than 992px) (md)*/ @media (max-width:991px){ .o-fgap-0\@md > .o-field{grid-gap:0px} .o-fgap-1\@md > .o-field{grid-gap:1px} .o-fgap-2\@md > .o-field{grid-gap:2px} .o-fgap-3\@md > .o-field{grid-gap:3px} .o-fgap-4\@md > .o-field{grid-gap:4px} .o-fgap-5\@md > .o-field{grid-gap:5px} .o-fgap-6\@md > .o-field{grid-gap:6px} .o-fgap-7\@md > .o-field{grid-gap:7px} .o-fgap-8\@md > .o-field{grid-gap:8px} .o-fgap-9\@md > .o-field{grid-gap:9px} .o-fgap-10\@md > .o-field{grid-gap:10px} .o-fgap-11\@md > .o-field{grid-gap:11px} .o-fgap-12\@md > .o-field{grid-gap:12px} .o-fgap-13\@md > .o-field{grid-gap:13px} .o-fgap-14\@md > .o-field{grid-gap:14px} .o-fgap-15\@md > .o-field{grid-gap:15px} .o-fgap-16\@md > .o-field{grid-gap:16px} .o-fgap-17\@md > .o-field{grid-gap:17px} .o-fgap-18\@md > .o-field{grid-gap:18px} .o-fgap-19\@md > .o-field{grid-gap:19px} .o-fgap-20\@md > .o-field{grid-gap:20px} .o-fgap-21\@md > .o-field{grid-gap:21px} .o-fgap-22\@md > .o-field{grid-gap:22px} .o-fgap-23\@md > .o-field{grid-gap:23px} .o-fgap-24\@md > .o-field{grid-gap:24px} .o-fgap-25\@md > .o-field{grid-gap:25px} .o-fgap-26\@md > .o-field{grid-gap:26px} .o-fgap-27\@md > .o-field{grid-gap:27px} .o-fgap-28\@md > .o-field{grid-gap:28px} .o-fgap-29\@md > .o-field{grid-gap:29px} .o-fgap-30\@md > .o-field{grid-gap:30px} .o-fgap-31\@md > .o-field{grid-gap:31px} .o-fgap-32\@md > .o-field{grid-gap:32px} .o-fgap-33\@md > .o-field{grid-gap:33px} .o-fgap-34\@md > .o-field{grid-gap:34px} .o-fgap-35\@md > .o-field{grid-gap:35px} .o-fgap-36\@md > .o-field{grid-gap:36px} .o-fgap-37\@md > .o-field{grid-gap:37px} .o-fgap-38\@md > .o-field{grid-gap:38px} .o-fgap-39\@md > .o-field{grid-gap:39px} .o-fgap-40\@md > .o-field{grid-gap:40px} .o-fgap-41\@md > .o-field{grid-gap:41px} .o-fgap-42\@md > .o-field{grid-gap:42px} .o-fgap-43\@md > .o-field{grid-gap:43px} .o-fgap-44\@md > .o-field{grid-gap:44px} .o-fgap-45\@md > .o-field{grid-gap:45px} .o-fgap-46\@md > .o-field{grid-gap:46px} .o-fgap-47\@md > .o-field{grid-gap:47px} .o-fgap-48\@md > .o-field{grid-gap:48px} } /* Small devices (landscape phones, less than 768px) (sm)*/ @media (max-width:767px){ .o-fgap-0\@sm > .o-field{grid-gap:0px} .o-fgap-1\@sm > .o-field{grid-gap:1px} .o-fgap-2\@sm > .o-field{grid-gap:2px} .o-fgap-3\@sm > .o-field{grid-gap:3px} .o-fgap-4\@sm > .o-field{grid-gap:4px} .o-fgap-5\@sm > .o-field{grid-gap:5px} .o-fgap-6\@sm > .o-field{grid-gap:6px} .o-fgap-7\@sm > .o-field{grid-gap:7px} .o-fgap-8\@sm > .o-field{grid-gap:8px} .o-fgap-9\@sm > .o-field{grid-gap:9px} .o-fgap-10\@sm > .o-field{grid-gap:10px} .o-fgap-11\@sm > .o-field{grid-gap:11px} .o-fgap-12\@sm > .o-field{grid-gap:12px} .o-fgap-13\@sm > .o-field{grid-gap:13px} .o-fgap-14\@sm > .o-field{grid-gap:14px} .o-fgap-15\@sm > .o-field{grid-gap:15px} .o-fgap-16\@sm > .o-field{grid-gap:16px} .o-fgap-17\@sm > .o-field{grid-gap:17px} .o-fgap-18\@sm > .o-field{grid-gap:18px} .o-fgap-19\@sm > .o-field{grid-gap:19px} .o-fgap-20\@sm > .o-field{grid-gap:20px} .o-fgap-21\@sm > .o-field{grid-gap:21px} .o-fgap-22\@sm > .o-field{grid-gap:22px} .o-fgap-23\@sm > .o-field{grid-gap:23px} .o-fgap-24\@sm > .o-field{grid-gap:24px} .o-fgap-25\@sm > .o-field{grid-gap:25px} .o-fgap-26\@sm > .o-field{grid-gap:26px} .o-fgap-27\@sm > .o-field{grid-gap:27px} .o-fgap-28\@sm > .o-field{grid-gap:28px} .o-fgap-29\@sm > .o-field{grid-gap:29px} .o-fgap-30\@sm > .o-field{grid-gap:30px} .o-fgap-31\@sm > .o-field{grid-gap:31px} .o-fgap-32\@sm > .o-field{grid-gap:32px} .o-fgap-33\@sm > .o-field{grid-gap:33px} .o-fgap-34\@sm > .o-field{grid-gap:34px} .o-fgap-35\@sm > .o-field{grid-gap:35px} .o-fgap-36\@sm > .o-field{grid-gap:36px} .o-fgap-37\@sm > .o-field{grid-gap:37px} .o-fgap-38\@sm > .o-field{grid-gap:38px} .o-fgap-39\@sm > .o-field{grid-gap:39px} .o-fgap-40\@sm > .o-field{grid-gap:40px} .o-fgap-41\@sm > .o-field{grid-gap:41px} .o-fgap-42\@sm > .o-field{grid-gap:42px} .o-fgap-43\@sm > .o-field{grid-gap:43px} .o-fgap-44\@sm > .o-field{grid-gap:44px} .o-fgap-45\@sm > .o-field{grid-gap:45px} .o-fgap-46\@sm > .o-field{grid-gap:46px} .o-fgap-47\@sm > .o-field{grid-gap:47px} .o-fgap-48\@sm > .o-field{grid-gap:48px} } /* Extra small devices (portrait phones, less than 533px) (xs)*/ @media (max-width:532px){ .o-fgap-0\@xs > .o-field{grid-gap:0px} .o-fgap-1\@xs > .o-field{grid-gap:1px} .o-fgap-2\@xs > .o-field{grid-gap:2px} .o-fgap-3\@xs > .o-field{grid-gap:3px} .o-fgap-4\@xs > .o-field{grid-gap:4px} .o-fgap-5\@xs > .o-field{grid-gap:5px} .o-fgap-6\@xs > .o-field{grid-gap:6px} .o-fgap-7\@xs > .o-field{grid-gap:7px} .o-fgap-8\@xs > .o-field{grid-gap:8px} .o-fgap-9\@xs > .o-field{grid-gap:9px} .o-fgap-10\@xs > .o-field{grid-gap:10px} .o-fgap-11\@xs > .o-field{grid-gap:11px} .o-fgap-12\@xs > .o-field{grid-gap:12px} .o-fgap-13\@xs > .o-field{grid-gap:13px} .o-fgap-14\@xs > .o-field{grid-gap:14px} .o-fgap-15\@xs > .o-field{grid-gap:15px} .o-fgap-16\@xs > .o-field{grid-gap:16px} .o-fgap-17\@xs > .o-field{grid-gap:17px} .o-fgap-18\@xs > .o-field{grid-gap:18px} .o-fgap-19\@xs > .o-field{grid-gap:19px} .o-fgap-20\@xs > .o-field{grid-gap:20px} .o-fgap-21\@xs > .o-field{grid-gap:21px} .o-fgap-22\@xs > .o-field{grid-gap:22px} .o-fgap-23\@xs > .o-field{grid-gap:23px} .o-fgap-24\@xs > .o-field{grid-gap:24px} .o-fgap-25\@xs > .o-field{grid-gap:25px} .o-fgap-26\@xs > .o-field{grid-gap:26px} .o-fgap-27\@xs > .o-field{grid-gap:27px} .o-fgap-28\@xs > .o-field{grid-gap:28px} .o-fgap-29\@xs > .o-field{grid-gap:29px} .o-fgap-30\@xs > .o-field{grid-gap:30px} .o-fgap-31\@xs > .o-field{grid-gap:31px} .o-fgap-32\@xs > .o-field{grid-gap:32px} .o-fgap-33\@xs > .o-field{grid-gap:33px} .o-fgap-34\@xs > .o-field{grid-gap:34px} .o-fgap-35\@xs > .o-field{grid-gap:35px} .o-fgap-36\@xs > .o-field{grid-gap:36px} .o-fgap-37\@xs > .o-field{grid-gap:37px} .o-fgap-38\@xs > .o-field{grid-gap:38px} .o-fgap-39\@xs > .o-field{grid-gap:39px} .o-fgap-40\@xs > .o-field{grid-gap:40px} .o-fgap-41\@xs > .o-field{grid-gap:41px} .o-fgap-42\@xs > .o-field{grid-gap:42px} .o-fgap-43\@xs > .o-field{grid-gap:43px} .o-fgap-44\@xs > .o-field{grid-gap:44px} .o-fgap-45\@xs > .o-field{grid-gap:45px} .o-fgap-46\@xs > .o-field{grid-gap:46px} .o-fgap-47\@xs > .o-field{grid-gap:47px} .o-fgap-48\@xs > .o-field{grid-gap:48px} } /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-split-col ------------------------------ ----------------------------------------------------------------------------- */ [class*="o-split-col"]{list-style:none;padding:0;margin:0;-webkit-column-fill:balance;column-fill:balance;width:100%;} [class*="o-split-col"] > li{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:start;align-content:flex-start;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-wrap:nowrap;flex-wrap:nowrap;} [class*="o-split-col"] > li .o-label-2{padding-left:0;padding-right:8px;} [class*="o-split-col"] > li .o-label-2{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;} [class*="o-split-col"] > li .o-label-2 > label{} [class*="o-split-col"] > li .o-label-2 > label > span{display:inline-block;} [class*="o-split-col"] > li .o-input-2{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;display:-webkit-box;display:-ms-flexbox;display:flex;} [class*="o-split-col"] > li .o-input-2 input[type="checkbox"] {margin-top: 2px;} .o-split-col-1\@n{-webkit-column-count:1;column-count:1;} .o-split-col-2\@n{-webkit-column-count:2;column-count:2;} .o-split-col-3\@n{-webkit-column-count:3;column-count:3;} .o-split-col-4\@n{-webkit-column-count:4;column-count:4;} .o-split-col-5\@n{-webkit-column-count:5;column-count:5;} .o-split-col-6\@n{-webkit-column-count:6;column-count:6;} .o-split-col-7\@n{-webkit-column-count:7;column-count:7;} .o-split-col-8\@n{-webkit-column-count:8;column-count:8;} .o-split-col-9\@n{-webkit-column-count:9;column-count:9;} .o-split-col-10\@n{-webkit-column-count:10;column-count:10;} .o-split-col-11\@n{-webkit-column-count:11;column-count:11;} .o-split-col-12\@n{-webkit-column-count:12;column-count:12;} /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-split-gap ------------------------------ ----------------------------------------------------------------------------- */ .o-split-gap-0\@n{-webkit-column-gap:0px;column-gap:0px;} .o-split-gap-1\@n{-webkit-column-gap:1px;column-gap:1px;} .o-split-gap-2\@n{-webkit-column-gap:2px;column-gap:2px;} .o-split-gap-3\@n{-webkit-column-gap:3px;column-gap:3px;} .o-split-gap-4\@n{-webkit-column-gap:4px;column-gap:4px;} .o-split-gap-5\@n{-webkit-column-gap:5px;column-gap:5px;} .o-split-gap-6\@n{-webkit-column-gap:6px;column-gap:6px;} .o-split-gap-7\@n{-webkit-column-gap:7px;column-gap:7px;} .o-split-gap-8\@n{-webkit-column-gap:8px;column-gap:8px;} .o-split-gap-9\@n{-webkit-column-gap:9px;column-gap:9px;} .o-split-gap-10\@n{-webkit-column-gap:10px;column-gap:10px;} .o-split-gap-11\@n{-webkit-column-gap:11px;column-gap:11px;} .o-split-gap-12\@n{-webkit-column-gap:12px;column-gap:12px;} .o-split-gap-13\@n{-webkit-column-gap:13px;column-gap:13px;} .o-split-gap-14\@n{-webkit-column-gap:14px;column-gap:14px;} .o-split-gap-15\@n{-webkit-column-gap:15px;column-gap:15px;} .o-split-gap-16\@n{-webkit-column-gap:16px;column-gap:16px;} .o-split-gap-17\@n{-webkit-column-gap:17px;column-gap:17px;} .o-split-gap-18\@n{-webkit-column-gap:18px;column-gap:18px;} .o-split-gap-19\@n{-webkit-column-gap:19px;column-gap:19px;} .o-split-gap-20\@n{-webkit-column-gap:20px;column-gap:20px;} .o-split-gap-21\@n{-webkit-column-gap:21px;column-gap:21px;} .o-split-gap-22\@n{-webkit-column-gap:22px;column-gap:22px;} .o-split-gap-23\@n{-webkit-column-gap:23px;column-gap:23px;} .o-split-gap-24\@n{-webkit-column-gap:24px;column-gap:24px;} .o-split-gap-25\@n{-webkit-column-gap:25px;column-gap:25px;} .o-split-gap-26\@n{-webkit-column-gap:26px;column-gap:26px;} .o-split-gap-27\@n{-webkit-column-gap:27px;column-gap:27px;} .o-split-gap-28\@n{-webkit-column-gap:28px;column-gap:28px;} .o-split-gap-29\@n{-webkit-column-gap:29px;column-gap:29px;} .o-split-gap-30\@n{-webkit-column-gap:30px;column-gap:30px;} .o-split-gap-31\@n{-webkit-column-gap:31px;column-gap:31px;} .o-split-gap-32\@n{-webkit-column-gap:32px;column-gap:32px;} .o-split-gap-33\@n{-webkit-column-gap:33px;column-gap:33px;} .o-split-gap-34\@n{-webkit-column-gap:34px;column-gap:34px;} .o-split-gap-35\@n{-webkit-column-gap:35px;column-gap:35px;} .o-split-gap-36\@n{-webkit-column-gap:36px;column-gap:36px;} .o-split-gap-37\@n{-webkit-column-gap:37px;column-gap:37px;} .o-split-gap-38\@n{-webkit-column-gap:38px;column-gap:38px;} .o-split-gap-39\@n{-webkit-column-gap:39px;column-gap:39px;} .o-split-gap-40\@n{-webkit-column-gap:40px;column-gap:40px;} .o-split-gap-41\@n{-webkit-column-gap:41px;column-gap:41px;} .o-split-gap-42\@n{-webkit-column-gap:42px;column-gap:42px;} .o-split-gap-43\@n{-webkit-column-gap:43px;column-gap:43px;} .o-split-gap-44\@n{-webkit-column-gap:44px;column-gap:44px;} .o-split-gap-45\@n{-webkit-column-gap:45px;column-gap:45px;} .o-split-gap-46\@n{-webkit-column-gap:46px;column-gap:46px;} .o-split-gap-47\@n{-webkit-column-gap:47px;column-gap:47px;} .o-split-gap-48\@n{-webkit-column-gap:48px;column-gap:48px;} /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-split-rule ----------------------------- ----------------------------------------------------------------------------- */ .o-split-rule\@n{-webkit-column-rule-width:1px;column-rule-width:1px;-webkit-column-rule-style:solid;column-rule-style:solid;-webkit-column-rule-color:#000;column-rule-color:#000;} /* ----------------------------------------------------------------------------- ------------------------------- CLASS o-split-reverse---------------------------- ----------------------------------------------------------------------------- */ [class*="o-split-col"].o-split-reverse\@n > li{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;} [class*="o-split-col"].o-split-reverse\@n > li .o-label-2{padding-left:8px;padding-right:0;}