css/jetbrains-bundle/utility-classes.css (872 lines of code) (raw):

/** * Dependencies */ /** * @name Core config file * @version 1.0 * @description Config on core styles */ /** * Dependencies */ /** * @name Utils * @collection core * @description Base utils on core */ /** * Dependencies */ /** * @name Core config file * @version 1.0 * @description Config on core styles */ /** * Dependencies */ /** * Make retina media query * Returns the @content (This mixin is helper) * @returns {String} */ /** * Make print media query * Returns the @content (This mixin is helper) * @returns {String} */ /** * @name Breakpoints * @collection core * @example-file ./examples.html */ /** * Dependencies */ /** * Dependencies */ /** * @name Utils * @collection core * @description Base utils on core */ /** * Dependencies */ /** * @name Core config file * @version 1.0 * @description Config on core styles */ /** * Dependencies */ /** * Make retina media query * Returns the @content (This mixin is helper) * @returns {String} */ /** * Make print media query * Returns the @content (This mixin is helper) * @returns {String} */ /** * Dependencies */ /** * Dependencies */ /** * @name Utils * @collection core * @description Base utils on core */ /** * Dependencies */ /** * @name Core config file * @version 1.0 * @description Config on core styles */ /** * Dependencies */ /** * Make retina media query * Returns the @content (This mixin is helper) * @returns {String} */ /** * Make print media query * Returns the @content (This mixin is helper) * @returns {String} */ /** * Create media query UP or DOWN * @param {String|Number} $key * @param {String|Number} $value * @param {String} $direction * @private * @returns {String} */ /** * Create media query between two values * @param {String|Number} $value1 * @param {String|Number} $value2 * @private * @returns {String} */ /** * Validate and get media breakpoint * @param {String|Number} $key * @param {Map} $breakpoints-with-default * @private * @returns {String} */ /** * Create media breakpoint or simple styles without a breakpoint * @param {String|Number} $key * @param {Map} $breakpoints-with-default * @param {String} $direction down|up * @returns {String} */ /** * Create all breakpoints. * .CLASS_NAME-sm, .CLASS_NAME-md etc. * @param {String} $selector * @param {Map} $breakpoints-with-default * @param {String} $direction down|up * @returns {String} */ /** * Create DOWN media breakpoints * @example @media screen and (max-width: BREAK_SIZE) { ... } * @param {String|Number} $breakpoint * @param {Map} $breakpoints-with-default * @returns {String} */ /** * Create UP media breakpoints * @example @media screen and (min-width: BREAK_SIZE) { ... } * @param {String|Number} $breakpoint * @param {Map} $breakpoints-with-default * @returns {String} */ /** * Create media breakpoints between UP and Down * @example @media screen and (min-width: BREAK_SIZE_1) and (max-width: BREAK_SIZE_2) { ... } * @param {String|Number} $breakpoint-up * @param {String|Number} $breakpoint-down * @param {Map} $breakpoints-with-default * @returns {String} */ .text-left { text-align: left; } @media screen and (max-width: 1440px) { .text-left-xlg { text-align: left; } } @media screen and (max-width: 1200px) { .text-left-lg { text-align: left; } } @media screen and (max-width: 960px) { .text-left-md { text-align: left; } } @media screen and (max-width: 640px) { .text-left-sm { text-align: left; } } .text-right { text-align: right; } @media screen and (max-width: 1440px) { .text-right-xlg { text-align: right; } } @media screen and (max-width: 1200px) { .text-right-lg { text-align: right; } } @media screen and (max-width: 960px) { .text-right-md { text-align: right; } } @media screen and (max-width: 640px) { .text-right-sm { text-align: right; } } .text-center { text-align: center; } @media screen and (max-width: 1440px) { .text-center-xlg { text-align: center; } } @media screen and (max-width: 1200px) { .text-center-lg { text-align: center; } } @media screen and (max-width: 960px) { .text-center-md { text-align: center; } } @media screen and (max-width: 640px) { .text-center-sm { text-align: center; } } .text-justify { text-align: justify; } @media screen and (max-width: 1440px) { .text-justify-xlg { text-align: justify; } } @media screen and (max-width: 1200px) { .text-justify-lg { text-align: justify; } } @media screen and (max-width: 960px) { .text-justify-md { text-align: justify; } } @media screen and (max-width: 640px) { .text-justify-sm { text-align: justify; } } .text-nowrap { white-space: nowrap; } @media screen and (max-width: 1440px) { .text-nowrap-xlg { white-space: nowrap; } } @media screen and (max-width: 1200px) { .text-nowrap-lg { white-space: nowrap; } } @media screen and (max-width: 960px) { .text-nowrap-md { white-space: nowrap; } } @media screen and (max-width: 640px) { .text-nowrap-sm { white-space: nowrap; } } .text-lowercase { text-transform: lowercase; } @media screen and (max-width: 1440px) { .text-lowercase-xlg { text-transform: lowercase; } } @media screen and (max-width: 1200px) { .text-lowercase-lg { text-transform: lowercase; } } @media screen and (max-width: 960px) { .text-lowercase-md { text-transform: lowercase; } } @media screen and (max-width: 640px) { .text-lowercase-sm { text-transform: lowercase; } } .text-uppercase { text-transform: uppercase; } @media screen and (max-width: 1440px) { .text-uppercase-xlg { text-transform: uppercase; } } @media screen and (max-width: 1200px) { .text-uppercase-lg { text-transform: uppercase; } } @media screen and (max-width: 960px) { .text-uppercase-md { text-transform: uppercase; } } @media screen and (max-width: 640px) { .text-uppercase-sm { text-transform: uppercase; } } .text-capitalize { text-transform: capitalize; } @media screen and (max-width: 1440px) { .text-capitalize-xlg { text-transform: capitalize; } } @media screen and (max-width: 1200px) { .text-capitalize-lg { text-transform: capitalize; } } @media screen and (max-width: 960px) { .text-capitalize-md { text-transform: capitalize; } } @media screen and (max-width: 640px) { .text-capitalize-sm { text-transform: capitalize; } } .text-line-through { text-decoration: line-through; } @media screen and (max-width: 1440px) { .text-line-through-xlg { text-decoration: line-through; } } @media screen and (max-width: 1200px) { .text-line-through-lg { text-decoration: line-through; } } @media screen and (max-width: 960px) { .text-line-through-md { text-decoration: line-through; } } @media screen and (max-width: 640px) { .text-line-through-sm { text-decoration: line-through; } } .text-ellipsis { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; } @media screen and (max-width: 1440px) { .text-ellipsis-xlg { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; } } @media screen and (max-width: 1200px) { .text-ellipsis-lg { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; } } @media screen and (max-width: 960px) { .text-ellipsis-md { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; } } @media screen and (max-width: 640px) { .text-ellipsis-sm { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; } } .float-left { float: left; } .float-left::before, .float-left::after { display: table; content: ''; } .float-left::after { clear: both; } @media screen and (max-width: 1440px) { .float-left-xlg { float: left; } .float-left-xlg::before, .float-left-xlg::after { display: table; content: ''; } .float-left-xlg::after { clear: both; } } @media screen and (max-width: 1200px) { .float-left-lg { float: left; } .float-left-lg::before, .float-left-lg::after { display: table; content: ''; } .float-left-lg::after { clear: both; } } @media screen and (max-width: 960px) { .float-left-md { float: left; } .float-left-md::before, .float-left-md::after { display: table; content: ''; } .float-left-md::after { clear: both; } } @media screen and (max-width: 640px) { .float-left-sm { float: left; } .float-left-sm::before, .float-left-sm::after { display: table; content: ''; } .float-left-sm::after { clear: both; } } .float-right { float: right; } .float-right::before, .float-right::after { display: table; content: ''; } .float-right::after { clear: both; } @media screen and (max-width: 1440px) { .float-right-xlg { float: right; } .float-right-xlg::before, .float-right-xlg::after { display: table; content: ''; } .float-right-xlg::after { clear: both; } } @media screen and (max-width: 1200px) { .float-right-lg { float: right; } .float-right-lg::before, .float-right-lg::after { display: table; content: ''; } .float-right-lg::after { clear: both; } } @media screen and (max-width: 960px) { .float-right-md { float: right; } .float-right-md::before, .float-right-md::after { display: table; content: ''; } .float-right-md::after { clear: both; } } @media screen and (max-width: 640px) { .float-right-sm { float: right; } .float-right-sm::before, .float-right-sm::after { display: table; content: ''; } .float-right-sm::after { clear: both; } } .float-none { float: none; } @media screen and (max-width: 1440px) { .float-none-xlg { float: none; } } @media screen and (max-width: 1200px) { .float-none-lg { float: none; } } @media screen and (max-width: 960px) { .float-none-md { float: none; } } @media screen and (max-width: 640px) { .float-none-sm { float: none; } } .clearfix::before, .clearfix::after { display: table; content: ''; } .clearfix::after { clear: both; } .hidden { display: none !important; } @media screen and (max-width: 1440px) { .hidden-xlg { display: none !important; } } @media screen and (max-width: 1200px) { .hidden-lg { display: none !important; } } @media screen and (max-width: 960px) { .hidden-md { display: none !important; } } @media screen and (max-width: 640px) { .hidden-sm { display: none !important; } } .visible { display: block !important; } @media screen and (max-width: 1440px) { .visible-xlg { display: block !important; } } @media screen and (max-width: 1200px) { .visible-lg { display: block !important; } } @media screen and (max-width: 960px) { .visible-md { display: block !important; } } @media screen and (max-width: 640px) { .visible-sm { display: block !important; } } .visible-inline { display: inline-block !important; } @media screen and (max-width: 1440px) { .visible-inline-xlg { display: inline-block !important; } } @media screen and (max-width: 1200px) { .visible-inline-lg { display: inline-block !important; } } @media screen and (max-width: 960px) { .visible-inline-md { display: inline-block !important; } } @media screen and (max-width: 640px) { .visible-inline-sm { display: inline-block !important; } } .margin-auto { display: block; margin-right: auto; margin-left: auto; } @media screen and (max-width: 1440px) { .margin-auto-xlg { display: block; margin-right: auto; margin-left: auto; } } @media screen and (max-width: 1200px) { .margin-auto-lg { display: block; margin-right: auto; margin-left: auto; } } @media screen and (max-width: 960px) { .margin-auto-md { display: block; margin-right: auto; margin-left: auto; } } @media screen and (max-width: 640px) { .margin-auto-sm { display: block; margin-right: auto; margin-left: auto; } } .no-margin-top { margin-top: 0 !important; } @media screen and (max-width: 1440px) { .no-margin-top-xlg { margin-top: 0 !important; } } @media screen and (max-width: 1200px) { .no-margin-top-lg { margin-top: 0 !important; } } @media screen and (max-width: 960px) { .no-margin-top-md { margin-top: 0 !important; } } @media screen and (max-width: 640px) { .no-margin-top-sm { margin-top: 0 !important; } } .no-margin-right { margin-right: 0 !important; } @media screen and (max-width: 1440px) { .no-margin-right-xlg { margin-right: 0 !important; } } @media screen and (max-width: 1200px) { .no-margin-right-lg { margin-right: 0 !important; } } @media screen and (max-width: 960px) { .no-margin-right-md { margin-right: 0 !important; } } @media screen and (max-width: 640px) { .no-margin-right-sm { margin-right: 0 !important; } } .no-margin-bottom { margin-bottom: 0 !important; } @media screen and (max-width: 1440px) { .no-margin-bottom-xlg { margin-bottom: 0 !important; } } @media screen and (max-width: 1200px) { .no-margin-bottom-lg { margin-bottom: 0 !important; } } @media screen and (max-width: 960px) { .no-margin-bottom-md { margin-bottom: 0 !important; } } @media screen and (max-width: 640px) { .no-margin-bottom-sm { margin-bottom: 0 !important; } } .no-margin-left { margin-left: 0 !important; } @media screen and (max-width: 1440px) { .no-margin-left-xlg { margin-left: 0 !important; } } @media screen and (max-width: 1200px) { .no-margin-left-lg { margin-left: 0 !important; } } @media screen and (max-width: 960px) { .no-margin-left-md { margin-left: 0 !important; } } @media screen and (max-width: 640px) { .no-margin-left-sm { margin-left: 0 !important; } } .margin-top-vertical-unit { margin-top: 50px; } @media screen and (max-width: 1440px) { .margin-top-vertical-unit-xlg { margin-top: 50px; } } @media screen and (max-width: 1200px) { .margin-top-vertical-unit-lg { margin-top: 50px; } } @media screen and (max-width: 960px) { .margin-top-vertical-unit-md { margin-top: 50px; } } @media screen and (max-width: 640px) { .margin-top-vertical-unit-sm { margin-top: 50px; } } .article-content .margin-top-vertical-unit { margin-top: 50px; } @media screen and (max-width: 1440px) { .article-content .margin-top-vertical-unit-xlg { margin-top: 50px; } } @media screen and (max-width: 1200px) { .article-content .margin-top-vertical-unit-lg { margin-top: 50px; } } @media screen and (max-width: 960px) { .article-content .margin-top-vertical-unit-md { margin-top: 50px; } } @media screen and (max-width: 640px) { .article-content .margin-top-vertical-unit-sm { margin-top: 50px; } } .margin-bottom-vertical-unit { margin-bottom: 50px; } @media screen and (max-width: 1440px) { .margin-bottom-vertical-unit-xlg { margin-bottom: 50px; } } @media screen and (max-width: 1200px) { .margin-bottom-vertical-unit-lg { margin-bottom: 50px; } } @media screen and (max-width: 960px) { .margin-bottom-vertical-unit-md { margin-bottom: 50px; } } @media screen and (max-width: 640px) { .margin-bottom-vertical-unit-sm { margin-bottom: 50px; } } .article-content .margin-bottom-vertical-unit { margin-bottom: 50px; } @media screen and (max-width: 1440px) { .article-content .margin-bottom-vertical-unit-xlg { margin-bottom: 50px; } } @media screen and (max-width: 1200px) { .article-content .margin-bottom-vertical-unit-lg { margin-bottom: 50px; } } @media screen and (max-width: 960px) { .article-content .margin-bottom-vertical-unit-md { margin-bottom: 50px; } } @media screen and (max-width: 640px) { .article-content .margin-bottom-vertical-unit-sm { margin-bottom: 50px; } } .margin-top-vertical-unit-half { margin-top: 25px; } @media screen and (max-width: 1440px) { .margin-top-vertical-unit-half-xlg { margin-top: 25px; } } @media screen and (max-width: 1200px) { .margin-top-vertical-unit-half-lg { margin-top: 25px; } } @media screen and (max-width: 960px) { .margin-top-vertical-unit-half-md { margin-top: 25px; } } @media screen and (max-width: 640px) { .margin-top-vertical-unit-half-sm { margin-top: 25px; } } .article-content .margin-top-vertical-unit-half { margin-top: 25px; } @media screen and (max-width: 1440px) { .article-content .margin-top-vertical-unit-half-xlg { margin-top: 25px; } } @media screen and (max-width: 1200px) { .article-content .margin-top-vertical-unit-half-lg { margin-top: 25px; } } @media screen and (max-width: 960px) { .article-content .margin-top-vertical-unit-half-md { margin-top: 25px; } } @media screen and (max-width: 640px) { .article-content .margin-top-vertical-unit-half-sm { margin-top: 25px; } } .margin-bottom-vertical-unit-half { margin-bottom: 25px; } @media screen and (max-width: 1440px) { .margin-bottom-vertical-unit-half-xlg { margin-bottom: 25px; } } @media screen and (max-width: 1200px) { .margin-bottom-vertical-unit-half-lg { margin-bottom: 25px; } } @media screen and (max-width: 960px) { .margin-bottom-vertical-unit-half-md { margin-bottom: 25px; } } @media screen and (max-width: 640px) { .margin-bottom-vertical-unit-half-sm { margin-bottom: 25px; } } .article-content .margin-bottom-vertical-unit-half { margin-bottom: 25px; } @media screen and (max-width: 1440px) { .article-content .margin-bottom-vertical-unit-half-xlg { margin-bottom: 25px; } } @media screen and (max-width: 1200px) { .article-content .margin-bottom-vertical-unit-half-lg { margin-bottom: 25px; } } @media screen and (max-width: 960px) { .article-content .margin-bottom-vertical-unit-half-md { margin-bottom: 25px; } } @media screen and (max-width: 640px) { .article-content .margin-bottom-vertical-unit-half-sm { margin-bottom: 25px; } } .no-padding-top { padding-top: 0 !important; } @media screen and (max-width: 1440px) { .no-padding-top-xlg { padding-top: 0 !important; } } @media screen and (max-width: 1200px) { .no-padding-top-lg { padding-top: 0 !important; } } @media screen and (max-width: 960px) { .no-padding-top-md { padding-top: 0 !important; } } @media screen and (max-width: 640px) { .no-padding-top-sm { padding-top: 0 !important; } } .no-padding-bottom { padding-bottom: 0 !important; } @media screen and (max-width: 1440px) { .no-padding-bottom-xlg { padding-bottom: 0 !important; } } @media screen and (max-width: 1200px) { .no-padding-bottom-lg { padding-bottom: 0 !important; } } @media screen and (max-width: 960px) { .no-padding-bottom-md { padding-bottom: 0 !important; } } @media screen and (max-width: 640px) { .no-padding-bottom-sm { padding-bottom: 0 !important; } } .no-padding-left { padding-left: 0 !important; } @media screen and (max-width: 1440px) { .no-padding-left-xlg { padding-left: 0 !important; } } @media screen and (max-width: 1200px) { .no-padding-left-lg { padding-left: 0 !important; } } @media screen and (max-width: 960px) { .no-padding-left-md { padding-left: 0 !important; } } @media screen and (max-width: 640px) { .no-padding-left-sm { padding-left: 0 !important; } } .no-padding-right { padding-right: 0 !important; } @media screen and (max-width: 1440px) { .no-padding-right-xlg { padding-right: 0 !important; } } @media screen and (max-width: 1200px) { .no-padding-right-lg { padding-right: 0 !important; } } @media screen and (max-width: 960px) { .no-padding-right-md { padding-right: 0 !important; } } @media screen and (max-width: 640px) { .no-padding-right-sm { padding-right: 0 !important; } } .z-index-1 { z-index: 1; } .position-relative { position: relative; } ._border-top { padding-top: 30px; padding-bottom: 20px; border-top: 1px solid #cccbcb; }