/home/arranoyd/empl/wp-content/plugins/redux-framework/redux-templates/src/scss/common.scss
// Most used breakpoints
$break-huge: 1440px;
$break-wide: 1280px;
$break-large: 960px; // admin sidebar auto folds. Breakpoint for tablet
$break-medium: 782px; // adminbar goes big
$break-small: 600px; // Breakpoint for mobile
$break-mobile: 480px;
$break-js-tablet: 1025px;
$break-js-mobile: 768px;
[class*="ugb-"] form[class*="-link"],
form[class*="ugb-"][class*="-link"],
[class*="ugb-"] + form[class*="-link"] {
display: flex;
justify-content: center;
align-items: center;
}
// Text margin bottom
$text-margin-bottom: 16px;
// Box
$box-radius: 12px;
$box-hori-padding: 35px;
$box-vert-padding: 40px;
@mixin boxNoPadding() {
box-shadow: 0 5px 5px 0 rgba(18, 63, 82, 0.035), 0 0 0 1px rgba(176, 181, 193, 0.2);
background-color: #fff;
border-radius: $box-radius;
overflow: hidden;
}
@mixin box() {
@include boxNoPadding();
padding: $box-vert-padding $box-hori-padding;
@media screen and (max-width: $break-medium) {
padding: ($box-vert-padding * 2/3) ($box-hori-padding * 2/3);
}
@media screen and (max-width: $break-small) {
padding: $box-hori-padding ($box-hori-padding / 2);
}
}