@import "vendor/rfs";
@import "mixins/deprecate";
@import "mixins/breakpoints";
@import "mixins/color-scheme";
@import "mixins/image";
@import "mixins/resize";
@import "mixins/visually-hidden";
@import "mixins/reset-text";
@import "mixins/text-truncate";
@import "mixins/utilities";
@import "mixins/alert";
@import "mixins/backdrop";
@import "mixins/buttons";
@import "mixins/caret";
@import "mixins/pagination";
@import "mixins/lists";
@import "mixins/list-group";
@import "mixins/forms";
@import "mixins/table-variants";
@import "mixins/border-radius";
@import "mixins/box-shadow";
@import "mixins/gradients";
@import "mixins/transition";
@import "mixins/clearfix";
@import "mixins/container";
@import "mixins/grid";
@import "functions";
@import "variables";
@import "mixins";
@import "utilities";
@import "root";
@import "reboot";
@import "type";
@import "images";
@import "containers";
@import "grid";
@import "tables";
@import "forms";
@import "buttons";
@import "transitions";
@import "dropdown";
@import "button-group";
@import "nav";
@import "navbar";
@import "card";
@import "accordion";
@import "breadcrumb";
@import "pagination";
@import "badge";
@import "alert";
@import "progress";
@import "list-group";
@import "close";
@import "toasts";
@import "modal";
@import "tooltip";
@import "popover";
@import "carousel";
@import "spinners";
@import "offcanvas";
@import "placeholders";
@import "helpers";
@import "utilities/api";
@import url("https://fonts.googleapis.com/css?family=#
@import url("/web/content/#
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');

/* /web/static/lib/bootstrap/scss/_functions.scss */
// Bootstrap functions // // Utility mixins and functions for evaluating source code across our variables, maps, and mixins. // Ascending // Used to evaluate Sass maps like our grid breakpoints. @mixin _assert-ascending($map, $map-name){$prev-key: null; $prev-num: null; @each $key, $num in $map{@if $prev-num == null or unit($num) == "%" or unit($prev-num) == "%"{// Do nothing}@else if not comparable($prev-num, $num){@warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num}whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";}@else if $prev-num >= $num{@warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num}which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !";}$prev-key: $key; $prev-num: $num;}}// Starts at zero // Used to ensure the min-width of the lowest breakpoint starts at 0. @mixin _assert-starts-at-zero($map, $map-name: "$grid-breakpoints"){@if length($map) > 0{$values: map-values($map); $first-value: nth($values, 1); @if $first-value != 0{@warn "First breakpoint in #{$map-name}must start at 0, but starts at #{$first-value}.";}}}// Colors @function to-rgb($value){@return red($value), green($value), blue($value);}// stylelint-disable scss/dollar-variable-pattern @function rgba-css-var($identifier, $target){@if $identifier == "body" and $target == "bg"{@return rgba(var(--#{$variable-prefix}#{$identifier}-bg-rgb), var(--#{$variable-prefix}#{$target}-opacity));}@if $identifier == "body" and $target == "text"{@return rgba(var(--#{$variable-prefix}#{$identifier}-color-rgb), var(--#{$variable-prefix}#{$target}-opacity));}@else{@return rgba(var(--#{$variable-prefix}#{$identifier}-rgb), var(--#{$variable-prefix}#{$target}-opacity));}}@function map-loop($map, $func, $args...){$_map: (); @each $key, $value in $map{// allow to pass the $key and $value of the map as an function argument $_args: (); @each $arg in $args{$_args: append($_args, if($arg == "$key", $key, if($arg == "$value", $value, $arg)));}$_map: map-merge($_map, ($key: call(get-function($func), $_args...)));}@return $_map;}// stylelint-enable scss/dollar-variable-pattern @function varify($list){$result: null; @each $entry in $list{$result: append($result, var(--#{$variable-prefix}#{$entry}), space);}@return $result;}// Internal Bootstrap function to turn maps into its negative variant. // It prefixes the keys with `n` and makes the value negative. @function negativify-map($map){$result: (); @each $key, $value in $map{@if $key != 0{$result: map-merge($result, ("n" + $key: (-$value)));}}@return $result;}// Get multiple keys from a sass map @function map-get-multiple($map, $values){$result: (); @each $key, $value in $map{@if (index($values, $key) != null){$result: map-merge($result, ($key: $value));}}@return $result;}// Merge multiple maps @function map-merge-multiple($maps...){$merged-maps: (); @each $map in $maps{$merged-maps: map-merge($merged-maps, $map);}@return $merged-maps;}// Replace `$search` with `$replace` in `$string` // Used on our SVG icon backgrounds for custom forms. // // @author Hugo Giraudel // @param{String}$string - Initial string // @param{String}$search - Substring to replace // @param{String}$replace ('') - New value // @return{String}- Updated string @function str-replace($string, $search, $replace: ""){$index: str-index($string, $search); @if $index{@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);}@return $string;}// See https://codepen.io/kevinweber/pen/dXWoRw // // Requires the use of quotes around data URIs. @function escape-svg($string){@if str-index($string, "data:image/svg+xml"){@each $char, $encoded in $escaped-characters{// Do not escape the url brackets @if str-index($string, "url(") == 1{$string: url("#{str-replace(str-slice($string, 6, -3), $char, $encoded)}");}@else{$string: str-replace($string, $char, $encoded);}}}@return $string;}// Color contrast // See https://github.com/twbs/bootstrap/pull/30168 // A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255) // stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0123 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1; @function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio){$foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black; $max-ratio: 0; $max-ratio-color: null; @each $color in $foregrounds{$contrast-ratio: contrast-ratio($background, $color); @if $contrast-ratio > $min-contrast-ratio{@return $color;}@else if $contrast-ratio > $max-ratio{$max-ratio: $contrast-ratio; $max-ratio-color: $color;}}@warn "Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}..."; @return $max-ratio-color;}@function contrast-ratio($background, $foreground: $color-contrast-light){$l1: luminance($background); $l2: luminance(opaque($background, $foreground)); @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));}// Return WCAG2.0 relative luminance // See https://www.w3.org/WAI/GL/wiki/Relative_luminance // See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests @function luminance($color){$rgb: ( "r": red($color), "g": green($color), "b": blue($color) ); @each $name, $value in $rgb{$value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1)); $rgb: map-merge($rgb, ($name: $value));}@return (map-get($rgb, "r") * .2126) + (map-get($rgb, "g") * .7152) + (map-get($rgb, "b") * .0722);}// Return opaque color // opaque(#fff, rgba(0, 0, 0, .5)) => #808080 @function opaque($background, $foreground){@return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);}// scss-docs-start color-functions // Tint a color: mix a color with white @function tint-color($color, $weight){@return mix(white, $color, $weight);}// Shade a color: mix a color with black @function shade-color($color, $weight){@return mix(black, $color, $weight);}// Shade the color if the weight is positive, else tint it @function shift-color($color, $weight){@return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));}// scss-docs-end color-functions // Return valid calc @function add($value1, $value2, $return-calc: true){@if $value1 == null{@return $value2;}@if $value2 == null{@return $value1;}@if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2){@return $value1 + $value2;}@return if($return-calc == true, calc(#{$value1}+ #{$value2}), $value1 + unquote(" + ") + $value2);}@function subtract($value1, $value2, $return-calc: true){@if $value1 == null and $value2 == null{@return null;}@if $value1 == null{@return -$value2;}@if $value2 == null{@return $value1;}@if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2){@return $value1 - $value2;}@if type-of($value2) != number{$value2: unquote("(") + $value2 + unquote(")");}@return if($return-calc == true, calc(#{$value1}- #{$value2}), $value1 + unquote(" - ") + $value2);}@function divide($dividend, $divisor, $precision: 10){$sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1); $dividend: abs($dividend); $divisor: abs($divisor); @if $dividend == 0{@return 0;}@if $divisor == 0{@error "Cannot divide by 0";}$remainder: $dividend; $result: 0; $factor: 10; @while ($remainder > 0 and $precision >= 0){$quotient: 0; @while ($remainder >= $divisor){$remainder: $remainder - $divisor; $quotient: $quotient + 1;}$result: $result * 10 + $quotient; $factor: $factor * .1; $remainder: $remainder * 10; $precision: $precision - 1; @if ($precision < 0 and $remainder >= $divisor * 5){$result: $result + 1;}}$result: $result * $factor * $sign; $dividend-unit: unit($dividend); $divisor-unit: unit($divisor); $unit-map: ( "px": 1px, "rem": 1rem, "em": 1em, "%": 1% ); @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)){$result: $result * map-get($unit-map, $dividend-unit);}@return $result;}

/* /web/static/lib/bootstrap/scss/_mixins.scss */
// Toggles // // Used in conjunction with global variables to enable certain theme features. // Vendor  // Deprecate  // Helpers        // Utilities  // Components          // Skins     // Layout    

/* /web/static/src/scss/functions.scss */
///============================================================================ /// Odoo SCSS Functions /// /// Regroup functions that can be used at any stage of the compilation process. ///============================================================================ /// Remove the unit of a length /// --------------------------------------------------------------------------- /// @param{Number}$-value /// Number to remove unit from /// @return{$-value}/// Unitless number @function o-strip-unit($-value){@if type-of($-value) == 'number' and not unitless($-value){@return $-value / ($-value * 0 + 1);}@return $-value;}/// Converts px to rem. /// --------------------------------------------------------------------------- /// @param{number or px value}$-px-value /// The value to convert. /// @param{number or px value}$-base /// The base font-size /// @return{number}/// `$-px-value` converted in rem units @function o-to-rem($-px-value, $-base: 16){@return (o-strip-unit($-px-value) / o-strip-unit($-base)) * 1rem;}/// Mixins /// =========================================================================== /// Generate Bootstrap, BS-legacy and custom text/bg classes in a consistent /// way. It applies the desired color to a specified rule using CSS variables. /// --------------------------------------------------------------------------- /// @param{color}$-color /// Desidered color /// @param{string}$-rule /// CSS property to be affected /// @param{string}$-css-opacity-var /// CSS varible defining the opacity /// --------------------------------------------------------------------------- @mixin o-print-color($-color, $-rule, $-css-opacity-var){--#{$-rule}: RGBA(#{to-rgb($-color)}, var(--#{$-css-opacity-var}, 1)); #{$-rule}: var(--#{$-rule}) !important;}

/* /web/static/src/scss/mixins_forwardport.scss */
// For each breakpoint, define the maximum width of the container in a media query @mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints){@each $breakpoint, $container-max-width in $max-widths{@include media-breakpoint-up($breakpoint, $breakpoints){max-width: $container-max-width;}}}//addons/web/static/lib/bootstrap-4/scss/mixins/_text-emphasis.scss @mixin text-emphasis-variant($parent, $color){#{$parent}{color: $color !important;}@if $link-shade-percentage != 0{a#{$parent}{&:hover, &:focus{color: darken($color, $link-shade-percentage) !important;}}}}

/* /web/static/src/scss/bs_mixins_overrides.scss */
//------------------------------------------------------------------------------ // Bootstrap Mixins and Functions Extensions // Those will affect the way bootstrap is generated wherever bootstrap is used //------------------------------------------------------------------------------ // This variable must be defined here instead of bootstrap overridden files // otherwise we will have deprecation messages during assets generation $enable-deprecation-messages: false !default; // Override color-contrast function to handle the alpha component of colors @function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio, $main-background: $body-bg){$real-color: opaque($main-background, $background); $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black; $max-ratio: 0; $max-ratio-color: null; @each $color in $foregrounds{$contrast-ratio: contrast-ratio($real-color, $color); @if $contrast-ratio > $min-contrast-ratio{@return $color;}@else if $contrast-ratio > $max-ratio{$max-ratio: $contrast-ratio; $max-ratio-color: $color;}}@warn "Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$real-color}(mix of given color and background)..."; @return $max-ratio-color;}@function mute-color($color){@return scale-color($color, $alpha: -30%);}// This placeholder regroups the rules that will apply on all elements with a // bg-* class (see o-bg-color, bg-variant). The optimized-css way would be to // have a common class for them all. %o-bg-color-component-color-reset{h1, h2, h3, h4, h5, h6{color: inherit;}}$o-yiq-min-opacity-threshold: 0.3 !default; $o-color-extras-nesting-selector: '&' !default; @mixin o-bg-color($color, $text-color: null, $with-extras: true, $important: true, $yiq-min-opacity-threshold: $o-yiq-min-opacity-threshold, $background: $body-bg, $nesting-selector: $o-color-extras-nesting-selector){@if ($color){$-yiq-threshold-met: alpha($color) > $yiq-min-opacity-threshold; $-yiq-color: if($text-color, $text-color, if($-yiq-threshold-met, color-contrast($color, $main-background: $background), null)); background-color: $color#{if($important, ' !important', '')}; color: $-yiq-color; // not important so that text utilities still work @if $with-extras and $-yiq-threshold-met{#{$nesting-selector}{@extend %o-bg-color-component-color-reset; .text-muted{// Always important since the basic BS rule is important color: mute-color($-yiq-color) !important;}}}}}// Override background utilities so that they come with a default contrasted // color (especially useful in the frontend editor for example). Also modifies // the way .text-muted elements are rendered in those environments. @mixin bg-variant($parent, $color, $text-color: null){#{$parent}{@include o-bg-color($color, $text-color);}a#{$parent}, button#{$parent}{&:hover, &:focus{@include o-bg-color(darken($color, 10%), $text-color, false);}}}@mixin bg-gradient-variant($parent, $color, $text-color: null){#{$parent}{@include o-bg-color($color, $text-color); background-image: linear-gradient(180deg, mix($body-bg, $color, 15%), $color) !important; background-repeat: repeat-x !important;}}

/* /web/static/src/scss/utils.scss */
/// /// This file regroups the odoo mixins. They are available in every asset bundle. /// // ------------------------------------------------------------------ // Caret // ------------------------------------------------------------------ @mixin utils-caret-boilerplate{content: ""; display: inline-block; width: 0; height: 0; vertical-align: middle; -moz-transform: scale(0.9999); // Smooth the caret on firefox}// ------------------------------------------------------------------ // Position absolute // ------------------------------------------------------------------ @mixin o-position-absolute($top: auto, $right: auto, $bottom: auto, $left: auto){position: absolute; top: $top; left: $left; bottom: $bottom; right: $right;}// ------------------------------------------------------------------ // Position sticky // ------------------------------------------------------------------ @mixin o-position-sticky($top: auto, $right: auto, $bottom: auto, $left: auto){position: -webkit-sticky; position: sticky; top: $top; left: $left; bottom: $bottom; right: $right;}// ------------------------------------------------------------------ // Text overflow // ------------------------------------------------------------------ @mixin o-text-overflow($display: inline-block, $max-width: 100%){display: $display; max-width: $max-width; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: top; // To update display context changed by overflow:hidden}// ------------------------------------------------------------------ // Hovering effects // ------------------------------------------------------------------ @mixin o-hover-opacity($default-opacity: 0.5, $hover-opacity: 1){opacity: $default-opacity; &:hover, &:focus, &.focus{opacity: $hover-opacity;}}//------------------------------------------------------------------------------ // Colors //------------------------------------------------------------------------------ @function luma($color){@return ((red($color) * .299) + (green($color) * .587) + (blue($color) * .114)) / 255 * 100%;}// Extend placeholder which adds a chess-like background below the color and // image of an element to preview the transparency of that color and image. // This is done thanks to both ::before and ::after elements so they must both // be available. %o-preview-alpha-background{position: relative; z-index: 0; &::before{content: ""; @include o-position-absolute(0, 0, 0, 0); z-index: -1; background-image: url('/web/static/img/transparent.png'); background-size: 10px auto; border-radius: inherit;}&::after{content: ""; @include o-position-absolute(0, 0, 0, 0); z-index: -1; background: inherit; // Inherit all background properties border-radius: inherit;}}// This function checks if the color ($color) has enough contrast to be visible // on a background with the color ($background-color). If not, it is replaced // with $light (if too dark) or $dark (if too light). @function adjust-color-to-background($color, $background-color, $light: $color-contrast-light, $dark: $color-contrast-dark){@return if( color-contrast($color) == $color-contrast-dark, color-contrast($background-color, $color, $dark), color-contrast($background-color, $light, $color) );}// ------------------------------------------------------------------ // Padding // ------------------------------------------------------------------ @mixin o-webclient-padding($top: 0px, $right: $o-horizontal-padding, $bottom: 0px, $left: $o-horizontal-padding){padding-top: $top; padding-right: $right; padding-bottom: $bottom; padding-left: $left;}// ------------------------------------------------------------------ // Caret // ------------------------------------------------------------------ @mixin o-caret-down($caret-width: $caret-width, $caret-color: var(--o-caret-color, currentColor)){@include utils-caret-boilerplate; border-bottom: 0; border-left: $caret-width solid transparent; border-right: $caret-width solid transparent; border-top: $caret-width solid $caret-color;}@mixin o-caret-up($caret-width: $caret-width, $caret-color: var(--o-input-border-color, currentColor)){@include utils-caret-boilerplate; border-bottom: $caret-width solid $caret-color; border-left: $caret-width solid transparent; border-right: $caret-width solid transparent; border-top: 0;}@mixin o-caret-left($caret-width: $caret-width, $caret-color: var(--o-input-border-color, currentColor)){@include utils-caret-boilerplate; border-bottom: $caret-width solid transparent; border-left: 0; border-right: $caret-width solid $caret-color; border-top: $caret-width solid transparent;}@mixin o-caret-right($caret-width: $caret-width, $caret-color: var(--o-input-border-color, currentColor)){@include utils-caret-boilerplate; border-bottom: $caret-width solid transparent; border-left: $caret-width solid $caret-color; border-right: 0; border-top: $caret-width solid transparent;}//------------------------------------------------------------------- // Cursor //------------------------------------------------------------------- @mixin o-grab-cursor(){// Use a custom cursor for the open hand icon as "grab" is not properly // working on Chrome Linux (at least) cursor: url(/web/static/img/openhand.cur), grab;}@mixin o-field-pointer(){// Force `pointer`cursor on inputs and labels .form-check-input:not(:disabled), .form-check-input:not(:disabled) + label{cursor: pointer;}&:hover, &:hover .form-check-input:not(:disabled){border-color: $form-check-input-checked-border-color;}}// ------------------------------------------------------------------ // Hovering effects // ------------------------------------------------------------------ @mixin o-hover-text-color($default-color: $body-color, $hover-color: $link-color){color: $default-color; &:hover, &:focus, &.focus{color: $hover-color;}}// ------------------------------------------------------------------ // Mixin to define variations for btn-links and muted btn-links // ------------------------------------------------------------------ @mixin o-btn-link-variant($color, $color-active){text-transform: none; @include o-hover-text-color($default-color: $color, $hover-color: $color-active); &, &:hover, &:focus, &:active, &.active{border-color: transparent !important; background-color: transparent !important;}&:hover:active:focus{box-shadow: none; outline: none;}&.text-muted, .text-muted{@include o-hover-text-color($default-color: $text-muted, $hover-color: $color-active);}}// Odoo defines a limited Noto font-family for a small variety of unicode // characters that are not necessary defined in the user system or even defined // but not properly readable. This function allows to add this font family in a // given font list. // // @param{list}$font - a list of font names ending with the generic one. // @param{integer}[$index] - the position where to add the support font, if // not given, it will be placed before the generic one. @function o-add-unicode-support-font($font, $index: false){$-with-support-font: (); @for $i from 1 through length($font){$-part: nth($font, $i); @if $i == $index or $-part == serif or $-part == sans-serif{$-with-support-font: append($-with-support-font, 'Odoo Unicode Support Noto', $separator: comma);}$-with-support-font: append($-with-support-font, $-part, $separator: comma);}@return $-with-support-font;}// Function to remove all null values of a map. @function o-map-omit($map){$-map: (); @each $key, $value in $map{@if $value != null{$-map: map-merge($-map, ( $key: $value, ));}}@return $-map;}// Function to get an element of a list with a default value in case the index // is out-of-bounds; also return that value if the retrieved value is null. @function o-safe-nth($list, $index, $default: null){$value: if($index > 0 and $index <= length($list), nth($list, $index), null); @return if($value != null, $value, $default);}// Function to get an element of a map with a default value in case the key // does not exist; also return that value if the retrieved value is null. @function o-safe-get($map, $key, $default: null){$value: map-get($map, $key); @return if($value != null, $value, $default);}// ------- Kanban grouped mixins ------- @mixin o-kanban-record-color{@for $size from 2 through length($o-colors){// Note: the first color is not defined as it is the 'no color' for kanban .oe_kanban_color_#{$size - 1}{border-left-color: nth($o-colors, $size); &:after{background-color: nth($o-colors, $size);}}}}// ------- Kanban records mixins ------- @mixin o-kanban-record-title($font-size: $h5-font-size){color: $headings-color; font-size: $font-size; font-weight: 500; margin-bottom: 0; margin-top: 0;}@mixin o-kanban-colorpicker{max-width: 150px; padding: 3px ($o-dropdown-hpadding - $o-kanban-inner-hmargin) 3px $o-dropdown-hpadding; > li{display: inline-block; margin: $o-kanban-inner-hmargin $o-kanban-inner-hmargin 0 0; border: 1px solid white; box-shadow: 0 0 0 1px map-get($grays, '300'); > a{display: block; &::after{content: ""; display: block; width: 20px; height: 15px;}}// No Color &:first-child > a:after{background: linear-gradient(45deg, rgba($dropdown-bg, 0) 0%, rgba($dropdown-bg, 0) 48%, $danger 48%, $danger 52%, rgba($dropdown-bg, 0) 52%, rgba($dropdown-bg, 0) 100%);}}}// Emulate dropdown links @mixin o-kanban-dashboard-dropdown-link($link-padding-gap: $o-dropdown-hpadding){padding: 0; > a{margin: auto auto auto (-$link-padding-gap); padding: 3px $link-padding-gap; color: $dropdown-link-color; display: block; &:hover{background-color: $dropdown-link-hover-bg; color: $dropdown-link-hover-color;}}&:last-child{margin-bottom: 5px;}}// No content helper @mixin o-nocontent-empty{pointer-events: auto; max-width: 650px; margin: auto; padding: 15px; z-index: 1000; text-align: center; color: $body-color; font-size: 115%; > p:first-of-type{margin-top: 0; color: $headings-color; font-weight: bold; font-size: 125%;}a{cursor: pointer;}}%o-nocontent-init-image{content: ""; display: block; margin: auto; background-size: cover;}%o-nocontent-empty-document{@extend %o-nocontent-init-image; width: 120px; height: 80px; margin-top: 30px; margin-bottom: 30px; background: transparent url(/web/static/img/empty_folder.svg) no-repeat center;}// Sample data @mixin o-sample-data-disabled{opacity: 0.33; pointer-events: none; user-select: none;}// ---------------------------------------------------------------------------- // CSS Variables // ---------------------------------------------------------------------------- // Print a document property the right way (depending on the type of the // printed variable). @mixin print-variable($key, $value){@if $value != null{$-type: type-of($value); @if $-type == 'string' and str-index($value, 'var(') != 1{--#{$key}: '#{$value}';}@else if $-type == 'list'{--#{$key}: #{inspect($value)};}@else{--#{$key}: #{$value};}}}

/* /web_enterprise/static/src/scss/primary_variables.scss */
/// /// This file regroups the variables that style odoo components. /// They are available in every asset bundle. /// // Colors $o-white: #FFF !default; $o-black: #000 !default; $o-gray-100: #F9FAFB !default; $o-gray-200: #e7e9ed !default; $o-gray-300: #d8dadd !default; $o-gray-400: #9a9ca5 !default; $o-gray-500: #7c7f89 !default; $o-gray-600: #5f636f !default; $o-gray-700: #374151 !default; $o-gray-800: #1F2937 !default; $o-gray-900: #111827 !default; $o-enterprise-color: #714B67 !default; $o-enterprise-action-color: #017e84 !default; $o-opacity-disabled: .5 !default; $o-opacity-muted: .76 !default; $o-brand-odoo: $o-enterprise-color !default; $o-brand-primary: $o-brand-odoo !default; $o-brand-secondary: #8f8f8f !default; $o-brand-lightsecondary: $o-gray-100 !default; $o-action: $o-enterprise-action-color !default; $o-main-text-color: $o-gray-700 !default; $o-main-link-color: $o-enterprise-action-color !default; $o-main-color-muted: rgba($o-main-text-color, $o-opacity-muted) !default; // Components $o-component-active-color: $o-gray-900 !default; $o-component-active-bg: mix($o-action, $o-white, 10%) !default; $o-component-active-border: $o-action !default; $o-list-group-header-color: $o-gray-900 !default; $o-list-footer-color: $o-gray-900 !default; $o-list-footer-bg-color: transparent !default; $o-list-footer-font-weight: 500 !default; $o-form-lightsecondary: $o-gray-200 !default; // o-inputs $o-input-padding-y: 1px !default; $o-input-padding-x: 0 !default; $o-input-border-required: $o-gray-900 !default; // Badges $o-badge-min-width: 2.7ch !default !default; // Buttons // Map of customized values for each button. If a button's design is defined // here, the relative values will take priority over default BS ones. // Notice: each map's entry is passed directly to the Bootstrap mixin, meaning // that all states must be defined, there can't be omissions. $o-btns-bs-override: () !default; $o-btns-bs-override: map-merge(( "primary": ( background: $o-brand-primary, border: $o-brand-primary, color: $o-white, hover-background: darken($o-brand-primary, 5%), hover-border: darken($o-brand-primary, 10%), hover-color: $o-white, active-background: mix($o-brand-primary, $o-white, 10%), active-border: $o-brand-primary, active-color:$o-brand-primary, ), "secondary": ( background: $o-gray-200, border: $o-gray-200, color: $o-gray-700, hover-background: $o-gray-300, hover-border: $o-gray-300, hover-color: $o-gray-800, active-background: $o-component-active-bg, active-border: $o-component-active-border, active-color: $o-component-active-color, ), ), $o-btns-bs-override); $o-btns-bs-outline-override: () !default; $o-btns-bs-outline-override: map-merge(( "secondary": ( background: transparent, border: $o-gray-300, color: $o-gray-700, hover-background: $o-gray-200, hover-border: $o-gray-300, hover-color: $o-gray-800, active-background: mix($o-enterprise-action-color, $o-white, 10%), active-border: $o-enterprise-action-color, active-color: $o-gray-900, ), ), $o-btns-bs-outline-override); 

/* /web/static/src/scss/primary_variables.scss */
/// /// This file regroups the variables that style odoo components. /// They are available in every asset bundle. /// // Contrast ratio $o-frontend-min-contrast-ratio: 2.9 !default; // Color-scheme $o-webclient-color-scheme: bright !default; // Font sizes $o-root-font-size: 1rem !default; $o-font-size-base: o-to-rem(14px) !default; $o-font-size-base-touch: o-to-rem(16px) !default; $o-font-size-base-small: o-to-rem(13px) !default; $o-font-size-base-smaller: o-to-rem(12px) !default; $o-line-height-base: 1.5 !default; // This is BS default // Global sans-serif fonts stack, defined here as we need to process // it before actually using it (to add more unicode support with the special // Odoo font for example). Adding unicode support is not done directly here as // this font can be used by the website where the unicode support is already // automatically added. $o-system-fonts: (-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Ubuntu, "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji") !default; // Font weights // Caution: These values represent the desired font weights, but they may vary // depending on the user's operating system. // Because we rely on system fonts, the browser will interpret these values // based on the available fonts on the user's device. // If the exact font weight is unavailable, the browser will attempt to assign // a suitable weight using the fallowing fallback scheme. // https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight#fallback_weights $o-font-weight-normal: 400 !default; $o-font-weight-medium: 500 !default; $o-font-weight-bold: 700 !default; $o-font-weight-extrabold: 800 !default; // Colors // This is BS default $o-white: #FFFFFF !default; $o-black: #000000 !default; $o-gray-100: #f8f9fa !default; $o-gray-200: #e9ecef !default; $o-gray-300: #dee2e6 !default; $o-gray-400: #ced4da !default; $o-gray-500: #adb5bd !default; $o-gray-600: #6c757d !default; $o-gray-700: #495057 !default; $o-gray-800: #343a40 !default; $o-gray-900: #212529 !default; $o-grays: ( 100: $o-gray-100, 200: $o-gray-200, 300: $o-gray-300, 400: $o-gray-400, 500: $o-gray-500, 600: $o-gray-600, 700: $o-gray-700, 800: $o-gray-800, 900: $o-gray-900, ) !default; $o-community-color: #71639e !default; $o-enterprise-color: #714B67 !default; $o-enterprise-action-color: #017e84 !default; $o-brand-odoo: $o-community-color !default; $o-brand-primary: $o-community-color !default; $o-brand-secondary: #8f8f8f !default; $o-brand-lightsecondary: $o-gray-100 !default; $o-action: $o-brand-primary !default; $o-success: #28a745 !default; $o-info: #17a2b8 !default; $o-warning: #ffac00 !default; $o-danger: #dc3545 !default; // Fine-tune contextual text colors. // Overrides $theme-colors generated 'text-x' classes only. // Custom colors are set by $o-text-colors-custom $o-theme-text-colors: ( "success": #008818, "info": #0180a5, "warning": #9a6b01, "danger": #d23f3a, )!default; // Opacities $o-opacity-disabled: .5 !default; $o-opacity-muted: .76 !default; $o-opacities: ( 0: 0, 25: .25, 50: .5, 75: .75, 100: 1, disabled: $o-opacity-disabled, muted: $o-opacity-muted, ) !default; // Font families $o-font-family-sans-serif: o-add-unicode-support-font($o-system-fonts) !default; $o-font-family-monospace: o-add-unicode-support-font((SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace)) !default; $o-headings-font-family: o-add-unicode-support-font(("SF Pro Display", $o-system-fonts)) !default; // Font colors $o-main-text-color: $o-gray-700 !default; $o-main-bg-color: #f0eeee !default; $o-main-color-muted: rgba($o-main-text-color, $o-opacity-muted) !default; $o-main-headings-color: $o-gray-900 !default; $o-main-link-color: darken($o-brand-primary, 5%) !default; $o-main-favorite-color: #f3cc00 !default; $o-main-code-color: #d2317b !default; // Components colors $o-component-active-color: $o-gray-900 !default; $o-component-active-bg: mix($o-action, $o-gray-100, 20%) !default; $o-component-active-border: $o-action !default; $o-view-background-color: white !default; $o-shadow-color: #303030 !default; $o-form-lightsecondary: #ccc !default; $o-list-footer-bg-color: transparent !default; $o-list-footer-font-weight: bold !default; // Custom colors generation maps $o-text-colors-custom: ( "action": $o-action, "favourite": $o-main-favorite-color, ) !default; $o-bg-colors-custom: ( "action": $o-action, "view": $o-view-background-color, "favourite": $o-main-favorite-color, ) !default; $o-btn-custom: ( "favourite": $o-main-favorite-color, ) !default; // Components (BS) $o-border-color: var(--border-color, #{$o-gray-300}) !default; // Forms // o-inputs $o-input-padding-y: 2px !default; $o-input-padding-x: 4px !default; $o-input-border-required: $o-brand-primary !default; $o-input-hover-border-color: $o-gray-300 !default; // Layout // // Extension of BS4. This is not redefining the BS4 variable directly as we only // need the extra ones for media queries (not creating new breakpoint classes). // Note: default BS4 values are hardcoded here while it should be possible to // merge with the default BS variable (but we would have to take care of // ordering & cie). $o-extra-grid-breakpoints: ( xs: 0, vsm: 475px, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1534px, ) !default; $o-spacer: 16px !default; // = 1rem $o-form-group-cols: 12 !default; $o-form-spacing-unit: 5px !default; $o-horizontal-padding: $o-spacer !default; $o-innergroup-rpadding: 45px !default; $o-dropdown-hpadding: 20px !default; $o-dropdown-vpadding: 3px !default; $o-dropdown-max-height: 70vh !default; $o-statbutton-height: 44px !default; $o-statbutton-vpadding: 0px !default; $o-statbutton-spacing: 6px !default; $o-modal-lg: 980px !default; $o-modal-md: 650px !default; // Needed for having no spacing between sheet and mail body in mass_mailing: // Different required cancel paddings between web and web_enterprise $o-sheet-cancel-tpadding: 0px !default; $o-statusbar-height: 33px !default; $o-label-font-size-factor: 0.8 !default; // == List group $o-list-group-active-color: $o-gray-900 !default; $o-list-group-active-bg: lighten(saturate(adjust-hue($o-info, 15), 1.8), 50) !default; // == Badges // Define a minimum width. This value is arbitrary and strictly font-related. $o-badge-min-width: 3ch !default; $o-nb-calendar-colors: 24 !default; $o-base-settings-mobile-tabs-height: 40px !default; $o-base-settings-mobile-tabs-overflow-gap: 3% !default; $o-cp-breadcrumb-height: 30px !default; $o-cp-button-sm-no-border-padding: 0.4rem; $o-datepicker-week-color: #8f8f8f !default; $o-card-body-bg-opacity: 0.9 !default; // Border-radius $o-border-radius: o-to-rem(4px) !default; $o-border-radius-sm: o-to-rem(3px) !default; $o-border-radius-lg: o-to-rem(6px) !default; // touch $o-touch-btn-padding: 7px 14px !default; // == Buttons // Map of customized values for each button. If a button's design is defined // here, the relative values will take priority over default BS ones. // Notice: each map's entry is passed directly to the Bootstrap mixin, meaning // that all states must be defined, there can't be omissions. $o-btns-bs-override: () !default; $o-btns-bs-override: map-merge(( "primary": ( background: $o-brand-primary, border: $o-brand-primary, color: $o-white, hover-background: darken($o-brand-primary, 10%), hover-border: darken($o-brand-primary, 20%), hover-color: $o-white, active-background: darken($o-brand-primary, 20%), active-border: darken($o-brand-primary, 20%), active-color: $o-white, ), "secondary": ( background: $o-gray-300, border: $o-gray-300, color: $o-gray-800, hover-background: $o-gray-400, hover-border: $o-gray-400, hover-color: $o-gray-900, active-background: $o-component-active-bg, active-border: $o-component-active-border, active-color: $o-component-active-color, ), "light": ( background: $o-white, border: $o-white, color: $o-gray-700, hover-background: $o-gray-200, hover-border: $o-gray-200, hover-color: $o-gray-900, active-background: $o-component-active-bg, active-border: $o-component-active-border, active-color: $o-component-active-color, ), ), $o-btns-bs-override); $o-btns-bs-outline-override: () !default; $o-btns-bs-outline-override: map-merge(( "secondary": ( background: transparent, border: $o-gray-300, color: $o-gray-700, hover-background: $o-gray-200, hover-border: $o-gray-300, hover-color: $o-gray-800, active-background: $o-component-active-bg, active-border: $o-component-active-border, active-color: $o-component-active-color, ), ), $o-btns-bs-outline-override); 

/* /web_enterprise/static/src/core/notifications/notifications.variables.scss */
$o-notification-shadow: 0 12px 14px -10px rgba(0, 0, 0, .25) !default; 

/* /web_enterprise/static/src/webclient/home_menu/home_menu.variables.scss */
$o-home-menu-font-size-base: 1rem; $o-home-menu-container-size: 850px; $o-home-menu-app-icon-max-width: 70px; $o-home-menu-caption-color: $o-gray-700 !default; $o-home-menu-caption-shadow: none !default; $o-home-menu-custom-caption-color: #fff !default; $o-home-menu-custom-caption-shadow: 0 1px 2px rgba(0, 0, 0, .75), 0 2px 5px rgba(0, 0, 0, .05), 0 0 5px rgba(0, 0, 0, .05) !default; 

/* /web_enterprise/static/src/webclient/navbar/navbar.variables.scss */
// = Enterprise Main Navbar Variables // ============================================================================ $o-navbar-background: $o-white !default; $o-navbar-padding-v: 10px !default; $o-navbar-border-bottom: 0 !default; $o-navbar-font-size: $o-font-size-base !default; $o-navbar-font-size-xxl: $o-navbar-font-size * 1.14 !default; $o-navbar-entry-margin-h: 1px !default; $o-navbar-entry-border-radius: $o-border-radius !default; $o-navbar-entry-color: $o-gray-800 !default; $o-navbar-entry-padding-h: .63em !default; $o-navbar-entry-bg--hover: $o-gray-200 !default; $o-navbar-entry-color--hover: $o-gray-900 !default; $o-navbar-entry-bg--active: unset !default; $o-navbar-entry-color--active: unset !default; $o-navbar-dropdown-menu-border-top: 1px solid $o-border-color !default; $o-navbar-dropdown-menu-border-radius: $o-border-radius !default; $o-navbar-brand-color: $o-gray-700 !default; $o-navbar-badge-size: .7em !default; $o-navbar-badge-padding: 6px !default; $o-navbar-badge-bg: $o-danger !default; $o-navbar-badge-color: $o-white !default; $o-navbar-badge-text-shadow: none !default; 

/* /web/static/src/core/avatar/avatar.variables.scss */
$o-avatar-size: 1.7145em !default; 

/* /web/static/src/core/notifications/notification.variables.scss */
$o-notification-max-width: 320px !default; $o-notification-border-left-width: 0.75rem !default; $o-notification-shadow: 0 .25rem .75rem rgba(#000, .1)!default; $o-notification-zindex: 1055 !default; 

/* /web/static/src/search/control_panel/control_panel.variables.scss */
$o-control-panel-background-color: $o-view-background-color !default; $o-control-panel-border-bottom: 1px solid $o-gray-300 !default;

/* /web/static/src/search/search_panel/search_panel.variables.scss */
// = Search Panel Variables // ============================================================================ $o-search-panel-width: 220px; $o-search-panel-font-size: 1em; @mixin o-details-modal($top: 0, $bottom: 0){position: fixed; z-index: $zindex-modal; right: 0; top: $top; bottom: $bottom; left: 0;}@mixin o-details-modal-header{padding: 0.7rem 1.4rem; height: $o-navbar-height;}@mixin o-details-hide-caret{// Hide the caret. For details see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/summary list-style-type: none; &::-webkit-details-marker{display: none;}}

/* /web/static/src/views/fields/statusbar/statusbar_field.variables.scss */
$o-statusbar-arrow-width: 1em;

/* /web/static/src/views/form/form.variables.scss */
$o-sheet-vpadding: $o-spacer * 1.5 !default; $o-form-renderer-max-width: 2600px !default; $o-form-view-sheet-max-width: 1534px !default; $o-form-picture-size: 90px !default; 

/* /web/static/src/views/kanban/kanban.variables.scss */
$o-kanban-background: $o-gray-100 !default; $o-kanban-default-record-width: 320px !default; $o-kanban-small-record-width: 300px !default; $o-kanban-image-width: 64px !default; $o-kanban-image-fill-width: 95px !default; $o-kanban-inside-vgutter: $o-spacer * 0.5 !default; $o-kanban-inside-hgutter: $o-spacer * 0.5 !default; $o-kanban-color-border-width: 3px !default; $o-kanban-inner-hmargin: 5px !default; $o-kanban-progressbar-height: 20px !default; $o-kanban-mobile-tabs-height: 40px !default; $o-kanban-mobile-empty-height: $o-kanban-image-width !default; $o-kanban-record-margin: $o-horizontal-padding / 2 !default; $o-kanban-group-padding: $o-horizontal-padding !default; // Cannot be higher than this $o-kanban-inside-hgutter-mobile: $o-horizontal-padding !default; // ------- Kanban dashboard variables ------- // Used to manage spacing in complex dropdown menu $o-kanban-dashboard-dropdown-complex-gap: 5px !default; // Since rows and containers are used inside cards, we're // forced to set the padding relative to the grid system. $o-kanban-dashboard-hpadding: $o-horizontal-padding !default; $o-kanban-dashboard-vpadding: $o-horizontal-padding / 2 !default; 

/* /web/static/src/webclient/burger_menu/burger_menu.variables.scss */
// = Burger Menu Variables // ============================================================================ $o-burger-base-bg: $o-white !default; $o-burger-base-color: $o-gray-800 !default; $o-burger-topbar-bg: $o-gray-100 !default; $o-burger-topbar-color: $o-gray-900 !default;

/* /web/static/src/webclient/navbar/navbar.variables.scss */
// = Main Navbar Variables // ============================================================================ $o-navbar-height: 46px !default; $o-navbar-padding-v: 0px !default; $o-navbar-font-size: $o-font-size-base !default; $o-navbar-background: $o-brand-odoo !default; $o-navbar-border-bottom: 1px solid darken($o-brand-odoo, 10%) !default; $o-navbar-entry-margin-h: 0 !default; $o-navbar-entry-padding-h: .63em !default; $o-navbar-entry-border-radius: 0 !default; $o-navbar-entry-color: rgba($o-white, .9) !default; $o-navbar-entry-color--hover: $o-white !default; $o-navbar-entry-font-size: 1em !default; $o-navbar-entry-bg--hover: rgba($o-black, .08) !default; $o-navbar-entry-color--active: $o-navbar-entry-color--hover !default; $o-navbar-entry-bg--active: $o-navbar-entry-bg--hover !default; $o-navbar-dropdown-menu-border-top: 0 !default; $o-navbar-dropdown-menu-border-radius: 0 0 $o-border-radius $o-border-radius !default; $o-navbar-brand-font-size: 1.2em !default; $o-navbar-brand-color: $o-navbar-entry-color !default; $o-navbar-badge-size: 11px !default; $o-navbar-badge-padding: 4px !default; $o-navbar-badge-bg: $o-success !default; $o-navbar-badge-color: inherit !default; $o-navbar-badge-text-shadow: 1px 1px 0 rgba($o-black, .3) !default; // = % PseudoClasses // // Regroup and expose rules shared across components // -------------------------------------------------------------------------- %-main-navbar-entry-base{position: relative; display: flex; align-items: center; width: auto; height: calc(var(--o-navbar-height) - #{$o-navbar-padding-v * 2}); border-radius: $o-navbar-entry-border-radius; user-select: none; background: transparent; font-size: $o-navbar-entry-font-size; @include o-hover-text-color( var(--NavBar-entry-color, #{$o-navbar-entry-color}), var(--NavBar-entry-color--hover, #{$o-navbar-entry-color--hover}) );}%-main-navbar-entry-spacing{margin: 0; margin-left: var(--NavBar-entry-margin-left, #{$o-navbar-entry-margin-h}); margin-right: var(--NavBar-entry-margin-right, #{$o-navbar-entry-margin-h}); padding: 0; padding-left: var(--NavBar-entry-padding-left, #{$o-navbar-entry-padding-h}); padding-right: var(--NavBar-entry-padding-right, #{$o-navbar-entry-padding-h}); line-height: calc(var(--o-navbar-height) - #{$o-navbar-padding-v * 2});}

/* /mail/static/src/core/common/primary_variables.scss */
$o-mail-Avatar-size: 36px !default; $o-mail-Avatar-sizeSmall: 24px !default; $o-mail-ChatWindow-width: 360px !default; // same value as CHAT_WINDOW_WIDTH // Needed because $border-radius variations are all set to 0 in enterprise. $o-RoundedRectangle-small: .2rem !default; $o-RoundedRectangle-large: 3 * $o-RoundedRectangle-small !default; $o-mail-LinkPreview-width: 320px !default; $o-mail-LinkPreview-height: 240px !default; $o-mail-LinkPreviewCard-height: 80px !default; $o-mail-Message-sidebarWidth: 42px !default; $o-mail-NavigableList-zIndex: 11; $o-mail-Chatter-minWidth: 530px !default; $o-mail-Discuss-inspector: 300px !default; $o-mail-Discuss-headerHeight: 48px !default; @mixin o-FileViewer-arrow{background-color: rgba(black, 0.4); color: rgba(map-get($theme-colors, 'light'), 0.7); &:hover{background-color: rgba(black, 0.6); color: white;}&.disabled{color: map-get($grays, '600'); background: none;}}

/* /mail/static/src/discuss/typing/common/primary_variables.scss */
$o-discuss-Typing-medium: 5px !default; $o-discuss-Typing-small: 3px !default; 

/* /mail/static/src/scss/variables/primary_variables.scss */
$o-mail-Avatar-size: 42px !default; $o-mail-ChatWindow-width: 360px !default; // same value as CHAT_WINDOW_WIDTH $o-mail-Chatter-mobile-gap: 2% !default; $o-mail-sidebar-icon-opacity: 0.7 !default; $o-mail-Discuss-inspector: 300px !default; $o-mail-Avatar-sizeSmall: 24px !default; $o-mail-partner-status-icon-size: 1.2em !default; // Needed because $border-radius variations are all set to 0 in enterprise. $o-RoundedRectangle-small: .2rem !default; $o-RoundedRectangle-large: 3 * $o-RoundedRectangle-small !default; $o-mail-Message-sidebarWidth: 42px !default; $o-mail-composer-text-input-height: 40px !default; $o-mail-LinkPreview-width: 320px !default; $o-mail-LinkPreview-height: 240px !default; $o-mail-LinkPreviewCard-height: 80px !default; 

/* /onboarding/static/src/scss/onboarding.variables.scss */
$o-onboarding-base-time: 0.5s !default; $o-onboarding-image-size: 64px !default; $o-onboarding-line-height: 2px !default; $o-onboarding-line-width: 100% !default; $o-onboarding-color-blue: #374874 !default; $o-onboarding-color-orange: #F39D9B !default; 

/* /web_editor/static/src/scss/web_editor.variables.scss */
/// /// This files regroups the variables and mixins which are specific to the editor. /// //------------------------------------------------------------------------------ // Odoo Editor UI //------------------------------------------------------------------------------ $o-we-bg-darkest: #000000 !default; $o-we-bg-darker: #141217 !default; $o-we-bg-dark: #191922 !default; $o-we-bg-light: #2b2b33 !default; $o-we-bg-lighter: #3e3e46 !default; $o-we-bg-lightest: #595964 !default; $o-we-fg-darker: #9d9d9d !default; $o-we-fg-dark: #C6C6C6 !default; $o-we-fg-light: #D9D9D9 !default; $o-we-fg-lighter: #FFFFFF !default; $o-we-color-danger: #e6586c !default; $o-we-color-warning: #f0ad4e !default; $o-we-color-success: #40ad67 !default; $o-we-color-info: #6999a8 !default; $o-we-bg: $o-we-bg-light !default; $o-we-color: $o-we-fg-light !default; $o-we-font-size: 13px !default; $o-we-font-family: $o-font-family-sans-serif !default; $o-we-accent: #01bad2 !default; $o-we-border-width: 1px !default; $o-we-border-color: $o-we-bg-light !default; // Needed to be changed to be high enough to not overflow when a user // has a page with a lot of content (10000px was proven to be too small) $o-we-handles-offset-to-hide: 100000px !default; $o-we-handles-btn-size: 14px !default; $o-we-handles-accent-color: $o-we-accent !default; $o-we-handles-accent-color-preview: $o-enterprise-color !default; $o-we-handle-edge-size: $o-we-handles-btn-size !default; $o-we-handle-border-width: 2px !default; $o-we-handle-inside-line-width: 3px !default; $o-we-dropzone-size: 30px !default; // $grid-gutter-width (todo: allow to use the variable) $o-we-dropzone-border-width: 2px !default; $o-we-dropzone-border: $o-we-dropzone-border-width dashed $o-brand-odoo !default; $o-we-dropzone-accent-color: $o-we-accent !default; $o-we-dropzone-bg-color: rgba($o-we-dropzone-accent-color, .5) !default; // Translations $o-we-content-to-translate-color: rgba(255, 255, 90, 0.5) !default; $o-we-translated-content-color: rgba(120, 215, 110, 0.5) !default; $o-we-toolbar-height: 40px !default; $o-we-item-spacing: 8px !default; $o-we-item-border-width: 1px !default; $o-we-item-border-color: transparent !default; $o-we-item-border-radius: 4px !default; $o-we-item-clickable-bg: $o-we-bg-lightest!default; $o-we-item-clickable-color: $o-we-fg-light!default; $o-we-item-clickable-hover-bg: $o-we-bg-dark!default; $o-we-item-pressed-bg: $o-we-bg-light !default; $o-we-item-pressed-color: $o-we-fg-lighter !default; $o-we-item-standup-color-light: $o-we-fg-lighter; $o-we-item-standup-color-dark: $o-we-bg-darkest; $o-we-item-standup-top: inset 0 1px 0; $o-we-item-standup-bottom: inset 0 -1px 0; $o-we-dropdown-spacing: $o-we-item-spacing !default; $o-we-dropdown-bg: $o-we-bg-darker !default; $o-we-dropdown-border-width: 1px !default; $o-we-dropdown-border-color: $o-we-bg-darkest !default; $o-we-dropdown-shadow: 0 2px 8px 0 rgba(black, 0.5) !default; $o-we-dropdown-item-height: 34px !default; $o-we-dropdown-item-spacing: 1px !default; $o-we-dropdown-item-bg: $o-we-bg-lightest !default; $o-we-dropdown-item-bg-hover: $o-we-bg-light !default; $o-we-dropdown-item-color: $o-we-fg-dark !default; $o-we-dropdown-item-hover-color: $o-we-fg-light !default; $o-we-dropdown-item-active-bg: mix($o-we-dropdown-item-bg, $o-we-dropdown-item-bg-hover) !default; $o-we-dropdown-item-active-color: $o-we-fg-lighter !default; $o-we-dropdown-caret-spacing: 2px !default; $o-we-sidebar-bg: $o-we-bg !default; $o-we-sidebar-color: $o-we-color !default; $o-we-sidebar-font-size: 12px !default; $o-we-sidebar-border-width: $o-we-border-width !default; $o-we-sidebar-border-color: $o-we-border-color !default; // This sidebar width cannot be increased at the moment, it is at the maximum // value it can have, given our current specs, which is 1920px / 150% - 992px. // - 1920px: the usual size of user screens, supposedly the browser one if the // OS task bar is not anchored to the right/left. // - 150%: this is actually the recommended Windows zoom (virtually decreasing // the amount of available pixels to fit our UI). // - 992px: the current minimum width the screen must have for our websites to // be in "desktop" mode (below, columns break over multiple lines). // // If the sidebar is 1px larger, entering edit mode on such Full HD + 150% zoom // will display the website in "mobile" mode (note it is the same with browser // zoom or OS zoom). // // Notice that 1920px / 150% = 1280px which gives the minimum size of the screen // that will display the website in "desktop" mode in the editor if no zoom is // used, which seems like an acceptable value. // // Note: reducing the sidebar width even further to support more devices or // more zoom / OS task bar configuration would be problematic as the sidebar // would become too small. It is currently kinda at both its maximum and minimum // authorized value. // // We tried solutions to virtually "de-zoom" the website iframe to display the // website in "desktop" mode no matter what but this did not give great results. // On problematic devices, the user still has the possibility to de-zoom its // browser by himself. $o-we-sidebar-width: 288px !default; // This includes $o-we-sidebar-border-width $o-we-sidebar-top-height: 46px !default; $o-we-sidebar-tabs-size-ratio: 1 !default; $o-we-sidebar-tabs-height: 3rem; $o-we-sidebar-tabs-bg: $o-we-bg-darker !default; $o-we-sidebar-tabs-color: $o-we-sidebar-color !default; $o-we-sidebar-tabs-disabled-color: $o-we-fg-darker !default; $o-we-sidebar-tabs-active-border-width: 2px !default; $o-we-sidebar-tabs-active-border-color: $o-we-accent !default; $o-we-sidebar-tabs-active-color: $o-we-fg-lighter !default; $o-we-sidebar-blocks-content-bg: $o-we-bg-dark !default; $o-we-sidebar-blocks-content-spacing: 10px !default; $o-we-sidebar-blocks-content-snippet-spacing: 2px !default; $o-we-sidebar-blocks-content-snippet-bg: $o-we-bg-lighter !default; $o-we-sidebar-content-highlight-bar-width: 2px !default; $o-we-sidebar-content-highlight-bar-color: $o-we-accent !default; $o-we-sidebar-content-gutter-item-indent: 5px !default; $o-we-sidebar-content-padding-base: 10px !default; $o-we-sidebar-content-indent: $o-we-sidebar-content-gutter-item-indent + $o-we-sidebar-content-padding-base !default; $o-we-sidebar-content-backdrop-bg: rgba(black, 0.2) !default; $o-we-sidebar-content-available-room: $o-we-sidebar-width - $o-we-sidebar-content-padding-base - $o-we-sidebar-content-indent !default; $o-we-sidebar-content-main-title-height: 32px !default; $o-we-sidebar-content-main-title-color: $o-we-fg-lighter !default; $o-we-sidebar-content-main-title-font-size: 13px !default; $o-we-sidebar-content-block-spacing: 10px !default; $o-we-sidebar-content-fold-block-bg: $o-we-bg-lighter !default; $o-we-sidebar-content-field-spacing: $o-we-item-spacing !default; $o-we-sidebar-content-field-color: $o-we-fg-darker !default; $o-we-sidebar-content-field-control-item-color: $o-we-fg-darker !default; $o-we-sidebar-content-field-control-item-size: 1em !default; $o-we-sidebar-content-field-control-item-spacing: 0.5em !default; $o-we-sidebar-content-field-label-spacing: 6px !default; $o-we-sidebar-content-field-label-width: $o-we-sidebar-content-available-room * .4 !default; $o-we-sidebar-content-field-multi-spacing: $o-we-sidebar-content-field-label-spacing * .5 !default; $o-we-sidebar-content-field-height: 22px !default; $o-we-sidebar-content-field-border-width: $o-we-item-border-width !default; $o-we-sidebar-content-field-border-color:$o-we-item-border-color !default; $o-we-sidebar-content-field-border-radius: $o-we-item-border-radius !default; $o-we-sidebar-content-field-disabled-color: $o-we-sidebar-content-field-control-item-color !default; $o-we-sidebar-content-field-clickable-bg: $o-we-item-clickable-bg !default; $o-we-sidebar-content-field-clickable-color: $o-we-item-clickable-color !default; $o-we-sidebar-content-field-clickable-spacing: $o-we-sidebar-content-field-label-spacing !default; $o-we-sidebar-content-field-pressed-bg: $o-we-item-pressed-bg !default; $o-we-sidebar-content-field-pressed-color: $o-we-item-pressed-color !default; $o-we-sidebar-content-field-dropdown-spacing: $o-we-dropdown-spacing !default; $o-we-sidebar-content-field-dropdown-bg: $o-we-dropdown-bg !default; $o-we-sidebar-content-field-dropdown-border-width: $o-we-dropdown-border-width !default; $o-we-sidebar-content-field-dropdown-border-color: $o-we-dropdown-border-color !default; $o-we-sidebar-content-field-dropdown-shadow: $o-we-dropdown-shadow !default; $o-we-sidebar-content-field-dropdown-item-height: $o-we-dropdown-item-height !default; $o-we-sidebar-content-field-dropdown-item-spacing: $o-we-dropdown-item-spacing !default; $o-we-sidebar-content-field-dropdown-item-bg: $o-we-dropdown-item-bg !default; $o-we-sidebar-content-field-dropdown-item-bg-hover: $o-we-dropdown-item-bg-hover !default; $o-we-sidebar-content-field-dropdown-item-color: $o-we-dropdown-item-color !default; $o-we-sidebar-content-field-dropdown-item-hover-color: $o-we-dropdown-item-hover-color !default; $o-we-sidebar-content-field-dropdown-item-active-bg: $o-we-dropdown-item-active-bg !default; $o-we-sidebar-content-field-dropdown-item-active-color: $o-we-dropdown-item-active-color !default; $o-we-sidebar-content-field-dropdown-grid-item-height: 60px !default; $o-we-sidebar-content-field-dropdown-grid-item-width: 80px !default; $o-we-sidebar-content-field-colorpicker-size: 20px !default; $o-we-sidebar-content-field-colorpicker-size-large: 26px !default; $o-we-sidebar-content-field-colorpicker-shadow: inset 0 0 0 1px rgba(white, 0.5) !default; $o-we-sidebar-content-field-colorpicker-dropdown-bg: $o-we-bg-lighter !default; $o-we-sidebar-content-field-colorpicker-dropdown-color: $o-we-fg-light !default; $o-we-sidebar-content-field-colorpicker-dropdown-active-color: $o-we-fg-lighter !default; $o-we-sidebar-content-field-colorpicker-cc-width: 208px !default; $o-we-sidebar-content-field-colorpicker-cc-height: 26px !default; $o-we-sidebar-content-field-input-max-width: 60px !default; $o-we-sidebar-content-field-input-bg: $o-we-bg-light !default; $o-we-sidebar-content-field-input-font-family: $o-we-font-family !default; $o-we-sidebar-content-field-input-unit-font-size: 11px !default; $o-we-sidebar-content-field-input-border-color: $o-we-accent !default; $o-we-sidebar-content-field-button-group-button-spacing: $o-we-sidebar-content-field-clickable-spacing; $o-we-sidebar-content-field-progress-height: 4px !default; $o-we-sidebar-content-field-progress-control-height: 10px !default; $o-we-sidebar-content-field-progress-color: $o-we-fg-darker !default; $o-we-sidebar-content-field-progress-active-color: $o-we-accent !default; $o-we-sidebar-content-field-toggle-width: 20px !default; $o-we-sidebar-content-field-toggle-height: 12px !default; $o-we-sidebar-content-field-toggle-bg: $o-we-fg-darker !default; $o-we-sidebar-content-field-toggle-active-bg: $o-we-accent !default; $o-we-sidebar-content-field-toggle-control-width: 11px !default; $o-we-sidebar-content-field-toggle-control-height: $o-we-sidebar-content-field-toggle-height - 2px !default; $o-we-sidebar-content-field-toggle-control-bg: $o-we-fg-lighter !default; $o-we-technical-modal-zindex: 2001; //------------------------------------------------------------------------------ // Preview component Mixins //------------------------------------------------------------------------------ @mixin o-we-preview-box($color-text: white){border-top: 1px solid black; border-bottom: 1px solid white; background-image: linear-gradient(-150deg, $o-we-bg-light, $o-we-bg-dark); color: $color-text;}// ------------------------------------------------------------------ // Selection wrapper // ------------------------------------------------------------------ @mixin o-we-active-wrapper($icon: '\f00c', $top: auto, $right: auto, $bottom: auto, $left: auto){box-shadow: 0 0 0 3px $o-brand-primary; &:not(.fa){border: 3px solid $o-brand-primary; box-shadow: none; &:before{content: $icon; @include o-position-absolute($top, $right, $bottom, $left); width: 19px; height: 19px; background-color: $o-brand-primary; font-family: 'FontAwesome'; color: white; border-radius: 50%; text-align: center; z-index: 1; box-shadow: $box-shadow;}}}//------------------------------------------------------------------------------ // Edited content //------------------------------------------------------------------------------ $o-support-13-0-color-system: false !default; $o-checklist-margin-left: 20px; $o-checklist-checkmark-width: 2px; $o-checklist-before-size: 13px; // Edition colors // Note: the "base" palettes contain all possible keys a palette should or // must contain, with a default value which should work in use cases where it // will be used. Any palette defined by an app will be merged with the base // palette once selected to ensure it works. // Colors $o-base-color-palette: ( 'o-color-1': transparent, 'o-color-2': transparent, 'o-color-3': transparent, 'o-color-4': transparent, 'o-color-5': transparent, ) !default; $o-color-palettes: ( 'base-1': ( 'o-color-1': $o-enterprise-color, 'o-color-2': #8595A2, 'o-color-3': #F3F2F2, 'o-color-4': #FFFFFF, 'o-color-5': #111827, ), 'base-2': ( 'o-color-1': #337ab7, 'o-color-2': #e9ecef, 'o-color-3': #F8F9FA, 'o-color-4': #FFFFFF, 'o-color-5': #343a40, ), ) !default; $o-color-palette-name: 'base-1' !default; // Theme colors $o-base-theme-color-palette: () !default; $o-theme-color-palettes: ( // alpha -> epsilon are old color names kept for compatibility. // They should not be used in the code base anymore and ideally they will // not generate any classes for >= 13.4 databases. 'base-1': ( 'alpha': $o-enterprise-action-color, 'beta': $o-enterprise-color, 'gamma': #5C5B80, 'delta': #5B899E, 'epsilon': #E46F78, ), ) !default; $o-theme-color-palette-name: 'base-1' !default; // Greyscale transparent colours // Note: BS values are forced by default in every palette as the values can // be used in bootstrap_overridden.scss files through the o-color function. // Also, all of the gray colors generates bg- classes in Odoo so black and white // are added for the same reason. $o-base-gray-color-palette: ( 'white': #FFFFFF, '100': #F8F9FA, '200': #E9ECEF, '300': #DEE2E6, '400': #CED4DA, '500': #ADB5BD, '600': #6C757D, '700': #495057, '800': #343A40, '900': #212529, 'black': #000000, ) !default; $o-transparent-grays: ( 'black-15': rgba(black, 0.15), 'black-25': rgba(black, 0.25), 'black-50': rgba(black, 0.5), 'black-75': rgba(black, 0.75), 'white-25': rgba(white, 0.25), 'white-50': rgba(white, 0.5), 'white-75': rgba(white, 0.75), 'white-85': rgba(white, 0.85), ) !default; $o-gray-color-palettes: () !default; $o-gray-color-palette-name: '' !default; // Color combinations $o-base-color-combination: ( 'bg': 'white', 'text': null, // Default to better contrast with the 'bg' 'headings': null, // Default to 'text' 'h2': null, // Default to 'h(x-1)' 'h3': null, 'h4': null, 'h5': null, 'h6': null, 'link': null, // Default to BS 'primary' (= first odoo color) 'btn-primary': null, // Default to BS 'primary' (= first odoo color) 'btn-primary-border': null, // Default to 'btn-primary' 'btn-secondary': null, // Default to BS 'secondary' (= second odoo color) 'btn-secondary-border': null, // Default to 'btn-secondary' ); $o-color-combinations-presets: ( ( ( 'bg': 'o-color-4', ), ( 'bg': 'o-color-3', 'headings': 'o-color-5', ), ( 'bg': 'o-color-2', 'btn-secondary': 'o-color-3', ), ( 'bg': 'o-color-1', 'link': 'o-color-5', 'btn-primary': 'o-color-5', 'btn-secondary': 'o-color-3', ), ( 'bg': 'o-color-5', 'headings': 'o-color-4', 'btn-secondary': 'o-color-3', ), ), ) !default; $o-color-combinations-preset-number: 1; // We allow snippets to be colored and elements like card and columns to be // colored as well. We need components targeted by those colored classes to // use the deepest coloring element config. We only allow here for this to // work for one level of nesting. Note: snippets which can contain other // snippets will have problem because of this; this is a limitation of the // system until a better solution is found. $o-color-extras-nesting-selector: '&, .o_colored_level &'; // Apply colors according to the given identifier. Can either be a preset // number, a color name or a css color. @mixin o-apply-colors($identifier, $with-extras: true, $background: $body-bg){$-related-color: o-related-color($identifier, $max-recursions: 10); @if type-of($-related-color) == 'number'{// This is a preset to be applied, just extend it. This should probably // be avoided and use the class in XML if possible. @extend .o_cc; @extend .o_cc#{$-related-color};}@else{@include o-bg-color(o-color($-related-color), $with-extras: $with-extras, $background: $background, $important: false);}}// Function which returns if a color has contrast enough in comparaison to // another given color. @function has-enough-contrast($color1, $color2, $threshold: 500){$r: (max(red($color1), red($color2))) - (min(red($color1), red($color2))); $g: (max(green($color1), green($color2))) - (min(green($color1), green($color2))); $b: (max(blue($color1), blue($color2))) - (min(blue($color1), blue($color2))); $sum-rgb: $r + $g + $b; @return ($sum-rgb >= $threshold);}// Function which transforms a color to increase its contrast in comparison to // another given color. @function increase-contrast($color1, $color2){@if not $color1 or not $color2{@return null;}$luma-c1: luma($color1); $luma-c2: luma($color2); $lightness-c1: lightness($color1); $lightness-inc: if($luma-c1 < $luma-c2, -1%, 1%); $i: 0; // Max 25% lightness change even if not contrasted enough @while ($lightness-c1 > 0.1% and $lightness-c1 < 99.9% and $i < 25 and not has-enough-contrast($color1, $color2)){$color1: adjust-color($color1, $lightness: $lightness-inc); $lightness-c1: $lightness-c1 + $lightness-inc; $i: $i + 1;}@return $color1;}// Given a primary color (and eventually a secondary one), the function returns // a basic odoo palette in sass-map format. The palette will be generated using // the safest readability values possible. @function o-make-palette($-primary, $-secondary: null, $-overrides-map: null){$-o-color-2: $-secondary or increase-contrast(desaturate(mix(complement($-primary), #FFFFFF, 80%), 20%), $-primary); $-palette: ( 'o-color-1': $-primary, 'o-color-2': $-o-color-2, 'o-color-3': change-color(#F5F0F0, $hue: hue($-primary), $saturation: min(saturation($-primary), saturation(#F5F0F0))), 'o-color-4': #FFFFFF, 'o-color-5': change-color(#2e1414, $hue: hue($-primary), $saturation: min(saturation($-primary), saturation(#2e1414))), ); // Check if primary/dark contrast is enough. If not adapt cc4 & cc5 schemes accordingly @if not (has-enough-contrast(map-get($-palette, 'o-color-5'), map-get($-palette, 'o-color-1'), 300)){@each $-cc in (4, 5){$-palette: map-merge($-palette, ( 'o-cc#{$-cc}-btn-primary': 'o-color-4', 'o-cc#{$-cc}-btn-secondary': 'o-color-2', 'o-cc#{$-cc}-text': 'o-color-3', 'o-cc#{$-cc}-link': 'o-color-4' ));}}@if $-overrides-map{$-palette: map-merge($-palette, $-overrides-map);}@return $-palette;}// format: (module_name: (shape_filename: ('position': X, 'size': Y, 'colors': (1, [3], ...)), ...)) $o-bg-shapes: ('web_editor': ( 'Airy/01': ('position': bottom, 'size': 100% auto, 'colors': (1)), 'Airy/02': ('position': top, 'size': 100% auto, 'colors': (1)), 'Airy/03': ('position': top, 'size': 100% auto, 'colors': (5)), 'Airy/03_001': ('position': top, 'size': 100% auto, 'colors': (5)), 'Airy/04': ('position': center, 'size': 100% 100%, 'colors': (1)), 'Airy/04_001': ('position': center, 'size': 100% 100%, 'colors': (1)), 'Airy/05': ('position': center, 'size': 100% 100%, 'colors': (1)), 'Airy/05_001': ('position': center, 'size': 100% 100%, 'colors': (1)), 'Airy/06': ('position': bottom, 'size': 100% auto, 'colors': (2)), 'Airy/07': ('position': top, 'size': 100% auto, 'colors': (2)), 'Airy/08': ('position': bottom, 'size': 100% auto, 'colors': (1)), 'Airy/09': ('position': top, 'size': 100% auto, 'colors': (1)), 'Airy/10': ('position': bottom, 'size': 100% auto, 'colors': (5)), 'Airy/11': ('position': top, 'size': 100% auto, 'colors': (5)), 'Airy/12': ('position': top, 'size': 100% auto, 'colors': (1, 3)), 'Airy/12_001': ('position': top, 'size': 100% auto, 'colors': (1, 3)), 'Airy/13': ('position': bottom, 'size': 100% auto, 'colors': (1, 4)), 'Airy/13_001': ('position': bottom, 'size': 100% auto, 'colors': (1, 4)), 'Airy/14': ('position': bottom, 'size': 100% auto, 'colors': (1, 4)), 'Blobs/01': ('position': top, 'size': 100% auto, 'colors': (2)), 'Blobs/01_001': ('position': top, 'size': 100% auto, 'colors': (2)), 'Blobs/02': ('position': bottom, 'size': 100% auto, 'colors': (1, 2)), 'Blobs/03': ('position': top, 'size': 100% auto, 'colors': (2)), 'Blobs/04': ('position': center, 'size': 100% auto, 'colors': (5)), 'Blobs/05': ('position': bottom, 'size': 100% auto, 'colors': (1)), 'Blobs/06': ('position': top, 'size': 100% auto, 'colors': (1)), 'Blobs/07': ('position': top, 'size': 100% auto, 'colors': (5)), 'Blobs/08': ('position': right, 'size': 100% auto, 'colors': (1)), 'Blobs/09': ('position': bottom, 'size': 100% auto, 'colors': (3)), 'Blobs/10': ('position': top, 'size': 100% auto, 'colors': (1, 5)), 'Blobs/10_001': ('position': top, 'size': 100% auto, 'colors': (1)), 'Blobs/11': ('position': center, 'size': 100% auto, 'colors': (1)), 'Blobs/12': ('position': bottom, 'size': 100% auto, 'colors': (1)), 'Blocks/01': ('position': bottom, 'size': 100% auto, 'colors': (1, 3, 5)), 'Blocks/01_001': ('position': top, 'size': 100% auto, 'colors': (1, 3, 5)), 'Blocks/02': ('position': top, 'size': 100% auto, 'colors': (1, 3, 5)), 'Blocks/02_001': ('position': bottom, 'size': 100% auto, 'colors': (1, 3, 5)), 'Blocks/03': ('position': bottom, 'size': 100% auto, 'colors': (1, 4)), 'Blocks/04': ('position': bottom, 'size': 100% auto, 'colors': (1, 2, 3, 5)), 'Bold/01': ('position': top, 'size': 100% auto, 'colors': (2)), 'Bold/02': ('position': bottom, 'size': 100% auto, 'colors': (1, 2, 3)), 'Bold/03': ('position': bottom, 'size': 100% auto, 'colors': (1, 3, 5)), 'Bold/04': ('position': top, 'size': 100% auto, 'colors': (2, 3)), 'Bold/05': ('position': center, 'size': 100% auto, 'colors': (5)), 'Bold/05_001': ('position': center, 'size': 100% auto, 'colors': (3)), 'Bold/06': ('position': center, 'size': 100% auto, 'colors': (5)), 'Bold/06_001': ('position': center, 'size': 100% auto, 'colors': (3)), 'Bold/07': ('position': bottom, 'size': 100% auto, 'colors': (1, 2)), 'Bold/07_001': ('position': bottom, 'size': 100% auto, 'colors': (1, 2)), 'Bold/08': ('position': top, 'size': 100% auto, 'colors': (1)), 'Bold/09': ('position': bottom, 'size': 100% auto, 'colors': (2, 3)), 'Bold/10': ('position': top, 'size': 100% auto, 'colors': (1, 3, 4, 5)), 'Bold/10_001': ('position': top, 'size': 100% auto, 'colors': (1, 4, 5)), 'Bold/11': ('position': bottom, 'size': 100% auto, 'colors': (1, 2, 3)), 'Bold/11_001': ('position': bottom, 'size': 100% auto, 'colors': (1, 2)), 'Bold/12': ('position': center, 'size': 100% auto, 'colors': (1, 2, 5)), 'Bold/12_001': ('position': center, 'size': 100% auto, 'colors': (1, 2, 5)), 'Floats/01': ('position': center right, 'size': auto 100%, 'colors': (1, 2, 3, 4, 5)), 'Floats/02': ('position': center, 'size': 100%, 'colors': (1, 2, 3, 5)), 'Floats/03': ('position': center, 'size': 100%, 'colors': (1, 2, 3, 5)), 'Floats/04': ('position': center, 'size': 100%, 'colors': (1, 2, 4, 5)), 'Floats/05': ('position': center, 'size': 100%, 'colors': (1, 2, 3, 5)), 'Floats/06': ('position': center, 'size': auto 100%, 'colors': (1, 2, 3, 5)), 'Floats/07': ('position': right bottom, 'size': auto 100%, 'colors': (1, 2, 3, 5)), 'Floats/08': ('position': top left, 'size': auto 100%, 'colors': (1, 2, 3, 5)), 'Floats/09': ('position': center right, 'size': auto 100%, 'colors': (1, 2, 3)), 'Floats/10': ('position': center, 'size': 100% auto, 'colors': (1, 2, 3, 5)), 'Floats/11': ('position': center, 'size': 100% 100%, 'colors': (1, 3)), 'Floats/12': ('position': top, 'size': 100% auto, 'colors': (1, 2, 3, 5), 'repeat-y': true), 'Floats/13': ('position': center, 'size': auto 100%, 'colors': (1, 2, 5)), 'Floats/14': ('position': center, 'size': 100%, 'colors': (1, 2, 3, 5), 'repeat-y': true), 'Origins/01': ('position': bottom, 'size': 100% auto, 'colors': (2, 5)), 'Origins/02': ('position': bottom, 'size': 100% auto, 'colors': (3)), 'Origins/02_001': ('position': bottom, 'size': 100% auto, 'colors': (4, 5)), 'Origins/03': ('position': top, 'size': 100% auto, 'colors': (3)), 'Origins/04': ('position': bottom, 'size': 100% auto, 'colors': (3)), 'Origins/04_001': ('position': top, 'size': 100% 100%, 'colors': (3)), 'Origins/05': ('position': top, 'size': 100% auto, 'colors': (3)), 'Origins/06': ('position': center, 'size': 100% auto, 'colors': (3)), 'Origins/06_001': ('position': center, 'size': 100% auto, 'colors': (3, 4)), 'Origins/07': ('position': center, 'size': 100% 100%, 'colors': (3)), 'Origins/07_001': ('position': center, 'size': 100% 100%, 'colors': (3, 5)), 'Origins/07_002': ('position': center, 'size': 100% 100%, 'colors': (3, 4, 5)), 'Origins/08': ('position': bottom, 'size': 100% auto, 'colors': (3)), 'Origins/09': ('position': top, 'size': 100% auto, 'colors': (1, 5)), 'Origins/09_001': ('position': top, 'size': 100% auto, 'colors': (3)), 'Origins/10': ('position': bottom, 'size': 100% auto, 'colors': (2, 5)), 'Origins/11': ('position': top, 'size': 100% auto, 'colors': (3, 5)), 'Origins/11_001': ('position': top, 'size': 100% auto, 'colors': (3, 4)), 'Origins/12': ('position': top, 'size': 100% auto, 'colors': (3, 5)), 'Origins/13': ('position': center, 'size': 100% auto, 'colors': (3, 5)), 'Origins/14': ('position': bottom, 'size': 100% auto, 'colors': (4)), 'Origins/14_001': ('position': bottom, 'size': 100% auto, 'colors': (3, 4)), 'Origins/15': ('position': top, 'size': 100% auto, 'colors': (4)), 'Origins/16': ('position': center, 'size': 100% 100%, 'colors': (3)), 'Origins/17': ('position': center, 'size': 100% 100%, 'colors': (3)), 'Origins/18': ('position': center, 'size': 100% 100%, 'colors': (1)), 'Rainy/01': ('position': bottom, 'size': 100% auto, 'colors': (1, 5)), 'Rainy/01_001': ('position': bottom, 'size': 100% auto, 'colors': (1, 5)), 'Rainy/02': ('position': top, 'size': 100% auto, 'colors': (1, 4, 5)), 'Rainy/02_001': ('position': top, 'size': 100% auto, 'colors': (1, 4, 5)), 'Rainy/03': ('position': top, 'size': 100% auto, 'colors': (2, 4, 5), 'repeat-y': true), 'Rainy/03_001': ('position': top, 'size': 100% auto, 'colors': (2, 5), 'repeat-y': true), 'Rainy/04': ('position': top, 'size': 100% auto, 'colors': (1, 5)), 'Rainy/05': ('position': top, 'size': 100% auto, 'colors': (1, 5)), 'Rainy/05_001': ('position': top, 'size': 100% auto, 'colors': (1)), 'Rainy/06': ('position': bottom, 'size': 100% auto, 'colors': (1, 2, 3)), 'Rainy/07': ('position': top, 'size': 100% auto, 'colors': (1, 2, 3)), 'Rainy/08': ('position': top, 'size': 100% auto, 'colors': (1, 4)), 'Rainy/08_001': ('position': top, 'size': 100% auto, 'colors': (1, 4)), 'Rainy/09': ('position': top, 'size': 100% auto, 'colors': (1)), 'Rainy/09_001': ('position': top, 'size': 100% auto, 'colors': (1)), 'Rainy/10': ('position': center, 'size': 100% auto, 'colors': (1, 3)), 'Wavy/01': ('position': bottom, 'size': 100% auto, 'colors': (4)), 'Wavy/01_001': ('position': bottom, 'size': 100% auto, 'colors': (3)), 'Wavy/02': ('position': top, 'size': 100% auto, 'colors': (4)), 'Wavy/02_001': ('position': top, 'size': 100% auto, 'colors': (3)), 'Wavy/03': ('position': top, 'size': 100% auto, 'colors': (1, 2)), 'Wavy/04': ('position': bottom, 'size': 100% auto, 'colors': (1, 5)), 'Wavy/05': ('position': top, 'size': 100% auto, 'colors': (1, 5)), 'Wavy/06': ('position': top, 'size': 100% auto, 'colors': (1, 3, 4, 5)), 'Wavy/06_001': ('position': top, 'size': 100% auto, 'colors': (1, 3, 5)), 'Wavy/07': ('position': top, 'size': 100% auto, 'colors': (3)), 'Wavy/08': ('position': top, 'size': 100% auto, 'colors': (2)), 'Wavy/09': ('position': bottom, 'size': 100% auto, 'colors': (1, 5)), 'Wavy/10': ('position': center, 'size': 100% auto, 'colors': (1, 2)), 'Wavy/11': ('position': bottom, 'size': 100% auto, 'colors': (1, 4)), 'Wavy/12': ('position': top, 'size': 100% auto, 'colors': (1)), 'Wavy/12_001': ('position': bottom, 'size': 100% auto, 'colors': (1)), 'Wavy/13': ('position': bottom, 'size': 100% auto, 'colors': (4)), 'Wavy/13_001': ('position': bottom, 'size': 100% auto, 'colors': (1)), 'Wavy/14': ('position': bottom, 'size': 100% auto, 'colors': (1, 3)), 'Wavy/15': ('position': top, 'size': 100% auto, 'colors': (1)), 'Wavy/16': ('position': bottom, 'size': 100% auto, 'colors': (1)), 'Wavy/17': ('position': top, 'size': 100% auto, 'colors': (1)), 'Wavy/18': ('position': bottom, 'size': 100% auto, 'colors': (5)), 'Wavy/19': ('position': top, 'size': 100% auto, 'colors': (5)), 'Wavy/20': ('position': bottom, 'size': 100% auto, 'colors': (2)), 'Wavy/21': ('position': top, 'size': 100% auto, 'colors': (2)), 'Wavy/22': ('position': bottom, 'size': 100% auto, 'colors': (3)), 'Wavy/23': ('position': top, 'size': 100% auto, 'colors': (3)), 'Wavy/24': ('position': center, 'size': 100% auto, 'colors': (1, 2)), 'Wavy/25': ('position': top, 'size': 100% auto, 'colors': (1, 2)), 'Wavy/26': ('position': bottom right, 'size': auto 100%, 'colors': (1, 2)), 'Wavy/27': ('position': center, 'size': 100% auto, 'colors': (1, 2)), 'Wavy/28': ('position': center, 'size': 100% 100%, 'colors': (1, 3)), 'Zigs/01': ('position': bottom, 'size': 100% auto, 'colors': (2)), 'Zigs/01_001': ('position': bottom, 'size': 100% auto, 'colors': (2)), 'Zigs/02': ('position': bottom, 'size': 100% auto, 'colors': (2)), 'Zigs/02_001': ('position': bottom, 'size': 100% auto, 'colors': (2)), 'Zigs/03': ('position': top, 'size': 100% auto, 'colors': (1), 'repeat-y': true), 'Zigs/04': ('position': bottom, 'size': 100% auto, 'colors': (1)), 'Zigs/05': ('position': bottom, 'size': 100% auto, 'colors': (3)), 'Zigs/06': ('position': bottom, 'size': 30px 100%, 'colors': (4, 5), 'repeat-x': true), )); @function change-shape-colors-mapping($module, $shape-name, $mapping, $shapes: $o-bg-shapes){$-module-shapes: map-get($shapes, $module); $-modified-module-shapes: map-merge($-module-shapes, ( $shape-name: map-merge(map-get($-module-shapes, $shape-name), ('color-to-cc-bg-map': $mapping)), )); @return map-merge($shapes, ( $module: $-modified-module-shapes, ));}@function add-extra-shape-colors-mapping($module, $shape-name, $mapping-name, $mapping, $shapes: $o-bg-shapes){$-module-shapes: map-get($shapes, $module); $-shape-data: map-get($-module-shapes, $shape-name); $-extra-mappings: map-get($-shape-data, 'extra-mappings') or (); $-modified-module-shapes: map-merge($-module-shapes, ( $shape-name: map-merge($-shape-data, ('extra-mappings': map-merge($-extra-mappings, ($mapping-name: $mapping)))), )); @return map-merge($shapes, ( $module: $-modified-module-shapes, ));}@function add-header-shape-colors-mapping($module, $shape-name, $mapping, $shapes: $o-bg-shapes){@return add-extra-shape-colors-mapping($module, $shape-name, 'header', $mapping, $shapes);}@function add-footer-shape-colors-mapping($module, $shape-name, $mapping, $shapes: $o-bg-shapes){@return add-extra-shape-colors-mapping($module, $shape-name, 'footer', $mapping, $shapes);}@mixin o-input-number-no-arrows(){// Remove arrows/spinners from input type number // => Chrome, Safari, Edge, Opera input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{-webkit-appearance: none; margin: 0;}// => Firefox input[type=number]{-moz-appearance: textfield;}}; 

/* /web_editor/static/src/scss/wysiwyg.variables.scss */
// Floating Toolbar Variables $o-we-toolbar-entries-gap: $o-we-sidebar-content-field-control-item-spacing * .7 !default; $o-we-toolbar-entries-border-width: 1px !default; $o-we-toolbar-entries-padding: $o-we-sidebar-content-padding-base * .7 !default; $o-we-toolbar-bg: #FFF !default; $o-we-toolbar-bg-active: rgba($o-we-fg-light, .2) !default; $o-we-toolbar-border: $o-we-fg-light !default; $o-we-toolbar-color-text: $o-we-bg-light !default; $o-we-toolbar-color-accent: #018597 !default; $o-we-toolbar-color-clickable: $o-we-bg-lightest !default; $o-we-toolbar-color-clickable-active: $o-we-bg-darkest !default; 

/* /portal/static/src/scss/primary_variables.scss */
$o-portal-default-body-bg: white; $o-theme-navbar-logo-height: null; $o-theme-btn-icon-hover-decoration: none; 

/* /account/static/src/scss/variables.scss */
@keyframes animate-red{0%{color: red;}100%{color: inherit;}}.animate{animation: animate-red 1s ease;}

/* /website/static/src/scss/primary_variables.scss */
 //------------------------------------------------------------------------------ // Colors //------------------------------------------------------------------------------ $o-base-color-palette: map-merge($o-base-color-palette, ( 'body': $o-portal-default-body-bg, 'input': null, 'menu': 1, // o_cc1 'menu-custom': null, 'menu-border-color': null, // Default to classes used on the template 'header-sales_one': 2, 'header-sales_one-custom': null, 'header-sales_two': 5, 'header-sales_two-custom': null, 'header-sales_three': 2, 'header-sales_three-custom': null, 'header-sales_four': 1, 'header-sales_four-custom': null, 'footer': 5, // o_cc5 'footer-custom': null, 'copyright': null, 'copyright-custom': null, )); // By default, all user color palette values are null. Each null value is // automatically replaced with corresponsing color of chosen color palette. $o-user-color-palette: () !default; // By default, all user gray color palette values are null. Each null value // is automatically replaced with corresponsing color of chosen gray color // palette. $o-user-gray-color-palette: () !default; // By default, all user theme color palette values are null. Each null value // is automatically replaced with corresponsing color of chosen theme color // palette. $o-user-theme-color-palette: () !default; $o-social-colors: ( 'facebook': #3B5999, 'twitter': #55ACEE, 'linkedin': #0077B5, 'google-plus': #DD4B39, 'youtube': #ff0000, 'github': #1a1e22, 'instagram': #cf2872, 'whatsapp': #25d366, 'pinterest': #C8232C, 'tiktok': #000000, ); $o-theme-figcaption-opacity: 0.6; $o-color-palettes: map-merge($o-color-palettes, ( 'base-1': map-merge(map-get($o-color-palettes, 'base-1'), ( 'copyright-custom': 'black-15', )), 'base-2': map-merge(map-get($o-color-palettes, 'base-2'), ( 'menu': 2, 'footer': 2, 'copyright': 5, )), 'default-1': o-make-palette(#38383B, null, ( 'menu': 4, 'footer': 4, 'copyright-custom': 'black-15', )), 'default-2': o-make-palette(#0F5132, null, ( 'menu': 4, 'footer': 4, 'copyright-custom': 'black-15', )), 'default-3': o-make-palette(#6CB14F, #114B5F, ( 'menu': 3, 'footer': 3, 'copyright-custom': 'black-15', )), 'default-4': o-make-palette(#20C997, #426A5A, ( 'menu': 2, 'footer': 2, )), 'default-5': o-make-palette(#79DFC1, null, ( 'footer': 1, )), 'default-6': o-make-palette(#3DD5F3), 'default-7': o-make-palette(#6EA8FE, #474973), 'default-8': o-make-palette(#0AA2C0), 'default-9': o-make-palette(#0A58CA), 'default-10': o-make-palette(#6610F2, #C97064), 'default-11': o-make-palette(#6F42C1, #114B5F), 'default-12': o-make-palette(#A370F7, #504746), 'default-13': o-make-palette(#e36ff7, #233D4D), 'default-14': o-make-palette(#E56B6B, #4C5B5C), 'default-15': o-make-palette(#8B1E3F, #23395B), 'default-16': o-make-palette(#DE6528), 'default-17': o-make-palette(#E17726, #51344D), 'default-19': o-make-palette(#FAB803, #1A1423, ( 'menu': 3, 'footer': 3, 'copyright-custom': 'black-15', )), 'default-18': o-make-palette(#DFA400), 'default-20': o-make-palette(#B99253, #495867), 'generic-1': ( 'o-color-1': #984c46, 'o-color-2': #23323b, 'o-color-3': #eceae4, 'o-color-4': #FFFFFF, 'o-color-5': #16121f, 'menu': 3, 'footer': 3, 'copyright-custom': 'black-15', ), 'generic-2': ( 'o-color-1': #B99932, 'o-color-2': #DED1C1, 'o-color-3': #F5F5F5, 'o-color-4': #FFFFFF, 'o-color-5': #373737, 'menu': 5, 'copyright': 4, ), 'generic-3': ( 'o-color-1': #f8882f, 'o-color-2': #6a7c8f, 'o-color-3': #fdf8ef, 'o-color-4': #FFFFFF, 'o-color-5': #212c39, 'copyright-custom': 'black-15', ), 'generic-4': ( 'o-color-1': #6E7993, 'o-color-2': #96848C, 'o-color-3': #8F9AA2, 'o-color-4': #D5D5D5, 'o-color-5': #313347, 'menu': 5, 'copyright-custom': 'black-15', ), 'generic-5': ( 'o-color-1': #F7CF41, 'o-color-2': #1A2930, 'o-color-3': #989898, 'o-color-4': #FFFFFF, 'o-color-5': #0B1612, 'menu': 3, 'footer': 3, 'copyright-custom': 'black-15', ), 'generic-6': ( 'o-color-1': #45859A, 'o-color-2': #B57D4D, 'o-color-3': #F5F5F5, 'o-color-4': #FFFFFF, 'o-color-5': #10273C, 'menu': 2, 'footer': 2, 'copyright': 5, ), 'generic-7': ( 'o-color-1': #1a547a, 'o-color-2': #ddc76a, 'o-color-3': #D6E6F1, 'o-color-4': #FFFFFF, 'o-color-5': #2b3442, 'o-cc5-link': 'o-color-4', 'o-cc5-text': #9b9ba0, 'menu': 5, 'footer': 5, 'copyright': 3, ), 'generic-8': ( 'o-color-1': #763240, 'o-color-2': #C19F7F, 'o-color-3': #FFFFFF, 'o-color-4': #EAEAEA, 'o-color-5': #2F2F2F, 'o-cc4-headings': 'o-color-3', 'o-cc4-link': 'o-color-3', 'o-cc4-text': rgba(#fff, .8), 'o-cc5-headings': 'o-color-3', 'o-cc5-link': 'o-color-3', 'o-cc5-text': rgba(#fff, .8), 'footer': 1, 'copyright': 4, ), 'generic-9': ( 'o-color-1': #4DC5C1, 'o-color-2': #EC576B, 'o-color-3': #E5E337, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'menu': 5, 'copyright-custom': 'black-15', ), 'generic-10': ( 'o-color-1': #b56355, 'o-color-2': #6ba17a, 'o-color-3': #ebe6ea, 'o-color-4': #FFFFFF, 'o-color-5': #343733, 'footer': 2, 'copyright-custom': 'black-15', ), 'generic-11': ( 'o-color-1': #01ACAB, 'o-color-2': #FEDC3D, 'o-color-3': #FAE8E0, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'footer': 1, 'copyright-custom': 'black-15', ), 'generic-12': ( 'o-color-1': #926190, 'o-color-2': #F3E0CD, 'o-color-3': #F9EFE9, 'o-color-4': #FFFFFF, 'o-color-5': #291528, 'o-cc4-headings': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc4-text': rgba(#fff, .8), 'o-cc5-headings': 'o-color-4', 'o-cc5-link': 'o-color-4', 'o-cc5-text': rgba(#fff, .6), 'copyright-custom': 'black-15', ), 'generic-13': ( 'o-color-1': #478FA2, 'o-color-2': #CECECE, 'o-color-3': #E8E9E9, 'o-color-4': #FFFFFF, 'o-color-5': #173F54, 'footer': 1, 'copyright': 1, ), 'generic-14': ( 'o-color-1': #3CC37C, 'o-color-2': #E9C893, 'o-color-3': #F5F5F5, 'o-color-4': #FFFFFF, 'o-color-5': #1F3A2A, 'footer': 1, 'copyright': 5, ), 'generic-15': ( 'o-color-1': #01524B, 'o-color-2': #1993A3, 'o-color-3': #dddde6, 'o-color-4': #FFFFFF, 'o-color-5': #011D1B, 'o-cc4-btn-primary': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc4-text': rgba(#fff, .8), 'o-cc5-btn-primary': 'o-color-4', 'o-cc5-link': 'o-color-4', 'o-cc5-text': rgba(#fff, .6), 'footer': 2, 'copyright': 5, ), 'generic-16': ( 'o-color-1': #464D77, 'o-color-2': #36827f, 'o-color-3': #f2f0ec, 'o-color-4': #FFFFFF, 'o-color-5': #22263c, 'o-cc4-btn-primary': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc4-text': rgba(#fff, .8), 'o-cc5-btn-primary': 'o-color-4', 'o-cc5-btn-secondary': #d6d4d0, 'o-cc5-link': 'o-color-4', 'o-cc5-text': rgba(#fff, .6), 'menu': 2, 'footer': 2, 'copyright': 5, ), 'generic-17': ( 'o-color-1': #4717f6, 'o-color-2': #A43ACB, 'o-color-3': #FAFAFA, 'o-color-4': #FFFFFF, 'o-color-5': #0F0A19, 'menu': 5, 'footer': 5, 'copyright-custom': 'black-15', ), 'anelusia-1': ( 'o-color-1': #000000, 'o-color-2': #e4e4e4, 'o-color-3': #00459e, 'o-color-4': #ffffff, 'o-color-5': #444444, 'o-cc2-headings': 'o-color-4', 'o-cc2-link': 'o-color-4', 'o-cc2-btn-primary': 'o-color-4', 'o-cc4-headings': 'o-color-4', 'o-cc4-btn-primary': 'o-color-4', 'o-cc4-text': 'o-color-2', 'o-cc4-link': 'o-color-4', 'o-cc5-text': 'o-color-2', 'o-cc5-link': 'o-color-4', 'menu': 4, 'footer': 4, 'copyright': 4, ), 'anelusia-2': ( 'o-color-1': #d4ab0a, 'o-color-2': #444444, 'o-color-3': #ececec, 'o-color-4': #ffffff, 'o-color-5': #000000, 'menu': 4, 'footer': 1, 'copyright': 2, ), 'anelusia-3': ( 'o-color-1': #005699, 'o-color-2': #ac5e82, 'o-color-3': #d8eff1, 'o-color-4': #ffffff, 'o-color-5': #222222, 'o-cc5-link': #218bdf, 'o-cc5-btn-primary': #218bdf, 'copyright-custom': 'black-15', ), 'anelusia-4': ( 'o-color-1': #dc143c, 'o-color-2': #7e2839, 'o-color-3': #faf7e1, 'o-color-4': #ffffff, 'o-color-5': #222222, 'copyright-custom': 'black-15', ), 'anelusia-5': ( 'o-color-1': #32c0c9, 'o-color-2': #cfcfcf, 'o-color-3': #cee6e7, 'o-color-4': #ffffff, 'o-color-5': #2e2e2e, 'footer': 1, 'copyright-custom': 'black-15', ), 'anelusia-6': ( 'o-color-1': #e27b92, 'o-color-2': #e4e4e4, 'o-color-3': #465548, 'o-color-4': #ffffff, 'o-color-5': #222222, 'o-cc2-headings': 'o-color-4', 'o-cc5-text': 'o-color-2', 'menu': 2, 'footer': 2, 'copyright-custom': 'black-15', ), 'artists-1': ( 'o-color-1': #6930C3, 'o-color-2': #333038, 'o-color-3': #e5e5e5, 'o-color-4': #ffffff, 'o-color-5': #110d16, 'o-cc5-text': 'o-color-3', 'menu': 5, 'copyright-custom': 'black-15', ), 'artists-2': ( 'o-color-1': #1ad68f, 'o-color-2': #2e2e2e, 'o-color-3': #cfcfcf, 'o-color-4': #ffffff, 'o-color-5': #000000, 'menu': 2, 'copyright-custom': 'black-15', ), 'artists-3': ( 'o-color-1': #007882, 'o-color-2': #052286, 'o-color-3': #f9ede6, 'o-color-4': #ffffff, 'o-color-5': #33302e, 'o-cc5-link': #48d9e5, 'footer': 1, 'copyright': 1, ), 'artists-4': ( 'o-color-1': #0061df, 'o-color-2': #1b1b1b, 'o-color-3': #e8e6dc, 'o-color-4': #ffffff, 'o-color-5': #000000, 'menu': 2, 'footer': 2, 'copyright-custom': 'black-15', ), 'artists-5': ( 'o-color-1': #f48847, 'o-color-2': #282d30, 'o-color-3': #e9ceb0, 'o-color-4': #ffffff, 'o-color-5': #000000, 'footer': 3, 'copyright-custom': 'black-15', ), 'artists-6': ( 'o-color-1': #95d2e5, 'o-color-2': #454545, 'o-color-3': #f6f4f2, 'o-color-4': #ffffff, 'o-color-5': #000000, 'menu': 2, 'footer': 2, 'copyright-custom': 'black-15', ), 'avantgarde-1': ( 'o-color-1': #ee4980, 'o-color-2': #5f5458, 'o-color-3': #f7f7f7, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'o-cc1-headings': 'o-color-1', 'o-cc5-headings': 'o-color-1', 'body': 'o-color-3', 'footer': 1, 'copyright': 1, ), 'avantgarde-2': ( 'o-color-1': #38383b, 'o-color-2': #918f8b, 'o-color-3': #dfe0e1, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'o-cc4-headings': 'o-color-3', 'o-cc5-headings': 'o-color-2', 'o-cc4-btn-primary': 'o-color-3', 'o-cc5-btn-primary': 'o-color-2', 'menu': 4, 'footer': 4, 'copyright-custom': 'black-15', ), 'avantgarde-3': ( 'o-color-1': #f08e80, 'o-color-2': #0b0d63, 'o-color-3': #fdf0e6, 'o-color-4': #FFFFFF, 'o-color-5': #4e4d4d, 'o-cc2-headings': 'o-color-2', 'o-cc3-headings': 'o-color-3', 'o-cc4-headings': 'o-color-5', 'o-cc5-headings': 'o-color-1', 'menu': 3, 'footer': 4, 'copyright': 4, ), 'avantgarde-4': ( 'o-color-1': #f78f4a, 'o-color-2': #94583a, 'o-color-3': #F7EFBA, 'o-color-4': #FFFFFF, 'o-color-5': #312b24, 'o-cc2-headings': 'o-color-2', 'o-cc3-headings': 'o-color-3', 'o-cc4-headings': 'o-color-5', 'o-cc5-headings': 'o-color-1', 'o-cc2-btn-primary': 'o-color-2', 'o-cc3-btn-primary': 'o-color-3', 'footer': 1, 'copyright': 1, ), 'avantgarde-5': ( 'o-color-1': #AC578C, 'o-color-2': #69355D, 'o-color-3': #F7EFBA, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'o-cc2-headings': 'o-color-2', 'o-cc3-headings': 'o-color-3', 'o-cc4-headings': 'o-color-5', 'o-cc5-headings': 'o-color-1', 'o-cc2-btn-primary': 'o-color-2', 'o-cc3-btn-primary': 'o-color-3', 'footer': 1, 'copyright': 1, ), 'avantgarde-6': ( 'o-color-1': #f3b65b, 'o-color-2': #3c4e3c, 'o-color-3': #e7d1b5, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'o-cc2-headings': 'o-color-2', 'o-cc3-headings': 'o-color-3', 'o-cc5-headings': 'o-color-1', 'copyright-custom': 'black-15', ), 'avantgarde-7': ( 'o-color-1': #f48847, 'o-color-2': #282d30, 'o-color-3': #e9ceb0, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'o-cc2-headings': 'o-color-1', 'o-cc5-headings': 'o-color-1', 'copyright-custom': 'black-15', ), 'avantgarde-8': ( 'o-color-1': #278f84, 'o-color-2': #494048, 'o-color-3': #ebe1ea, 'o-color-4': #FFFFFF, 'o-color-5': #201c20, 'o-cc2-headings': 'o-color-1', 'o-cc5-headings': 'o-color-1', 'copyright-custom': 'black-15', ), 'beauty-1': ( 'o-color-1': #df699c, 'o-color-2': #590046, 'o-color-3': #dbe8ed, 'o-color-4': #ffffff, 'o-color-5': #222222, 'o-cc2-text': 'o-color-1', 'menu': 5, 'footer': 5, 'copyright': 5, ), 'beauty-2': ( 'o-color-1': #4fda89, 'o-color-2': #714e9c, 'o-color-3': #dadbdb, 'o-color-4': #ffffff, 'o-color-5': #242327, 'o-cc2-link': 'o-color-5', 'menu': 4, 'footer': 4, 'copyright': 2, ), 'beauty-3': ( 'o-color-1': #009083, 'o-color-2': #8ba1a0, 'o-color-3': #e9e9e9, 'o-color-4': #ffffff, 'o-color-5': #1e222f, 'footer': 2, 'copyright': 2, ), 'beauty-4': ( 'o-color-1': #b6977d, 'o-color-2': #585832, 'o-color-3': #e7e5e5, 'o-color-4': #ffffff, 'o-color-5': #000000, 'footer': 1, 'copyright': 1, ), 'beauty-5': ( 'o-color-1': #1ad68f, 'o-color-2': #2e2e2e, 'o-color-3': #e9e9e9, 'o-color-4': #ffffff, 'o-color-5': #000000, 'o-cc2-link': 'o-color-5', 'menu': 3, 'footer': 3, 'copyright': 3, ), 'beauty-6': ( 'o-color-1': #b3b862, 'o-color-2': #1e493b, 'o-color-3': #e3e7e9, 'o-color-4': #ffffff, 'o-color-5': #112625, 'o-cc2-link': 'o-color-5', 'copyright-custom': 'black-15', ), 'bewise-1': ( 'o-color-1': #162238, 'o-color-2': #b4904f, 'o-color-3': #f0f4f4, 'o-color-4': #ffffff, 'o-color-5': #222222, 'body': 'o-color-3', 'menu': 3, 'footer': 1, 'copyright': 1, ), 'bewise-2': ( 'o-color-1': #f74b94, 'o-color-2': #45AADA, 'o-color-3': #edf2f4, 'o-color-4': #ffffff, 'o-color-5': #333333, 'footer': 1, 'copyright': 1, ), 'bewise-3': ( 'o-color-1': #dbb132, 'o-color-2': #8578b9, 'o-color-3': #f4f4f4, 'o-color-4': #ffffff, 'o-color-5': #333333, 'footer': 1, 'copyright': 1, ), 'bistro-1': ( 'o-color-1': #68b581, 'o-color-2': #046380, 'o-color-3': #e8e6d1, 'o-color-4': #ffffff, 'o-color-5': #1d2127, 'o-cc1-text': 'o-color-5', 'menu': 1, 'footer': 5, 'copyright': 4, ), 'bistro-2': ( 'o-color-1': #8cc850, 'o-color-2': #cc4452, 'o-color-3': #f6f4e1, 'o-color-4': #ffffff, 'o-color-5': #4c4545, 'o-cc1-text': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-2', 'menu': 5, 'footer': 5, 'copyright': 4, ), 'bistro-3': ( 'o-color-1': #e2ad3b, 'o-color-2': #1a2a41, 'o-color-3': #f2ebd5, 'o-color-4': #ffffff, 'o-color-5': #d26400, 'o-cc1-text': 'o-color-2', 'o-cc2-headings': 'o-color-2', 'o-cc2-link': 'o-color-2', 'o-cc3-headings': 'o-color-3', 'o-cc5-link': 'o-color-3', 'menu': 3, 'footer': 3, 'copyright': 4, ), 'bistro-4': ( 'o-color-1': #0092b2, 'o-color-2': #046380, 'o-color-3': #f2ebd5, 'o-color-4': #ffffff, 'o-color-5': #a8c545, 'o-cc1-text': #002737, 'o-cc2-headings': 'o-color-2', 'o-cc3-headings': 'o-color-3', 'o-cc3-link': 'o-color-3', 'o-cc4-link': 'o-color-3', 'o-cc4-btn-primary': 'o-color-3', 'o-cc4-btn-secondary': 'o-color-2', 'o-cc5-link': 'o-color-2', 'o-cc5-btn-secondary': 'o-color-2', 'preheader': 4, 'menu': 1, 'footer': 3, 'copyright': 4, ), 'bistro-5': ( 'o-color-1': #dd7e43, 'o-color-2': #658791, 'o-color-3': #9cc264, 'o-color-4': #ffffff, 'o-color-5': #2b2d33, 'o-cc1-text': 'o-color-5', 'o-cc2-headings': 'o-color-4', 'o-cc2-btn-primary': 'o-color-4', 'o-cc2-link': 'o-color-4', 'o-cc3-btn-primary': 'o-color-4', 'o-cc3-btn-secondary': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc4-btn-primary': 'o-color-4', 'o-cc4-btn-secondary': 'o-color-5', 'o-cc4-link': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-2', 'o-cc5-link': 'o-color-1', 'preheader': 4, 'menu': 5, 'footer': 5, 'copyright': 4, ), 'bistro-6': ( 'o-color-1': #92b475, 'o-color-2': #8c7d77, 'o-color-3': #efefed, 'o-color-4': #ffffff, 'o-color-5': #011a33, 'o-cc1-text': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc3-btn-secondary': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc4-btn-secondary': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-4', 'menu': 2, 'footer': 5, 'copyright': 4, ), 'bookstore-1': ( 'o-color-1': #a1a52f, 'o-color-2': #66555c, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #242327, 'o-cc2-link': 'o-color-5', 'o-cc5-link': 'o-color-4', 'o-cc5-btn-primary': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-5', 'menu': 5, 'footer': 5, 'copyright': 5, ), 'bookstore-2': ( 'o-color-1': #679b96, 'o-color-2': #345552, 'o-color-3': #e9e9e9, 'o-color-4': #ffffff, 'o-color-5': #1e222f, 'o-cc2-link': 'o-color-5', 'o-cc2-headings': 'o-color-5', 'menu': 2, 'footer': 2, 'copyright': 2, ), 'bookstore-3': ( 'o-color-1': #df699c, 'o-color-2': #590046, 'o-color-3': #dbe8ed, 'o-color-4': #ffffff, 'o-color-5': #222222, 'o-cc2-link': 'o-color-5', 'o-cc2-headings': 'o-color-5', 'menu': 2, 'footer': 2, 'copyright': 2, ), 'bookstore-4': ( 'o-color-1': #b29964, 'o-color-2': #62624c, 'o-color-3': #f5f4f4, 'o-color-4': #ffffff, 'o-color-5': #333333, 'o-cc2-link': 'o-color-5', 'menu': 4, 'footer': 4, 'copyright': 4, ), 'bookstore-5': ( 'o-color-1': #1ad68f, 'o-color-2': #2e2e2e, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #000000, 'o-cc2-link': 'o-color-5', 'o-cc4-link': 'o-color-5', 'o-cc4-text': 'o-color-5', 'menu': 4, 'footer': 4, 'copyright': 4, ), 'bookstore-6': ( 'o-color-1': #cfd744, 'o-color-2': #3d504a, 'o-color-3': #f0f1f1, 'o-color-4': #ffffff, 'o-color-5': #112625, 'o-cc2-link': 'o-color-5', 'o-cc4-link': 'o-color-5', 'o-cc4-text': 'o-color-5', 'menu': 4, 'footer': 4, 'copyright': 4, ), 'clean-1': ( 'o-color-1': #3498db, 'o-color-2': #34495e, 'o-color-3': #e5edf2, 'o-color-4': #ffffff, 'o-color-5': #333333, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'clean-2': ( 'o-color-1': #7a58b2, 'o-color-2': #4e3575, 'o-color-3': #ecece4, 'o-color-4': #ffffff, 'o-color-5': #2c3e50, 'o-cc1-headings': 'o-color-5', 'o-cc5-link': #b9a1df, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'clean-3': ( 'o-color-1': #f85fa6, 'o-color-2': #a3416f, 'o-color-3': #e0e9f2, 'o-color-4': #ffffff, 'o-color-5': #222222, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'clean-4': ( 'o-color-1': #3d91db, 'o-color-2': #995528, 'o-color-3': #f0edeb, 'o-color-4': #ffffff, 'o-color-5': #222222, 'o-cc3-bg': #583e2d, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'clean-5': ( 'o-color-1': #53aeb4, 'o-color-2': #7f8c8d, 'o-color-3': #eef3f6, 'o-color-4': #ffffff, 'o-color-5': #34495e, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'cobalt-1': ( 'o-color-1': #116466, 'o-color-2': #2B3737, 'o-color-3': #F6F4F2, 'o-color-4': #ffffff, 'o-color-5': #a9bcbc, 'o-cc3-headings': 'o-color-3', 'o-cc3-text': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc3-btn-primary': 'o-color-4', 'o-cc3-btn-secondary': 'o-color-5', 'header': 1, 'footer': 3, 'copyright-custom': 'black-15', ), 'enark-1': ( 'o-color-1': #7b97af, 'o-color-2': #464d53, 'o-color-3': #f2f2f2, 'o-color-4': #FFFFFF, 'o-color-5': #191919, 'o-cc1-text': 'o-color-2', 'o-cc1-btn-primary': 'o-color-2', 'o-cc5-link': 'o-color-4', 'copyright-custom': 'black-15', ), 'enark-2': ( 'o-color-1': #41cb7a, 'o-color-2': #0f4c26, 'o-color-3': #fafafa, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'enark-3': ( 'o-color-1': #F2A679, 'o-color-2': #4f6b8c, 'o-color-3': #f4f2f2, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'o-cc4-text': 'o-color-5', 'menu': 4, 'footer': 4, 'copyright': 4, ), 'enark-4': ( 'o-color-1': #FFC513, 'o-color-2': #022859, 'o-color-3': #f4f2f2, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'o-cc4-text': 'o-color-5', 'menu': 4, 'footer': 4, 'copyright': 4, ), 'enark-5': ( 'o-color-1': #41cbb4, 'o-color-2': #0f4c4c, 'o-color-3': #f2f2ef, 'o-color-4': #FFFFFF, 'o-color-5': #000000, 'o-cc4-text': 'o-color-5', 'footer': 4, 'copyright': 4, ), 'graphene-1': ( 'o-color-1': #30cbb2, 'o-color-2': #3c4e5e, 'o-color-3': #f4f5f6, 'o-color-4': #ffffff, 'o-color-5': #192028, 'o-cc1-link': #04957e, 'o-cc5-text': #b2b2b2, 'body': 'black-15', 'menu': 1, 'footer': 5, 'copyright-custom': 'black-25', ), 'graphene-2': ( 'o-color-1': #c8a47e, 'o-color-2': #32273b, 'o-color-3': #f1f1ef, 'o-color-4': #ffffff, 'o-color-5': #252424, 'o-cc3-text': #b2b2b2, 'o-cc4-text': 'o-color-4', 'o-cc3-headings': 'o-color-4', 'o-cc4-headings': 'o-color-5', 'o-cc5-text': #b2b2b2, 'copyright-custom': 'black-15', ), 'graphene-3': ( 'o-color-1': #39588e, 'o-color-2': #d2b683, 'o-color-3': #e0dfdb, 'o-color-4': #f4f5f6, 'o-color-5': #2a282a, 'o-cc5-link': #7a9edc, 'menu': 2, 'footer': 2, 'copyright-custom': 'black-15', ), 'graphene-4': ( 'o-color-1': #f48747, 'o-color-2': #e9ceb0, 'o-color-3': #f1ebe5, 'o-color-4': #fbfaf8, 'o-color-5': #282d30, 'menu': 5, 'copyright-custom': 'black-15', ), 'kea-1': ( 'o-color-1': #e991a3, 'o-color-2': #575757, 'o-color-3': #f6f5f5, 'o-color-4': #ffffff, 'o-color-5': #333333, 'menu': 5, 'footer': 5, 'copyright': 5, ), 'kea-2': ( 'o-color-1': #f7a58e, 'o-color-2': #4b6272, 'o-color-3': #ecf0f2, 'o-color-4': #ffffff, 'o-color-5': #374249, 'menu': 4, 'footer': 4, 'copyright': 4, ), 'kea-3': ( 'o-color-1': #f9a646, 'o-color-2': #68635d, 'o-color-3': #f0efee, 'o-color-4': #ffffff, 'o-color-5': #333333, 'menu': 4, 'footer': 4, 'copyright': 4, ), 'kea-4': ( 'o-color-1': #ed6639, 'o-color-2': #385b9f, 'o-color-3': #d5dee3, 'o-color-4': #ffffff, 'o-color-5': #333333, 'o-cc4-link': 'o-color-4', 'o-cc4-btn-primary': 'o-color-4', 'menu': 4, 'footer': 4, 'copyright': 4, ), 'kiddo-1': ( 'o-color-1': #f3997b, 'o-color-2': #a7c7d5, 'o-color-3': #e3f0ee, 'o-color-4': #FFFFFF, 'o-color-5': #47464b, 'o-cc2-headings': null, 'menu': 4, 'footer': 4, 'copyright': 4, ), 'kiddo-2': ( 'o-color-1': #637bbe, 'o-color-2': #8eb9c7, 'o-color-3': #f6f0ea, 'o-color-4': #FFFFFF, 'o-color-5': #343643, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'kiddo-3': ( 'o-color-1': #684672, 'o-color-2': #639C8E, 'o-color-3': #f8ebd6, 'o-color-4': #FFFFFF, 'o-color-5': #302633, 'menu': 2, 'footer': 2, 'copyright': 2, 'o-cc1-headings': 'o-color-1', 'o-cc1-btn-secondary': 'o-color-3', ), 'kiddo-4': ( 'o-color-1': #c54545, 'o-color-2': #364481, 'o-color-3': #ccd7c5, 'o-color-4': #ffffff, 'o-color-5': #1f2230, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'loftspace-1': ( 'o-color-1': #a1a52f, 'o-color-2': #66555c, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #242327, 'menu': 5, 'footer': 5, 'copyright': 5, ), 'loftspace-2': ( 'o-color-1': #679b96, 'o-color-2': #345552, 'o-color-3': #e9e9e9, 'o-color-4': #ffffff, 'o-color-5': #1e222f, 'menu': 5, 'footer': 5, 'copyright': 5, ), 'loftspace-3': ( 'o-color-1': #df699c, 'o-color-2': #590046, 'o-color-3': #dbe8ed, 'o-color-4': #ffffff, 'o-color-5': #222222, 'menu': 5, 'footer': 5, 'copyright': 5, ), 'loftspace-4': ( 'o-color-1': #b29964, 'o-color-2': #62624c, 'o-color-3': #f5f4f4, 'o-color-4': #ffffff, 'o-color-5': #333333, 'menu': 5, 'footer': 5, 'copyright': 5, ), 'loftspace-5': ( 'o-color-1': #1ad68f, 'o-color-2': #2e2e2e, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #000000, 'menu': 5, 'footer': 5, 'copyright': 5, ), 'loftspace-6': ( 'o-color-1': #cfd744, 'o-color-2': #3d504a, 'o-color-3': #f0f1f1, 'o-color-4': #ffffff, 'o-color-5': #112625, 'menu': 5, 'footer': 5, 'copyright': 5, ), 'monglia-1': ( 'o-color-1': #ed145b, 'o-color-2': #9CD6FA, 'o-color-3': #f5f5f5, 'o-color-4': #ffffff, 'o-color-5': #111111, 'copyright-custom': 'black-15', ), 'monglia-2': ( 'o-color-1': #8f8747, 'o-color-2': #5b4645, 'o-color-3': #f0ecdb, 'o-color-4': #ffffff, 'o-color-5': #21263a, 'copyright-custom': 'black-15', ), 'monglia-3': ( 'o-color-1': #c0ce75, 'o-color-2': #704562, 'o-color-3': #dedede, 'o-color-4': #ffffff, 'o-color-5': #3e3e3e, 'copyright-custom': 'black-15', ), 'monglia-4': ( 'o-color-1': #1ad68f, 'o-color-2': #2e2e2e, 'o-color-3': #cfcfcf, 'o-color-4': #ffffff, 'o-color-5': #000000, 'copyright-custom': 'black-15', ), 'monglia-5': ( 'o-color-1': #c5ca60, 'o-color-2': #40a181, 'o-color-3': #bfddec, 'o-color-4': #ffffff, 'o-color-5': #112625, 'footer': 1, 'copyright': 1, ), 'monglia-6': ( 'o-color-1': #da557d, 'o-color-2': #6d4046, 'o-color-3': #fffddc, 'o-color-4': #ffffff, 'o-color-5': #3e3f43, 'footer': 1, 'copyright': 1, ), 'nano-1': ( 'o-color-1': #ed8558, 'o-color-2': #74bcc5, 'o-color-3': #efe9e0, 'o-color-4': #ffffff, 'o-color-5': #23262b, 'o-cc2-headings': 'o-color-5', 'o-cc3-btn-primary': 'o-color-4', 'o-cc3-link': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-2', 'body': 'o-color-5', 'preheader': 4, 'menu': 5, 'footer': 2, 'copyright': 5, ), 'nano-2': ( 'o-color-1': #e77557, 'o-color-2': #213047, 'o-color-3': #f2f2f2, 'o-color-4': #ffffff, 'o-color-5': #23262b, 'o-cc2-headings': 'o-color-2', 'o-cc4-link': 'o-color-4', 'menu': 3, 'footer': 2, 'copyright': 2, ), 'nano-3': ( 'o-color-1': #85bf4b, 'o-color-2': #74bcc5, 'o-color-3': #eaf2df, 'o-color-4': #ffffff, 'o-color-5': #23262b, 'o-cc2-headings': 'o-color-5', 'o-cc3-btn-primary': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-2', 'menu': 5, 'footer': 5, 'copyright': 5, ), 'nano-4': ( 'o-color-1': #16c6cc, 'o-color-2': #d72d3c, 'o-color-3': #e9ecef, 'o-color-4': #ffffff, 'o-color-5': #23262b, 'o-cc2-headings': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc4-link': 'o-color-4', 'menu': 5, 'footer': 2, 'copyright': 4, ), 'nano-5': ( 'o-color-1': #c7db58, 'o-color-2': #413659, 'o-color-3': #efefed, 'o-color-4': #ffffff, 'o-color-5': #23262b, 'o-cc2-headings': 'o-color-5', 'o-cc2-link': 'o-color-2', 'o-cc3-link': 'o-color-1', 'o-cc5-link': 'o-color-1', 'menu': 3, 'footer': 2, 'copyright': 3, ), 'nano-6': ( 'o-color-1': #db5d6b, 'o-color-2': #5acaaf, 'o-color-3': #efefed, 'o-color-4': #ffffff, 'o-color-5': #23262b, 'o-cc3-link': 'o-color-3', 'o-cc3-btn-primary': 'o-color-5', 'o-cc4-link': 'o-color-3', 'o-cc5-headings': 'o-color-1', 'o-cc5-link': 'o-color-1', 'menu': 5, 'footer': 2, 'copyright': 5, 'o-cc2-headings': 'o-color-5', ), 'notes-1': ( 'o-color-1': #a1c005, 'o-color-2': #9B96B4, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #212121, 'o-cc2-headings': 'o-color-5', 'menu': 5, 'copyright': 4, ), 'notes-2': ( 'o-color-1': #5191f0, 'o-color-2': #394b44, 'o-color-3': #f6f3ef, 'o-color-4': #ffffff, 'o-color-5': #212523, 'menu': 3, 'footer': 3, 'copyright': 4, ), 'notes-3': ( 'o-color-1': #DE8642, 'o-color-2': #B9B1A8, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #4B4D52, 'menu': 4, 'footer': 4, 'copyright': 5, ), 'notes-4': ( 'o-color-1': #ebd425, 'o-color-2': #48372f, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #352e2e, 'o-cc2-headings': 'o-color-5', 'o-cc4-text': 'o-color-5', 'menu': 3, 'footer': 3, 'copyright': 4, ), 'odoo-experts-1': ( 'o-color-1': #278f84, 'o-color-2': #494048, 'o-color-3': #f9f9f9, 'o-color-4': #FFFFFF, 'o-color-5': #201c20, 'o-cc5-link': #65e4d7, 'menu': 1, 'footer': 5, 'copyright': 5, ), 'odoo-experts-2': ( 'o-color-1': #414f8a, 'o-color-2': #888888, 'o-color-3': #f9f9f9, 'o-color-4': #FFFFFF, 'o-color-5': #222222, 'o-cc5-text': #b8b7b7, 'o-cc5-link': 'o-color-4', 'menu': 5, 'footer': 5, 'copyright': 5, ), 'odoo-experts-3': ( 'o-color-1': #dfcc60, 'o-color-2': #7f6262, 'o-color-3': #f9f9f9, 'o-color-4': #FFFFFF, 'o-color-5': #352626, 'menu': 4, 'footer': 4, 'copyright': 4, ), 'odoo-experts-4': ( 'o-color-1': #01e0b5, 'o-color-2': #5c7aff, 'o-color-3': #f9f9f9, 'o-color-4': #FFFFFF, 'o-color-5': #444444, 'o-cc2-link': 'o-color-5', 'menu': 3, 'footer': 3, 'copyright': 3, ), 'orchid-1': ( 'o-color-1': #a1a52f, 'o-color-2': #66555c, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #242327, 'footer': 4, 'copyright': 4, ), 'orchid-2': ( 'o-color-1': #679b96, 'o-color-2': #345552, 'o-color-3': #e9e9e9, 'o-color-4': #ffffff, 'o-color-5': #1e222f, 'footer': 1, 'copyright': 4, ), 'orchid-3': ( 'o-color-1': #df699c, 'o-color-2': #590046, 'o-color-3': #dbe8ed, 'o-color-4': #ffffff, 'o-color-5': #222222, 'footer': 1, 'copyright': 4, ), 'orchid-4': ( 'o-color-1': #b29964, 'o-color-2': #62624c, 'o-color-3': #f5f4f4, 'o-color-4': #ffffff, 'o-color-5': #333333, 'footer': 1, 'copyright': 4, ), 'orchid-5': ( 'o-color-1': #1ad68f, 'o-color-2': #2e2e2e, 'o-color-3': #f7f7f7, 'o-color-4': #ffffff, 'o-color-5': #000000, 'footer': 1, 'copyright': 4, ), 'orchid-6': ( 'o-color-1': #cfd744, 'o-color-2': #3d504a, 'o-color-3': #f0f1f1, 'o-color-4': #ffffff, 'o-color-5': #112625, 'menu': 4, 'footer': 4, 'copyright': 5, ), 'orchid-7': ( 'o-color-1': #007564, 'o-color-2': #fcb752, 'o-color-3': #f8f8f8, 'o-color-4': #ffffff, 'o-color-5': #011a16, ), 'paptic-1': ( 'o-color-1': #6772E5, 'o-color-2': #F5F9F9, 'o-color-3': #34B885, 'o-color-4': #ffffff, 'o-color-5': #9BA9BB, 'o-cc1-headings': 'o-color-5', 'o-cc1-link': 'o-color-1', 'o-cc1-btn-secondary': 'o-color-5', 'o-cc1-btn-secondary-border': 'o-color-5', 'o-cc2-headings': 'o-color-2', 'o-cc2-link': #40fffb, 'o-cc3-headings': 'o-color-3', 'o-cc4-link': #40fffb, 'o-cc5-link': #40fffb, 'header': 1, 'footer': 1, 'copyright': 3, ), 'real-estate-1': ( 'o-color-1': #539b80, 'o-color-2': #2e2e2e, 'o-color-3': #f4f4f4, 'o-color-4': #ffffff, 'o-color-5': #000000, 'o-cc1-btn-primary': #1ad68f, 'o-cc5-link': #1ad68f, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'real-estate-2': ( 'o-color-1': #006bff, 'o-color-2': #fda400, 'o-color-3': #F1F1F4, 'o-color-4': #ffffff, 'o-color-5': #2A2A33, 'footer': 1, 'copyright': 1, ), 'real-estate-3': ( 'o-color-1': #cddf66, 'o-color-2': #b62682, 'o-color-3': #f4f5f2, 'o-color-4': #ffffff, 'o-color-5': #000000, 'footer': 1, 'copyright': 1, ), 'real-estate-4': ( 'o-color-1': #007882, 'o-color-2': #48578a, 'o-color-3': #f4efeb, 'o-color-4': #ffffff, 'o-color-5': #33302e, 'o-cc5-link': #70c7cf, 'menu': 5, 'copyright-custom': 'black-15', ), 'treehouse-1': ( 'o-color-1': #68b581, 'o-color-2': #046380, 'o-color-3': #e8e6d1, 'o-color-4': #ffffff, 'o-color-5': #1d2127, 'o-cc1-text': 'o-color-5', 'o-cc4-btn-primary': 'o-color-4', 'o-cc4-link': 'o-color-4', 'menu': 1, 'footer': 5, 'copyright': 4, ), 'treehouse-2': ( 'o-color-1': #8cc850, 'o-color-2': #cc4452, 'o-color-3': #f6f4e1, 'o-color-4': #ffffff, 'o-color-5': #4c4545, 'o-cc1-text': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-2', 'menu': 5, 'footer': 5, 'copyright': 4, ), 'treehouse-3': ( 'o-color-1': #e2ad3b, 'o-color-2': #1a2a41, 'o-color-3': #f2ebd5, 'o-color-4': #ffffff, 'o-color-5': #d26400, 'o-cc1-text': 'o-color-2', 'o-cc2-headings': 'o-color-2', 'o-cc2-link': 'o-color-2', 'o-cc3-headings': 'o-color-3', 'o-cc5-link': 'o-color-3', 'menu': 3, 'footer': 3, 'copyright': 4, ), 'treehouse-4': ( 'o-color-1': #0092b2, 'o-color-2': #046380, 'o-color-3': #f2ebd5, 'o-color-4': #ffffff, 'o-color-5': #a8c545, 'o-cc1-text': #002737, 'o-cc2-headings': 'o-color-2', 'o-cc3-headings': 'o-color-3', 'o-cc3-link': 'o-color-3', 'o-cc4-link': 'o-color-3', 'o-cc4-btn-primary': 'o-color-3', 'o-cc4-btn-secondary': 'o-color-2', 'o-cc5-link': 'o-color-2', 'o-cc5-btn-secondary': 'o-color-2', 'menu': 1, 'footer': 3, 'copyright': 4, ), 'treehouse-5': ( 'o-color-1': #dd7e43, 'o-color-2': #658791, 'o-color-3': #e3e9eb, 'o-color-4': #ffffff, 'o-color-5': #d45c45, 'o-cc2-headings': 'o-color-2', 'o-cc3-link': 'o-color-3', 'o-cc4-link': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-4', 'o-cc5-link': 'o-color-4', 'menu': 1, 'footer': 2, 'copyright': 4, ), 'treehouse-6': ( 'o-color-1': #92b475, 'o-color-2': #8c7d77, 'o-color-3': #efefed, 'o-color-4': #ffffff, 'o-color-5': #011a33, 'o-cc1-text': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc3-btn-secondary': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc4-btn-secondary': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-4', 'menu': 2, 'footer': 5, 'copyright': 4, ), 'vehicle-1': ( 'o-color-1': #9e160d, 'o-color-2': #543b3b, 'o-color-3': #f7f6f6, 'o-color-4': #ffffff, 'o-color-5': #242424, 'footer': 1, 'copyright': 1, ), 'vehicle-2': ( 'o-color-1': #3e7ae9, 'o-color-2': #000000, 'o-color-3': #f3f3f3, 'o-color-4': #ffffff, 'o-color-5': #222222, 'menu': 2, 'footer': 2, 'copyright': 2, ), 'yes-1': ( 'o-color-1': #e991a3, 'o-color-2': #575757, 'o-color-3': #f6f5f5, 'o-color-4': #ffffff, 'o-color-5': #333333, 'footer': 1, 'copyright': 1, ), 'yes-2': ( 'o-color-1': #f7a58e, 'o-color-2': #4b6272, 'o-color-3': #ecf0f2, 'o-color-4': #ffffff, 'o-color-5': #374249, 'footer': 4, 'copyright': 4, ), 'yes-3': ( 'o-color-1': #92657e, 'o-color-2': #bbd3c1, 'o-color-3': #eeeeef, 'o-color-4': #ffffff, 'o-color-5': #574656, ), 'yes-4': ( 'o-color-1': #ed6639, 'o-color-2': #385b9f, 'o-color-3': #d5dee3, 'o-color-4': #ffffff, 'o-color-5': #333333, 'footer': 1, 'copyright': 4, ), 'zap-1': ( 'o-color-1': #337ab7, 'o-color-2': #5cb85c, 'o-color-3': #eceef1, 'o-color-4': #ffffff, 'o-color-5': #1d2127, 'o-cc1-text': 'o-color-5', 'o-cc3-link': 'o-color-4', 'o-cc4-link': 'o-color-4', 'o-cc5-headings': 'o-color-1', 'menu': 2, 'footer': 2, 'copyright': 4, ), 'zap-2': ( 'o-color-1': #ed8c2b, 'o-color-2': #a8c545, 'o-color-3': #8e3557, 'o-color-4': #efecca, 'o-color-5': #35203b, 'o-cc1-bg': #ffffff, 'o-cc1-text': #1d2127, 'o-cc3-link': 'o-color-4', 'o-cc3-btn-primary': 'o-color-5', 'o-cc4-link': 'o-color-4', 'menu': 5, 'footer': 5, 'copyright': 4, ), 'zap-3': ( 'o-color-1': #79bd8f, 'o-color-2': #046380, 'o-color-3': #beeb9f, 'o-color-4': #ffffff, 'o-color-5': #000000, 'o-cc1-text': #222222, 'o-cc2-headings': 'o-color-2', 'o-cc2-link': 'o-color-2', 'o-cc4-link': 'o-color-4', 'o-cc5-headings': 'o-color-3', 'o-cc5-link': 'o-color-3', 'menu': 1, 'footer': 5, 'copyright': 4, ), 'zap-4': ( 'o-color-1': #00b3c5, 'o-color-2': #d72d3c, 'o-color-3': #ebeef1, 'o-color-4': #ffffff, 'o-color-5': #000000, 'o-cc1-text': #1d2127, 'o-cc2-headings': 'o-cc1-text', 'o-cc3-link': 'o-color-4', 'o-cc4-link': 'o-color-4', 'menu': 2, 'footer': 2, 'copyright': 4, ), 'zap-5': ( 'o-color-1': #413659, 'o-color-2': #c9de55, 'o-color-3': #bdd4de, 'o-color-4': #ffffff, 'o-color-5': #14212b, 'o-cc1-text': 'o-color-5', 'o-cc2-btn-secondary': 'o-color-4', 'o-cc3-btn-secondary': 'o-color-4', 'o-cc4-btn-primary': 'o-color-2', 'o-cc4-btn-secondary': 'o-color-4', 'o-cc4-link': 'o-color-3', 'o-cc5-headings': 'o-color-2', 'o-cc5-btn-primary': 'o-color-4', 'o-cc5-btn-secondary': 'o-color-2', 'o-cc5-link': 'o-color-3', 'menu': 2, 'footer': 2, 'copyright': 4, ), 'zap-6': ( 'o-color-1': #F25244, 'o-color-2': #45858C, 'o-color-3': #e8f1ff, 'o-color-4': #ffffff, 'o-color-5': #000000, 'o-cc1-text': #323a49, 'o-cc2-headings': 'o-cc1-text', 'o-cc3-link': 'o-color-4', 'o-cc3-btn-primary': 'o-color-5', 'o-cc4-link': 'o-color-4', 'menu': 2, 'footer': 5, 'copyright': 4, ), ) ); // This map is used to support the old color palettes system. Previously, color // palettes were stored in a list and the selected one was retrieved using its // index. Now color palettes are stored in maps and retrieved using their key. // This map allows to convert the old palette index to the corresponding key. // Since the color palettes list was different for each theme, this // compatibility map is overridden by each theme. $o-color-palettes-compatibility-indexes: ( 1: 'base-1', 2: 'base-2', 3: 'generic-1', 4: 'generic-2', 5: 'generic-3', 6: 'generic-4', 7: 'generic-5', 8: 'generic-6', 9: 'generic-7', 10: 'generic-8', 11: 'generic-9', 12: 'generic-10', 13: 'generic-11', 14: 'generic-12', 15: 'generic-13', 16: 'generic-14', 17: 'generic-15', 18: 'generic-16', 19: 'generic-17', ); $o-gray-color-palettes-compatibility-indexes: null; // Default to the color one above $o-theme-color-palettes-compatibility-indexes: null; // Default to the color one above // Create the list of palettes proposed by the UI $o-selected-color-palettes-names: ( // Proposed by the configurator 'default-1', 'default-2', 'default-3', 'default-4', 'default-5', 'default-6', 'default-7', 'default-8', 'default-9', 'default-10', 'default-11', 'default-12', 'default-13', 'default-14', 'default-15', 'default-16', 'default-17', 'default-18', 'default-19', 'default-20', // System default 'base-1', 'base-2', ); //------------------------------------------------------------------------------ // Website customizations //------------------------------------------------------------------------------ $o-base-website-values-palette: ( 'font-size-base': 1rem, // Need a set value as the value is used in bootstrap_overridden files 'body-line-height': 1.5, 'headings-line-height': 1.2, 'paragraph-margin-top': 0, 'paragraph-margin-bottom': 16px, 'headings-margin-top': 0, 'headings-margin-bottom': 0.5rem, 'display-1-font-size': null, // Default to BS 'display-2-font-size': null, // Default to BS 'display-3-font-size': null, // Default to BS 'display-4-font-size': null, // Default to BS // Note that this custom value is not directly linked to the // "small-font-size" variable of bootstrap. Indeed we want the default // "small" behavior of bootstrap to stay the same: being "smaller" that the // context where it is used (em units). Here we want to define a specific // fixed font-size for a smaller font-size than the base font size. However, // the default value for the "smaller" behavior of Bootstrap is based on // this value anyway. See SMALLER_FONT_SIZE_RATIO. 'small-font-size': 0.875rem, 'google-fonts': null, 'google-local-fonts': null, 'body-image': null, 'body-image-type': 'image', // 'image' or 'pattern' 'layout': 'full', // 'full' / 'boxed' 'color-palettes-name': null, // Default to the individual variables for each color palette type 'btn-primary-outline': false, 'btn-secondary-outline': false, 'btn-primary-flat': false, 'btn-secondary-flat': false, 'btn-primary-outline-border-width': 1px, 'btn-secondary-outline-border-width': 1px, 'link-underline': 'hover', // 'never' / 'hover' / 'always' 'btn-ripple': false, 'btn-padding-y': null, // Default to BS 'btn-padding-x': null, // Default to BS 'btn-font-size': null, // Default to BS 'btn-padding-y-sm': null, // Default to portal value 'btn-padding-x-sm': null, // Default to BS 'btn-font-size-sm': null, // Default to BS 'btn-padding-y-lg': null, // Default to BS 'btn-padding-x-lg': null, // Default to BS 'btn-font-size-lg': null, // Default to BS 'btn-border-width': null, // Default to BS 'btn-border-radius': null, // Default to BS 'btn-border-radius-sm': null, // Default to BS 'btn-border-radius-lg': null, // Default to BS 'input-padding-y': null, // Default to BS 'input-padding-x': null, // Default to BS 'input-font-size': null, // Default to BS 'input-padding-y-sm': null, // Default to BS 'input-padding-x-sm': null, // Default to BS 'input-font-size-sm': null, // Default to BS 'input-padding-y-lg': null, // Default to BS 'input-padding-x-lg': null, // Default to BS 'input-font-size-lg': null, // Default to BS 'input-border-width': null, // Default to BS 'input-border-radius': null, // Default to BS 'input-border-radius-sm': null, // Default to BS 'input-border-radius-lg': null, // Default to BS // A key from the $o-theme-font-configs map (null = default to the first key // for the base 'font' value, the others just fallback to 'font'). 'font': null, 'headings-font': null, 'navbar-font': null, 'buttons-font': null, // Gradients 'menu-gradient': null, 'menu-secondary-gradient': null, 'footer-gradient': null, 'copyright-gradient': null, 'header-template': 'default', // 'default' / 'hamburger' / 'vertical' / 'sidebar' 'header-font-size': null, // Default to BS (normal font-size) 'header-text-color': null, 'header-links-style': 'default', // 'default' / 'fill' / 'outline' / 'pills' / 'block' / 'border-bottom' 'logo-height': null, // Default to navbar height (see portal) 'hamburger-position': 'left', // 'left' / 'center' / 'right' 'hamburger-position-mobile': 'left', // 'left' / 'center' / 'right' 'menu-border-width': null, // Default to classes used on the template 'menu-border-style': solid, // Default to classes used on the template 'menu-border-radius': null, // Default to classes used on the template 'menu-box-shadow': null, // Default to classes used on the template 'sidebar-width': 18.75rem, // 300px 'footer-template': 'default', 'footer-effect': null, // null / 'slideout_slide_hover' / 'slideout_shadow' 'footer-scrolltop': false, ); $o-font-aliases-to-keys: ( 'base': 'font', 'headings': 'headings-font', 'h2': 'h2-font', 'h3': 'h3-font', 'h4': 'h4-font', 'h5': 'h5-font', 'h6': 'h6-font', 'display-1': 'display-1-font', 'display-2': 'display-2-font', 'display-3': 'display-3-font', 'display-4': 'display-4-font', 'navbar': 'navbar-font', 'buttons': 'buttons-font', ); $o-website-values-palettes: ( ( // By default, the $o-base-website-values-palette for fonts are "null" // but will actually automatically be filled with the first font themes // define in $o-theme-font-configs (for the base one). For the default // website, we want to specifically use the system fonts. 'font': 'SYSTEM_FONTS', 'btn-padding-x': 1rem, 'btn-padding-x-sm': .5rem, 'btn-padding-y-lg': 1rem, 'btn-padding-x-lg': 2.5rem, 'btn-border-radius-lg': 2rem, ), ) !default; $o-website-values-palette-number: 1 !default; // By default, all user website values are null. Each null value is // automatically replaced with corresponsing value of chosen values palette. $o-user-website-values: () !default; //------------------------------------------------------------------------------ // Fonts //------------------------------------------------------------------------------ // These variables mirror BS multipliers behavior, except that in BS those are // hardcoded in '$h[x]-font-size' declarations and are not customizable. $o-theme-h1-font-size-multiplier: 3 !default; $o-theme-h2-font-size-multiplier: 2.5 !default; $o-theme-h3-font-size-multiplier: 2 !default; $o-theme-h4-font-size-multiplier: 1.5 !default; $o-theme-h5-font-size-multiplier: 1.25 !default; $o-theme-h6-font-size-multiplier: 1 !default; // Mirror BS default lead multiplier value $o-lead-ratio: 1.125 !default; // Map: // <font-name>: ( // 'family': <css font family list>, // 'url': <related part of google fonts URL>, // 'properties' (optional): ( // <font-alias>: ( // <website-value-key>: <value>, // ..., // ), // ..., // ) // ) // $o-base-theme-font-configs will be used to automatically extend // $o-theme-font-configs whatever themes added inside. $o-base-theme-font-configs: ( 'SYSTEM_FONTS': ( // This allows users to use default system fonts, potentially improving // page loading performances. This should always be kept as the first // font defined in $o-base-theme-font-configs. 'family': $o-system-fonts, ), ) !default; $o-theme-font-configs: ( 'Roboto': ( 'family': ('Roboto', sans-serif), 'url': 'Roboto:300,300i,400,400i,700,700i', ), 'Open Sans': ( 'family': ('Open Sans', sans-serif), 'url': 'Open+Sans:300,300i,400,400i,700,700i', ), 'Source Sans Pro': ( 'family': ('Source Sans Pro', sans-serif), 'url': 'Source+Sans+Pro:300,300i,400,400i,700,700i', ), 'Raleway': ( 'family': ('Raleway', sans-serif), 'url': 'Raleway:300,300i,400,400i,700,700i', ), 'Noto Serif': ( 'family': ('Noto Serif', serif), 'url': 'Noto+Serif:300,300i,400,400i,700,700i', ), 'Arvo': ( 'family': ('Arvo', Times, serif), 'url': 'Arvo:300,300i,400,400i,700,700i', ), ) !default; //------------------------------------------------------------------------------ // Mixins //------------------------------------------------------------------------------ @mixin o-ribbon-right(){@include o-position-absolute($top: 0, $right: 0); padding: 0.5rem $ribbon-padding; // 0.708 is 1 - cos(45deg) // Transforms are applied right-to-left // Cannot use matrix because of the use of % values. transform: translateX(calc(-0.708 * (100% - #{2 * $ribbon-padding}))) rotate(45deg) translateX(calc(100% - #{$ribbon-padding})); transform-origin: top right;}; @mixin o-ribbon-left(){@include o-position-absolute($top: 0, $left: 0); padding: 0.5rem $ribbon-padding; transform: translateX(calc(0.708 * (100% - #{2 * $ribbon-padding}) - 100%)) rotate(-45deg) translateX($ribbon-padding); transform-origin: top right;}; @mixin o-tag-right(){@include o-position-absolute($top: 0, $right: 0); padding: 0.25rem 1rem;}; @mixin o-tag-left(){@include o-position-absolute($top: 0, $left: 0); padding: 0.25rem 1rem;}; @mixin o-add-gradient($key){$-gradient: o-website-value($key); @if $-gradient{background-color: rgba(0, 0, 0, 0); background-image: $-gradient;}}; // Replaces 'NULL' string values in a map by the sass null value (this is useful // as a "hack" to allow users to define null values in their custom palette as // normal null values are immediately removed to act as "removing the user custo // and resetting to theme default": ideally, we should review that system to // actually removing the custos in those cases instead of setting a null value // but this cannot be migrated at the moment). // Also transforms `'True'` and `'False'` values into boolean `true`/`false`. // This is needed because of some options that wrongly set some CSS variables to // these values. @function o-map-force-nulls($map){$-map: (); @each $key, $value in $map{@if $value == 'True'{$value: true;}@if $value == 'False'{$value: false;}$-map: map-merge($-map, ( $key: if($value == 'NULL', null, $value), ));}@return $-map;}// Fade-in 'currentColor' by a customizable amount @function fade-currentColor($-opacity: 15%){@return color-mix(in srgb, currentColor #{$-opacity}, transparent);}

/* /website/static/src/scss/options/user_values.scss */
// This file is meant to be edited automatically by the user. The variables it // contains should not be renamed otherwise it would break existing customers // customizations. $o-user-website-values: map-merge($o-user-website-values, o-map-omit(( // -- hook -- ))); 

/* /website/static/src/scss/options/colors/user_color_palette.scss */
 $o-user-color-palette: map-merge($o-user-color-palette, o-map-omit(( // -- hook -- ))); 

/* /website/static/src/scss/options/colors/user_gray_color_palette.scss */
 $o-user-gray-color-palette: map-merge($o-user-gray-color-palette, o-map-omit(( // -- hook -- ))); 

/* /website/static/src/scss/options/colors/user_theme_color_palette.scss */
 $o-user-theme-color-palette: map-merge($o-user-theme-color-palette, o-map-omit(( // -- hook -- ))); 

/* /website_sale/static/src/scss/primary_variables.scss */
$o-wsale-products-layout-grid-ratio: 1.0 !default; $o-wsale-dropdown-width-overflow: 8em !default; $o-wsale-input-max-width: 32em !default; 

/* /web_gantt/static/src/gantt_view.variables.scss */
// = Gantt View Variables // ============================================================================ // Define the necessary conditions to provide visual feedback on hover, // focus, drag, clone and resize. @mixin o-gantt-hover(){&:hover, &:focus, &.o_dragged_pill, &.ui-resizable-resize{// Avoid visual feedback if 'o_gantt_renderer' has class 'o_grabbing', 'o_copying', 'o_no_dragging' or 'o_connect' @at-root #{selector-replace(&, ".o_gantt_renderer", ".o_gantt_renderer:not(.o_grabbing):not(.o_copying):not(.o_no_dragging):not(.o_connect)")}{@content;}}}// Generate background and text for each color. @mixin o-gantt-hoverable-colors($color){$color-subdle: mix($color, white, 60%); color: color-contrast($color-subdle); background-color: $color-subdle; @include o-gantt-hover(){background-color: $color; color: color-contrast($color);}}// Generate stripes decorations for each color. @mixin o-gantt-gradient-decorations($color){$color-subdle: mix($color, white, 60%); background-image: repeating-linear-gradient( -45deg, $color-subdle 0 10px, lighten($color-subdle, 6%) 10px 20px ); @include o-gantt-hover(){background-image: repeating-linear-gradient( -45deg, $color 0 10px, lighten($color, 6%) 10px 20px );}}@mixin o-gantt-ribbon-decoration($color){content: ""; width: 20px; height: 16px; @include o-position-absolute(-11px, $left: -13px); box-shadow: 1px 1px 0 white; background: $color; transform: rotate(45deg);}@mixin o-gantt-cell{&.o_gantt_today{background-color: $gantt-highlight-today-bg; border-left-color: $gantt-highlight-today-border; border-top-color: $gantt-highlight-today-border; + .o_gantt_header_cell, + .o_gantt_cell{border-left-color: $gantt-highlight-today-border;}}}@mixin o-gantt-zindex($level){z-index: map-get( ( // Grid and grid interactions level grid: 0, grid-interact: 1, // Pills level pill: 10, // Interactions => over pills interact: 20, // Top-most elements top: 30, // No-content helper view-nocontent: 25, ), $level );}$gantt-border-color: $o-gray-300 !default; $gantt-pill-height: 31px !default; $gantt-highlight-cell-color: rgba(0, 160, 157, 0.3) !default; $gantt-highlight-today-border: #dca665 !default; $gantt-highlight-today-bg: #fffaeb !default; $gantt-highlight-hover-row: rgba($o-brand-primary, 0.1) !default; $gantt-row-open-bg: $o-gray-100 !default; $gantt-pill-consolidated-height: 24px !default; $gantt-unavailability-bg: $o-gray-200 !default; $o-connector-creator-bullet-radius: 3px !default; $o-connector-creator-size: 8px !default; $o-connector-creator-bullet-diameter: 2 * $o-connector-creator-bullet-radius !default; $o-connector-wrapper-height: $o-connector-creator-size + $o-connector-creator-bullet-radius !default; 

/* /hr_org_chart/static/src/scss/variables.scss */
 $o-hr-org-chart-entry-pic-size: 46px; $o-hr-org-chart-entry-pic-small-size: $o-hr-org-chart-entry-pic-size * .8; 

/* /documents/static/src/scss/documents.variables.scss */
$o-dms-inspector-width: 320px !default; $o-dms-chatter-width: 525px !default; $o-dms-p: $o-horizontal-padding !default; $o-dms-p-small: $o-horizontal-padding*0.5 !default; $o-dms-p-tiny: $o-dms-p-small*0.5 !default; $o-dms-color-action: #00DAC5 !default; $o-dms-color-tag: $o-dms-color-action !default; $o-dms-color-model: #338FFC !default; $o-dms-color-history: #3bb97b !default; $o-dms-btn-to-activate: #427a1c !default; $o-dms-btn-to-delete: #963535 !default; $o-dms-btn-is-locked: #9e5c4d !default; $o-dms-inspector-label-breakpoint: 85px !default; $o-dms-inspector-txt-lighter: #f2f2f2 !default; $o-dms-inspector-txt-light: #cccccc !default; $o-dms-inspector-txt: #a09f9f !default; $o-dms-inspector-txt-link: lighten($o-dms-color-action, 10%) !default; $o-dms-inspector-txt-link-hover: $o-dms-color-action !default; $o-dms-inspector-bg-light: #4C4C4C !default; $o-dms-inspector-bg: #3F3F3F !default; $o-dms-inspector-bg-medium: #3D3D3D !default; $o-dms-inspector-bg-dark: #2E2E2E !default; $o-dms-inspector-bg-darker: #1A1A1A !default; $o-dms-progress-bar-height: 15px !default; $o-dms-inspector-width-model-button: 30px !default; $o-dms-kanban-stack-zindex: 2; 

/* /marketing_automation/static/src/scss/variables.scss */
$o-ma-border-color: var(--MarketingAutomation-border-color, #{$o-gray-300}); $o-ma-hierarchy-background: var(--MarketingAutomation__Hierarchy-background-color, #{$o-gray-100}); $o-ma-color-white: $o-view-background-color; 

/* /im_livechat/static/src/primary_variables.scss */
$o-mail-chat-header-height: 46px !default; $o-mail-Chatter-gap: 10px !default; $o-mail-ThreadIcon-opacity: 0.6 !default; 

/* /website/static/src/snippets/s_badge/000_variables.scss */
$s-badge-border-radius: null; $s-badge-padding: .5rem; $s-badge-margin: .5rem .5rem .5rem 0; $s-badge-i-margin: 0 .3rem 0 0; 

/* /website/static/src/snippets/s_product_list/000_variables.scss */
@mixin s-product-list-img-hook{}

/* /website/static/src/scss/secondary_variables.scss */
//------------------------------------------------------------------------------ // Website customizations //------------------------------------------------------------------------------ // Complete the base website values palette with the first defined font in // $o-theme-font-configs, this allows themes to just define a list of fonts and // relying on the fact the first one will be used (but not SYSTEM_FONTS which // is defined in $o-base-theme-font-configs). $-first-font-name: nth(map-keys($o-theme-font-configs), 1); @if map-get($o-base-website-values-palette, 'font') == null{$o-base-website-values-palette: map-merge($o-base-website-values-palette, ( 'font': $-first-font-name, ));}@function o-add-font-config($values){@each $alias, $key in $o-font-aliases-to-keys{$font-name: map-get($values, $key); $font-config: o-safe-get($o-theme-font-configs, $font-name, ()); $font-properties: o-safe-get($font-config, 'properties', ()); $type-font-properties: o-safe-get($font-properties, $alias, ()); $values: map-merge($values, $type-font-properties);}@return $values;}// Some fonts have been renamed in a stable version, and for retro compatibility // for users which have a custom user_values.css as attachment with an old font // already used, we map the old font with the new `similar` font $o-fonts-similar: ( 'Droid Serif': 'Noto Serif', 'SinKinSans': 'Spartan', 'Proxima': 'Montserrat', 'Comic Sans MS': 'Comic Neue', 'Fontastique': 'Bubblegum Sans', 'Luminari': 'Eagle Lake', 'Fecske': 'Marcellus', 'Din Alternate': 'Roboto', 'Muli': 'Mulish', ); @function o-map-font-aliases($values){$-values: $values; @each $key in map-values($o-font-aliases-to-keys){$value: map-get($values, $key); @if ($value and map-has-key($o-fonts-similar, $value)){$-values: map-merge($-values, ( $key: map-get($o-fonts-similar, $value), ));}}@return $-values;}; // By default, most website palette values are null. Each null value is // automatically replaced with corresponsing values in chosen default values // palette. $o-user-website-values: o-map-force-nulls($o-user-website-values); $o-user-website-values: o-map-font-aliases($o-user-website-values); $-website-values-default: o-safe-nth($o-website-values-palettes, $o-website-values-palette-number, ()); $-website-values-default: map-merge($o-base-website-values-palette, $-website-values-default); $-actual-user-website-values-palette: map-merge($-website-values-default, $o-user-website-values); // Default font selection + User font selection have been merged, now need to // add the right associated font default config $-actual-user-website-values-palette: o-add-font-config($-actual-user-website-values-palette); // Reforce the properties which already had a set values in the user map (the // font properties override the default palette values but not the user ones) $-actual-user-website-values-palette: map-merge($-actual-user-website-values-palette, $o-user-website-values); $o-website-values-palettes: append($o-website-values-palettes, $-actual-user-website-values-palette); // Enable last website values palette, which is now the user customized one $o-website-values-palette-number: length($o-website-values-palettes); $o-website-values: $-actual-user-website-values-palette !default; @function o-website-value($key){@return map-get($o-website-values, $key);}$o-theme-navbar-logo-height: o-website-value('logo-height') !default; $o-theme-navbar-fixed-logo-height: o-website-value('fixed-logo-height') !default; //------------------------------------------------------------------------------ // Colors //------------------------------------------------------------------------------ // First change the palette selection to the actual user choice if any, keeping // compatibility with old numbers too. $-color-palette-number: o-website-value('color-palettes-number') or if(variable-exists(o-color-palette-number), $o-color-palette-number, null); // Only in old databases $-color-palette-name: o-website-value('color-palettes-name'); $-gray-color-palette-name: $-color-palette-name; $-theme-color-palette-name: $-color-palette-name; // If defined palette number but no *user* defined palette name, this is an // old database with a old palette selection, we have to find the name from // the old number @if ($-color-palette-number and not map-get($o-user-website-values, 'color-palettes-name')){$-compat: $o-color-palettes-compatibility-indexes; $-color-palette-name: map-get($-compat, $-color-palette-number) or ''; $-compat: $o-gray-color-palettes-compatibility-indexes or $o-color-palettes-compatibility-indexes; $-gray-color-palette-name: map-get($-compat, $-color-palette-number) or ''; $-compat: $o-theme-color-palettes-compatibility-indexes or $o-color-palettes-compatibility-indexes; $-theme-color-palette-name: map-get($-compat, $-color-palette-number) or '';}@if ($-color-palette-name){$o-color-palette-name: $-color-palette-name;}@if ($-gray-color-palette-name){$o-gray-color-palette-name: $-gray-color-palette-name;}@if ($-theme-color-palette-name){$o-theme-color-palette-name: $-theme-color-palette-name;}$o-has-customized-13-0-color-system: not not (map-get($o-user-theme-color-palette, 'primary') or map-get($o-user-theme-color-palette, 'secondary') or map-get($o-user-theme-color-palette, 'alpha') or map-get($o-user-theme-color-palette, 'beta') or map-get($o-user-theme-color-palette, 'gamma') or map-get($o-user-theme-color-palette, 'delta') or map-get($o-user-theme-color-palette, 'epsilon')); $o-has-customized-colors: not not (length(map-keys($o-user-color-palette)) > 0 or map-get($o-user-theme-color-palette, 'success') or map-get($o-user-theme-color-palette, 'info') or map-get($o-user-theme-color-palette, 'warning') or map-get($o-user-theme-color-palette, 'danger')); // Color palette // ------------- // By default, most user color palette values are null. Each null value is // automatically replaced with corresponsing colors in chosen default color // palette. $o-user-color-palette: o-map-force-nulls($o-user-color-palette); $-palette-default: map-get($o-color-palettes, $o-color-palette-name) or (); $-actual-user-color-palette: map-merge($-palette-default, $o-user-color-palette); // Compatibility with old values in old names @each $name, $custom-name in ( // Each of those values were either a number for a color combination, a // string for a color name or a color. Now they should only be a number for // a color combination and the other value types for the color name/value // are handled by another variable. 'menu': 'menu-custom', 'header-sales_one': 'header-sales_one-custom', 'header-sales_two': 'header-sales_two-custom', 'header-sales_three': 'header-sales_three-custom', 'header-sales_four': 'header-sales_four-custom', 'footer': 'footer-custom', 'copyright': 'copyright-custom' ){$-base-value: map-get($-actual-user-color-palette, $name); @if $-base-value and $-base-value != 'NULL' and type-of($-base-value) != 'number'{$-base-custom-value: map-get($-actual-user-color-palette, $custom-name); $-actual-user-color-palette: map-merge($-actual-user-color-palette, ( $name: 1, $custom-name: $-base-custom-value or $-base-value, ));}}$o-color-palettes: map-merge($o-color-palettes, ('user-palette': $-actual-user-color-palette)); // Gray palette // ------------ // By default, most user gray palette values are null. Each null value is // automatically replaced with corresponsing colors in chosen default color // palette. $o-user-gray-color-palette: o-map-force-nulls($o-user-gray-color-palette); $-palette-default: map-get($o-gray-color-palettes, $o-gray-color-palette-name) or (); $-actual-user-gray-color-palette: map-merge($-palette-default, $o-user-gray-color-palette); $o-gray-color-palettes: map-merge($o-gray-color-palettes, ('user-palette': $-actual-user-gray-color-palette)); // Theme color palette // ------------------- // alpha -> epsilon colors are from the old color system, this is kept for // compatibility: Generate default theme color scheme if alpha is set $-alpha: map-get($o-user-theme-color-palette, 'alpha'); @if ($-alpha){$o-user-theme-color-palette: map-merge(( beta: lighten(desaturate($-alpha, 60%), 30%), gamma: desaturate(adjust-hue($-alpha, -45deg), 10%), delta: desaturate(adjust-hue($-alpha, 45deg), 10%), epsilon: desaturate(adjust-hue($-alpha, 180deg), 10%), ), $o-user-theme-color-palette);}// By default, all user theme color palette values are null. Each null value is // automatically replaced with corresponsing colors in chosen default theme // color palette. $o-user-theme-color-palette: o-map-force-nulls($o-user-theme-color-palette); $-palette-default: map-get($o-theme-color-palettes, $o-theme-color-palette-name) or (); $-actual-user-theme-color-palette: map-merge($-palette-default, $o-user-theme-color-palette); // Always remove the primary/secondary which were customizable in some theme // in Odoo <= 13.3. The customer can always rechoose the right color in the // Odoo color system as the first two ones are mapped to primary/secondary. $-actual-user-theme-color-palette: map-remove($-actual-user-theme-color-palette, 'primary', 'secondary' ); $o-theme-color-palettes: map-merge($o-theme-color-palettes, ('user-palette': $-actual-user-theme-color-palette)); // --- // Enable last color and theme color palettes, which are now the user customized // color palettes. $o-original-color-palette-name: $o-color-palette-name; $o-color-palette-name: 'user-palette'; $o-gray-color-palette-name: 'user-palette'; $o-theme-color-palette-name: 'user-palette'; $o-we-auto-contrast-exclusions: () !default; $o-we-auto-contrast-exclusions: join($o-we-auto-contrast-exclusions, map-keys($o-user-color-palette)); //------------------------------------------------------------------------------ // Fonts //------------------------------------------------------------------------------ // Use $o-base-theme-font-configs to extend $o-theme-font-configs whatever // themes added inside. $o-theme-font-configs: map-merge($o-base-theme-font-configs, $o-theme-font-configs); // Merge base fonts with user-added google fonts @each $font-name in (o-website-value('google-fonts') or ()){$o-theme-font-configs: map-merge($o-theme-font-configs, ( $font-name: ( 'family': (quote($font-name), sans-serif), 'url': quote($font-name) + ':300,300i,400,400i,700,700i', ), ));}// Add locally hosted google fonts @each $font-name, $font-attach-id in (o-website-value('google-local-fonts') or ()){// If a font exists both remotely and locally, we remove the remote font to // prioritize the local font. $o-theme-font-configs: map-remove($o-theme-font-configs, $font-name); $o-theme-font-configs: map-merge($o-theme-font-configs, ( $font-name: ( 'family': (quote($font-name), sans-serif), 'attachment': $font-attach-id, 'name': quote($font-name), ), ));}// Add odoo unicode support for all fonts @each $font-name, $font-config in $o-theme-font-configs{$o-theme-font-configs: map-merge($o-theme-font-configs, ( $font-name: map-merge($font-config, ( 'family': o-add-unicode-support-font(map-get($font-config, 'family')), )), ));}// Function which allows to retrieve a base info (family, url, properties) about // a component (base, navbar, ...)'s font. The font name is retrievable via a // simple o-website-value call. @function o-get-font-info($alias: 'base', $config-key: 'family'){$key: map-get($o-font-aliases-to-keys, $alias); $font-name: o-website-value($key); $-font-config: o-safe-get($o-theme-font-configs, $font-name, ()); @return map-get($-font-config, $config-key);}$o-theme-font: o-get-font-info('base') !default; // A theme which defines no default font normally automatically uses the first // one in $o-base-theme-font-configs. This ensures a misconfiguration also does. $o-theme-font: $o-theme-font or o-add-unicode-support-font($o-system-fonts); $o-theme-headings-font: o-get-font-info('headings') or $o-theme-font !default; $o-theme-h2-font: o-get-font-info('h2') or $o-theme-headings-font !default; $o-theme-h3-font: o-get-font-info('h3') or $o-theme-headings-font !default; $o-theme-h4-font: o-get-font-info('h4') or $o-theme-headings-font !default; $o-theme-h5-font: o-get-font-info('h5') or $o-theme-headings-font !default; $o-theme-h6-font: o-get-font-info('h6') or $o-theme-headings-font !default; $o-theme-display-1-font: o-get-font-info('display-1') or $o-theme-headings-font !default; $o-theme-display-2-font: o-get-font-info('display-2') or $o-theme-headings-font !default; $o-theme-display-3-font: o-get-font-info('display-3') or $o-theme-headings-font !default; $o-theme-display-4-font: o-get-font-info('display-4') or $o-theme-headings-font !default; $o-theme-navbar-font: o-get-font-info('navbar') or $o-theme-font !default; $o-theme-buttons-font: o-get-font-info('buttons') or $o-theme-font !default; $o-small-font-size: o-website-value('small-font-size') !default; 

/* /web_enterprise/static/src/scss/secondary_variables.scss */
// Needed for having no spacing between sheet and mail body in mass_mailing: // Different required cancel paddings between web and web_enterprise $o-sheet-cancel-tpadding: $o-horizontal-padding !default; $o-sheet-cancel-bpadding: $o-horizontal-padding + $o-sheet-vpadding !default; 

/* /web/static/src/scss/secondary_variables.scss */
$o-webclient-background-color: $o-gray-100 !default; $o-list-footer-color: null !default; $o-list-group-header-color: lighten($o-brand-lightsecondary, 10%) !default; // UI custom colors for tags, kanban records' colors, ...) // Note: the first value is the old BS3 gray-light value $o-colors: #a2a2a2, #ee2d2d, #dc8534, #e8bb1d, #5794dd, #9f628f, #db8865, #41a9a2, #304be0, #ee2f8a, #61c36e, #9872e6 !default; $o-colors-secondary: #aa4b6b, #30C381, #97743a, #F7CD1F, #4285F4, #8E24AA, #D6145F, #173e43, #348F50, #AA3A38, #795548, #5e0231, #6be585, #999966, #e9d362, #b56969, #bdc3c7, #649173, #ea00ff, #ff0026, #8bcc00, #00bfaf, #006aff, #af00bf, #bf001d, #bf6300, #8cff00, #00f2ff, #004ab3, #ff00d0, #ffa600, #3acc00, #00b6bf, #0048ff, #bf7c00, #04ff00, #00d0ff, #0036bf, #ff008c, #00bf49, #0092b3, #0004ff, #b20062, #649173 !default; // UI custom colors, complete list $o-colors-complete: join( $o-colors, $o-colors-secondary )!default; $o-sheet-cancel-hpadding: $o-horizontal-padding !default; $o-sheet-cancel-bpadding: $o-horizontal-padding !default; $o-statusbar-disabled-bg: lighten($o-brand-lightsecondary, 7%) !default; $o-datepicker-week-bg-color: lighten($o-datepicker-week-color, 30%) !default; // Computation of the total height of a single line, // useful to visually center elements eg. in a list view. $o-line-size: $o-line-height-base * $o-font-size-base !default; // Form // Safest for the next value would be map-get($container-max-widths, lg) as it // is the minimal width of the default form view design for md/lg sizes $o-form-sheet-min-width: 990px !default; $o-form-separator-color: invert($o-view-background-color, 10%) !default; $o-caret-down: url("data:image/svg+xml," + "<svg xmlns='http://www.w3.org/2000/svg' width='7' height='4' viewBox='0 0 7 4'>" + "<polygon fill='%23#{str-slice(#{$o-main-text-color}, 2)}' points='3.5 4 7 0 0 0'/>" + "</svg>"); 

/* /web_editor/static/src/scss/secondary_variables.scss */
 //------------------------------------------------------------------------------ // Colors //------------------------------------------------------------------------------ // Color combinations $o-color-combinations: o-safe-nth($o-color-combinations-presets, $o-color-combinations-preset-number, ()) !default; $-combination-additions: (); @for $index from 1 through length($o-color-combinations){$combination: map-merge($o-base-color-combination, nth($o-color-combinations, $index)); @each $element, $color in $combination{$-combination-additions: map-merge($-combination-additions, ( 'o-cc#{$index}-#{$element}': $color, ));}}// Colors $o-color-palette: map-get($o-color-palettes, $o-color-palette-name) or (); // Original color palette can contain override of the default combinations (so keep 'null' values for this merge) $o-color-palette: map-merge($-combination-additions, $o-color-palette); $o-color-palette: map-merge($o-base-color-palette, $o-color-palette); // Theme colors $o-theme-color-palette: map-get($o-theme-color-palettes, $o-theme-color-palette-name) or () !default; @if not $o-support-13-0-color-system{$o-theme-color-palette: map-remove($o-theme-color-palette, 'alpha', 'beta', 'gamma', 'delta', 'epsilon');}$-main-color: map-get($o-color-palette, 'o-color-1'); $-main-color-lightness: lightness($-main-color); $o-theme-color-palette: map-merge(( // color 1 and 2 are used to override primary and secondary BS4 // colors by default, so that theme colors affect the default Odoo layouts 'primary': $-main-color, 'secondary': map-get($o-color-palette, 'o-color-2'), ), $o-theme-color-palette); $o-theme-color-palette: map-merge($o-base-theme-color-palette, $o-theme-color-palette); // Gray colors // Extend grays with transparent ones (for some reason, BS4 create black-50 and // white-50 but does not allow overridding that with variables). $o-gray-color-palette: map-get($o-gray-color-palettes, $o-gray-color-palette-name) or () !default; $o-gray-color-palette: map-merge($o-transparent-grays, $o-gray-color-palette); $o-gray-color-palette: map-merge($o-base-gray-color-palette, $o-gray-color-palette); $o-color-system-initialized: false; // Returns: // - true if the given name is a css color or null // - false if a potential valid color name // - throws an error if the given arg cannot reference a color @function check-color-identifier-type($name){$-type: type-of($name); @if $-type == 'color' or $-type == 'null'{@return true;}@else if $-type != 'string'{@error "Color name '#{$name}' is of unsupported type '#{$-type}'";}@return false;}@function use-cc-bg($name){@if type-of($name) == 'number'{// Preset number, let's return the background color of the related // preset. @return 'o-cc#{$name}-bg';}@return $name;}// Looks up for the color related to the given name in the related odoo palettes // following redirection a maximum number of time (by default none). @function o-related-color($name, $max-recursions: 0, $original-name: $name, $use-cc-bg: false){@if $use-cc-bg{$name: use-cc-bg($name);}@else if type-of($name) == 'number'{@return $name;}@if $max-recursions < 0 or check-color-identifier-type($name){@return $name;}$-value: null; @if map-has-key($o-color-palette, $name){$-value: map-get($o-color-palette, $name);}@else if map-has-key($o-theme-color-palette, $name){$-value: map-get($o-theme-color-palette, $name);}@else if map-has-key($o-gray-color-palette, $name){$-value: map-get($o-gray-color-palette, $name);}@return o-related-color($-value, $max-recursions - 1, $original-name);}// Function which allows to retrieve a color value from a name, the color being // either in $theme-colors, $grays or $colors maps. If those maps are not // initialized yet, it will look up the color in the related odoo palettes. @function o-color($name){$name: use-cc-bg($name); @if check-color-identifier-type($name){@return $name;}// When the system is initialized, it means that the bootstrap maps have // been configured and contain a direct mapping between color name -> css // value. We can thus search in those. @if $o-color-system-initialized{@if map-has-key($colors, $name){@return map-get($colors, $name);}@if map-has-key($theme-colors, $name){@return map-get($theme-colors, $name);}@if map-has-key($grays, $name){@return map-get($grays, $name);}}// If not initialized, search the css color value in selected color palettes @return o-related-color($name, $max-recursions: 10, $use-cc-bg: true);}// Same as 'increase-contrast' except that the color is not changed if the given // related color name is part of the given exclusion list (default to a global // exclusion list which can be extended by other apps). $o-we-auto-contrast-exclusions: () !default; @function auto-contrast($color1, $color2, $color1-name, $exclude: $o-we-auto-contrast-exclusions){@if index($exclude, $color1-name){@return $color1;}@return increase-contrast($color1, $color2);}// Replace invalid characters used for colors in url. // (e.g. "rgba(0, 0, 0, .5)" or "#111111"). @function encode-color($colors){$colors: str-replace($colors, '#', '%23'); $colors: str-replace($colors, '(', '%28'); $colors: str-replace($colors, ')', '%29'); $colors: str-replace($colors, ',', '%2C'); $colors: str-replace($colors, ' ', '%20'); @return $colors;}//------------------------------------------------------------------------------ // Fonts //------------------------------------------------------------------------------ $o-small-font-size: 0.875rem !default; 

/* /website/static/src/scss/user_custom_bootstrap_overridden.scss */
// // /!\ // This file is meant to regroup your bootstrap customizations. In that file, // you must define variables *ONLY*. If you want to introduce new CSS rules // for your website, check the 'user_custom_rules.scss' file you can also edit. // /!\ // // You can change the value of a variable you can find in the bootstrap 5 // documentation (or in the file /web/static/lib/bootstrap/scss/_variables.scss) // and Odoo will automatically adapt its design to your new bootstrap. For // example, doing this will make some shadows and gradients appear, especially // for your buttons design: // // $enable-shadows: true; // $enable-gradients: true; // // Notice that Odoo already overrides bootstrap variables according to your // choices via the website builder (especially 3rd tab of the editor panel). You // should first take a look at it and do customizations this way. Indeed, if you // override the same variables yourself, Odoo will either have to ignore them or // not be able to make the website builder work properly for these variables // anymore. // 

/* /website/static/src/scss/bootstrap_overridden.scss */
// // Color system // //Restore BS4 Colors $blue: #007bff !default; $pink: #e83e8c !default; $green: #28a745 !default; $cyan: #17a2b8 !default; $gray-900: #212529 !default; //End Restore BS4 Colors $white: #FFF !default; $black: #000 !default; // This coupling allows to control the appearance of some app components (and // more). Note that it is still possible to have more than 2 "bright" main // colors by using them in color combinations config instead of as theme colors. $light: o-color('o-color-3'); $dark: o-color('o-color-5'); // The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7. // See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast // Overridden here as it is a dependency for some variables/functions afterwards $min-contrast-ratio: $o-frontend-min-contrast-ratio !default; // Prefix for :root CSS variables $variable-prefix: '' !default; // Restore negative margins disabled in BS5 by default $enable-negative-margins: true !default; // Customize the light and dark text colors for use in our color contrast function. $color-contrast-dark: o-color('900') !default; $color-contrast-light: o-color('white') !default; // Spacing // // Control the default styling of most Bootstrap elements by modifying these // variables. Mostly focused on spacing. // You can add more entries to the $spacers map, should you need more variation. $spacer: 1rem !default; // Need to predefine as used below $spacers: ( 0: 0, 1: $spacer * .25, 2: $spacer * .5, 3: $spacer, 4: $spacer * 1.5, 5: $spacer * 3, ) !default; // BS default // Body // // Settings for the `<body>` element. // Bootstrap uses `$body-bg` as default value for multiple variables but also in // the creation of CSS rules (not controlled by variables). In case of Odoo // boxed layout, `$body-bg` should thus be used to control the box background // color so that components displayed inside are consistent (as they use the // variable to compute some of their colors too). The background color behind // the box will be forced by an Odoo CSS rule instead of relying on Bootstrap // CSS rule (the <body> background color CSS rule) which uses `$body-bg`. // In future bootstrap version (> 5.1.3), this should probably be reviewed. // grep: BOXED_BODY_BG_ODOO $body-bg: o-color('o-cc1-bg') !default; $body-color: o-color('o-cc1-text') or color-contrast($body-bg) !default; // Links // // Style anchor elements. $-link-color: o-color('o-cc1-link'); $-link-color: if($-link-color, $-link-color, o-color('primary')); $link-color: auto-contrast($-link-color, $body-bg, 'o-cc1-link') !default; $link-hover-color: auto-contrast(darken($link-color, 15%), $body-bg, 'o-cc1-link') !default; $link-decoration: if(o-website-value('link-underline') == 'always', underline, none) !default; $link-hover-decoration: if(o-website-value('link-underline') != 'never', underline, none) !default; // Grid $grid-gutter-width: 30px !default; // Components // // Define common padding and border radius sizes and more. // Allow dynamic border-color adaptations $border-color: var(--o-border-color) !default; // Note: for the 'active' color, color preset edition is not really flexible but // this could come in a future update. $component-active-bg: o-color('o-cc1-btn-primary') !default; $component-active-color: if($component-active-bg, color-contrast($component-active-bg), null) !default; // Fonts // // Font, line-height, and color for body text, headings, and more. $font-family-sans-serif: $o-theme-font !default; $font-size-base: o-website-value('font-size-base') !default; // The top paragraph margin is a custom variable. $paragraph-margin-top: o-website-value('paragraph-margin-top') !default; $paragraph-margin-bottom: o-website-value('paragraph-margin-bottom') !default; $h1-font-size: o-website-value('h1-font-size') or $font-size-base * $o-theme-h1-font-size-multiplier !default; $h2-font-size: o-website-value('h2-font-size') or $font-size-base * $o-theme-h2-font-size-multiplier !default; $h3-font-size: o-website-value('h3-font-size') or $font-size-base * $o-theme-h3-font-size-multiplier !default; $h4-font-size: o-website-value('h4-font-size') or $font-size-base * $o-theme-h4-font-size-multiplier !default; $h5-font-size: o-website-value('h5-font-size') or $font-size-base * $o-theme-h5-font-size-multiplier !default; $h6-font-size: o-website-value('h6-font-size') or $font-size-base * $o-theme-h6-font-size-multiplier !default; $display-font-sizes: ( // If the theme does not configure, default to Bootstrap values. It has to // be duplicated here as Bootstrap does not merge the default map with the // overridden ones anymore. 1: o-website-value('display-1-font-size') or 5rem, 2: o-website-value('display-2-font-size') or 4.5rem, 3: o-website-value('display-3-font-size') or 4rem, 4: o-website-value('display-4-font-size') or 3.5rem, // Unused in Odoo templates and not configurable through the editor but we // still want default Bootstrap classes to work for now. Also using // o-website-value for those still allows to configure them through custom // code more easily if needed. 5: o-website-value('display-5-font-size') or 3rem, 6: o-website-value('display-6-font-size') or 2.5rem ) !default; // H2~H6 font families are custom variables. $headings-font-family: $o-theme-headings-font !default; $h2-font-family: $o-theme-h2-font !default; $h3-font-family: $o-theme-h3-font !default; $h4-font-family: $o-theme-h4-font !default; $h5-font-family: $o-theme-h5-font !default; $h6-font-family: $o-theme-h6-font !default; $display-1-font-family: $o-theme-display-1-font !default; $display-2-font-family: $o-theme-display-2-font !default; $display-3-font-family: $o-theme-display-3-font !default; $display-4-font-family: $o-theme-display-4-font !default; // H2~H6 line heights are custom variables. $headings-line-height: o-website-value('headings-line-height') !default; $h2-line-height: o-website-value('h2-line-height') or $headings-line-height !default; $h3-line-height: o-website-value('h3-line-height') or $headings-line-height !default; $h4-line-height: o-website-value('h4-line-height') or $headings-line-height !default; $h5-line-height: o-website-value('h5-line-height') or $headings-line-height !default; $h6-line-height: o-website-value('h6-line-height') or $headings-line-height !default; $display-1-line-height: o-website-value('display-1-line-height') or $headings-line-height !default; $display-2-line-height: o-website-value('display-2-line-height') or $headings-line-height !default; $display-3-line-height: o-website-value('display-3-line-height') or $headings-line-height !default; $display-4-line-height: o-website-value('display-4-line-height') or $headings-line-height !default; // H1~H6 top margins are custom variables. $headings-margin-top: o-website-value('headings-margin-top') or 0 !default; $h2-margin-top: o-website-value('h2-margin-top') or $headings-margin-top !default; $h3-margin-top: o-website-value('h3-margin-top') or $headings-margin-top !default; $h4-margin-top: o-website-value('h4-margin-top') or $headings-margin-top !default; $h5-margin-top: o-website-value('h5-margin-top') or $headings-margin-top !default; $h6-margin-top: o-website-value('h6-margin-top') or $headings-margin-top !default; $display-1-margin-top: o-website-value('display-1-margin-top') or $headings-margin-top !default; $display-2-margin-top: o-website-value('display-2-margin-top') or $headings-margin-top !default; $display-3-margin-top: o-website-value('display-3-margin-top') or $headings-margin-top !default; $display-4-margin-top: o-website-value('display-4-margin-top') or $headings-margin-top !default; // H2~H6 bottom margins are custom variables. $headings-margin-bottom: o-website-value('headings-margin-bottom') !default; $h2-margin-bottom: o-website-value('h2-margin-bottom') or $headings-margin-bottom !default; $h3-margin-bottom: o-website-value('h3-margin-bottom') or $headings-margin-bottom !default; $h4-margin-bottom: o-website-value('h4-margin-bottom') or $headings-margin-bottom !default; $h5-margin-bottom: o-website-value('h5-margin-bottom') or $headings-margin-bottom !default; $h6-margin-bottom: o-website-value('h6-margin-bottom') or $headings-margin-bottom !default; $display-1-margin-bottom: o-website-value('display-1-margin-bottom') or $headings-margin-bottom !default; $display-2-margin-bottom: o-website-value('display-2-margin-bottom') or $headings-margin-bottom !default; $display-3-margin-bottom: o-website-value('display-3-margin-bottom') or $headings-margin-bottom !default; $display-4-margin-bottom: o-website-value('display-4-margin-bottom') or $headings-margin-bottom !default; $headings-color: o-color('o-cc1-headings') !default; $lead-font-size: $font-size-base * $o-lead-ratio !default; // Note that we currently load only 700 for Google fonts, we may consider trying // to load more or this one only instead. Meanwhile, this fallbacks on 700 // if 600 is not available anyway. $font-weight-bold: 600 !default; $text-muted: mute-color($body-color) !default; // Tables // // Customizes the `.table` component with basic values, each used across all table variations. $table-striped-bg-factor: .01 !default; $table-cell-padding-x: .75rem !default; $table-cell-padding-y: .75rem !default; $table-cell-padding-x-sm: .3rem !default; $table-cell-padding-y-sm: .3rem !default; $table-border-color: $border-color !default; $table-group-separator-color: $table-border-color !default; // Buttons // // For each of Bootstrap's buttons, define text, background, and border color. $btn-padding-y: o-website-value('btn-padding-y') !default; $btn-padding-x: o-website-value('btn-padding-x') !default; $btn-font-size: o-website-value('btn-font-size') !default; $btn-padding-y-sm: o-website-value('btn-padding-y-sm') !default; $btn-padding-x-sm: o-website-value('btn-padding-x-sm') !default; $btn-font-size-sm: o-website-value('btn-font-size-sm') !default; $btn-padding-y-lg: o-website-value('btn-padding-y-lg') !default; $btn-padding-x-lg: o-website-value('btn-padding-x-lg') !default; $btn-font-size-lg: o-website-value('btn-font-size-lg') !default; $btn-border-width: o-website-value('btn-border-width') !default; $btn-border-radius: o-website-value('btn-border-radius') !default; $btn-border-radius-lg: o-website-value('btn-border-radius-lg') !default; $btn-border-radius-sm: o-website-value('btn-border-radius-sm') !default; // Forms $input-padding-y: o-website-value('input-padding-y') !default; $input-padding-x: o-website-value('input-padding-x') !default; $input-font-size: o-website-value('input-font-size') !default; $input-padding-y-sm: o-website-value('input-padding-y-sm') !default; $input-padding-x-sm: o-website-value('input-padding-x-sm') !default; $input-font-size-sm: o-website-value('input-font-size-sm') !default; $input-padding-y-lg: o-website-value('input-padding-y-lg') !default; $input-padding-x-lg: o-website-value('input-padding-x-lg') !default; $input-font-size-lg: o-website-value('input-font-size-lg') !default; $input-border-width: o-website-value('input-border-width') !default; $input-border-radius: o-website-value('input-border-radius') !default; $input-border-radius-lg: o-website-value('input-border-radius-lg') !default; $input-border-radius-sm: o-website-value('input-border-radius-sm') !default; $input-bg: o-color('input') or $body-bg !default; $input-border-color: $border-color !default; $input-color: color-contrast($input-bg) !default; $input-placeholder-color: mix($input-bg, $input-color) !default; $input-disabled-bg: mix($input-color, $input-bg, 10%) !default; $form-check-input-border: ($input-border-width or 1px) solid $input-border-color !default; // Note that using "input-disabled-bg" here might seems strange at first but it // is actually the most consistent found way at the moment: // - It does not depend on the "border-color", which is important as the // border-color depends on the "currentColor" in standard... and the track // does not have a color. // - It depends on "input-bg", which is what we want otherwise the "input-bg" // color would be used for all control elements except the range one. // - The notion of "disabled" kinda fits the "track" part of the range, as it is // the "disabled" part of the range value. True, it is still interactive but // a background color on its own is not enough to convey that meaning anyway // (a disabled range should have its *active* part with a different color). $form-range-track-bg: $input-disabled-bg !default; // Badge $badge-padding-y: 0.25em !default; $badge-padding-x: 0.4em !default; // Breadcrumbs $breadcrumb-padding-y: .75rem !default; $breadcrumb-padding-x: 1rem !default; // Navbar // Increase default navbar padding for some navbar styles $navbar-padding-x: $spacer !default; $navbar-padding-y: if(index(('fill', 'pills', 'outline'), o-website-value('header-links-style')), ($spacer / 2) * 1.25, null) !default; $navbar-nav-link-padding-x: if(index(('outline', 'block'), o-website-value('header-links-style')), .5rem * 3, null) !default; $navbar-nav-link-padding-x: if(o-website-value('header-links-style') == 'border-bottom', .5rem * 2, null) !default; // Jumbotron $jumbotron-bg: transparent !default; // Block Quote $blockquote-margin-y: 0 !default; // Bootstrap Review $o-btn-flat-defaults: () !default; $o-btn-outline-defaults: () !default; $o-btn-outline-border-width-defaults: () !default; @each $color in ('primary', 'secondary'){@if o-website-value('btn-#{$color}-flat'){$o-btn-flat-defaults: append($o-btn-flat-defaults, $color);}@else if o-website-value('btn-#{$color}-outline'){$o-btn-outline-defaults: append($o-btn-outline-defaults, $color); $o-btn-outline-border-width-defaults: map-merge($o-btn-outline-border-width-defaults, ( $color: o-website-value('btn-#{$color}-outline-border-width'), ));}}// Increase default navbar pills padding for 'pills' mode and add big radius $o-navbar-nav-pills-link-padding-x: if(o-website-value('header-links-style') == 'pills', 1rem * 1.5, null) !default; $o-navbar-nav-pills-link-border-radius: if(o-website-value('header-links-style') == 'pills', 10rem, null) !default; // Borders $border-radius-sm: .3rem !default; $border-radius: .4rem !default; $border-radius-lg: .6rem !default; $border-radius-pill: 50rem !default; // BS Default // Accordion $accordion-color: inherit !default; $accordion-bg: inherit !default; $accordion-padding-x: 1.5rem !default; $accordion-border-width: 1px !default; $accordion-border-color: $border-color !default; $accordion-button-active-bg: $light !default; $accordion-button-active-color: color-contrast($light) !default; $accordion-button-focus-box-shadow: none !default; $accordion-icon-color: $body-color !default; $accordion-icon-active-color: $accordion-button-active-color !default; // Popovers $popover-bg: $body-bg !default; $popover-border-color: $border-color !default; $popover-arrow-color: $body-bg !default; $popover-arrow-outer-color: $border-color !default; // Shadows $box-shadow: 0px 4px 16px rgba($black, 0.12) !default; $box-shadow-sm: 0px 1px 3px rgba($black, .1) !default; $box-shadow-lg: 0px 12px 32px rgba($black, .175) !default; // Cards $card-border-color: $border-color !default; // Modals $modal-header-border-width: 0 !default; $modal-footer-border-width: 0 !default; // HR Separator $hr-color: $border-color !default; $hr-opacity: 1 !default; // Pagination // Arbitrary values to get a circle for 1 digit numbers $pagination-padding-y: 0.4ch !default; $pagination-padding-x: 1.2ch !default; $pagination-border-radius: $border-radius-pill !default; $pagination-margin-start: map-get($map: $spacers, $key: 1) !default; $pagination-border-color: transparent !default; $pagination-bg: $body-bg !default; $pagination-color: color-contrast($pagination-bg) !default; $pagination-transition: none !default; $pagination-focus-bg: $light !default; $pagination-focus-color: color-contrast($light) !default; $pagination-focus-box-shadow: 0 0 0 1px $pagination-focus-bg !default; $pagination-hover-bg: $light !default; $pagination-hover-color: color-contrast($light) !default; $pagination-hover-border-color: $light !default; $pagination-disabled-color: rgba(color-contrast($pagination-bg), 0.5) !default; $pagination-disabled-border-color: transparent !default; $pagination-disabled-bg: $pagination-bg !default; $pagination-padding-y-sm: $pagination-padding-y !default; $pagination-padding-x-sm: $pagination-padding-x !default; $pagination-padding-y-lg: $pagination-padding-y !default; $pagination-padding-x-lg: $pagination-padding-x !default; $pagination-border-radius-lg: $pagination-border-radius !default; $pagination-border-radius-sm: $pagination-border-radius !default; 

/* /portal/static/src/scss/bootstrap_overridden.scss */
// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7. // See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast // Overridden here as it is a dependency for some variables/functions afterwards $min-contrast-ratio: $o-frontend-min-contrast-ratio !default; //Restore BS4 Colors $blue: #007bff !default; $pink: #e83e8c !default; $green: #28a745 !default; $cyan: #17a2b8 !default; $gray-900: #212529 !default; //End Restore BS4 Colors $gray-300: #dee2e6 !default; $light: #eeeeee !default; // Body // // Settings for the `<body>` element. $body-bg: $o-portal-default-body-bg !default; // Fonts // // Font, line-height, and color for body text, headings, and more. $font-size-sm: (12 / 16) * 1rem !default; // Table $table-border-color: $gray-300 !default; $table-group-separator-color: $gray-300 !default; // Buttons // // For each of Bootstrap's buttons, define text, background, and border color. $btn-padding-y-sm: (1 / 16) * 1rem !default; $btn-padding-x-sm: (5 / 16) * 1rem !default; // Navbar $navbar-dark-toggler-border-color: transparent; $navbar-light-toggler-border-color: transparent; // Modals $modal-lg: $o-modal-lg; $modal-md: $o-modal-md; 

/* /web_editor/static/src/scss/bootstrap_overridden.scss */
// TODO this whole file is probably not needed in the backend and may be the // cause of color issues. It will be reviewed in master (probably removed from // backend bundles and simplified). // Automatically update bootstrap colors map (unused by BS itself) $colors: () !default; @each $name, $color in $o-color-palette{$colors: map-merge(('#{$name}': o-color($color)), $colors);}$o-btn-bg-colors: () !default; $o-btn-border-colors: () !default; @if not (variable-exists('prevent-backend-colors-alteration') and $prevent-backend-colors-alteration){$o-btn-bg-colors: map-merge(( 'primary': o-color('o-cc1-btn-primary'), 'secondary': o-color('o-cc1-btn-secondary'), ), $o-btn-bg-colors); $o-btn-border-colors: map-merge(( 'primary': o-color('o-cc1-btn-primary-border'), 'secondary': o-color('o-cc1-btn-secondary-border'), ), $o-btn-border-colors);}// Automatically extend bootstrap to create theme background/text/button classes $theme-colors: () !default; @each $name, $color in $o-theme-color-palette{$theme-colors: map-merge(('#{$name}': o-color($color)), $theme-colors);}// Automatically extend bootstrap gray palette (the theme palette is supposed to // at least declare white and black) $grays: () !default; @each $name, $color in $o-gray-color-palette{$grays: map-merge(('#{$name}': o-color($color)), $grays);}// Detach colors that are used for backend UI (see comment linked to the // prevent-backend-colors-alteration for more information) @if variable-exists('prevent-backend-colors-alteration') and $prevent-backend-colors-alteration{$theme-colors: map-remove($theme-colors, 'primary', 'secondary', 'success', 'info', 'warning', 'danger', 'light', 'dark'); $grays: map-remove($grays, '100', '200', '300', '400', '500', '600', '700', '800', '900', 'black', 'white');}// Bootstrap use standard variables to define individual colors which are then // placed into a map which is then used to get the value of each individual // color. As BS4 allows to extend the map a priori to define our own colors, // it does not take care of making the standard variables match the values in // the user's map. The problem is that, at least for grays, bootstrap uses the // standard variables in its _variables.scss file, so if: // // User file: // $grays: ( // '100': blue, // ); // // BS4: // $gray-100: gray !default; // $grays: () !default; // $grays: map-merge(( // '100': $gray-100, // ), $grays); // // -> Here map-get($grays, '100') is blue but $gray-100 is still gray... so BS4 is not // correctly generated as BS4 uses $gray-100 in _variables.scss $primary: map-get($theme-colors, 'primary') !default; $secondary: map-get($theme-colors, 'secondary') !default; $success: map-get($theme-colors, 'success') !default; $info: map-get($theme-colors, 'info') !default; $warning: map-get($theme-colors, 'warning') !default; $danger: map-get($theme-colors, 'danger') !default; $light: map-get($theme-colors, 'light') !default; $dark: map-get($theme-colors, 'dark') !default; $white: map-get($grays, 'white') !default; $gray-100: map-get($grays, '100') !default; $gray-200: map-get($grays, '200') !default; $gray-300: map-get($grays, '300') !default; $gray-400: map-get($grays, '400') !default; $gray-500: map-get($grays, '500') !default; $gray-600: map-get($grays, '600') !default; $gray-700: map-get($grays, '700') !default; $gray-800: map-get($grays, '800') !default; $gray-900: map-get($grays, '900') !default; $black: map-get($grays, 'black') !default; $o-color-system-initialized: true; // This was added by compatibility but it actually became a nice behavior: the // bootstrap default "small" behavior will use the ratio of the configured base // font size (if configured, e.g. with website settings) and the Odoo own's // "small" font size. Grep: SMALLER_FONT_SIZE_RATIO. $small-font-size: if( variable-exists('font-size-base'), ($o-small-font-size / $font-size-base) * 1em, null ) !default; 

/* /web/static/src/scss/bootstrap_overridden_frontend.scss */
// Color system // // Note: all of these variables use BS default values, will be eventually // overridden by website and are declared here just to allow components // customization (eg. form-range) // gray-color-variables $white: #fff !default; $gray-400: #ced4da !default; // color-variables $blue: #0d6efd !default; // theme-color-variables $primary: $blue !default; // The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7. // See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast $min-contrast-ratio: $o-frontend-min-contrast-ratio !default; // Body $body-bg: $white !default; // BS Default $body-color: $o-main-text-color !default; // Components // // Define common padding and border radius sizes and more. $border-width: 1px !default; // BS Default // Fonts // // Font, line-height, and color for body text, headings, and more. $font-family-sans-serif: o-add-unicode-support-font($o-system-fonts) !default; $font-size-base: (14 / 16) * 1rem !default; // Inherit color for blockquote-footer, use text-muted on top of it if you want // a muted one. This is defined here to be consistent in the whole frontend, as // when used with background classes, it should not be forced to a gray color. $blockquote-small-color: inherit !default; // Link $link-decoration: none !default; // Tables // // Customizes the `.table` component with basic values, each used across all table variations. // Bootstrap tables can basically be customized with the `$table-bg` and // `$table-color` variables. The problem is that, by default, BS5 defines them // so that the background-color is null (so transparent: displaying the // background-color of its ancestors) but the color is forced to the body color // (by default: white). This is a problem as soon as the ancestors background // colors are a color close to the body text color: the text becomes invisible. // We disable this behavior by not forcing a text color for tables. $table-color: inherit !default; // Forms $component-active-bg: $primary !default; $input-color: $body-color !default; $input-bg: $body-bg !default; $input-transition: background-color .05s ease-in-out, border-color .05s ease-in-out, box-shadow .05s ease-in-out !default; $input-disabled-bg: $gray-200 !default; $input-disabled-border-color: rgba($input-color, 0.15) !default; $form-check-input-border: $border-width solid $gray-400 !default; $form-check-input-border-radius: 0 !default; $form-check-input-checked-color: color-contrast($component-active-bg, $body-color, $white) !default; $form-switch-color: $input-color !default; $form-switch-checked-color: $form-check-input-checked-color !default; $form-select-indicator-color: $input-color !default; $form-select-disabled-color: mix($input-color, $input-bg) !default; $form-select-disabled-bg: $input-disabled-bg !default; $form-select-disabled-border-color: $input-disabled-border-color !default; $form-range-track-height: .1rem !default; $form-range-thumb-border: $border-width solid $primary !default; $form-range-thumb-bg: $body-bg !default; $form-range-thumb-active-bg: $primary !default; $form-range-thumb-disabled-bg: $input-disabled-bg !default; // Figures // Inherit color for figure-caption, use text-muted on top of it if you want // a muted one. This is defined here to be consistent in the whole frontend, as // when used with background classes, it should not be forced to a gray color. $figure-caption-color: inherit !default; // Offcanvas $offcanvas-border-width: 0 !default; $offcanvas-backdrop-opacity: .3 !default; 

/* /web/static/src/scss/pre_variables.scss */
// Hack for Bootstrap 5 // In Bootstrap 4 these variables was used with map-merge() // In Bootstrap 5 these variables has set only if they don't exist before // PS: Another fix will be to reorder all bundle to follow Bootstrap documentation and do another // logic that wasn't use before // Ref: // https://getbootstrap.com/docs/5.1/customize/sass/#colors // Need to be include before web/static/lib/bootstrap/scss/_variables.scss $white: #fff !default; $gray-100: #f8f9fa !default; $gray-200: #e9ecef !default; $gray-300: #dee2e6 !default; $gray-400: #ced4da !default; $gray-500: #adb5bd !default; $gray-600: #6c757d !default; $gray-700: #495057 !default; $gray-800: #343a40 !default; $gray-900: #212529 !default; $black: #000 !default; $grays: () !default; $grays: map-merge(( "100": $gray-100, "200": $gray-200, "300": $gray-300, "400": $gray-400, "500": $gray-500, "600": $gray-600, "700": $gray-700, "800": $gray-800, "900": $gray-900 ), $grays); $blue: #0d6efd !default; $indigo: #6610f2 !default; $purple: #6f42c1 !default; $pink: #d63384 !default; $red: #dc3545 !default; $orange: #fd7e14 !default; $yellow: #ffc107 !default; $green: #198754 !default; $teal: #20c997 !default; $cyan: #0dcaf0 !default; $colors: () !default; $colors: map-merge(( "blue": $blue, "indigo": $indigo, "purple": $purple, "pink": $pink, "red": $red, "orange": $orange, "yellow": $yellow, "green": $green, "teal": $teal, "cyan": $cyan, "white": $white, "gray": $gray-600, "gray-dark": $gray-800 ), $colors); $primary: $blue !default; $secondary: $gray-600 !default; $success: $green !default; $info: $cyan !default; $warning: $yellow !default; $danger: $red !default; $light: $gray-100 !default; $dark: $gray-900 !default; $theme-colors: () !default; $theme-colors: map-merge(( "primary": $primary, "secondary": $secondary, "success": $success, "info": $info, "warning": $warning, "danger": $danger, "light": $light, "dark": $dark ), $theme-colors); 

/* /web/static/lib/bootstrap/scss/_variables.scss */
// Variables // // Variables should follow the `$component-state-property-size` formula for // consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs. // Color system // scss-docs-start gray-color-variables $white: #fff !default; $gray-100: #f8f9fa !default; $gray-200: #e9ecef !default; $gray-300: #dee2e6 !default; $gray-400: #ced4da !default; $gray-500: #adb5bd !default; $gray-600: #6c757d !default; $gray-700: #495057 !default; $gray-800: #343a40 !default; $gray-900: #212529 !default; $black: #000 !default; // scss-docs-end gray-color-variables // fusv-disable // scss-docs-start gray-colors-map $grays: ( "100": $gray-100, "200": $gray-200, "300": $gray-300, "400": $gray-400, "500": $gray-500, "600": $gray-600, "700": $gray-700, "800": $gray-800, "900": $gray-900 ) !default; // scss-docs-end gray-colors-map // fusv-enable // scss-docs-start color-variables $blue: #0d6efd !default; $indigo: #6610f2 !default; $purple: #6f42c1 !default; $pink: #d63384 !default; $red: #dc3545 !default; $orange: #fd7e14 !default; $yellow: #ffc107 !default; $green: #198754 !default; $teal: #20c997 !default; $cyan: #0dcaf0 !default; // scss-docs-end color-variables // scss-docs-start colors-map $colors: ( "blue": $blue, "indigo": $indigo, "purple": $purple, "pink": $pink, "red": $red, "orange": $orange, "yellow": $yellow, "green": $green, "teal": $teal, "cyan": $cyan, "white": $white, "gray": $gray-600, "gray-dark": $gray-800 ) !default; // scss-docs-end colors-map // scss-docs-start theme-color-variables $primary: $blue !default; $secondary: $gray-600 !default; $success: $green !default; $info: $cyan !default; $warning: $yellow !default; $danger: $red !default; $light: $gray-100 !default; $dark: $gray-900 !default; // scss-docs-end theme-color-variables // scss-docs-start theme-colors-map $theme-colors: ( "primary": $primary, "secondary": $secondary, "success": $success, "info": $info, "warning": $warning, "danger": $danger, "light": $light, "dark": $dark ) !default; // scss-docs-end theme-colors-map // scss-docs-start theme-colors-rgb $theme-colors-rgb: map-loop($theme-colors, to-rgb, "$value") !default; // scss-docs-end theme-colors-rgb // The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7. // See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast $min-contrast-ratio: 4.5 !default; // Customize the light and dark text colors for use in our color contrast function. $color-contrast-dark: $black !default; $color-contrast-light: $white !default; // fusv-disable $blue-100: tint-color($blue, 80%) !default; $blue-200: tint-color($blue, 60%) !default; $blue-300: tint-color($blue, 40%) !default; $blue-400: tint-color($blue, 20%) !default; $blue-500: $blue !default; $blue-600: shade-color($blue, 20%) !default; $blue-700: shade-color($blue, 40%) !default; $blue-800: shade-color($blue, 60%) !default; $blue-900: shade-color($blue, 80%) !default; $indigo-100: tint-color($indigo, 80%) !default; $indigo-200: tint-color($indigo, 60%) !default; $indigo-300: tint-color($indigo, 40%) !default; $indigo-400: tint-color($indigo, 20%) !default; $indigo-500: $indigo !default; $indigo-600: shade-color($indigo, 20%) !default; $indigo-700: shade-color($indigo, 40%) !default; $indigo-800: shade-color($indigo, 60%) !default; $indigo-900: shade-color($indigo, 80%) !default; $purple-100: tint-color($purple, 80%) !default; $purple-200: tint-color($purple, 60%) !default; $purple-300: tint-color($purple, 40%) !default; $purple-400: tint-color($purple, 20%) !default; $purple-500: $purple !default; $purple-600: shade-color($purple, 20%) !default; $purple-700: shade-color($purple, 40%) !default; $purple-800: shade-color($purple, 60%) !default; $purple-900: shade-color($purple, 80%) !default; $pink-100: tint-color($pink, 80%) !default; $pink-200: tint-color($pink, 60%) !default; $pink-300: tint-color($pink, 40%) !default; $pink-400: tint-color($pink, 20%) !default; $pink-500: $pink !default; $pink-600: shade-color($pink, 20%) !default; $pink-700: shade-color($pink, 40%) !default; $pink-800: shade-color($pink, 60%) !default; $pink-900: shade-color($pink, 80%) !default; $red-100: tint-color($red, 80%) !default; $red-200: tint-color($red, 60%) !default; $red-300: tint-color($red, 40%) !default; $red-400: tint-color($red, 20%) !default; $red-500: $red !default; $red-600: shade-color($red, 20%) !default; $red-700: shade-color($red, 40%) !default; $red-800: shade-color($red, 60%) !default; $red-900: shade-color($red, 80%) !default; $orange-100: tint-color($orange, 80%) !default; $orange-200: tint-color($orange, 60%) !default; $orange-300: tint-color($orange, 40%) !default; $orange-400: tint-color($orange, 20%) !default; $orange-500: $orange !default; $orange-600: shade-color($orange, 20%) !default; $orange-700: shade-color($orange, 40%) !default; $orange-800: shade-color($orange, 60%) !default; $orange-900: shade-color($orange, 80%) !default; $yellow-100: tint-color($yellow, 80%) !default; $yellow-200: tint-color($yellow, 60%) !default; $yellow-300: tint-color($yellow, 40%) !default; $yellow-400: tint-color($yellow, 20%) !default; $yellow-500: $yellow !default; $yellow-600: shade-color($yellow, 20%) !default; $yellow-700: shade-color($yellow, 40%) !default; $yellow-800: shade-color($yellow, 60%) !default; $yellow-900: shade-color($yellow, 80%) !default; $green-100: tint-color($green, 80%) !default; $green-200: tint-color($green, 60%) !default; $green-300: tint-color($green, 40%) !default; $green-400: tint-color($green, 20%) !default; $green-500: $green !default; $green-600: shade-color($green, 20%) !default; $green-700: shade-color($green, 40%) !default; $green-800: shade-color($green, 60%) !default; $green-900: shade-color($green, 80%) !default; $teal-100: tint-color($teal, 80%) !default; $teal-200: tint-color($teal, 60%) !default; $teal-300: tint-color($teal, 40%) !default; $teal-400: tint-color($teal, 20%) !default; $teal-500: $teal !default; $teal-600: shade-color($teal, 20%) !default; $teal-700: shade-color($teal, 40%) !default; $teal-800: shade-color($teal, 60%) !default; $teal-900: shade-color($teal, 80%) !default; $cyan-100: tint-color($cyan, 80%) !default; $cyan-200: tint-color($cyan, 60%) !default; $cyan-300: tint-color($cyan, 40%) !default; $cyan-400: tint-color($cyan, 20%) !default; $cyan-500: $cyan !default; $cyan-600: shade-color($cyan, 20%) !default; $cyan-700: shade-color($cyan, 40%) !default; $cyan-800: shade-color($cyan, 60%) !default; $cyan-900: shade-color($cyan, 80%) !default; $blues: ( "blue-100": $blue-100, "blue-200": $blue-200, "blue-300": $blue-300, "blue-400": $blue-400, "blue-500": $blue-500, "blue-600": $blue-600, "blue-700": $blue-700, "blue-800": $blue-800, "blue-900": $blue-900 ) !default; $indigos: ( "indigo-100": $indigo-100, "indigo-200": $indigo-200, "indigo-300": $indigo-300, "indigo-400": $indigo-400, "indigo-500": $indigo-500, "indigo-600": $indigo-600, "indigo-700": $indigo-700, "indigo-800": $indigo-800, "indigo-900": $indigo-900 ) !default; $purples: ( "purple-100": $purple-200, "purple-200": $purple-100, "purple-300": $purple-300, "purple-400": $purple-400, "purple-500": $purple-500, "purple-600": $purple-600, "purple-700": $purple-700, "purple-800": $purple-800, "purple-900": $purple-900 ) !default; $pinks: ( "pink-100": $pink-100, "pink-200": $pink-200, "pink-300": $pink-300, "pink-400": $pink-400, "pink-500": $pink-500, "pink-600": $pink-600, "pink-700": $pink-700, "pink-800": $pink-800, "pink-900": $pink-900 ) !default; $reds: ( "red-100": $red-100, "red-200": $red-200, "red-300": $red-300, "red-400": $red-400, "red-500": $red-500, "red-600": $red-600, "red-700": $red-700, "red-800": $red-800, "red-900": $red-900 ) !default; $oranges: ( "orange-100": $orange-100, "orange-200": $orange-200, "orange-300": $orange-300, "orange-400": $orange-400, "orange-500": $orange-500, "orange-600": $orange-600, "orange-700": $orange-700, "orange-800": $orange-800, "orange-900": $orange-900 ) !default; $yellows: ( "yellow-100": $yellow-100, "yellow-200": $yellow-200, "yellow-300": $yellow-300, "yellow-400": $yellow-400, "yellow-500": $yellow-500, "yellow-600": $yellow-600, "yellow-700": $yellow-700, "yellow-800": $yellow-800, "yellow-900": $yellow-900 ) !default; $greens: ( "green-100": $green-100, "green-200": $green-200, "green-300": $green-300, "green-400": $green-400, "green-500": $green-500, "green-600": $green-600, "green-700": $green-700, "green-800": $green-800, "green-900": $green-900 ) !default; $teals: ( "teal-100": $teal-100, "teal-200": $teal-200, "teal-300": $teal-300, "teal-400": $teal-400, "teal-500": $teal-500, "teal-600": $teal-600, "teal-700": $teal-700, "teal-800": $teal-800, "teal-900": $teal-900 ) !default; $cyans: ( "cyan-100": $cyan-100, "cyan-200": $cyan-200, "cyan-300": $cyan-300, "cyan-400": $cyan-400, "cyan-500": $cyan-500, "cyan-600": $cyan-600, "cyan-700": $cyan-700, "cyan-800": $cyan-800, "cyan-900": $cyan-900 ) !default; // fusv-enable // Characters which are escaped by the escape-svg function $escaped-characters: ( ("<", "%3c"), (">", "%3e"), ("#", "%23"), ("(", "%28"), (")", "%29"), ) !default; // Options // // Quickly modify global styling by enabling or disabling optional features. $enable-caret: true !default; $enable-rounded: true !default; $enable-shadows: false !default; $enable-gradients: false !default; $enable-transitions: true !default; $enable-reduced-motion: true !default; $enable-smooth-scroll: true !default; $enable-grid-classes: true !default; $enable-cssgrid: false !default; $enable-button-pointers: true !default; $enable-rfs: true !default; $enable-validation-icons: true !default; $enable-negative-margins: false !default; $enable-deprecation-messages: true !default; $enable-important-utilities: true !default; // Prefix for :root CSS variables $variable-prefix: bs- !default; // Gradient // // The gradient which is added to components if `$enable-gradients` is `true` // This gradient is also added to elements with `.bg-gradient` // scss-docs-start variable-gradient $gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default; // scss-docs-end variable-gradient // Spacing // // Control the default styling of most Bootstrap elements by modifying these // variables. Mostly focused on spacing. // You can add more entries to the $spacers map, should you need more variation. // scss-docs-start spacer-variables-maps $spacer: 1rem !default; $spacers: ( 0: 0, 1: $spacer * .25, 2: $spacer * .5, 3: $spacer, 4: $spacer * 1.5, 5: $spacer * 3, ) !default; $negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default; // scss-docs-end spacer-variables-maps // Position // // Define the edge positioning anchors of the position utilities. // scss-docs-start position-map $position-values: ( 0: 0, 50: 50%, 100: 100% ) !default; // scss-docs-end position-map // Body // // Settings for the `<body>` element. $body-bg: $white !default; $body-color: $gray-900 !default; $body-text-align: null !default; // Utilities maps // // Extends the default `$theme-colors` maps to help create our utilities. // Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign. // scss-docs-start utilities-colors $utilities-colors: $theme-colors-rgb !default; // scss-docs-end utilities-colors // scss-docs-start utilities-text-colors $utilities-text: map-merge( $utilities-colors, ( "black": to-rgb($black), "white": to-rgb($white), "body": to-rgb($body-color) ) ) !default; $utilities-text-colors: map-loop($utilities-text, rgba-css-var, "$key", "text") !default; // scss-docs-end utilities-text-colors // scss-docs-start utilities-bg-colors $utilities-bg: map-merge( $utilities-colors, ( "black": to-rgb($black), "white": to-rgb($white), "body": to-rgb($body-bg) ) ) !default; $utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, "$key", "bg") !default; // scss-docs-end utilities-bg-colors // Links // // Style anchor elements. $link-color: $primary !default; $link-decoration: underline !default; $link-shade-percentage: 20% !default; $link-hover-color: shift-color($link-color, $link-shade-percentage) !default; $link-hover-decoration: null !default; $stretched-link-pseudo-element: after !default; $stretched-link-z-index: 1 !default; // Paragraphs // // Style p element. $paragraph-margin-bottom: 1rem !default; // Grid breakpoints // // Define the minimum dimensions at which your layout will change, // adapting to different screen sizes, for use in media queries. // scss-docs-start grid-breakpoints $grid-breakpoints: ( xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px ) !default; // scss-docs-end grid-breakpoints @include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); @include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints"); // Grid containers // // Define the maximum width of `.container` for different screen sizes. // scss-docs-start container-max-widths $container-max-widths: ( sm: 540px, md: 720px, lg: 960px, xl: 1140px, xxl: 1320px ) !default; // scss-docs-end container-max-widths @include _assert-ascending($container-max-widths, "$container-max-widths"); // Grid columns // // Set the number of columns and specify the width of the gutters. $grid-columns: 12 !default; $grid-gutter-width: 1.5rem !default; $grid-row-columns: 6 !default; $gutters: $spacers !default; // Container padding $container-padding-x: $grid-gutter-width * .5 !default; // Components // // Define common padding and border radius sizes and more. // scss-docs-start border-variables $border-width: 1px !default; $border-widths: ( 1: 1px, 2: 2px, 3: 3px, 4: 4px, 5: 5px ) !default; $border-color: $gray-300 !default; // scss-docs-end border-variables // scss-docs-start border-radius-variables $border-radius: .25rem !default; $border-radius-sm: .2rem !default; $border-radius-lg: .3rem !default; $border-radius-pill: 50rem !default; // scss-docs-end border-radius-variables // scss-docs-start box-shadow-variables $box-shadow: 0 .5rem 1rem rgba($black, .15) !default; $box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default; $box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default; $box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default; // scss-docs-end box-shadow-variables $component-active-color: $white !default; $component-active-bg: $primary !default; // scss-docs-start caret-variables $caret-width: .3em !default; $caret-vertical-align: $caret-width * .85 !default; $caret-spacing: $caret-width * .85 !default; // scss-docs-end caret-variables $transition-base: all .2s ease-in-out !default; $transition-fade: opacity .15s linear !default; // scss-docs-start collapse-transition $transition-collapse: height .35s ease !default; $transition-collapse-width: width .35s ease !default; // scss-docs-end collapse-transition // stylelint-disable function-disallowed-list // scss-docs-start aspect-ratios $aspect-ratios: ( "1x1": 100%, "4x3": calc(3 / 4 * 100%), "16x9": calc(9 / 16 * 100%), "21x9": calc(9 / 21 * 100%) ) !default; // scss-docs-end aspect-ratios // stylelint-enable function-disallowed-list // Typography // // Font, line-height, and color for body text, headings, and more. // scss-docs-start font-variables // stylelint-disable value-keyword-case $font-family-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default; $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default; // stylelint-enable value-keyword-case $font-family-base: var(--#{$variable-prefix}font-sans-serif) !default; $font-family-code: var(--#{$variable-prefix}font-monospace) !default; // $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins // $font-size-base affects the font size of the body text $font-size-root: null !default; $font-size-base: 1rem !default; // Assumes the browser default, typically `16px` $font-size-sm: $font-size-base * .875 !default; $font-size-lg: $font-size-base * 1.25 !default; $font-weight-lighter: lighter !default; $font-weight-light: 300 !default; $font-weight-normal: 400 !default; $font-weight-bold: 700 !default; $font-weight-bolder: bolder !default; $font-weight-base: $font-weight-normal !default; $line-height-base: 1.5 !default; $line-height-sm: 1.25 !default; $line-height-lg: 2 !default; $h1-font-size: $font-size-base * 2.5 !default; $h2-font-size: $font-size-base * 2 !default; $h3-font-size: $font-size-base * 1.75 !default; $h4-font-size: $font-size-base * 1.5 !default; $h5-font-size: $font-size-base * 1.25 !default; $h6-font-size: $font-size-base !default; // scss-docs-end font-variables // scss-docs-start font-sizes $font-sizes: ( 1: $h1-font-size, 2: $h2-font-size, 3: $h3-font-size, 4: $h4-font-size, 5: $h5-font-size, 6: $h6-font-size ) !default; // scss-docs-end font-sizes // scss-docs-start headings-variables $headings-margin-bottom: $spacer * .5 !default; $headings-font-family: null !default; $headings-font-style: null !default; $headings-font-weight: 500 !default; $headings-line-height: 1.2 !default; $headings-color: null !default; // scss-docs-end headings-variables // scss-docs-start display-headings $display-font-sizes: ( 1: 5rem, 2: 4.5rem, 3: 4rem, 4: 3.5rem, 5: 3rem, 6: 2.5rem ) !default; $display-font-weight: 300 !default; $display-line-height: $headings-line-height !default; // scss-docs-end display-headings // scss-docs-start type-variables $lead-font-size: $font-size-base * 1.25 !default; $lead-font-weight: 300 !default; $small-font-size: .875em !default; $sub-sup-font-size: .75em !default; $text-muted: $gray-600 !default; $initialism-font-size: $small-font-size !default; $blockquote-margin-y: $spacer !default; $blockquote-font-size: $font-size-base * 1.25 !default; $blockquote-footer-color: $gray-600 !default; $blockquote-footer-font-size: $small-font-size !default; $hr-margin-y: $spacer !default; $hr-color: inherit !default; $hr-height: $border-width !default; $hr-opacity: .25 !default; $legend-margin-bottom: .5rem !default; $legend-font-size: 1.5rem !default; $legend-font-weight: null !default; $mark-padding: .2em !default; $dt-font-weight: $font-weight-bold !default; $nested-kbd-font-weight: $font-weight-bold !default; $list-inline-padding: .5rem !default; $mark-bg: #fcf8e3 !default; // scss-docs-end type-variables // Tables // // Customizes the `.table` component with basic values, each used across all table variations. // scss-docs-start table-variables $table-cell-padding-y: .5rem !default; $table-cell-padding-x: .5rem !default; $table-cell-padding-y-sm: .25rem !default; $table-cell-padding-x-sm: .25rem !default; $table-cell-vertical-align: top !default; $table-color: $body-color !default; $table-bg: transparent !default; $table-accent-bg: transparent !default; $table-th-font-weight: null !default; $table-striped-color: $table-color !default; $table-striped-bg-factor: .05 !default; $table-striped-bg: rgba($black, $table-striped-bg-factor) !default; $table-active-color: $table-color !default; $table-active-bg-factor: .1 !default; $table-active-bg: rgba($black, $table-active-bg-factor) !default; $table-hover-color: $table-color !default; $table-hover-bg-factor: .075 !default; $table-hover-bg: rgba($black, $table-hover-bg-factor) !default; $table-border-factor: .1 !default; $table-border-width: $border-width !default; $table-border-color: $border-color !default; $table-striped-order: odd !default; $table-group-separator-color: currentColor !default; $table-caption-color: $text-muted !default; $table-bg-scale: -80% !default; // scss-docs-end table-variables // scss-docs-start table-loop $table-variants: ( "primary": shift-color($primary, $table-bg-scale), "secondary": shift-color($secondary, $table-bg-scale), "success": shift-color($success, $table-bg-scale), "info": shift-color($info, $table-bg-scale), "warning": shift-color($warning, $table-bg-scale), "danger": shift-color($danger, $table-bg-scale), "light": $light, "dark": $dark, ) !default; // scss-docs-end table-loop // Buttons + Forms // // Shared variables that are reassigned to `$input-` and `$btn-` specific variables. // scss-docs-start input-btn-variables $input-btn-padding-y: .375rem !default; $input-btn-padding-x: .75rem !default; $input-btn-font-family: null !default; $input-btn-font-size: $font-size-base !default; $input-btn-line-height: $line-height-base !default; $input-btn-focus-width: .25rem !default; $input-btn-focus-color-opacity: .25 !default; $input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default; $input-btn-focus-blur: 0 !default; $input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default; $input-btn-padding-y-sm: .25rem !default; $input-btn-padding-x-sm: .5rem !default; $input-btn-font-size-sm: $font-size-sm !default; $input-btn-padding-y-lg: .5rem !default; $input-btn-padding-x-lg: 1rem !default; $input-btn-font-size-lg: $font-size-lg !default; $input-btn-border-width: $border-width !default; // scss-docs-end input-btn-variables // Buttons // // For each of Bootstrap's buttons, define text, background, and border color. // scss-docs-start btn-variables $btn-padding-y: $input-btn-padding-y !default; $btn-padding-x: $input-btn-padding-x !default; $btn-font-family: $input-btn-font-family !default; $btn-font-size: $input-btn-font-size !default; $btn-line-height: $input-btn-line-height !default; $btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping $btn-padding-y-sm: $input-btn-padding-y-sm !default; $btn-padding-x-sm: $input-btn-padding-x-sm !default; $btn-font-size-sm: $input-btn-font-size-sm !default; $btn-padding-y-lg: $input-btn-padding-y-lg !default; $btn-padding-x-lg: $input-btn-padding-x-lg !default; $btn-font-size-lg: $input-btn-font-size-lg !default; $btn-border-width: $input-btn-border-width !default; $btn-font-weight: $font-weight-normal !default; $btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default; $btn-focus-width: $input-btn-focus-width !default; $btn-focus-box-shadow: $input-btn-focus-box-shadow !default; $btn-disabled-opacity: .65 !default; $btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default; $btn-link-color: $link-color !default; $btn-link-hover-color: $link-hover-color !default; $btn-link-disabled-color: $gray-600 !default; // Allows for customizing button radius independently from global border radius $btn-border-radius: $border-radius !default; $btn-border-radius-sm: $border-radius-sm !default; $btn-border-radius-lg: $border-radius-lg !default; $btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; $btn-hover-bg-shade-amount: 15% !default; $btn-hover-bg-tint-amount: 15% !default; $btn-hover-border-shade-amount: 20% !default; $btn-hover-border-tint-amount: 10% !default; $btn-active-bg-shade-amount: 20% !default; $btn-active-bg-tint-amount: 20% !default; $btn-active-border-shade-amount: 25% !default; $btn-active-border-tint-amount: 10% !default; // scss-docs-end btn-variables // Forms // scss-docs-start form-text-variables $form-text-margin-top: .25rem !default; $form-text-font-size: $small-font-size !default; $form-text-font-style: null !default; $form-text-font-weight: null !default; $form-text-color: $text-muted !default; // scss-docs-end form-text-variables // scss-docs-start form-label-variables $form-label-margin-bottom: .5rem !default; $form-label-font-size: null !default; $form-label-font-style: null !default; $form-label-font-weight: null !default; $form-label-color: null !default; // scss-docs-end form-label-variables // scss-docs-start form-input-variables $input-padding-y: $input-btn-padding-y !default; $input-padding-x: $input-btn-padding-x !default; $input-font-family: $input-btn-font-family !default; $input-font-size: $input-btn-font-size !default; $input-font-weight: $font-weight-base !default; $input-line-height: $input-btn-line-height !default; $input-padding-y-sm: $input-btn-padding-y-sm !default; $input-padding-x-sm: $input-btn-padding-x-sm !default; $input-font-size-sm: $input-btn-font-size-sm !default; $input-padding-y-lg: $input-btn-padding-y-lg !default; $input-padding-x-lg: $input-btn-padding-x-lg !default; $input-font-size-lg: $input-btn-font-size-lg !default; $input-bg: $body-bg !default; $input-disabled-bg: $gray-200 !default; $input-disabled-border-color: null !default; $input-color: $body-color !default; $input-border-color: $gray-400 !default; $input-border-width: $input-btn-border-width !default; $input-box-shadow: $box-shadow-inset !default; $input-border-radius: $border-radius !default; $input-border-radius-sm: $border-radius-sm !default; $input-border-radius-lg: $border-radius-lg !default; $input-focus-bg: $input-bg !default; $input-focus-border-color: tint-color($component-active-bg, 50%) !default; $input-focus-color: $input-color !default; $input-focus-width: $input-btn-focus-width !default; $input-focus-box-shadow: $input-btn-focus-box-shadow !default; $input-placeholder-color: $gray-600 !default; $input-plaintext-color: $body-color !default; $input-height-border: $input-border-width * 2 !default; $input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default; $input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default; $input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y * .5) !default; $input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default; $input-height-sm: add($input-line-height * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default; $input-height-lg: add($input-line-height * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default; $input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; $form-color-width: 3rem !default; // scss-docs-end form-input-variables // scss-docs-start form-check-variables $form-check-input-width: 1em !default; $form-check-min-height: $font-size-base * $line-height-base !default; $form-check-padding-start: $form-check-input-width + .5em !default; $form-check-margin-bottom: .125rem !default; $form-check-label-color: null !default; $form-check-label-cursor: null !default; $form-check-transition: null !default; $form-check-input-active-filter: brightness(90%) !default; $form-check-input-bg: $input-bg !default; $form-check-input-border: 1px solid rgba($black, .25) !default; $form-check-input-border-radius: .25em !default; $form-check-radio-border-radius: 50% !default; $form-check-input-focus-border: $input-focus-border-color !default; $form-check-input-focus-box-shadow: $input-btn-focus-box-shadow !default; $form-check-input-checked-color: $component-active-color !default; $form-check-input-checked-bg-color: $component-active-bg !default; $form-check-input-checked-border-color: $form-check-input-checked-bg-color !default; $form-check-input-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-checked-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/></svg>") !default; $form-check-radio-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='#{$form-check-input-checked-color}'/></svg>") !default; $form-check-input-indeterminate-color: $component-active-color !default; $form-check-input-indeterminate-bg-color: $component-active-bg !default; $form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default; $form-check-input-indeterminate-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-indeterminate-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/></svg>") !default; $form-check-input-disabled-opacity: .5 !default; $form-check-label-disabled-opacity: $form-check-input-disabled-opacity !default; $form-check-btn-check-disabled-opacity: $btn-disabled-opacity !default; $form-check-inline-margin-end: 1rem !default; // scss-docs-end form-check-variables // scss-docs-start form-switch-variables $form-switch-color: rgba($black, .25) !default; $form-switch-width: 2em !default; $form-switch-padding-start: $form-switch-width + .5em !default; $form-switch-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color}'/></svg>") !default; $form-switch-border-radius: $form-switch-width !default; $form-switch-transition: background-position .15s ease-in-out !default; $form-switch-focus-color: $input-focus-border-color !default; $form-switch-focus-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-focus-color}'/></svg>") !default; $form-switch-checked-color: $component-active-color !default; $form-switch-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-checked-color}'/></svg>") !default; $form-switch-checked-bg-position: right center !default; // scss-docs-end form-switch-variables // scss-docs-start input-group-variables $input-group-addon-padding-y: $input-padding-y !default; $input-group-addon-padding-x: $input-padding-x !default; $input-group-addon-font-weight: $input-font-weight !default; $input-group-addon-color: $input-color !default; $input-group-addon-bg: $gray-200 !default; $input-group-addon-border-color: $input-border-color !default; // scss-docs-end input-group-variables // scss-docs-start form-select-variables $form-select-padding-y: $input-padding-y !default; $form-select-padding-x: $input-padding-x !default; $form-select-font-family: $input-font-family !default; $form-select-font-size: $input-font-size !default; $form-select-indicator-padding: $form-select-padding-x * 3 !default; // Extra padding for background-image $form-select-font-weight: $input-font-weight !default; $form-select-line-height: $input-line-height !default; $form-select-color: $input-color !default; $form-select-bg: $input-bg !default; $form-select-disabled-color: null !default; $form-select-disabled-bg: $gray-200 !default; $form-select-disabled-border-color: $input-disabled-border-color !default; $form-select-bg-position: right $form-select-padding-x center !default; $form-select-bg-size: 16px 12px !default; // In pixels because image dimensions $form-select-indicator-color: $gray-800 !default; $form-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$form-select-indicator-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>") !default; $form-select-feedback-icon-padding-end: $form-select-padding-x * 2.5 + $form-select-indicator-padding !default; $form-select-feedback-icon-position: center right $form-select-indicator-padding !default; $form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default; $form-select-border-width: $input-border-width !default; $form-select-border-color: $input-border-color !default; $form-select-border-radius: $input-border-radius !default; $form-select-box-shadow: $box-shadow-inset !default; $form-select-focus-border-color: $input-focus-border-color !default; $form-select-focus-width: $input-focus-width !default; $form-select-focus-box-shadow: 0 0 0 $form-select-focus-width $input-btn-focus-color !default; $form-select-padding-y-sm: $input-padding-y-sm !default; $form-select-padding-x-sm: $input-padding-x-sm !default; $form-select-font-size-sm: $input-font-size-sm !default; $form-select-border-radius-sm: $input-border-radius-sm !default; $form-select-padding-y-lg: $input-padding-y-lg !default; $form-select-padding-x-lg: $input-padding-x-lg !default; $form-select-font-size-lg: $input-font-size-lg !default; $form-select-border-radius-lg: $input-border-radius-lg !default; $form-select-transition: $input-transition !default; // scss-docs-end form-select-variables // scss-docs-start form-range-variables $form-range-track-width: 100% !default; $form-range-track-height: .5rem !default; $form-range-track-cursor: pointer !default; $form-range-track-bg: $gray-300 !default; $form-range-track-border-radius: 1rem !default; $form-range-track-box-shadow: $box-shadow-inset !default; $form-range-thumb-width: 1rem !default; $form-range-thumb-height: $form-range-thumb-width !default; $form-range-thumb-bg: $component-active-bg !default; $form-range-thumb-border: 0 !default; $form-range-thumb-border-radius: 1rem !default; $form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default; $form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default; $form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge $form-range-thumb-active-bg: tint-color($component-active-bg, 70%) !default; $form-range-thumb-disabled-bg: $gray-500 !default; $form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; // scss-docs-end form-range-variables // scss-docs-start form-file-variables $form-file-button-color: $input-color !default; $form-file-button-bg: $input-group-addon-bg !default; $form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default; // scss-docs-end form-file-variables // scss-docs-start form-floating-variables $form-floating-height: add(3.5rem, $input-height-border) !default; $form-floating-line-height: 1.25 !default; $form-floating-padding-x: $input-padding-x !default; $form-floating-padding-y: 1rem !default; $form-floating-input-padding-t: 1.625rem !default; $form-floating-input-padding-b: .625rem !default; $form-floating-label-opacity: .65 !default; $form-floating-label-transform: scale(.85) translateY(-.5rem) translateX(.15rem) !default; $form-floating-transition: opacity .1s ease-in-out, transform .1s ease-in-out !default; // scss-docs-end form-floating-variables // Form validation // scss-docs-start form-feedback-variables $form-feedback-margin-top: $form-text-margin-top !default; $form-feedback-font-size: $form-text-font-size !default; $form-feedback-font-style: $form-text-font-style !default; $form-feedback-valid-color: $success !default; $form-feedback-invalid-color: $danger !default; $form-feedback-icon-valid-color: $form-feedback-valid-color !default; $form-feedback-icon-valid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><path fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/></svg>") !default; $form-feedback-icon-invalid-color: $form-feedback-invalid-color !default; $form-feedback-icon-invalid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='#{$form-feedback-icon-invalid-color}'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='#{$form-feedback-icon-invalid-color}' stroke='none'/></svg>") !default; // scss-docs-end form-feedback-variables // scss-docs-start form-validation-states $form-validation-states: ( "valid": ( "color": $form-feedback-valid-color, "icon": $form-feedback-icon-valid ), "invalid": ( "color": $form-feedback-invalid-color, "icon": $form-feedback-icon-invalid ) ) !default; // scss-docs-end form-validation-states // Z-index master list // // Warning: Avoid customizing these values. They're used for a bird's eye view // of components dependent on the z-axis and are designed to all work together. // scss-docs-start zindex-stack $zindex-dropdown: 1000 !default; $zindex-sticky: 1020 !default; $zindex-fixed: 1030 !default; $zindex-offcanvas-backdrop: 1040 !default; $zindex-offcanvas: 1045 !default; $zindex-modal-backdrop: 1050 !default; $zindex-modal: 1055 !default; $zindex-popover: 1070 !default; $zindex-tooltip: 1080 !default; // scss-docs-end zindex-stack // Navs // scss-docs-start nav-variables $nav-link-padding-y: .5rem !default; $nav-link-padding-x: 1rem !default; $nav-link-font-size: null !default; $nav-link-font-weight: null !default; $nav-link-color: $link-color !default; $nav-link-hover-color: $link-hover-color !default; $nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default; $nav-link-disabled-color: $gray-600 !default; $nav-tabs-border-color: $gray-300 !default; $nav-tabs-border-width: $border-width !default; $nav-tabs-border-radius: $border-radius !default; $nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default; $nav-tabs-link-active-color: $gray-700 !default; $nav-tabs-link-active-bg: $body-bg !default; $nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default; $nav-pills-border-radius: $border-radius !default; $nav-pills-link-active-color: $component-active-color !default; $nav-pills-link-active-bg: $component-active-bg !default; // scss-docs-end nav-variables // Navbar // scss-docs-start navbar-variables $navbar-padding-y: $spacer * .5 !default; $navbar-padding-x: null !default; $navbar-nav-link-padding-x: .5rem !default; $navbar-brand-font-size: $font-size-lg !default; // Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link $nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default; $navbar-brand-height: $navbar-brand-font-size * $line-height-base !default; $navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default; $navbar-brand-margin-end: 1rem !default; $navbar-toggler-padding-y: .25rem !default; $navbar-toggler-padding-x: .75rem !default; $navbar-toggler-font-size: $font-size-lg !default; $navbar-toggler-border-radius: $btn-border-radius !default; $navbar-toggler-focus-width: $btn-focus-width !default; $navbar-toggler-transition: box-shadow .15s ease-in-out !default; // scss-docs-end navbar-variables // scss-docs-start navbar-theme-variables $navbar-dark-color: rgba($white, .55) !default; $navbar-dark-hover-color: rgba($white, .75) !default; $navbar-dark-active-color: $white !default; $navbar-dark-disabled-color: rgba($white, .25) !default; $navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default; $navbar-dark-toggler-border-color: rgba($white, .1) !default; $navbar-light-color: rgba($black, .55) !default; $navbar-light-hover-color: rgba($black, .7) !default; $navbar-light-active-color: rgba($black, .9) !default; $navbar-light-disabled-color: rgba($black, .3) !default; $navbar-light-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default; $navbar-light-toggler-border-color: rgba($black, .1) !default; $navbar-light-brand-color: $navbar-light-active-color !default; $navbar-light-brand-hover-color: $navbar-light-active-color !default; $navbar-dark-brand-color: $navbar-dark-active-color !default; $navbar-dark-brand-hover-color: $navbar-dark-active-color !default; // scss-docs-end navbar-theme-variables // Dropdowns // // Dropdown menu container and contents. // scss-docs-start dropdown-variables $dropdown-min-width: 10rem !default; $dropdown-padding-x: 0 !default; $dropdown-padding-y: .5rem !default; $dropdown-spacer: .125rem !default; $dropdown-font-size: $font-size-base !default; $dropdown-color: $body-color !default; $dropdown-bg: $white !default; $dropdown-border-color: rgba($black, .15) !default; $dropdown-border-radius: $border-radius !default; $dropdown-border-width: $border-width !default; $dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default; $dropdown-divider-bg: $dropdown-border-color !default; $dropdown-divider-margin-y: $spacer * .5 !default; $dropdown-box-shadow: $box-shadow !default; $dropdown-link-color: $gray-900 !default; $dropdown-link-hover-color: shade-color($dropdown-link-color, 10%) !default; $dropdown-link-hover-bg: $gray-200 !default; $dropdown-link-active-color: $component-active-color !default; $dropdown-link-active-bg: $component-active-bg !default; $dropdown-link-disabled-color: $gray-500 !default; $dropdown-item-padding-y: $spacer * .25 !default; $dropdown-item-padding-x: $spacer !default; $dropdown-header-color: $gray-600 !default; $dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default; // scss-docs-end dropdown-variables // scss-docs-start dropdown-dark-variables $dropdown-dark-color: $gray-300 !default; $dropdown-dark-bg: $gray-800 !default; $dropdown-dark-border-color: $dropdown-border-color !default; $dropdown-dark-divider-bg: $dropdown-divider-bg !default; $dropdown-dark-box-shadow: null !default; $dropdown-dark-link-color: $dropdown-dark-color !default; $dropdown-dark-link-hover-color: $white !default; $dropdown-dark-link-hover-bg: rgba($white, .15) !default; $dropdown-dark-link-active-color: $dropdown-link-active-color !default; $dropdown-dark-link-active-bg: $dropdown-link-active-bg !default; $dropdown-dark-link-disabled-color: $gray-500 !default; $dropdown-dark-header-color: $gray-500 !default; // scss-docs-end dropdown-dark-variables // Pagination // scss-docs-start pagination-variables $pagination-padding-y: .375rem !default; $pagination-padding-x: .75rem !default; $pagination-padding-y-sm: .25rem !default; $pagination-padding-x-sm: .5rem !default; $pagination-padding-y-lg: .75rem !default; $pagination-padding-x-lg: 1.5rem !default; $pagination-color: $link-color !default; $pagination-bg: $white !default; $pagination-border-width: $border-width !default; $pagination-border-radius: $border-radius !default; $pagination-margin-start: -$pagination-border-width !default; $pagination-border-color: $gray-300 !default; $pagination-focus-color: $link-hover-color !default; $pagination-focus-bg: $gray-200 !default; $pagination-focus-box-shadow: $input-btn-focus-box-shadow !default; $pagination-focus-outline: 0 !default; $pagination-hover-color: $link-hover-color !default; $pagination-hover-bg: $gray-200 !default; $pagination-hover-border-color: $gray-300 !default; $pagination-active-color: $component-active-color !default; $pagination-active-bg: $component-active-bg !default; $pagination-active-border-color: $pagination-active-bg !default; $pagination-disabled-color: $gray-600 !default; $pagination-disabled-bg: $white !default; $pagination-disabled-border-color: $gray-300 !default; $pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; $pagination-border-radius-sm: $border-radius-sm !default; $pagination-border-radius-lg: $border-radius-lg !default; // scss-docs-end pagination-variables // Placeholders // scss-docs-start placeholders $placeholder-opacity-max: .5 !default; $placeholder-opacity-min: .2 !default; // scss-docs-end placeholders // Cards // scss-docs-start card-variables $card-spacer-y: $spacer !default; $card-spacer-x: $spacer !default; $card-title-spacer-y: $spacer * .5 !default; $card-border-width: $border-width !default; $card-border-color: rgba($black, .125) !default; $card-border-radius: $border-radius !default; $card-box-shadow: null !default; $card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default; $card-cap-padding-y: $card-spacer-y * .5 !default; $card-cap-padding-x: $card-spacer-x !default; $card-cap-bg: rgba($black, .03) !default; $card-cap-color: null !default; $card-height: null !default; $card-color: null !default; $card-bg: $white !default; $card-img-overlay-padding: $spacer !default; $card-group-margin: $grid-gutter-width * .5 !default; // scss-docs-end card-variables // Accordion // scss-docs-start accordion-variables $accordion-padding-y: 1rem !default; $accordion-padding-x: 1.25rem !default; $accordion-color: $body-color !default; $accordion-bg: $body-bg !default; $accordion-border-width: $border-width !default; $accordion-border-color: rgba($black, .125) !default; $accordion-border-radius: $border-radius !default; $accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default; $accordion-body-padding-y: $accordion-padding-y !default; $accordion-body-padding-x: $accordion-padding-x !default; $accordion-button-padding-y: $accordion-padding-y !default; $accordion-button-padding-x: $accordion-padding-x !default; $accordion-button-color: $accordion-color !default; $accordion-button-bg: $accordion-bg !default; $accordion-transition: $btn-transition, border-radius .15s ease !default; $accordion-button-active-bg: tint-color($component-active-bg, 90%) !default; $accordion-button-active-color: shade-color($primary, 10%) !default; $accordion-button-focus-border-color: $input-focus-border-color !default; $accordion-button-focus-box-shadow: $btn-focus-box-shadow !default; $accordion-icon-width: 1.25rem !default; $accordion-icon-color: $accordion-button-color !default; $accordion-icon-active-color: $accordion-button-active-color !default; $accordion-icon-transition: transform .2s ease-in-out !default; $accordion-icon-transform: rotate(-180deg) !default; $accordion-button-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !default; $accordion-button-active-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-active-color}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !default; // scss-docs-end accordion-variables // Tooltips // scss-docs-start tooltip-variables $tooltip-font-size: $font-size-sm !default; $tooltip-max-width: 200px !default; $tooltip-color: $white !default; $tooltip-bg: $black !default; $tooltip-border-radius: $border-radius !default; $tooltip-opacity: .9 !default; $tooltip-padding-y: $spacer * .25 !default; $tooltip-padding-x: $spacer * .5 !default; $tooltip-margin: 0 !default; $tooltip-arrow-width: .8rem !default; $tooltip-arrow-height: .4rem !default; $tooltip-arrow-color: $tooltip-bg !default; // scss-docs-end tooltip-variables // Form tooltips must come after regular tooltips // scss-docs-start tooltip-feedback-variables $form-feedback-tooltip-padding-y: $tooltip-padding-y !default; $form-feedback-tooltip-padding-x: $tooltip-padding-x !default; $form-feedback-tooltip-font-size: $tooltip-font-size !default; $form-feedback-tooltip-line-height: null !default; $form-feedback-tooltip-opacity: $tooltip-opacity !default; $form-feedback-tooltip-border-radius: $tooltip-border-radius !default; // scss-docs-end tooltip-feedback-variables // Popovers // scss-docs-start popover-variables $popover-font-size: $font-size-sm !default; $popover-bg: $white !default; $popover-max-width: 276px !default; $popover-border-width: $border-width !default; $popover-border-color: rgba($black, .2) !default; $popover-border-radius: $border-radius-lg !default; $popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default; $popover-box-shadow: $box-shadow !default; $popover-header-bg: shade-color($popover-bg, 6%) !default; $popover-header-color: $headings-color !default; $popover-header-padding-y: .5rem !default; $popover-header-padding-x: $spacer !default; $popover-body-color: $body-color !default; $popover-body-padding-y: $spacer !default; $popover-body-padding-x: $spacer !default; $popover-arrow-width: 1rem !default; $popover-arrow-height: .5rem !default; $popover-arrow-color: $popover-bg !default; $popover-arrow-outer-color: fade-in($popover-border-color, .05) !default; // scss-docs-end popover-variables // Toasts // scss-docs-start toast-variables $toast-max-width: 350px !default; $toast-padding-x: .75rem !default; $toast-padding-y: .5rem !default; $toast-font-size: .875rem !default; $toast-color: null !default; $toast-background-color: rgba($white, .85) !default; $toast-border-width: 1px !default; $toast-border-color: rgba($black, .1) !default; $toast-border-radius: $border-radius !default; $toast-box-shadow: $box-shadow !default; $toast-spacing: $container-padding-x !default; $toast-header-color: $gray-600 !default; $toast-header-background-color: rgba($white, .85) !default; $toast-header-border-color: rgba($black, .05) !default; // scss-docs-end toast-variables // Badges // scss-docs-start badge-variables $badge-font-size: .75em !default; $badge-font-weight: $font-weight-bold !default; $badge-color: $white !default; $badge-padding-y: .35em !default; $badge-padding-x: .65em !default; $badge-border-radius: $border-radius !default; // scss-docs-end badge-variables // Modals // scss-docs-start modal-variables $modal-inner-padding: $spacer !default; $modal-footer-margin-between: .5rem !default; $modal-dialog-margin: .5rem !default; $modal-dialog-margin-y-sm-up: 1.75rem !default; $modal-title-line-height: $line-height-base !default; $modal-content-color: null !default; $modal-content-bg: $white !default; $modal-content-border-color: rgba($black, .2) !default; $modal-content-border-width: $border-width !default; $modal-content-border-radius: $border-radius-lg !default; $modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default; $modal-content-box-shadow-xs: $box-shadow-sm !default; $modal-content-box-shadow-sm-up: $box-shadow !default; $modal-backdrop-bg: $black !default; $modal-backdrop-opacity: .5 !default; $modal-header-border-color: $border-color !default; $modal-footer-border-color: $modal-header-border-color !default; $modal-header-border-width: $modal-content-border-width !default; $modal-footer-border-width: $modal-header-border-width !default; $modal-header-padding-y: $modal-inner-padding !default; $modal-header-padding-x: $modal-inner-padding !default; $modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility $modal-sm: 300px !default; $modal-md: 500px !default; $modal-lg: 800px !default; $modal-xl: 1140px !default; $modal-fade-transform: translate(0, -50px) !default; $modal-show-transform: none !default; $modal-transition: transform .3s ease-out !default; $modal-scale-transform: scale(1.02) !default; // scss-docs-end modal-variables // Alerts // // Define alert colors, border radius, and padding. // scss-docs-start alert-variables $alert-padding-y: $spacer !default; $alert-padding-x: $spacer !default; $alert-margin-bottom: 1rem !default; $alert-border-radius: $border-radius !default; $alert-link-font-weight: $font-weight-bold !default; $alert-border-width: $border-width !default; $alert-bg-scale: -80% !default; $alert-border-scale: -70% !default; $alert-color-scale: 40% !default; $alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side // scss-docs-end alert-variables // Progress bars // scss-docs-start progress-variables $progress-height: 1rem !default; $progress-font-size: $font-size-base * .75 !default; $progress-bg: $gray-200 !default; $progress-border-radius: $border-radius !default; $progress-box-shadow: $box-shadow-inset !default; $progress-bar-color: $white !default; $progress-bar-bg: $primary !default; $progress-bar-animation-timing: 1s linear infinite !default; $progress-bar-transition: width .6s ease !default; // scss-docs-end progress-variables // List group // scss-docs-start list-group-variables $list-group-color: $gray-900 !default; $list-group-bg: $white !default; $list-group-border-color: rgba($black, .125) !default; $list-group-border-width: $border-width !default; $list-group-border-radius: $border-radius !default; $list-group-item-padding-y: $spacer * .5 !default; $list-group-item-padding-x: $spacer !default; $list-group-item-bg-scale: -80% !default; $list-group-item-color-scale: 40% !default; $list-group-hover-bg: $gray-100 !default; $list-group-active-color: $component-active-color !default; $list-group-active-bg: $component-active-bg !default; $list-group-active-border-color: $list-group-active-bg !default; $list-group-disabled-color: $gray-600 !default; $list-group-disabled-bg: $list-group-bg !default; $list-group-action-color: $gray-700 !default; $list-group-action-hover-color: $list-group-action-color !default; $list-group-action-active-color: $body-color !default; $list-group-action-active-bg: $gray-200 !default; // scss-docs-end list-group-variables // Image thumbnails // scss-docs-start thumbnail-variables $thumbnail-padding: .25rem !default; $thumbnail-bg: $body-bg !default; $thumbnail-border-width: $border-width !default; $thumbnail-border-color: $gray-300 !default; $thumbnail-border-radius: $border-radius !default; $thumbnail-box-shadow: $box-shadow-sm !default; // scss-docs-end thumbnail-variables // Figures // scss-docs-start figure-variables $figure-caption-font-size: $small-font-size !default; $figure-caption-color: $gray-600 !default; // scss-docs-end figure-variables // Breadcrumbs // scss-docs-start breadcrumb-variables $breadcrumb-font-size: null !default; $breadcrumb-padding-y: 0 !default; $breadcrumb-padding-x: 0 !default; $breadcrumb-item-padding-x: .5rem !default; $breadcrumb-margin-bottom: 1rem !default; $breadcrumb-bg: null !default; $breadcrumb-divider-color: $gray-600 !default; $breadcrumb-active-color: $gray-600 !default; $breadcrumb-divider: quote("/") !default; $breadcrumb-divider-flipped: $breadcrumb-divider !default; $breadcrumb-border-radius: null !default; // scss-docs-end breadcrumb-variables // Carousel // scss-docs-start carousel-variables $carousel-control-color: $white !default; $carousel-control-width: 15% !default; $carousel-control-opacity: .5 !default; $carousel-control-hover-opacity: .9 !default; $carousel-control-transition: opacity .15s ease !default; $carousel-indicator-width: 30px !default; $carousel-indicator-height: 3px !default; $carousel-indicator-hit-area-height: 10px !default; $carousel-indicator-spacer: 3px !default; $carousel-indicator-opacity: .5 !default; $carousel-indicator-active-bg: $white !default; $carousel-indicator-active-opacity: 1 !default; $carousel-indicator-transition: opacity .6s ease !default; $carousel-caption-width: 70% !default; $carousel-caption-color: $white !default; $carousel-caption-padding-y: 1.25rem !default; $carousel-caption-spacer: 1.25rem !default; $carousel-control-icon-width: 2rem !default; $carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/></svg>") !default; $carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/></svg>") !default; $carousel-transition-duration: .6s !default; $carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`) $carousel-dark-indicator-active-bg: $black !default; $carousel-dark-caption-color: $black !default; $carousel-dark-control-icon-filter: invert(1) grayscale(100) !default; // scss-docs-end carousel-variables // Spinners // scss-docs-start spinner-variables $spinner-width: 2rem !default; $spinner-height: $spinner-width !default; $spinner-vertical-align: -.125em !default; $spinner-border-width: .25em !default; $spinner-animation-speed: .75s !default; $spinner-width-sm: 1rem !default; $spinner-height-sm: $spinner-width-sm !default; $spinner-border-width-sm: .2em !default; // scss-docs-end spinner-variables // Close // scss-docs-start close-variables $btn-close-width: 1em !default; $btn-close-height: $btn-close-width !default; $btn-close-padding-x: .25em !default; $btn-close-padding-y: $btn-close-padding-x !default; $btn-close-color: $black !default; $btn-close-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$btn-close-color}'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>") !default; $btn-close-focus-shadow: $input-btn-focus-box-shadow !default; $btn-close-opacity: .5 !default; $btn-close-hover-opacity: .75 !default; $btn-close-focus-opacity: 1 !default; $btn-close-disabled-opacity: .25 !default; $btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default; // scss-docs-end close-variables // Offcanvas // scss-docs-start offcanvas-variables $offcanvas-padding-y: $modal-inner-padding !default; $offcanvas-padding-x: $modal-inner-padding !default; $offcanvas-horizontal-width: 400px !default; $offcanvas-vertical-height: 30vh !default; $offcanvas-transition-duration: .3s !default; $offcanvas-border-color: $modal-content-border-color !default; $offcanvas-border-width: $modal-content-border-width !default; $offcanvas-title-line-height: $modal-title-line-height !default; $offcanvas-bg-color: $modal-content-bg !default; $offcanvas-color: $modal-content-color !default; $offcanvas-box-shadow: $modal-content-box-shadow-xs !default; $offcanvas-backdrop-bg: $modal-backdrop-bg !default; $offcanvas-backdrop-opacity: $modal-backdrop-opacity !default; // scss-docs-end offcanvas-variables // Code $code-font-size: $small-font-size !default; $code-color: $pink !default; $kbd-padding-y: .2rem !default; $kbd-padding-x: .4rem !default; $kbd-font-size: $code-font-size !default; $kbd-color: $white !default; $kbd-bg: $gray-900 !default; $pre-color: null !default; 

/* /web/static/src/scss/import_bootstrap.scss */
 // This file is importing bootstrap. While a simple "import "bootstrap";" // should be enough, this does not allow overridding mixins/functions. // Overridding those is necessary for some of our need and allow to generate // more efficient CSS than adding more rules. This file instead copies the // content of the "bootstrap.scss" files but do not import functions, variables // and mixins which will be handled "by hand" in _assets_helpers. // scss-docs-start import-stack // Configuration //  //  //   // Layout & components         // Small hack in bootstrap (see bootstrap_review.scss): prevent it to generate // primary, secondary, and other color/outline classes by itself to be able to // do it ourself properly. $-tmp: $theme-colors; $theme-colors: ();  $theme-colors: $-tmp;                       // Helpers  // Utilities // Moved into bundle after bs_utilities_custom.scss file to allow to extend // the utilities //  // scss-docs-end import-stack 

/* /web/static/src/scss/helpers_backport.scss */
// Backport from BS 5.2 // TODO remove me when migrate to new Bootstrap 5.2 + $prefix: '' !default; $theme-colors: () !default; // All-caps `RGBA()` function used because of this Sass bug: https://github.com/sass/node-sass/issues/2251 @each $color, $value in $theme-colors{$color-rgb: to-rgb($value); .text-bg-#{$color}{color: color-contrast($value) !important; background-color: RGBA($color-rgb, var(--#{$prefix}bg-opacity, 1)) !important;}}

/* /web/static/src/scss/utilities_custom.scss */
// Extend utilities $rounded-sizes: () !default; $rounded-sizes: map-merge( $rounded-sizes, ( null: $border-radius, 0: 0, 1: $border-radius-sm, 2: $border-radius, 3: $border-radius-lg, circle: 50%, pill: $border-radius-pill, ) ); $utilities-opacity: () !default; $utilities-opacity: map-merge($utilities-opacity, $o-opacities); $utilities-sizes: () !default; $utilities-sizes: map-merge( $utilities-sizes, ( 0: 0, 25: 25%, 50: 50%, 75: 75%, 100: 100%, auto: auto, ) ); $order-array: ( first: -1, last: $grid-columns + 1, ) !default; @for $i from 0 through $grid-columns{$order-array: map-merge( $order-array, (#{$i}: $i) );}$utilities: () !default; $utilities: map-merge( $utilities, ( "display": map-merge( map-get($utilities, "display"), ( values: join(map-get(map-get($utilities, "display"), "values"), contents), ), ), "white-space": map-merge( map-get($utilities, "white-space"), ( values: map-merge( map-get(map-get($utilities, "white-space"), "values"), ("prewrap": pre-wrap), ), ), ), "position": map-merge( map-get($utilities, "position"), ( responsive: true, ), ), "opacity": map-merge( map-get($utilities, "opacity"), ( values: $utilities-opacity, ), ), "border-color": map-merge( map-get($utilities, "border-color"), ( values: map-merge( map-get(map-get($utilities, "border-color"), "values"), ("transparent": transparent), ), ), ), "rounded-top": ( property: border-top-left-radius border-top-right-radius, class: rounded-top, values: $rounded-sizes, ), "rounded-end": ( property: border-top-right-radius border-bottom-right-radius, class: rounded-end, values: $rounded-sizes, ), "rounded-bottom": ( property: border-bottom-right-radius border-bottom-left-radius, class: rounded-bottom, values: $rounded-sizes, ), "rounded-start": ( property: border-bottom-left-radius border-top-left-radius, class: rounded-start, values: $rounded-sizes, ), "width": map-merge( map-get($utilities, "width"), ( responsive: true, values: $utilities-sizes, ), ), "height": map-merge( map-get($utilities, "height"), ( responsive: true, values: $utilities-sizes, ), ), "max-width": map-merge( map-get($utilities, "max-width"), ( responsive: true, values: $utilities-sizes, ), ), "max-height": map-merge( map-get($utilities, "max-height"), ( responsive: true, values: $utilities-sizes, ), ), "font-family": map-merge( map-get($utilities, "font-family"), ( values: map-merge( map-get(map-get($utilities, "font-family"), "values"), (sans-serif: var(--#{$variable-prefix}font-sans-serif)), ), ), ), "order": map-merge( map-get($utilities, "order"), ( values: $order-array, ), ), ), ); // Odoo Custom Utility Classes $utilities: map-merge( $utilities, ( "cursor": ( property: cursor, values: default pointer, ), "bg-opacity": ( css-var: true, class: bg-opacity, values: $utilities-opacity, ), "flex-basis": ( responsive: true, property: flex-basis, values: $utilities-sizes, ), "z-index": ( property: z-index, values: 0 1, ), "overflow-x": ( property: overflow-x, values: auto hidden visible scroll, ), "overflow-y": ( property: overflow-y, values: auto hidden visible scroll, ), "transition": ( property: transition, values: ( none: none, base: $transition-base, fade: $transition-fade, ), ), "min-width": ( class: min-w, property: min-width, values: 0, ), ) ); // Define opacity:hover classes while defining the triggerer behavior. // Use'.opacity-trigger-hover' class to allow hovered parents to // trigger their children ':hover' opacity state. @each $-opacity-key, $-opacity-level in $utilities-opacity{.opacity-#{$-opacity-key}-hover{&:hover, .opacity-trigger-hover:hover &{opacity: $-opacity-level!important;}}}// Hide empty elements .d-empty-none:empty{display: none !important;}// Define a smaller font-size .smaller{font-size: $o-font-size-base-smaller;}

/* /web/static/lib/bootstrap/scss/utilities/_api.scss */
// Loop over each breakpoint @each $breakpoint in map-keys($grid-breakpoints){// Generate media query if needed @include media-breakpoint-up($breakpoint){$infix: breakpoint-infix($breakpoint, $grid-breakpoints); // Loop over each utility property @each $key, $utility in $utilities{// The utility can be disabled with `false`, thus check if the utility is a map first // Only proceed if responsive media queries are enabled or if it's the base media query @if type-of($utility) == "map" and (map-get($utility, responsive) or $infix == ""){@include generate-utility($utility, $infix);}}}}// RFS rescaling @media (min-width: $rfs-mq-value){@each $breakpoint in map-keys($grid-breakpoints){$infix: breakpoint-infix($breakpoint, $grid-breakpoints); @if (map-get($grid-breakpoints, $breakpoint) < $rfs-breakpoint){// Loop over each utility property @each $key, $utility in $utilities{// The utility can be disabled with `false`, thus check if the utility is a map first // Only proceed if responsive media queries are enabled or if it's the base media query @if type-of($utility) == "map" and map-get($utility, rfs) and (map-get($utility, responsive) or $infix == ""){@include generate-utility($utility, $infix, true);}}}}}// Print utilities @media print{@each $key, $utility in $utilities{// The utility can be disabled with `false`, thus check if the utility is a map first // Then check if the utility needs print styles @if type-of($utility) == "map" and map-get($utility, print) == true{@include generate-utility($utility, "-print");}}}

/* /web/static/src/scss/bootstrap_review.scss */
/// /// This file regroups the CSS rules made to fix/extend bootstrap in all places /// where it is used in Odoo (backend / frontend / reports / ...) /// .alert{// Alerts are block elements with relative positioning. // They would go over floating elements, which is never what we want. clear: both;}%-card-body-reviewed{// BS4 colored cards do not have a very popular design. This will reset them // to a BS3-like one: only the header and footer are colored and the body // will use the color of a default card background with a light opacity. // Limitation: bg-* utilities cannot be used on card-body elements anymore. // Note: these rules need grays utilities to be defined before so that the // related o-bg-color text-muted rules work. Since backend and fronted // generate these classes differently, this pseudo-class is called in the // respective 'bootstrap_review_x' file immediately after gray classes // generation. @include o-bg-color(rgba($card-bg, $o-card-body-bg-opacity)); &:first-child{@include border-top-radius($card-inner-border-radius);}&:last-child{@include border-bottom-radius($card-inner-border-radius);}&.row{// The 'row' class should not be used on a 'card-body' element but if // it is done, our custom bg color would overflow the card. As a fix // for those cases (normally only one at the time this fix is made), // remove the background color. // TODO remove me in master. background-color: transparent !important;}}.accordion{.collapsing, .collapse.show{> .card-body:first-child{// Above background color would overflow on the card-header border // without this margin-top: $card-border-width;}}}.toast-header{background-clip: border-box;}.toast-body{// Same as card-body, see explanation above @include o-bg-color(opacify($toast-background-color, 0.08));}// Modify modals so that their scrollable element is the modal-body (except in // mobile). // TODO: should be replaced by .modal-dialog-scrollable class @include media-breakpoint-up(sm){:not(.s_popup) > .modal{.modal-dialog{height: 100%; padding: $modal-dialog-margin-y-sm-up 0; margin: 0 auto;}.modal-content{max-height: 100%;}.modal-header, .modal-footer{flex: 0 0 auto;}.modal-body{overflow: auto; min-height: 0;}}}// Do not display the backdrop element added by bootstrap in the body and add a // background on the modal to keep the same effect. The bootstrap backdrop was // probably useful for compatibility with <IE9 but is no longer needed. This // also avoids z-index issues because modals could be opened in an element // (e.g. the website #wrapwrap) whose stacking context is different of the body // one (where the backdrop is opened). This would make the backdrop appears on // top of the modal. .modal-backdrop{display: none;}.modal:not([data-bs-backdrop="false"]){background-color: rgba($modal-backdrop-bg, $modal-backdrop-opacity);}// Force field label pointer to cursor .form-check{@include o-field-pointer();}// Update the border color when hovering form-select elements .form-select:where(:not(:disabled)):hover{border-color: $form-check-input-checked-border-color;}// Disable RTL for the dropdown position .dropdown-menu{&[x-placement^="top"], &[x-placement^="right"], &[x-placement^="bottom"], &[x-placement^="left"]{right: auto;}}// Disable RTL for the popover position .popover{right: auto#{""};}// Review $link-decoration behavior @if $link-decoration and $link-decoration != none{.btn:not(.btn-link), .nav-link, .dropdown-item, .page-link, .breadcrumb-item > a, .badge, .fa{&, &:hover, &:focus{text-decoration: none;}}}

/* /web/static/src/scss/bootstrap_review_frontend.scss */
/// /// This file regroups the CSS rules made to fix/extend bootstrap in frontend /// ============================================================================== // Extend bootstrap to create background and text utilities for gray colors too // Note: the card-body rule below needs those grays utilities to be defined // before so that the related o-bg-color text-muted rules work. @each $color, $value in $grays{@include bg-variant(".bg-#{$color}", $value); @include text-emphasis-variant(".text-#{$color}", $value);}// Restore text-X from BS4 that use text-emphasis-variant @each $color, $value in $theme-colors{@include text-emphasis-variant(".text-#{$color}", $value);}// Cards .card-body{@extend %-card-body-reviewed; // See bootstrap_review.scss}// Generating bootstrap color buttons was disabled (see import_bootstrap.scss). // We do it ourself here with a tweak: we introduce btn-fill-* (working as the // normal btn-* classes (in opposition to btn-outline-* classes). We then map // the btn-* classes to either btn-fill-* or btn-outline-* classes depending on // the configuration. We also allow to define a border-color different than the // background color. $o-btn-bg-colors: () !default; $o-btn-border-colors: () !default; @each $color, $value in $theme-colors{$-bg-color: map-get($o-btn-bg-colors, $color) or $value; $-border-color: map-get($o-btn-border-colors, $color) or $-bg-color; .btn-fill-#{$color}{@include button-variant($-bg-color, $-border-color);}}@each $color, $value in $theme-colors{$-bg-color: map-get($o-btn-bg-colors, $color) or $value; $-border-color: map-get($o-btn-border-colors, $color) or $-bg-color; .btn-outline-#{$color}{@include button-outline-variant($-border-color);}}$o-btn-flat-defaults: () !default; $o-btn-outline-defaults: () !default; $o-btn-outline-border-width-defaults: () !default; @each $color, $value in $theme-colors{.btn-#{$color}{@if index($o-btn-outline-defaults, $color){@extend .btn-outline-#{$color}; border-width: map-get($o-btn-outline-border-width-defaults, $color);}@else{@extend .btn-fill-#{$color}; @if index($o-btn-flat-defaults, $color){// TODO In master: move definition to web_editor @extend .btn.flat !optional;}}}}// Highlight '.btn-group's active buttons .btn-group .btn-light.active{box-shadow: inset 0 0 0 $border-width $component-active-bg; border-color: transparent; background-color: mix($component-active-bg, $light, 10%);}// Compensate navbar brand padding if no visible border @if alpha($navbar-dark-toggler-border-color) < 0.001{.navbar-dark .navbar-toggler{padding-left: 0; padding-right: 0;}}@if alpha($navbar-light-toggler-border-color) < 0.001{.navbar-light .navbar-toggler{padding-left: 0; padding-right: 0;}}// Review bootstrap navbar to work with different nav styles $o-navbar-nav-pills-link-padding-x: $nav-link-padding-x !default; $o-navbar-nav-pills-link-border-radius: $nav-pills-border-radius !default; .navbar-nav.nav-pills .nav-link{// The rules is needed so that the padding is not reset to 0 in mobile. // Also use default nav-link paddings instead of navbar ones. padding-right: $o-navbar-nav-pills-link-padding-x; padding-left: $o-navbar-nav-pills-link-padding-x; @if $o-navbar-nav-pills-link-border-radius != $nav-pills-border-radius{@include border-radius($o-navbar-nav-pills-link-border-radius);}}.carousel-control-next .visually-hidden{left: 50%; // Avoid horizontal scrollbar in Chrome}.pagination{// Ensure circle for one digit numbers font-variant-numeric: tabular-nums;}// Modal .modal-content{// If the text color of the body (used for the text color in modals) is not // visible due to insufficient contrast with the modal background, we adjust // the text color in the modal using the following code. For example, if the // user sets a black background for its website and the text color of the // body is white, the text will not be visible on modals with a white // background. @if $modal-content-color == null{color: adjust-color-to-background($body-color, $modal-content-bg); // This prevents these elements from taking their colors from the body // inside a modal. // We need to exclude 'oe_structure' that are areas containing editable // snippets. Indeed, this code was added in a stable version, and we are // doing everything not to alter the content edited by users. For // example in Website, without this 'not', the 's_website_form' snippets // with a black background in modals and on websites with a black // background would have their input background changing from black to // white. // TODO: In Master, find a more consistent way to define the background // color of 's_website_form' snippet inputs inside a modal. &:where(:not(.oe_structure)){@if ($input-bg == $body-bg){.form-control{background-color: $modal-content-bg; color: color-contrast($modal-content-bg);}}@if ($form-select-bg == $body-bg){.form-select{background-color: $modal-content-bg; color: color-contrast($modal-content-bg);;}}@if $form-check-input-bg == $body-bg{.form-check-input:not(:checked){background-color: $modal-content-bg;}}}}.text-muted{color: adjust-color-to-background($text-muted, $modal-content-bg, mute-color($color-contrast-light), mute-color($color-contrast-dark)) !important;}}// Popover .popover{// The popover can have a different background color than that of the body. // Here, we adjust the text color of the popover in case the body color // (used by default for the text color of popovers) is not visible inside a // popover due to a lack of contrast (e.g. on a website with a dark // background). @if $popover-header-color == null{.popover-header{color: adjust-color-to-background($body-color, $popover-header-bg);}}@if $popover-body-color == $body-color{.popover-body{color: adjust-color-to-background($body-color, $popover-bg);}}}// Form .form-check-input{// Without this line, the border of the checkboxes is not visible when the // body is dark. This is due to the fact that the borders are defined based // on the 'currentColor' of the inputs. color: inherit;}.form-control.bg-light{color: adjust-color-to-background($input-color, $light);}$-color-for-gray-200-bg: adjust-color-to-background($body-color, $gray-200); // Input group text (e.g. Date time picker) .input-group-text{// Adapt only if the variables have their default values. @if ($input-group-addon-bg == $gray-200) and ($input-group-addon-color == $body-color){color: $-color-for-gray-200-bg;}}// File upload button .form-control::file-selector-button{@if ($form-file-button-bg == $gray-200) and ($form-file-button-color == $body-color){color: $-color-for-gray-200-bg;}}// offcanvas .offcanvas{@if $offcanvas-color == null{color: adjust-color-to-background($body-color, $offcanvas-bg-color); @if $form-check-input-bg == $body-bg{.form-check-input:where(:not(:checked)){background-color: $offcanvas-bg-color;}}@if $form-range-thumb-bg == $body-bg{.form-range{&::-webkit-slider-thumb{&:where(:not(:active)){background-color: $offcanvas-bg-color;}}&::-moz-range-thumb{&:where(:not(:active)){background-color: $offcanvas-bg-color;}}}}}}// Button within input-group (e.g., "search bar") .input-group{.btn:first-child, .btn:last-child{@include border-radius($input-border-radius, 0);}}// Dropdown .dropdown .dropdown-menu{.text-muted{color: adjust-color-to-background($text-muted, $dropdown-bg, mute-color($color-contrast-light), mute-color($color-contrast-dark)) !important;}}// The following code adapts the style of disabled inputs to maintain color // consistency and make them more recognizable. .form-select{// This is necessary to achieve a consistent "border rendering behaviour" // across form-select and form-control when using semi-transparent // borders and a background color (eg. disabled inputs). // Otherwise, the color rendering of the semi-transparent border may be altered // (the color may be darker depending on the background color used). background-clip: padding-box; &:disabled:not([multiple]):where(:not([size]), [size="1"]){background-image: str-replace($form-select-indicator, #{$form-select-indicator-color}, str-replace(#{$form-select-disabled-color}, "#", "%23"));}}.form-control{&:disabled, &[readonly]{color: $form-select-disabled-color;}}.form-check-input:disabled:not(:checked){background-color: $input-disabled-bg; .form-switch &{background-image: escape-svg(url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-select-disabled-color}'/></svg>"));}}.form-range:disabled::-webkit-slider-thumb{border-color: $input-disabled-border-color;}

/* /web/static/src/libs/fontawesome/css/font-awesome.css */
 @font-face{font-family: 'FontAwesome'; src: url('/web/static/src/libs/fontawesome/css/../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('/web/static/src/libs/fontawesome/css/../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'); font-weight: normal; font-style: normal; font-display: block;}.fa{display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}.fa-lg{font-size: 1.315em; vertical-align: -6%;}.fa-2x{font-size: 2em;}.fa-3x{font-size: 3em;}.fa-4x{font-size: 4em;}.fa-5x{font-size: 5em;}.fa-fw{width: 1.28571429em; text-align: center;}.fa-ul{padding-left: 0; margin-left: 2.14285714em; list-style-type: none;}.fa-ul > li{position: relative;}.fa-li{position: absolute; left: -2.14285714em; width: 2.14285714em; top: 0.14285714em; text-align: center;}.fa-li.fa-lg{left: -1.85714286em;}.fa-border{padding: .2em .25em .15em; border: solid 0.08em #eeeeee; border-radius: .1em;}.fa-pull-left{float: left;}.fa-pull-right{float: right;}.fa.fa-pull-left{margin-right: .3em;}.fa.fa-pull-right{margin-left: .3em;}.fa-spin{animation: fa-spin 2s infinite linear;}.fa-pulse{animation: fa-spin 1s infinite steps(8);}@keyframes fa-spin{0%{transform: rotate(0deg);}100%{transform: rotate(359deg);}}.fa-rotate-90{transform: rotate(90deg);}.fa-rotate-180{transform: rotate(180deg);}.fa-rotate-270{transform: rotate(270deg);}.fa-flip-horizontal{transform: scale(-1, 1);}.fa-flip-vertical{transform: scale(1, -1);}:root .fa-rotate-90, :root .fa-rotate-180, :root .fa-rotate-270, :root .fa-flip-horizontal, :root .fa-flip-vertical{filter: none;}.fa-stack{position: relative; display: inline-block; width: 2em; height: 2em; line-height: 2em; vertical-align: middle;}.fa-stack-1x, .fa-stack-2x{position: absolute; left: 0; width: 100%; text-align: center;}.fa-stack-1x{line-height: inherit;}.fa-stack-2x{font-size: 2em;}.fa-inverse{color: #ffffff;}.fa-glass:before{content: "\f000";}.fa-music:before{content: "\f001";}.fa-search:before{content: "\f002";}.fa-envelope-o:before{content: "\f003";}.fa-heart:before{content: "\f004";}.fa-star:before{content: "\f005";}.fa-star-o:before{content: "\f006";}.fa-user:before{content: "\f007";}.fa-film:before{content: "\f008";}.fa-th-large:before{content: "\f009";}.fa-th:before{content: "\f00a";}.fa-th-list:before{content: "\f00b";}.fa-check:before{content: "\f00c";}.fa-remove:before, .fa-close:before, .fa-times:before{content: "\f00d";}.fa-search-plus:before{content: "\f00e";}.fa-search-minus:before{content: "\f010";}.fa-power-off:before{content: "\f011";}.fa-signal:before{content: "\f012";}.fa-gear:before, .fa-cog:before{content: "\f013";}.fa-trash-o:before{content: "\f014";}.fa-home:before{content: "\f015";}.fa-file-o:before{content: "\f016";}.fa-clock-o:before{content: "\f017";}.fa-road:before{content: "\f018";}.fa-download:before{content: "\f019";}.fa-arrow-circle-o-down:before{content: "\f01a";}.fa-arrow-circle-o-up:before{content: "\f01b";}.fa-inbox:before{content: "\f01c";}.fa-play-circle-o:before{content: "\f01d";}.fa-rotate-right:before, .fa-repeat:before{content: "\f01e";}.fa-refresh:before{content: "\f021";}.fa-list-alt:before{content: "\f022";}.fa-lock:before{content: "\f023";}.fa-flag:before{content: "\f024";}.fa-headphones:before{content: "\f025";}.fa-volume-off:before{content: "\f026";}.fa-volume-down:before{content: "\f027";}.fa-volume-up:before{content: "\f028";}.fa-qrcode:before{content: "\f029";}.fa-barcode:before{content: "\f02a";}.fa-tag:before{content: "\f02b";}.fa-tags:before{content: "\f02c";}.fa-book:before{content: "\f02d";}.fa-bookmark:before{content: "\f02e";}.fa-print:before{content: "\f02f";}.fa-camera:before{content: "\f030";}.fa-font:before{content: "\f031";}.fa-bold:before{content: "\f032";}.fa-italic:before{content: "\f033";}.fa-text-height:before{content: "\f034";}.fa-text-width:before{content: "\f035";}.fa-align-left:before{content: "\f036";}.fa-align-center:before{content: "\f037";}.fa-align-right:before{content: "\f038";}.fa-align-justify:before{content: "\f039";}.fa-list:before{content: "\f03a";}.fa-dedent:before, .fa-outdent:before{content: "\f03b";}.fa-indent:before{content: "\f03c";}.fa-video-camera:before{content: "\f03d";}.fa-photo:before, .fa-image:before, .fa-picture-o:before{content: "\f03e";}.fa-pencil:before{content: "\f040";}.fa-map-marker:before{content: "\f041";}.fa-adjust:before{content: "\f042";}.fa-tint:before{content: "\f043";}.fa-edit:before, .fa-pencil-square-o:before{content: "\f044";}.fa-share-square-o:before{content: "\f045";}.fa-check-square-o:before{content: "\f046";}.fa-arrows:before{content: "\f047";}.fa-step-backward:before{content: "\f048";}.fa-fast-backward:before{content: "\f049";}.fa-backward:before{content: "\f04a";}.fa-play:before{content: "\f04b";}.fa-pause:before{content: "\f04c";}.fa-stop:before{content: "\f04d";}.fa-forward:before{content: "\f04e";}.fa-fast-forward:before{content: "\f050";}.fa-step-forward:before{content: "\f051";}.fa-eject:before{content: "\f052";}.fa-chevron-left:before{content: "\f053";}.fa-chevron-right:before{content: "\f054";}.fa-plus-circle:before{content: "\f055";}.fa-minus-circle:before{content: "\f056";}.fa-times-circle:before{content: "\f057";}.fa-check-circle:before{content: "\f058";}.fa-question-circle:before{content: "\f059";}.fa-info-circle:before{content: "\f05a";}.fa-crosshairs:before{content: "\f05b";}.fa-times-circle-o:before{content: "\f05c";}.fa-check-circle-o:before{content: "\f05d";}.fa-ban:before{content: "\f05e";}.fa-arrow-left:before{content: "\f060";}.fa-arrow-right:before{content: "\f061";}.fa-arrow-up:before{content: "\f062";}.fa-arrow-down:before{content: "\f063";}.fa-mail-forward:before, .fa-share:before{content: "\f064";}.fa-expand:before{content: "\f065";}.fa-compress:before{content: "\f066";}.fa-plus:before{content: "\f067";}.fa-minus:before{content: "\f068";}.fa-asterisk:before{content: "\f069";}.fa-exclamation-circle:before{content: "\f06a";}.fa-gift:before{content: "\f06b";}.fa-leaf:before{content: "\f06c";}.fa-fire:before{content: "\f06d";}.fa-eye:before{content: "\f06e";}.fa-eye-slash:before{content: "\f070";}.fa-warning:before, .fa-exclamation-triangle:before{content: "\f071";}.fa-plane:before{content: "\f072";}.fa-calendar:before{content: "\f073";}.fa-random:before{content: "\f074";}.fa-comment:before{content: "\f075";}.fa-magnet:before{content: "\f076";}.fa-chevron-up:before{content: "\f077";}.fa-chevron-down:before{content: "\f078";}.fa-retweet:before{content: "\f079";}.fa-shopping-cart:before{content: "\f07a";}.fa-folder:before{content: "\f07b";}.fa-folder-open:before{content: "\f07c";}.fa-arrows-v:before{content: "\f07d";}.fa-arrows-h:before{content: "\f07e";}.fa-bar-chart-o:before, .fa-bar-chart:before{content: "\f080";}.fa-twitter-square:before{content: "\f081";}.fa-facebook-square:before{content: "\f082";}.fa-camera-retro:before{content: "\f083";}.fa-key:before{content: "\f084";}.fa-gears:before, .fa-cogs:before{content: "\f085";}.fa-comments:before{content: "\f086";}.fa-thumbs-o-up:before{content: "\f087";}.fa-thumbs-o-down:before{content: "\f088";}.fa-star-half:before{content: "\f089";}.fa-heart-o:before{content: "\f08a";}.fa-sign-out:before{content: "\f08b";}.fa-linkedin-square:before{content: "\f08c";}.fa-thumb-tack:before{content: "\f08d";}.fa-external-link:before{content: "\f08e";}.fa-sign-in:before{content: "\f090";}.fa-trophy:before{content: "\f091";}.fa-github-square:before{content: "\f092";}.fa-upload:before{content: "\f093";}.fa-lemon-o:before{content: "\f094";}.fa-phone:before{content: "\f095";}.fa-square-o:before{content: "\f096";}.fa-bookmark-o:before{content: "\f097";}.fa-phone-square:before{content: "\f098";}.fa-twitter:before{content: "\f099";}.fa-facebook-f:before, .fa-facebook:before{content: "\f09a";}.fa-github:before{content: "\f09b";}.fa-unlock:before{content: "\f09c";}.fa-credit-card:before{content: "\f09d";}.fa-feed:before, .fa-rss:before{content: "\f09e";}.fa-hdd-o:before{content: "\f0a0";}.fa-bullhorn:before{content: "\f0a1";}.fa-bell:before{content: "\f0f3";}.fa-certificate:before{content: "\f0a3";}.fa-hand-o-right:before{content: "\f0a4";}.fa-hand-o-left:before{content: "\f0a5";}.fa-hand-o-up:before{content: "\f0a6";}.fa-hand-o-down:before{content: "\f0a7";}.fa-arrow-circle-left:before{content: "\f0a8";}.fa-arrow-circle-right:before{content: "\f0a9";}.fa-arrow-circle-up:before{content: "\f0aa";}.fa-arrow-circle-down:before{content: "\f0ab";}.fa-globe:before{content: "\f0ac";}.fa-wrench:before{content: "\f0ad";}.fa-tasks:before{content: "\f0ae";}.fa-filter:before{content: "\f0b0";}.fa-briefcase:before{content: "\f0b1";}.fa-arrows-alt:before{content: "\f0b2";}.fa-group:before, .fa-users:before{content: "\f0c0";}.fa-chain:before, .fa-link:before{content: "\f0c1";}.fa-cloud:before{content: "\f0c2";}.fa-flask:before{content: "\f0c3";}.fa-cut:before, .fa-scissors:before{content: "\f0c4";}.fa-copy:before, .fa-files-o:before{content: "\f0c5";}.fa-paperclip:before{content: "\f0c6";}.fa-save:before, .fa-floppy-o:before{content: "\f0c7";}.fa-square:before{content: "\f0c8";}.fa-navicon:before, .fa-reorder:before, .fa-bars:before{content: "\f0c9";}.fa-list-ul:before{content: "\f0ca";}.fa-list-ol:before{content: "\f0cb";}.fa-strikethrough:before{content: "\f0cc";}.fa-underline:before{content: "\f0cd";}.fa-table:before{content: "\f0ce";}.fa-magic:before{content: "\f0d0";}.fa-truck:before{content: "\f0d1";}.fa-pinterest:before{content: "\f0d2";}.fa-pinterest-square:before{content: "\f0d3";}.fa-google-plus-square:before{content: "\f0d4";}.fa-google-plus:before{content: "\f0d5";}.fa-money:before{content: "\f0d6";}.fa-caret-down:before{content: "\f0d7";}.fa-caret-up:before{content: "\f0d8";}.fa-caret-left:before{content: "\f0d9";}.fa-caret-right:before{content: "\f0da";}.fa-columns:before{content: "\f0db";}.fa-unsorted:before, .fa-sort:before{content: "\f0dc";}.fa-sort-down:before, .fa-sort-desc:before{content: "\f0dd";}.fa-sort-up:before, .fa-sort-asc:before{content: "\f0de";}.fa-envelope:before{content: "\f0e0";}.fa-linkedin:before{content: "\f0e1";}.fa-rotate-left:before, .fa-undo:before{content: "\f0e2";}.fa-legal:before, .fa-gavel:before{content: "\f0e3";}.fa-dashboard:before, .fa-tachometer:before{content: "\f0e4";}.fa-comment-o:before{content: "\f0e5";}.fa-comments-o:before{content: "\f0e6";}.fa-flash:before, .fa-bolt:before{content: "\f0e7";}.fa-sitemap:before{content: "\f0e8";}.fa-umbrella:before{content: "\f0e9";}.fa-paste:before, .fa-clipboard:before{content: "\f0ea";}.fa-lightbulb-o:before{content: "\f0eb";}.fa-exchange:before{content: "\f0ec";}.fa-cloud-download:before{content: "\f0ed";}.fa-cloud-upload:before{content: "\f0ee";}.fa-user-md:before{content: "\f0f0";}.fa-stethoscope:before{content: "\f0f1";}.fa-suitcase:before{content: "\f0f2";}.fa-bell-o:before{content: "\f0a2";}.fa-coffee:before{content: "\f0f4";}.fa-cutlery:before{content: "\f0f5";}.fa-file-text-o:before{content: "\f0f6";}.fa-building-o:before{content: "\f0f7";}.fa-hospital-o:before{content: "\f0f8";}.fa-ambulance:before{content: "\f0f9";}.fa-medkit:before{content: "\f0fa";}.fa-fighter-jet:before{content: "\f0fb";}.fa-beer:before{content: "\f0fc";}.fa-h-square:before{content: "\f0fd";}.fa-plus-square:before{content: "\f0fe";}.fa-angle-double-left:before{content: "\f100";}.fa-angle-double-right:before{content: "\f101";}.fa-angle-double-up:before{content: "\f102";}.fa-angle-double-down:before{content: "\f103";}.fa-angle-left:before{content: "\f104";}.fa-angle-right:before{content: "\f105";}.fa-angle-up:before{content: "\f106";}.fa-angle-down:before{content: "\f107";}.fa-desktop:before{content: "\f108";}.fa-laptop:before{content: "\f109";}.fa-tablet:before{content: "\f10a";}.fa-mobile-phone:before, .fa-mobile:before{content: "\f10b";}.fa-circle-o:before{content: "\f10c";}.fa-quote-left:before{content: "\f10d";}.fa-quote-right:before{content: "\f10e";}.fa-spinner:before{content: "\f110";}.fa-circle:before{content: "\f111";}.fa-mail-reply:before, .fa-reply:before{content: "\f112";}.fa-github-alt:before{content: "\f113";}.fa-folder-o:before{content: "\f114";}.fa-folder-open-o:before{content: "\f115";}.fa-smile-o:before{content: "\f118";}.fa-frown-o:before{content: "\f119";}.fa-meh-o:before{content: "\f11a";}.fa-gamepad:before{content: "\f11b";}.fa-keyboard-o:before{content: "\f11c";}.fa-flag-o:before{content: "\f11d";}.fa-flag-checkered:before{content: "\f11e";}.fa-terminal:before{content: "\f120";}.fa-code:before{content: "\f121";}.fa-mail-reply-all:before, .fa-reply-all:before{content: "\f122";}.fa-star-half-empty:before, .fa-star-half-full:before, .fa-star-half-o:before{content: "\f123";}.fa-location-arrow:before{content: "\f124";}.fa-crop:before{content: "\f125";}.fa-code-fork:before{content: "\f126";}.fa-unlink:before, .fa-chain-broken:before{content: "\f127";}.fa-question:before{content: "\f128";}.fa-info:before{content: "\f129";}.fa-exclamation:before{content: "\f12a";}.fa-superscript:before{content: "\f12b";}.fa-subscript:before{content: "\f12c";}.fa-eraser:before{content: "\f12d";}.fa-puzzle-piece:before{content: "\f12e";}.fa-microphone:before{content: "\f130";}.fa-microphone-slash:before{content: "\f131";}.fa-shield:before{content: "\f132";}.fa-calendar-o:before{content: "\f133";}.fa-fire-extinguisher:before{content: "\f134";}.fa-rocket:before{content: "\f135";}.fa-maxcdn:before{content: "\f136";}.fa-chevron-circle-left:before{content: "\f137";}.fa-chevron-circle-right:before{content: "\f138";}.fa-chevron-circle-up:before{content: "\f139";}.fa-chevron-circle-down:before{content: "\f13a";}.fa-html5:before{content: "\f13b";}.fa-css3:before{content: "\f13c";}.fa-anchor:before{content: "\f13d";}.fa-unlock-alt:before{content: "\f13e";}.fa-bullseye:before{content: "\f140";}.fa-ellipsis-h:before{content: "\f141";}.fa-ellipsis-v:before{content: "\f142";}.fa-rss-square:before{content: "\f143";}.fa-play-circle:before{content: "\f144";}.fa-ticket:before{content: "\f145";}.fa-minus-square:before{content: "\f146";}.fa-minus-square-o:before{content: "\f147";}.fa-level-up:before{content: "\f148";}.fa-level-down:before{content: "\f149";}.fa-check-square:before{content: "\f14a";}.fa-pencil-square:before{content: "\f14b";}.fa-external-link-square:before{content: "\f14c";}.fa-share-square:before{content: "\f14d";}.fa-compass:before{content: "\f14e";}.fa-toggle-down:before, .fa-caret-square-o-down:before{content: "\f150";}.fa-toggle-up:before, .fa-caret-square-o-up:before{content: "\f151";}.fa-toggle-right:before, .fa-caret-square-o-right:before{content: "\f152";}.fa-euro:before, .fa-eur:before{content: "\f153";}.fa-gbp:before{content: "\f154";}.fa-dollar:before, .fa-usd:before{content: "\f155";}.fa-rupee:before, .fa-inr:before{content: "\f156";}.fa-cny:before, .fa-rmb:before, .fa-yen:before, .fa-jpy:before{content: "\f157";}.fa-ruble:before, .fa-rouble:before, .fa-rub:before{content: "\f158";}.fa-won:before, .fa-krw:before{content: "\f159";}.fa-bitcoin:before, .fa-btc:before{content: "\f15a";}.fa-file:before{content: "\f15b";}.fa-file-text:before{content: "\f15c";}.fa-sort-alpha-asc:before{content: "\f15d";}.fa-sort-alpha-desc:before{content: "\f15e";}.fa-sort-amount-asc:before{content: "\f160";}.fa-sort-amount-desc:before{content: "\f161";}.fa-sort-numeric-asc:before{content: "\f162";}.fa-sort-numeric-desc:before{content: "\f163";}.fa-thumbs-up:before{content: "\f164";}.fa-thumbs-down:before{content: "\f165";}.fa-youtube-square:before{content: "\f166";}.fa-youtube:before{content: "\f167";}.fa-xing:before{content: "\f168";}.fa-xing-square:before{content: "\f169";}.fa-youtube-play:before{content: "\f16a";}.fa-dropbox:before{content: "\f16b";}.fa-stack-overflow:before{content: "\f16c";}.fa-instagram:before{content: "\f16d";}.fa-flickr:before{content: "\f16e";}.fa-adn:before{content: "\f170";}.fa-bitbucket:before{content: "\f171";}.fa-bitbucket-square:before{content: "\f172";}.fa-tumblr:before{content: "\f173";}.fa-tumblr-square:before{content: "\f174";}.fa-long-arrow-down:before{content: "\f175";}.fa-long-arrow-up:before{content: "\f176";}.fa-long-arrow-left:before{content: "\f177";}.fa-long-arrow-right:before{content: "\f178";}.fa-apple:before{content: "\f179";}.fa-windows:before{content: "\f17a";}.fa-android:before{content: "\f17b";}.fa-linux:before{content: "\f17c";}.fa-dribbble:before{content: "\f17d";}.fa-skype:before{content: "\f17e";}.fa-foursquare:before{content: "\f180";}.fa-trello:before{content: "\f181";}.fa-female:before{content: "\f182";}.fa-male:before{content: "\f183";}.fa-gittip:before, .fa-gratipay:before{content: "\f184";}.fa-sun-o:before{content: "\f185";}.fa-moon-o:before{content: "\f186";}.fa-archive:before{content: "\f187";}.fa-bug:before{content: "\f188";}.fa-vk:before{content: "\f189";}.fa-weibo:before{content: "\f18a";}.fa-renren:before{content: "\f18b";}.fa-pagelines:before{content: "\f18c";}.fa-stack-exchange:before{content: "\f18d";}.fa-arrow-circle-o-right:before{content: "\f18e";}.fa-arrow-circle-o-left:before{content: "\f190";}.fa-toggle-left:before, .fa-caret-square-o-left:before{content: "\f191";}.fa-dot-circle-o:before{content: "\f192";}.fa-wheelchair:before{content: "\f193";}.fa-vimeo-square:before{content: "\f194";}.fa-turkish-lira:before, .fa-try:before{content: "\f195";}.fa-plus-square-o:before{content: "\f196";}.fa-space-shuttle:before{content: "\f197";}.fa-slack:before{content: "\f198";}.fa-envelope-square:before{content: "\f199";}.fa-wordpress:before{content: "\f19a";}.fa-openid:before{content: "\f19b";}.fa-institution:before, .fa-bank:before, .fa-university:before{content: "\f19c";}.fa-mortar-board:before, .fa-graduation-cap:before{content: "\f19d";}.fa-yahoo:before{content: "\f19e";}.fa-google:before{content: "\f1a0";}.fa-reddit:before{content: "\f1a1";}.fa-reddit-square:before{content: "\f1a2";}.fa-stumbleupon-circle:before{content: "\f1a3";}.fa-stumbleupon:before{content: "\f1a4";}.fa-delicious:before{content: "\f1a5";}.fa-digg:before{content: "\f1a6";}.fa-pied-piper-pp:before{content: "\f1a7";}.fa-pied-piper-alt:before{content: "\f1a8";}.fa-drupal:before{content: "\f1a9";}.fa-joomla:before{content: "\f1aa";}.fa-language:before{content: "\f1ab";}.fa-fax:before{content: "\f1ac";}.fa-building:before{content: "\f1ad";}.fa-child:before{content: "\f1ae";}.fa-paw:before{content: "\f1b0";}.fa-spoon:before{content: "\f1b1";}.fa-cube:before{content: "\f1b2";}.fa-cubes:before{content: "\f1b3";}.fa-behance:before{content: "\f1b4";}.fa-behance-square:before{content: "\f1b5";}.fa-steam:before{content: "\f1b6";}.fa-steam-square:before{content: "\f1b7";}.fa-recycle:before{content: "\f1b8";}.fa-automobile:before, .fa-car:before{content: "\f1b9";}.fa-cab:before, .fa-taxi:before{content: "\f1ba";}.fa-tree:before{content: "\f1bb";}.fa-spotify:before{content: "\f1bc";}.fa-deviantart:before{content: "\f1bd";}.fa-soundcloud:before{content: "\f1be";}.fa-database:before{content: "\f1c0";}.fa-file-pdf-o:before{content: "\f1c1";}.fa-file-word-o:before{content: "\f1c2";}.fa-file-excel-o:before{content: "\f1c3";}.fa-file-powerpoint-o:before{content: "\f1c4";}.fa-file-photo-o:before, .fa-file-picture-o:before, .fa-file-image-o:before{content: "\f1c5";}.fa-file-zip-o:before, .fa-file-archive-o:before{content: "\f1c6";}.fa-file-sound-o:before, .fa-file-audio-o:before{content: "\f1c7";}.fa-file-movie-o:before, .fa-file-video-o:before{content: "\f1c8";}.fa-file-code-o:before{content: "\f1c9";}.fa-vine:before{content: "\f1ca";}.fa-codepen:before{content: "\f1cb";}.fa-jsfiddle:before{content: "\f1cc";}.fa-life-bouy:before, .fa-life-buoy:before, .fa-life-saver:before, .fa-support:before, .fa-life-ring:before{content: "\f1cd";}.fa-circle-o-notch:before{content: "\f1ce";}.fa-ra:before, .fa-resistance:before, .fa-rebel:before{content: "\f1d0";}.fa-ge:before, .fa-empire:before{content: "\f1d1";}.fa-git-square:before{content: "\f1d2";}.fa-git:before{content: "\f1d3";}.fa-y-combinator-square:before, .fa-yc-square:before, .fa-hacker-news:before{content: "\f1d4";}.fa-tencent-weibo:before{content: "\f1d5";}.fa-qq:before{content: "\f1d6";}.fa-wechat:before, .fa-weixin:before{content: "\f1d7";}.fa-send:before, .fa-paper-plane:before{content: "\f1d8";}.fa-send-o:before, .fa-paper-plane-o:before{content: "\f1d9";}.fa-history:before{content: "\f1da";}.fa-circle-thin:before{content: "\f1db";}.fa-header:before{content: "\f1dc";}.fa-paragraph:before{content: "\f1dd";}.fa-sliders:before{content: "\f1de";}.fa-share-alt:before{content: "\f1e0";}.fa-share-alt-square:before{content: "\f1e1";}.fa-bomb:before{content: "\f1e2";}.fa-soccer-ball-o:before, .fa-futbol-o:before{content: "\f1e3";}.fa-tty:before{content: "\f1e4";}.fa-binoculars:before{content: "\f1e5";}.fa-plug:before{content: "\f1e6";}.fa-slideshare:before{content: "\f1e7";}.fa-twitch:before{content: "\f1e8";}.fa-yelp:before{content: "\f1e9";}.fa-newspaper-o:before{content: "\f1ea";}.fa-wifi:before{content: "\f1eb";}.fa-calculator:before{content: "\f1ec";}.fa-paypal:before{content: "\f1ed";}.fa-google-wallet:before{content: "\f1ee";}.fa-cc-visa:before{content: "\f1f0";}.fa-cc-mastercard:before{content: "\f1f1";}.fa-cc-discover:before{content: "\f1f2";}.fa-cc-amex:before{content: "\f1f3";}.fa-cc-paypal:before{content: "\f1f4";}.fa-cc-stripe:before{content: "\f1f5";}.fa-bell-slash:before{content: "\f1f6";}.fa-bell-slash-o:before{content: "\f1f7";}.fa-trash:before{content: "\f1f8";}.fa-copyright:before{content: "\f1f9";}.fa-at:before{content: "\f1fa";}.fa-eyedropper:before{content: "\f1fb";}.fa-paint-brush:before{content: "\f1fc";}.fa-birthday-cake:before{content: "\f1fd";}.fa-area-chart:before{content: "\f1fe";}.fa-pie-chart:before{content: "\f200";}.fa-line-chart:before{content: "\f201";}.fa-lastfm:before{content: "\f202";}.fa-lastfm-square:before{content: "\f203";}.fa-toggle-off:before{content: "\f204";}.fa-toggle-on:before{content: "\f205";}.fa-bicycle:before{content: "\f206";}.fa-bus:before{content: "\f207";}.fa-ioxhost:before{content: "\f208";}.fa-angellist:before{content: "\f209";}.fa-cc:before{content: "\f20a";}.fa-shekel:before, .fa-sheqel:before, .fa-ils:before{content: "\f20b";}.fa-meanpath:before{content: "\f20c";}.fa-buysellads:before{content: "\f20d";}.fa-connectdevelop:before{content: "\f20e";}.fa-dashcube:before{content: "\f210";}.fa-forumbee:before{content: "\f211";}.fa-leanpub:before{content: "\f212";}.fa-sellsy:before{content: "\f213";}.fa-shirtsinbulk:before{content: "\f214";}.fa-simplybuilt:before{content: "\f215";}.fa-skyatlas:before{content: "\f216";}.fa-cart-plus:before{content: "\f217";}.fa-cart-arrow-down:before{content: "\f218";}.fa-diamond:before{content: "\f219";}.fa-ship:before{content: "\f21a";}.fa-user-secret:before{content: "\f21b";}.fa-motorcycle:before{content: "\f21c";}.fa-street-view:before{content: "\f21d";}.fa-heartbeat:before{content: "\f21e";}.fa-venus:before{content: "\f221";}.fa-mars:before{content: "\f222";}.fa-mercury:before{content: "\f223";}.fa-intersex:before, .fa-transgender:before{content: "\f224";}.fa-transgender-alt:before{content: "\f225";}.fa-venus-double:before{content: "\f226";}.fa-mars-double:before{content: "\f227";}.fa-venus-mars:before{content: "\f228";}.fa-mars-stroke:before{content: "\f229";}.fa-mars-stroke-v:before{content: "\f22a";}.fa-mars-stroke-h:before{content: "\f22b";}.fa-neuter:before{content: "\f22c";}.fa-genderless:before{content: "\f22d";}.fa-facebook-official:before{content: "\f230";}.fa-pinterest-p:before{content: "\f231";}.fa-whatsapp:before{content: "\f232";}.fa-server:before{content: "\f233";}.fa-user-plus:before{content: "\f234";}.fa-user-times:before{content: "\f235";}.fa-hotel:before, .fa-bed:before{content: "\f236";}.fa-viacoin:before{content: "\f237";}.fa-train:before{content: "\f238";}.fa-subway:before{content: "\f239";}.fa-medium:before{content: "\f23a";}.fa-yc:before, .fa-y-combinator:before{content: "\f23b";}.fa-optin-monster:before{content: "\f23c";}.fa-opencart:before{content: "\f23d";}.fa-expeditedssl:before{content: "\f23e";}.fa-battery-4:before, .fa-battery:before, .fa-battery-full:before{content: "\f240";}.fa-battery-3:before, .fa-battery-three-quarters:before{content: "\f241";}.fa-battery-2:before, .fa-battery-half:before{content: "\f242";}.fa-battery-1:before, .fa-battery-quarter:before{content: "\f243";}.fa-battery-0:before, .fa-battery-empty:before{content: "\f244";}.fa-mouse-pointer:before{content: "\f245";}.fa-i-cursor:before{content: "\f246";}.fa-object-group:before{content: "\f247";}.fa-object-ungroup:before{content: "\f248";}.fa-sticky-note:before{content: "\f249";}.fa-sticky-note-o:before{content: "\f24a";}.fa-cc-jcb:before{content: "\f24b";}.fa-cc-diners-club:before{content: "\f24c";}.fa-clone:before{content: "\f24d";}.fa-balance-scale:before{content: "\f24e";}.fa-hourglass-o:before{content: "\f250";}.fa-hourglass-1:before, .fa-hourglass-start:before{content: "\f251";}.fa-hourglass-2:before, .fa-hourglass-half:before{content: "\f252";}.fa-hourglass-3:before, .fa-hourglass-end:before{content: "\f253";}.fa-hourglass:before{content: "\f254";}.fa-hand-grab-o:before, .fa-hand-rock-o:before{content: "\f255";}.fa-hand-stop-o:before, .fa-hand-paper-o:before{content: "\f256";}.fa-hand-scissors-o:before{content: "\f257";}.fa-hand-lizard-o:before{content: "\f258";}.fa-hand-spock-o:before{content: "\f259";}.fa-hand-pointer-o:before{content: "\f25a";}.fa-hand-peace-o:before{content: "\f25b";}.fa-trademark:before{content: "\f25c";}.fa-registered:before{content: "\f25d";}.fa-creative-commons:before{content: "\f25e";}.fa-gg:before{content: "\f260";}.fa-gg-circle:before{content: "\f261";}.fa-tripadvisor:before{content: "\f262";}.fa-odnoklassniki:before{content: "\f263";}.fa-odnoklassniki-square:before{content: "\f264";}.fa-get-pocket:before{content: "\f265";}.fa-wikipedia-w:before{content: "\f266";}.fa-safari:before{content: "\f267";}.fa-chrome:before{content: "\f268";}.fa-firefox:before{content: "\f269";}.fa-opera:before{content: "\f26a";}.fa-internet-explorer:before{content: "\f26b";}.fa-tv:before, .fa-television:before{content: "\f26c";}.fa-contao:before{content: "\f26d";}.fa-500px:before{content: "\f26e";}.fa-amazon:before{content: "\f270";}.fa-calendar-plus-o:before{content: "\f271";}.fa-calendar-minus-o:before{content: "\f272";}.fa-calendar-times-o:before{content: "\f273";}.fa-calendar-check-o:before{content: "\f274";}.fa-industry:before{content: "\f275";}.fa-map-pin:before{content: "\f276";}.fa-map-signs:before{content: "\f277";}.fa-map-o:before{content: "\f278";}.fa-map:before{content: "\f279";}.fa-commenting:before{content: "\f27a";}.fa-commenting-o:before{content: "\f27b";}.fa-houzz:before{content: "\f27c";}.fa-vimeo:before{content: "\f27d";}.fa-black-tie:before{content: "\f27e";}.fa-fonticons:before{content: "\f280";}.fa-reddit-alien:before{content: "\f281";}.fa-edge:before{content: "\f282";}.fa-credit-card-alt:before{content: "\f283";}.fa-codiepie:before{content: "\f284";}.fa-modx:before{content: "\f285";}.fa-fort-awesome:before{content: "\f286";}.fa-usb:before{content: "\f287";}.fa-product-hunt:before{content: "\f288";}.fa-mixcloud:before{content: "\f289";}.fa-scribd:before{content: "\f28a";}.fa-pause-circle:before{content: "\f28b";}.fa-pause-circle-o:before{content: "\f28c";}.fa-stop-circle:before{content: "\f28d";}.fa-stop-circle-o:before{content: "\f28e";}.fa-shopping-bag:before{content: "\f290";}.fa-shopping-basket:before{content: "\f291";}.fa-hashtag:before{content: "\f292";}.fa-bluetooth:before{content: "\f293";}.fa-bluetooth-b:before{content: "\f294";}.fa-percent:before{content: "\f295";}.fa-gitlab:before{content: "\f296";}.fa-wpbeginner:before{content: "\f297";}.fa-wpforms:before{content: "\f298";}.fa-envira:before{content: "\f299";}.fa-universal-access:before{content: "\f29a";}.fa-wheelchair-alt:before{content: "\f29b";}.fa-question-circle-o:before{content: "\f29c";}.fa-blind:before{content: "\f29d";}.fa-audio-description:before{content: "\f29e";}.fa-volume-control-phone:before{content: "\f2a0";}.fa-braille:before{content: "\f2a1";}.fa-assistive-listening-systems:before{content: "\f2a2";}.fa-asl-interpreting:before, .fa-american-sign-language-interpreting:before{content: "\f2a3";}.fa-deafness:before, .fa-hard-of-hearing:before, .fa-deaf:before{content: "\f2a4";}.fa-glide:before{content: "\f2a5";}.fa-glide-g:before{content: "\f2a6";}.fa-signing:before, .fa-sign-language:before{content: "\f2a7";}.fa-low-vision:before{content: "\f2a8";}.fa-viadeo:before{content: "\f2a9";}.fa-viadeo-square:before{content: "\f2aa";}.fa-snapchat:before{content: "\f2ab";}.fa-snapchat-ghost:before{content: "\f2ac";}.fa-snapchat-square:before{content: "\f2ad";}.fa-pied-piper:before{content: "\f2ae";}.fa-first-order:before{content: "\f2b0";}.fa-yoast:before{content: "\f2b1";}.fa-themeisle:before{content: "\f2b2";}.fa-google-plus-circle:before, .fa-google-plus-official:before{content: "\f2b3";}.fa-fa:before, .fa-font-awesome:before{content: "\f2b4";}.fa-handshake-o:before{content: "\f2b5";}.fa-envelope-open:before{content: "\f2b6";}.fa-envelope-open-o:before{content: "\f2b7";}.fa-linode:before{content: "\f2b8";}.fa-address-book:before{content: "\f2b9";}.fa-address-book-o:before{content: "\f2ba";}.fa-vcard:before, .fa-address-card:before{content: "\f2bb";}.fa-vcard-o:before, .fa-address-card-o:before{content: "\f2bc";}.fa-user-circle:before{content: "\f2bd";}.fa-user-circle-o:before{content: "\f2be";}.fa-user-o:before{content: "\f2c0";}.fa-id-badge:before{content: "\f2c1";}.fa-drivers-license:before, .fa-id-card:before{content: "\f2c2";}.fa-drivers-license-o:before, .fa-id-card-o:before{content: "\f2c3";}.fa-quora:before{content: "\f2c4";}.fa-free-code-camp:before{content: "\f2c5";}.fa-telegram:before{content: "\f2c6";}.fa-thermometer-4:before, .fa-thermometer:before, .fa-thermometer-full:before{content: "\f2c7";}.fa-thermometer-3:before, .fa-thermometer-three-quarters:before{content: "\f2c8";}.fa-thermometer-2:before, .fa-thermometer-half:before{content: "\f2c9";}.fa-thermometer-1:before, .fa-thermometer-quarter:before{content: "\f2ca";}.fa-thermometer-0:before, .fa-thermometer-empty:before{content: "\f2cb";}.fa-shower:before{content: "\f2cc";}.fa-bathtub:before, .fa-s15:before, .fa-bath:before{content: "\f2cd";}.fa-podcast:before{content: "\f2ce";}.fa-window-maximize:before{content: "\f2d0";}.fa-window-minimize:before{content: "\f2d1";}.fa-window-restore:before{content: "\f2d2";}.fa-times-rectangle:before, .fa-window-close:before{content: "\f2d3";}.fa-times-rectangle-o:before, .fa-window-close-o:before{content: "\f2d4";}.fa-bandcamp:before{content: "\f2d5";}.fa-grav:before{content: "\f2d6";}.fa-etsy:before{content: "\f2d7";}.fa-imdb:before{content: "\f2d8";}.fa-ravelry:before{content: "\f2d9";}.fa-eercast:before{content: "\f2da";}.fa-microchip:before{content: "\f2db";}.fa-snowflake-o:before{content: "\f2dc";}.fa-superpowers:before{content: "\f2dd";}.fa-wpexplorer:before{content: "\f2de";}.fa-meetup:before{content: "\f2e0";}.visually-hidden{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;}.visually-hidden-focusable:active, .visually-hidden-focusable:focus{position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto;}

/* /web/static/lib/odoo_ui_icons/style.css */
@font-face{font-family: 'odoo_ui_icons'; src: url('/web/static/lib/odoo_ui_icons/fonts/odoo_ui_icons.woff2') format('woff2'), url('/web/static/lib/odoo_ui_icons/fonts/odoo_ui_icons.woff') format('woff'); font-weight: normal; font-style: normal; font-display: block;}.oi{display: inline-block; font-family: 'odoo_ui_icons'; speak: never; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}.oi-view-pivot:before{content: '\e800';}.oi-text-break:before{content: '\e801';}.oi-text-inline:before{content: '\e802';}.oi-voip:before{content: '\e803';}.oi-odoo:before{content: '\e806';}.oi-search:before{content: '\e808';}.oi-group:before{content: '\e80a';}.oi-settings-adjust:before{content: '\e80c';}.oi-apps:before{content: '\e80d';}.oi-panel-right:before{content: '\e810';}.oi-launch:before{content: '\e812';}.oi-studio:before{content: '\e813';}.oi-view-kanban:before{content: '\e814';}.oi-text-wrap:before{content: '\e815';}.oi-view-cohort:before{content: '\e816';}.oi-view-list:before{content: '\e817';}.oi-gif-picker:before{content: '\e82e';}.oi-chevron-down:before{content: '\e839';}.oi-chevron-left:before{content: '\e83a';}.oi-chevron-right:before{content: '\e83b';}.oi-chevron-up:before{content: '\e83c';}.oi-arrows-h:before{content: '\e83d';}.oi-arrows-v:before{content: '\e83e';}.oi-arrow-down-left:before{content: '\e83f';}.oi-arrow-down-right:before{content: '\e840';}.oi-arrow-down:before{content: '\e841';}.oi-arrow-left:before{content: '\e842';}.oi-arrow-right:before{content: '\e843';}.oi-arrow-up-left:before{content: '\e844';}.oi-arrow-up-right:before{content: '\e845';}.oi-arrow-up:before{content: '\e846';}.oi-draggable:before{content: '\e847';}.oi-view:before{content: '\e861';}.oi-archive:before{content: '\e862';}.oi-unarchive:before{content: '\e863';}.oi-text-effect:before{content: '\e827';}.oi-smile-add:before{content: '\e84e';}.oi-close:before{content: '\e852';}.o_rtl .oi-chevron-left, .o_rtl .oi-chevron-right, .o_rtl .oi-arrow-down-left, .o_rtl .oi-arrow-down-right, .o_rtl .oi-arrow-left, .o_rtl .oi-arrow-right, .o_rtl .oi-arrow-up-left, .o_rtl .oi-arrow-up-right{transform: rotate(180deg);}

/* /web/static/lib/select2/select2.css */
 .select2-container{margin: 0; position: relative; display: inline-block; vertical-align: middle;}.select2-container, .select2-drop, .select2-search, .select2-search input{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}.select2-container .select2-choice{display: block; height: 26px; padding: 0 0 0 8px; overflow: hidden; position: relative; border: 1px solid #aaa; white-space: nowrap; line-height: 26px; color: #444; text-decoration: none; border-radius: 4px; background-clip: padding-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: #fff; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(0.5, #fff)); background-image: -webkit-linear-gradient(center bottom, #eee 0%, #fff 50%); background-image: -moz-linear-gradient(center bottom, #eee 0%, #fff 50%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#eeeeee', GradientType = 0); background-image: linear-gradient(to top, #eee 0%, #fff 50%);}html[dir="rtl"] .select2-container .select2-choice{padding: 0 8px 0 0;}.select2-container.select2-drop-above .select2-choice{border-bottom-color: #aaa; border-radius: 0 0 4px 4px; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(0.9, #fff)); background-image: -webkit-linear-gradient(center bottom, #eee 0%, #fff 90%); background-image: -moz-linear-gradient(center bottom, #eee 0%, #fff 90%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0); background-image: linear-gradient(to bottom, #eee 0%, #fff 90%);}.select2-container.select2-allowclear .select2-choice .select2-chosen{margin-right: 42px;}.select2-container .select2-choice > .select2-chosen{margin-right: 26px; display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; float: none; width: auto;}html[dir="rtl"] .select2-container .select2-choice > .select2-chosen{margin-left: 26px; margin-right: 0;}.select2-container .select2-choice abbr{display: none; width: 12px; height: 12px; position: absolute; right: 24px; top: 8px; font-size: 1px; text-decoration: none; border: 0; background: url('/web/static/lib/select2/select2.png') right top no-repeat; cursor: pointer; outline: 0;}.select2-container.select2-allowclear .select2-choice abbr{display: inline-block;}.select2-container .select2-choice abbr:hover{background-position: right -11px; cursor: pointer;}.select2-drop-mask{border: 0; margin: 0; padding: 0; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 9998; background-color: #fff; filter: alpha(opacity=0);}.select2-drop{width: 100%; margin-top: -1px; position: absolute; z-index: 9999; top: 100%; background: #fff; color: #000; border: 1px solid #aaa; border-top: 0; border-radius: 0 0 4px 4px; -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .15); box-shadow: 0 4px 5px rgba(0, 0, 0, .15);}.select2-drop.select2-drop-above{margin-top: 1px; border-top: 1px solid #aaa; border-bottom: 0; border-radius: 4px 4px 0 0; -webkit-box-shadow: 0 -4px 5px rgba(0, 0, 0, .15); box-shadow: 0 -4px 5px rgba(0, 0, 0, .15);}.select2-drop-active{border: 1px solid #5897fb; border-top: none;}.select2-drop.select2-drop-above.select2-drop-active{border-top: 1px solid #5897fb;}.select2-drop-auto-width{border-top: 1px solid #aaa; width: auto;}.select2-container .select2-choice .select2-arrow{display: inline-block; width: 18px; height: 100%; position: absolute; right: 0; top: 0; border-left: 1px solid #aaa; border-radius: 0 4px 4px 0; background-clip: padding-box; background: #ccc; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ccc), color-stop(0.6, #eee)); background-image: -webkit-linear-gradient(center bottom, #ccc 0%, #eee 60%); background-image: -moz-linear-gradient(center bottom, #ccc 0%, #eee 60%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#eeeeee', endColorstr = '#cccccc', GradientType = 0); background-image: linear-gradient(to top, #ccc 0%, #eee 60%);}html[dir="rtl"] .select2-container .select2-choice .select2-arrow{left: 0; right: auto; border-left: none; border-right: 1px solid #aaa; border-radius: 4px 0 0 4px;}.select2-container .select2-choice .select2-arrow b{display: block; width: 100%; height: 100%; background: url('/web/static/lib/select2/select2.png') no-repeat 0 1px;}html[dir="rtl"] .select2-container .select2-choice .select2-arrow b{background-position: 2px 1px;}.select2-search{display: inline-block; width: 100%; min-height: 26px; margin: 0; padding: 4px 4px 0 4px; position: relative; z-index: 10000; white-space: nowrap;}.select2-search input{width: 100%; height: auto !important; min-height: 26px; padding: 4px 20px 4px 5px; margin: 0; outline: 0; font-family: sans-serif; font-size: 1em; border: 1px solid #aaa; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; background: #fff url('/web/static/lib/select2/select2.png') no-repeat 100% -22px; background: url('/web/static/lib/select2/select2.png') no-repeat 100% -22px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee)); background: url('/web/static/lib/select2/select2.png') no-repeat 100% -22px, -webkit-linear-gradient(center bottom, #fff 85%, #eee 99%); background: url('/web/static/lib/select2/select2.png') no-repeat 100% -22px, -moz-linear-gradient(center bottom, #fff 85%, #eee 99%); background: url('/web/static/lib/select2/select2.png') no-repeat 100% -22px, linear-gradient(to bottom, #fff 85%, #eee 99%) 0 0;}html[dir="rtl"] .select2-search input{padding: 4px 5px 4px 20px; background: #fff url('/web/static/lib/select2/select2.png') no-repeat -37px -22px; background: url('/web/static/lib/select2/select2.png') no-repeat -37px -22px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee)); background: url('/web/static/lib/select2/select2.png') no-repeat -37px -22px, -webkit-linear-gradient(center bottom, #fff 85%, #eee 99%); background: url('/web/static/lib/select2/select2.png') no-repeat -37px -22px, -moz-linear-gradient(center bottom, #fff 85%, #eee 99%); background: url('/web/static/lib/select2/select2.png') no-repeat -37px -22px, linear-gradient(to bottom, #fff 85%, #eee 99%) 0 0;}.select2-search input.select2-active{background: #fff url('/web/static/lib/select2/select2-spinner.gif') no-repeat 100%; background: url('/web/static/lib/select2/select2-spinner.gif') no-repeat 100%, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee)); background: url('/web/static/lib/select2/select2-spinner.gif') no-repeat 100%, -webkit-linear-gradient(center bottom, #fff 85%, #eee 99%); background: url('/web/static/lib/select2/select2-spinner.gif') no-repeat 100%, -moz-linear-gradient(center bottom, #fff 85%, #eee 99%); background: url('/web/static/lib/select2/select2-spinner.gif') no-repeat 100%, linear-gradient(to bottom, #fff 85%, #eee 99%) 0 0;}.select2-container-active .select2-choice, .select2-container-active .select2-choices{border: 1px solid #5897fb; outline: none; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .3); box-shadow: 0 0 5px rgba(0, 0, 0, .3);}.select2-dropdown-open .select2-choice{border-bottom-color: transparent; -webkit-box-shadow: 0 1px 0 #fff inset; box-shadow: 0 1px 0 #fff inset; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-color: #eee; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #fff), color-stop(0.5, #eee)); background-image: -webkit-linear-gradient(center bottom, #fff 0%, #eee 50%); background-image: -moz-linear-gradient(center bottom, #fff 0%, #eee 50%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0); background-image: linear-gradient(to top, #fff 0%, #eee 50%);}.select2-dropdown-open.select2-drop-above .select2-choice, .select2-dropdown-open.select2-drop-above .select2-choices{border: 1px solid #5897fb; border-top-color: transparent; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.5, #eee)); background-image: -webkit-linear-gradient(center top, #fff 0%, #eee 50%); background-image: -moz-linear-gradient(center top, #fff 0%, #eee 50%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0); background-image: linear-gradient(to bottom, #fff 0%, #eee 50%);}.select2-dropdown-open .select2-choice .select2-arrow{background: transparent; border-left: none; filter: none;}html[dir="rtl"] .select2-dropdown-open .select2-choice .select2-arrow{border-right: none;}.select2-dropdown-open .select2-choice .select2-arrow b{background-position: -18px 1px;}html[dir="rtl"] .select2-dropdown-open .select2-choice .select2-arrow b{background-position: -16px 1px;}.select2-hidden-accessible{border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}.select2-results{max-height: 200px; padding: 0 0 0 4px; margin: 4px 4px 4px 0; position: relative; overflow-x: hidden; overflow-y: auto; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}html[dir="rtl"] .select2-results{padding: 0 4px 0 0; margin: 4px 0 4px 4px;}.select2-results ul.select2-result-sub{margin: 0; padding-left: 0;}.select2-results li{list-style: none; display: list-item; background-image: none;}.select2-results li.select2-result-with-children > .select2-result-label{font-weight: bold;}.select2-results .select2-result-label{padding: 3px 7px 4px; margin: 0; cursor: pointer; min-height: 1em; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}.select2-results-dept-1 .select2-result-label{padding-left: 20px}.select2-results-dept-2 .select2-result-label{padding-left: 40px}.select2-results-dept-3 .select2-result-label{padding-left: 60px}.select2-results-dept-4 .select2-result-label{padding-left: 80px}.select2-results-dept-5 .select2-result-label{padding-left: 100px}.select2-results-dept-6 .select2-result-label{padding-left: 110px}.select2-results-dept-7 .select2-result-label{padding-left: 120px}.select2-results .select2-highlighted{background: #3875d7; color: #fff;}.select2-results li em{background: #feffde; font-style: normal;}.select2-results .select2-highlighted em{background: transparent;}.select2-results .select2-highlighted ul{background: #fff; color: #000;}.select2-results .select2-no-results, .select2-results .select2-searching, .select2-results .select2-ajax-error, .select2-results .select2-selection-limit{background: #f4f4f4; display: list-item; padding-left: 5px;}.select2-results .select2-disabled.select2-highlighted{color: #666; background: #f4f4f4; display: list-item; cursor: default;}.select2-results .select2-disabled{background: #f4f4f4; display: list-item; cursor: default;}.select2-results .select2-selected{display: none;}.select2-more-results.select2-active{background: #f4f4f4 url('/web/static/lib/select2/select2-spinner.gif') no-repeat 100%;}.select2-results .select2-ajax-error{background: rgba(255, 50, 50, .2);}.select2-more-results{background: #f4f4f4; display: list-item;}.select2-container.select2-container-disabled .select2-choice{background-color: #f4f4f4; background-image: none; border: 1px solid #ddd; cursor: default;}.select2-container.select2-container-disabled .select2-choice .select2-arrow{background-color: #f4f4f4; background-image: none; border-left: 0;}.select2-container.select2-container-disabled .select2-choice abbr{display: none;}.select2-container-multi .select2-choices{height: auto !important; height: 1%; margin: 0; padding: 0 5px 0 0; position: relative; border: 1px solid #aaa; cursor: text; overflow: hidden; background-color: #fff; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eee), color-stop(15%, #fff)); background-image: -webkit-linear-gradient(top, #eee 1%, #fff 15%); background-image: -moz-linear-gradient(top, #eee 1%, #fff 15%); background-image: linear-gradient(to bottom, #eee 1%, #fff 15%);}html[dir="rtl"] .select2-container-multi .select2-choices{padding: 0 0 0 5px;}.select2-locked{padding: 3px 5px 3px 5px !important;}.select2-container-multi .select2-choices{min-height: 26px;}.select2-container-multi.select2-container-active .select2-choices{border: 1px solid #5897fb; outline: none; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .3); box-shadow: 0 0 5px rgba(0, 0, 0, .3);}.select2-container-multi .select2-choices li{float: left; list-style: none;}html[dir="rtl"] .select2-container-multi .select2-choices li{float: right;}.select2-container-multi .select2-choices .select2-search-field{margin: 0; padding: 0; white-space: nowrap;}.select2-container-multi .select2-choices .select2-search-field input{padding: 5px; margin: 1px 0; font-family: sans-serif; font-size: 100%; color: #666; outline: 0; border: 0; -webkit-box-shadow: none; box-shadow: none; background: transparent !important;}.select2-container-multi .select2-choices .select2-search-field input.select2-active{background: #fff url('/web/static/lib/select2/select2-spinner.gif') no-repeat 100% !important;}.select2-default{color: #999 !important;}.select2-container-multi .select2-choices .select2-search-choice{padding: 3px 5px 3px 18px; margin: 3px 0 3px 5px; position: relative; line-height: 13px; color: #333; cursor: default; border: 1px solid #aaaaaa; border-radius: 3px; -webkit-box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05); box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05); background-clip: padding-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: #e4e4e4; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#f4f4f4', GradientType=0); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eee)); background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); background-image: linear-gradient(to bottom, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);}html[dir="rtl"] .select2-container-multi .select2-choices .select2-search-choice{margin: 3px 5px 3px 0; padding: 3px 18px 3px 5px;}.select2-container-multi .select2-choices .select2-search-choice .select2-chosen{cursor: default;}.select2-container-multi .select2-choices .select2-search-choice-focus{background: #d4d4d4;}.select2-search-choice-close{display: block; width: 12px; height: 13px; position: absolute; right: 3px; top: 4px; font-size: 1px; outline: none; background: url('/web/static/lib/select2/select2.png') right top no-repeat;}html[dir="rtl"] .select2-search-choice-close{right: auto; left: 3px;}.select2-container-multi .select2-search-choice-close{left: 3px;}html[dir="rtl"] .select2-container-multi .select2-search-choice-close{left: auto; right: 2px;}.select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover{background-position: right -11px;}.select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close{background-position: right -11px;}.select2-container-multi.select2-container-disabled .select2-choices{background-color: #f4f4f4; background-image: none; border: 1px solid #ddd; cursor: default;}.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice{padding: 3px 5px 3px 5px; border: 1px solid #ddd; background-image: none; background-color: #f4f4f4;}.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close{display: none; background: none;}.select2-result-selectable .select2-match, .select2-result-unselectable .select2-match{text-decoration: underline;}.select2-offscreen, .select2-offscreen:focus{clip: rect(0 0 0 0) !important; width: 1px !important; height: 1px !important; border: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; position: absolute !important; outline: 0 !important; left: 0px !important; top: 0px !important;}.select2-display-none{display: none;}.select2-measure-scrollbar{position: absolute; top: -10000px; left: -10000px; width: 100px; height: 100px; overflow: scroll;}@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 2dppx){.select2-search input, .select2-search-choice-close, .select2-container .select2-choice abbr, .select2-container .select2-choice .select2-arrow b{background-image: url('/web/static/lib/select2/select2x2.png') !important; background-repeat: no-repeat !important; background-size: 60px 40px !important;}.select2-search input{background-position: 100% -21px !important;}}

/* /web/static/lib/select2-bootstrap-css/select2-bootstrap.css */
 .form-control .select2-choice{border: 0; border-radius: 2px;}.form-control .select2-choice .select2-arrow{border-radius: 0 2px 2px 0;}.form-control.select2-container{height: auto !important; padding: 0;}.form-control.select2-container.select2-dropdown-open{border-color: #5897FB; border-radius: 3px 3px 0 0;}.form-control .select2-container.select2-dropdown-open .select2-choices{border-radius: 3px 3px 0 0;}.form-control.select2-container .select2-choices{border: 0 !important; border-radius: 3px;}.control-group.warning .select2-container .select2-choice, .control-group.warning .select2-container .select2-choices, .control-group.warning .select2-container-active .select2-choice, .control-group.warning .select2-container-active .select2-choices, .control-group.warning .select2-dropdown-open.select2-drop-above .select2-choice, .control-group.warning .select2-dropdown-open.select2-drop-above .select2-choices, .control-group.warning .select2-container-multi.select2-container-active .select2-choices{border: 1px solid #C09853 !important;}.control-group.warning .select2-container .select2-choice div{border-left: 1px solid #C09853 !important; background: #FCF8E3 !important;}.control-group.error .select2-container .select2-choice, .control-group.error .select2-container .select2-choices, .control-group.error .select2-container-active .select2-choice, .control-group.error .select2-container-active .select2-choices, .control-group.error .select2-dropdown-open.select2-drop-above .select2-choice, .control-group.error .select2-dropdown-open.select2-drop-above .select2-choices, .control-group.error .select2-container-multi.select2-container-active .select2-choices{border: 1px solid #B94A48 !important;}.control-group.error .select2-container .select2-choice div{border-left: 1px solid #B94A48 !important; background: #F2DEDE !important;}.control-group.info .select2-container .select2-choice, .control-group.info .select2-container .select2-choices, .control-group.info .select2-container-active .select2-choice, .control-group.info .select2-container-active .select2-choices, .control-group.info .select2-dropdown-open.select2-drop-above .select2-choice, .control-group.info .select2-dropdown-open.select2-drop-above .select2-choices, .control-group.info .select2-container-multi.select2-container-active .select2-choices{border: 1px solid #3A87AD !important;}.control-group.info .select2-container .select2-choice div{border-left: 1px solid #3A87AD !important; background: #D9EDF7 !important;}.control-group.success .select2-container .select2-choice, .control-group.success .select2-container .select2-choices, .control-group.success .select2-container-active .select2-choice, .control-group.success .select2-container-active .select2-choices, .control-group.success .select2-dropdown-open.select2-drop-above .select2-choice, .control-group.success .select2-dropdown-open.select2-drop-above .select2-choices, .control-group.success .select2-container-multi.select2-container-active .select2-choices{border: 1px solid #468847 !important;}.control-group.success .select2-container .select2-choice div{border-left: 1px solid #468847 !important; background: #DFF0D8 !important;}

/* /web/static/src/webclient/navbar/navbar.scss */
 // = Main Navbar // ============================================================================ .o_main_navbar{@include print-variable(o-navbar-height, $o-navbar-height); --Dropdown_menu-margin-y: 0; display: flex; height: var(--o-navbar-height); min-width: min-content; padding-top: $o-navbar-padding-v; padding-bottom: $o-navbar-padding-v; border-bottom: $o-navbar-border-bottom; background: $o-navbar-background; font-size: $o-navbar-font-size; // = Reset browsers defaults // -------------------------------------------------------------------------- > ul{padding: 0; margin: 0; list-style: none;}// = General components & behaviours // -------------------------------------------------------------------------- .o_nav_entry, .dropdown-toggle{@extend %-main-navbar-entry-base; @extend %-main-navbar-entry-spacing; border-color: transparent;}.o_menu_sections{.o_nav_entry, .dropdown-toggle{background: var(--NavBar-entry-backgroundColor, #{$o-navbar-background}); border: $border-width solid transparent; &:hover{background: var(--NavBar-entry-backgroundColor--hover, #{$o-navbar-entry-bg--hover});}&:focus{background: var(--NavBar-entry-backgroundColor--focus, #{$o-navbar-entry-bg--hover});}&:active{background: var(--NavBar-entry-backgroundColor--active, #{$o-navbar-entry-bg--active});}}.dropdown.show > .dropdown-toggle{border-color: var(--NavBar-entry-borderColor-active, transparent); background: var(--NavBar-entry-backgroundColor--active, #{$o-navbar-entry-bg--active}); color: var(--NavBar-entry-color--active, #{$o-navbar-entry-color--active});}}.dropdown-menu{border-top: $o-navbar-dropdown-menu-border-top; border-radius: $o-navbar-dropdown-menu-border-radius; .disabled{cursor: default;}}.dropdown-header.dropdown-menu_group{margin-top: 0;}.dropdown-item + .dropdown-header:not(.o_more_dropdown_section_group){margin-top: .3em;}.o_dropdown_menu_group_entry.dropdown-item{padding-left: $o-dropdown-hpadding * 1.5; + .dropdown-item:not(.o_dropdown_menu_group_entry){margin-top: .8em;}}// = Navbar Sections & Children // -------------------------------------------------------------------------- .o_navbar_apps_menu .dropdown-toggle{--NavBar-entry-padding-left: #{$o-horizontal-padding}; @extend %-main-navbar-entry-base; font-size: $o-navbar-brand-font-size;}.o_menu_brand{@extend %-main-navbar-entry-base; @extend %-main-navbar-entry-spacing; padding-left: 0; font-size: $o-navbar-brand-font-size; color: var(--NavBar-brand-color, #{$o-navbar-brand-color}); &:hover{background: none;}}.o_menu_sections{.o_more_dropdown_section_group{margin-top: .8em; &:first-child{margin-top: $dropdown-padding-y * -1; padding-top: $dropdown-padding-y * 1.5;}}}.o_menu_systray{--NavBar-entry-padding-left: #{$o-navbar-entry-padding-h * 0.5}; --NavBar-entry-padding-right: #{$o-navbar-entry-padding-h * 0.5}; .badge{margin-right: -.5em; border: 0; padding: ($o-navbar-badge-padding * .5) $o-navbar-badge-padding; background-color: var(--o-navbar-badge-bg, #{$o-navbar-badge-bg}); font-size: $o-navbar-badge-size; color: var(--o-navbar-badge-color, $o-navbar-badge-color); text-shadow: var(--o-navbar-badge-text-shadow, #{$o-navbar-badge-text-shadow}); transform: translate(-0.6em, -30%);}}}// = SuperUser Design // ============================================================================ body.o_is_superuser .o_menu_systray{border-image: repeating-linear-gradient(135deg, #d9b904, #d9b904 10px, #373435 10px, #373435 20px) 2; border-image-width: map-get($border-widths, 2);}

/* /web/static/src/scss/animation.scss */
 // 'bounce' effect @keyframes bounceIn{0%, 20%, 40%, 60%, 80%, 100%{transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);}0%{opacity: 0; transform: scale3d(.3, .3, .3);}20%{transform: scale3d(1.1, 1.1, 1.1);}40%{transform: scale3d(.9, .9, .9);}60%{opacity: 1; transform: scale3d(1.03, 1.03, 1.03);}80%{transform: scale3d(.97, .97, .97);}100%{opacity: 1; transform: scale3d(1, 1, 1);}}@keyframes flash{from, 50%, to{opacity: 1;}25%, 75%{opacity: 0;}}

/* /web/static/src/scss/base_frontend.scss */
// Frontend general html, body, #wrapwrap{width: 100%; height: 100%;}#wrapwrap{// The z-index is useful to prevent that children with a negative z-index // go behind the wrapwrap (we create a new stacking context). z-index: 0; position: relative; display: flex; flex-flow: column nowrap; > *{flex: 0 0 auto;}> main{flex: 1 0 auto;}}.modal-open #wrapwrap{overflow: hidden;}// TODO: This whole block can be removed once the scroll bar is moved back from // the #wrapwrap to the body. The fact the scroll bar is on the #wrapwrap // prevent browser to print more than what is above the fold. This block // is moving the scroll to the body when printing the page. @media screen{html, body{overflow: hidden;}#wrapwrap{// ... we delegate the scroll to that top element instead of the window/body // This is at least needed for the edit mode to not have a double scrollbar // due to the right editor panel (and since we want to minimize the style // difference between edit mode and non-edit mode (wysiwyg)...). overflow: auto;}}

/* /web/static/src/scss/fontawesome_overridden.scss */
// This is a patch of the font awesome library to add TikTok & Twitter icons. @font-face{font-family: 'FontAwesome-tiktok-only'; src: url('/web/static/src/scss/../../fonts/tiktok_only.woff'); font-weight: normal; font-style: normal; font-display: block;}@font-face{font-family: 'FontAwesome-twitter-x-only'; src: url('/web/static/src/scss/../../fonts/twitter_x_only.woff'); font-weight: normal; font-style: normal; font-display: block;}.fa.fa-tiktok{font-family: 'FontAwesome-tiktok-only' !important; &:before{content: '\e07b';}}// Don't write `.fa.fa-twitter` or this will be considered like a new icon in // the media dialog. The css here is just about overriding the existing twitter // icon and should not be considered as a new icon, otherwise those icons will // be shown twice in the media dialog. Grep: `iconsParser` and `fontIcons`. .fa-twitter.fa{font-family: 'FontAwesome-twitter-x-only' !important; &:before{content: '\e800';}}.fa-twitter-square.fa{font-family: 'FontAwesome-twitter-x-only' !important; &:before{content: '\e803';}}%rtl-transform{transform: rotate(180deg);}// Define a list variable to store all the classes that need transformation $rtl-fa-classes: ( 'fa-align-right', 'fa-align-left', 'fa-chevron-right', 'fa-chevron-left', 'fa-arrow-right', 'fa-arrow-left', 'fa-hand-o-right', 'fa-hand-o-left', 'fa-arrow-circle-right', 'fa-arrow-circle-left', 'fa-caret-right', 'fa-caret-left', 'fa-rotate-right', 'fa-rotate-left', 'fa-angle-double-right', 'fa-angle-double-left', 'fa-angle-right', 'fa-angle-left', 'fa-quote-right', 'fa-quote-left', 'fa-chevron-circle-right', 'fa-chevron-circle-left', 'fa-long-arrow-right', 'fa-long-arrow-left', 'fa-toggle-right', 'fa-toggle-left', 'fa-caret-square-o-right', 'fa-arrow-circle-o-left', 'fa-arrow-circle-o-right', 'fa-caret-square-o-left' ); // This is rtl language specific fix // It will override the font awesome symbols and flip them 180 degree @each $class in $rtl-fa-classes{.o_rtl .fa.#{$class}{@extend %rtl-transform;}}

/* /web/static/src/scss/mimetypes.scss */
.o_image{display: inline-block; width: 38px; height: 38px; background-image: url('/web/static/img/mimetypes/unknown.svg'); background-size: contain; background-repeat: no-repeat; background-position: center; &[data-mimetype^='image']{background-image: url('/web/static/img/mimetypes/image.svg');}&[data-mimetype^='audio']{background-image: url('/web/static/img/mimetypes/audio.svg');}&[data-mimetype^='text'], &[data-mimetype$='rtf']{background-image: url('/web/static/img/mimetypes/text.svg');}&[data-mimetype*='octet-stream'], &[data-mimetype*='download'], &[data-mimetype*='python']{background-image: url('/web/static/img/mimetypes/binary.svg');}&[data-mimetype^='video'], &[title$='.mp4'], &[title$='.avi']{background-image: url('/web/static/img/mimetypes/video.svg');}&[data-mimetype$='archive'], &[data-mimetype$='compressed'], &[data-mimetype*='zip'], &[data-mimetype$='tar'], &[data-mimetype*='package']{background-image: url('/web/static/img/mimetypes/archive.svg');}&[data-mimetype='application/pdf']{background-image: url('/web/static/img/mimetypes/pdf.svg');}&[data-mimetype^='text-master'], &[data-mimetype*='document'], &[data-mimetype*='msword'], &[data-mimetype*='wordprocessing']{background-image: url('/web/static/img/mimetypes/document.svg');}&[data-mimetype*='application/xml'], &[data-mimetype$='html']{background-image: url('/web/static/img/mimetypes/web_code.svg');}&[data-mimetype$='css'], &[data-mimetype$='less'], &[data-ext$='less']{background-image: url('/web/static/img/mimetypes/web_style.svg');}&[data-mimetype*='-image'], &[data-mimetype*='diskimage'], &[data-ext$='dmg']{background-image: url('/web/static/img/mimetypes/disk.svg');}&[data-mimetype$='csv'], &[data-mimetype*='vc'], &[data-mimetype*='excel'], &[data-mimetype$='numbers'], &[data-mimetype$='calc'], &[data-mimetype*='mods'], &[data-mimetype*='spreadsheet']{background-image: url('/web/static/img/mimetypes/spreadsheet.svg');}&[data-mimetype^='key']{background-image: url('/web/static/img/mimetypes/certificate.svg');}&[data-mimetype*='presentation'], &[data-mimetype*='keynote'], &[data-mimetype*='teacher'], &[data-mimetype*='slideshow'], &[data-mimetype*='powerpoint']{background-image: url('/web/static/img/mimetypes/presentation.svg');}&[data-mimetype*='cert'], &[data-mimetype*='rules'], &[data-mimetype*='pkcs'], &[data-mimetype$='stl'], &[data-mimetype$='crl']{background-image: url('/web/static/img/mimetypes/certificate.svg');}&[data-mimetype*='-font'], &[data-mimetype*='font-'], &[data-ext$='ttf']{background-image: url('/web/static/img/mimetypes/font.svg');}&[data-mimetype*='-dvi']{background-image: url('/web/static/img/mimetypes/print.svg');}&[data-mimetype*='script'], &[data-mimetype*='x-sh'], &[data-ext*='bat'], &[data-mimetype$='bat'], &[data-mimetype$='cgi'], &[data-mimetype$='-c'], &[data-mimetype*='java'], &[data-mimetype*='ruby']{background-image: url('/web/static/img/mimetypes/script.svg');}&[data-mimetype*='javascript']{background-image: url('/web/static/img/mimetypes/javascript.svg');}&[data-mimetype*='calendar'], &[data-mimetype$='ldif']{background-image: url('/web/static/img/mimetypes/calendar.svg');}&[data-mimetype$='postscript'], &[data-mimetype$='cdr'], &[data-mimetype$='xara'], &[data-mimetype$='cgm'], &[data-mimetype$='graphics'], &[data-mimetype$='draw'], &[data-mimetype*='svg']{background-image: url('/web/static/img/mimetypes/vector.svg');}}

/* /web/static/src/scss/ui.scss */
:root .o_hidden{// Add `:root` as parent selector to increase '.o_hidden' hierarchy. // The aim is to ensure that it overrides any bootstrap default layout // class (eg. d-flex). // TODO: After migrating to BTS5 review how layout/visibility classes // interfere with each other. display: none!important;}.o_disabled{pointer-events: none; opacity: $o-opacity-disabled;}.o_text_overflow{@include o-text-overflow;}.dropdown-menu{max-height: $o-dropdown-max-height; overflow: auto; background-clip: border-box;}.dropdown-toggle{white-space: nowrap; &.o-no-caret{&::before, &::after{content: normal;}}}.o_catch_attention{position: relative; z-index: 1; animation: catchAttention 200ms ease 0s infinite normal;}// ---------------------------------------------------------------------------- // Render a "tree-view" design on a set of vertical elements // @param{number}--treeEntry-padding-h - Entry's horizzontal padding. // @param{number}--treeEntry-padding-v - Entry's vertical padding. // @param{number}--treeEntry--before-top - Vertical-line top position. // @param{string}--treeEntry--after-display - Horizzontal-line display mode. // @param{color}--treeEntry--beforeAfter-color - Lines color // @param{color}--treeEntry--beforeAfter-left - Lines left position // ---------------------------------------------------------------------------- .o_treeEntry{$-padding-h: var(--treeEntry-padding-h, #{map-get($spacers, 4)}); $-padding-v: var(--treeEntry-padding-v, #{map-get($spacers, 2)}); padding-left: $-padding-h; position: relative; &:before, &:after{position: absolute; left: var(--treeEntry--beforeAfter-left, calc(#{$-padding-h}* .5)); background: var(--treeEntry--beforeAfter-color, #{$border-color}); content: '';}&:before{top: var(--treeEntry--before-top, 0); width: 1px; height: 100%;}&:after{display: var(--treeEntry--after-display, initial); top: calc(.5em + #{$-padding-v}); width: calc(#{$-padding-h}* .5); height: 1px;}&:last-of-type:before{height: calc(.5em + #{$-padding-v});}}// bounce effect @keyframes catchAttention{0%, 20%, 40%, 60%, 80%, 100%{transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);}0%{transform: translateY(-30%);}20%{transform: translateY(-25%);}40%{transform: translateY(-20%);}60%{transform: translateY(-15%);}80%{transform: translateY(-10%);}100%{transform: translateY(-5%);}}span.o_force_ltr{display: inline;}.o_force_ltr{unicode-bidi: embed; // ensure element has level of embedding for direction direction: ltr;}// To fill the available space while keeping aspect ratio (crop). // Assuming the important part of the image is its center. .o_object_fit_cover{object-fit: cover;}.o_object_fit_contain{object-fit: contain;}.o_image_24_cover{width: 24px; height: 24px; object-fit: cover;}.o_image_40_cover{width: 40px; height: 40px; object-fit: cover;}.o_image_64_cover{width: 64px; height: 64px; object-fit: cover;}// Keep ratio but avoid cropping (so part of the background becomes visible). .o_image_64_contain{width: 64px; height: 64px; object-fit: contain;}// When having a square is not necessary, the image will take less space if any // of its width or height is smaller than 64px. .o_image_64_max{max-width: 64px; max-height: 64px;}

/* /web/static/src/views/fields/translation_dialog.scss */
// translation dialog .o_translation_dialog{.o_language_current{font-weight: bold;}.row{margin-bottom: 9px;}}

/* /web/static/src/views/fields/signature/signature_field.scss */
.o_field_widget{.o_signature{outline: 1px solid rgba(map-get($theme-colors, 'secondary'), 0.3); position: relative; &.o_signature_empty{display: flex;}> p{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}}}.o_field_invalid{.o_signature{outline: 3px solid map-get($theme-colors, 'danger'); cursor: pointer;}}.o_form_editable{.o_signature:hover{outline: 3px solid $o-enterprise-action-color; cursor: pointer;}}

/* /web/static/src/legacy/scss/ui.scss */
.ui-autocomplete{z-index: $zindex-modal + 1; max-width: 600px; .ui-menu-item > a{display: block;}}// This is rtl language specific fix // It will fix the extra space in ui-autocomplete class // and flip the next and previous symbols of jquery ui. .o_rtl{.ui-autocomplete{direction: ltr; right: 0; left: auto;}}

/* /web/static/src/legacy/scss/modal.scss */
.modal.o_technical_modal{.modal-content{.modal-header .o_subtitle{margin-left: 10px;}}@include media-breakpoint-down(sm){&.o_modal_full .modal-dialog .modal-content .modal-header .o_subtitle{color: $o-navbar-entry-color;}}}

/* /web/static/src/legacy/scss/lazyloader.scss */
// TODO remove this file in master 

/* /web/static/src/core/utils/transitions.scss */
 @mixin owl-fade($time, $name){.#{$name}_fade{transition: all $time;}.#{$name}_fade-enter{opacity: 0;}}

/* /web/static/src/core/action_swiper/action_swiper.scss */
.o_actionswiper{position: relative; touch-action: pan-y;}.o_actionswiper_target_container{transition: transform 0.4s;}.o_actionswiper_swiping{transition: none;}.o_actionswiper_right_swipe_area{transform: translateX(-100%); inset: 0 auto auto 0;}.o_actionswiper_left_swipe_area{transform: translateX(100%); inset: 0 0 auto auto;}

/* /web/static/src/core/autocomplete/autocomplete.scss */
 .o-autocomplete{.o-autocomplete--input{width: 100%;}}

/* /web/static/src/core/avatar/avatar.scss */
// Avatar .o_avatar img, .o_avatar .o_avatar_empty, img.o_avatar{height: var(--Avatar-size, #{$o-avatar-size}); aspect-ratio: 1; object-fit: cover;}.o_avatar_empty{background: $o-black; opacity: .1;}

/* /web/static/src/core/checkbox/checkbox.scss */
.o-checkbox{width: fit-content;}

/* /web/static/src/core/colorlist/colorlist.scss */
.o_colorlist{button{border: 1px solid $dropdown-bg; box-shadow: 0 0 0 1px $gray-500; width: 22px; height: 17px;}.o_colorlist_selected{box-shadow: 0 0 0 2px $o-brand-odoo !important;}}// Set all the colors but the "no-color" one @for $size from 2 through length($o-colors){.o_colorlist_item_color_#{$size - 1}{$-bg: adjust-color(nth($o-colors, $size), $lightness: 25%, $saturation: 15%); $-color: adjust-color(nth($o-colors, $size), $lightness: -40%, $saturation: -15%); @include o-print-color($-bg, background-color, bg-opacity); @include o-print-color($-color, color, text-opacity);}}// Set the "no-color", a red bar on white background .o_colorlist_item_color_0{background: linear-gradient(45deg, rgba($dropdown-bg, 0) 0%, rgba($dropdown-bg, 0) 48%, $danger 48%, $danger 52%, rgba($dropdown-bg, 0) 52%, rgba($dropdown-bg, 0) 100%);}

/* /web/static/src/core/colorpicker/colorpicker.scss */
// COLOR PICKER .o_colorpicker_widget{.o_color_pick_area{height: 125px; background-image: linear-gradient(to bottom, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%, hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%), linear-gradient(to right, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%); cursor: crosshair;}.o_color_slider{background: linear-gradient(#F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%, #00F 66.66%, #F0F 83.33%, #F00 100%);}.o_opacity_slider, .o_color_preview{@extend %o-preview-alpha-background;}.o_color_slider, .o_opacity_slider{width: 4%; margin-right: 2%; cursor: pointer;}.o_slider_pointer, .o_opacity_pointer{@include o-position-absolute($left: -50%); width: 200%; height: 8px; margin-top: -2px;}.o_slider_pointer, .o_opacity_pointer, .o_picker_pointer, .o_color_preview{box-shadow: inset 0 0 0 1px rgba(white, 0.9); border: 1px solid black;}.o_color_picker_inputs{font-size: 10px; input{font-family: monospace !important; // FIXME: the monospace font used in the editor has not consistent ch units on Firefox height: 18px; font-size: 11px;}.o_hex_div input{width: 7ch;}.o_rgba_div input{margin-right: 3px; width: 3ch;}}}

/* /web/static/src/core/datetime/datetime_picker.scss */
.o_datetime_picker{--DateTimePicker__Cell-size-md: 3rem; --DateTimePicker__Cell-size-lg: 5rem; --DateTimePicker__Template-rows: 3; --DateTimePicker__Template-columns: 4; --DateTimePicker__Day-template-rows: 6; // Header .o_datetime_picker_header .o_header_part{text-transform: none;}// Day .o_date_item_cell{position: relative; border-radius: 0;}.o_current, .o_selected{color: $o-component-active-color;}.o_selected:not(.o_select_start):not(.o_select_end){background: $o-component-active-bg;}.o_current, .o_highlight_start:not(.o_selected), .o_highlight_end:not(.o_selected), .o_select_start, .o_select_end{&:before{content: ""; position: absolute; box-shadow: inset 0 0 0 1px $o-component-active-border; width: 100%; aspect-ratio: 1; border-radius: 100%; z-index: 1;}}.o_select_start, .o_select_end{&:before{background: mix(lighten($o-component-active-border, 10%), $o-component-active-bg, 15%);}&:after{content: ""; position: absolute; background: transparent; width: 50%; aspect-ratio: 1/2;}&:not(.o_select_end):after{right: 0; background: $o-component-active-bg;}&:not(.o_select_start):after{right: 50%; background: $o-component-active-bg;}}.o_today:not(.o_out_of_range) span{position: relative; &::after{content: ""; position: absolute; left: 50%; bottom: $spacer * -0.25; transform: translateX(-50%); width: 0.95em; height: 0.2em; border-radius: $border-radius-pill; background: $danger;}}.o_out_of_range{color: var(--gray-400);}.o_time_picker_select{background: none; &:focus, &:hover{border-color: var(--primary);}}// Grids .o_date_picker{grid-template-rows: repeat(var(--DateTimePicker__Day-template-rows), 1fr); grid-template-columns: repeat(var(--DateTimePicker__Day-template-columns), 1fr);}.o_date_item_picker{grid-template-rows: repeat(var(--DateTimePicker__Template-rows), 1fr); grid-template-columns: repeat(var(--DateTimePicker__Template-columns), 1fr);}// Utilities .o_date_item_picker .o_datetime_button{&.o_selected, &:hover, &.o_today:not(.o_selected):hover{&:not(.o_select_start):not(.o_select_end){background: $o-component-active-bg; color: $o-component-active-color;}}}.o_center{display: grid; place-items: center;}// Compute spacing between the two month by compensating buttons size and tables gap .o_zoom_out{gap: o-to-rem($btn-border-width * 4) + o-to-rem($o-font-size-base) * 2 + $input-btn-padding-x * 4;}.o_cell_md{aspect-ratio: 1; @include media-breakpoint-up(md){padding: 0.4rem; width: var(--DateTimePicker__Cell-size-md); height: var(--DateTimePicker__Cell-size-md);}}.o_cell_lg{width: var(--DateTimePicker__Cell-size-lg); height: var(--DateTimePicker__Cell-size-lg);}.o_text_sm{font-size: 0.875rem;}.o_time_picker{direction: ltr;}}

/* /web/static/src/core/debug/debug_menu.scss */
.o_dialog{.o_debug_manager .dropdown-toggle{padding: 0 4px; margin: 2px 10px 2px 0;}}

/* /web/static/src/core/debug/profiling/profiling_item.scss */
.o_debug_manager{.dropdown-menu .o_debug_profiling_item_wrapper.dropdown-item.focus{background: inherit;}.o_debug_profiling_item{cursor: auto;}.form-switch{cursor: pointer;}}.o_debug_recording{animation: 2s flash infinite;}

/* /web/static/src/core/debug/profiling/profiling_qweb.scss */
.o_form_view .o_ace_view_editor{background: transparent;}.o_profiling_qweb_view{user-select: none; .o_select_view_profiling{margin-bottom: 10px; .dropdown-menu{overflow: auto; max-height: 240px;}a{margin: 3px 0; display: block; .o_delay, .o_query{font-size: 0.8em; display: inline-block; color: $body-color; text-align: right; width: 50px; margin-right: 10px; white-space: nowrap;}.o_key{display: inline-block; margin-left: 10px; font-size: 0.8em;}}}.ace_editor{overflow: visible; .ace_qweb, .ace_tag-name{cursor: default; pointer-events: all; position: relative; .o_info{display: none; left: 8px; top: 14px; width: 100px; .o_delay span, .o_query span{text-align: left; display: inline-block; width: 40px;}}&:hover .o_info{display: block; &:hover{display: none;}}}.ace_gutter{overflow: visible;}.ace_gutter-layer{width: 134px !important; overflow: visible;}.ace_gutter-cell .o_info{display: block; float: left; font-size: 0.8em; white-space: nowrap; .o_more{float: left; position: relative; span{color: orange !important; cursor: default; margin-left: -12px;}.o_detail{left: 30px; top: -30px; min-width: 120px; display: none; th{text-align: center;}td{min-width: 60px; vertical-align: top; text-align: left;}tr td:first-child{padding-right: 10px; white-space: nowrap;}tr th:last-child, tr td:last-child{padding-left: 10px;}}&:hover > .o_detail{display: block; &:hover{display: none;}}}.o_delay, .o_query{display: block; float: left; margin-right: 10px; width: 30px;}}.ace_line{border-bottom: 1px #dddddd dotted;}.ace_scrollbar-h{z-index: 3;}.o_detail{position: absolute; z-index: 1; background: #ffedcb; color: orange !important; border: 1px orange solid; padding: 6px; white-space: normal; text-align: right;}}}

/* /web/static/src/core/dialog/dialog.scss */
.modal.o_technical_modal{.modal-content{.modal-header .modal-title{overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}}.modal-footer{text-align: left; // FIXME: These selectors should not be necessary if we used buttons // as direct children of the modal-footer as normally required footer, .o_form_buttons_edit, .o_form_buttons_view{display: flex; flex-wrap: wrap; flex: 1 1 auto; justify-content: flex-start; gap: map-get($spacers, 1); @include media-breakpoint-down(md){justify-content: space-around;}}button{margin: 0; // Reset boostrap.}@include media-breakpoint-down(md){.btn{width: 45%; text-overflow: ellipsis; white-space: inherit;}}}@include media-breakpoint-down(sm){&.o_modal_full{.modal-dialog{margin: 0px; height: 100%; .modal-content{height: 100%; border: none; .modal-header{background: $o-navbar-background; .modal-title, .btn{color: $o-navbar-entry-color;}}.modal-body{height: 100%; overflow-y: auto;}}}}}}.modal.o_inactive_modal{z-index: $zindex-modal-backdrop - 1;}.o_dialog > .modal{display: block;}@include media-breakpoint-up(sm){.modal-fs{width: calc(100% - #{2 * $modal-dialog-margin-y-sm-up}); max-width: none;}}@include media-breakpoint-down(md){.modal{&.o_modal_full .modal-content{.modal-header{align-items: center; height: $o-navbar-height; padding: 0 1rem;}.modal-footer{@include o-webclient-padding($top: 1rem, $bottom: 0.5rem); box-shadow: 0 1rem 2rem black; z-index: 0;}}}}

/* /web/static/src/core/dropdown/accordion_item.scss */
.o_accordion_toggle{@include caret(); &.open{@include caret('up');}&::after{@include o-position-absolute($top: 0, $right: 0); transform: translate(-0.6em, 0.8em) ;}}

/* /web/static/src/core/dropdown/dropdown.scss */
// = New Owl Dropdown specific rules // ----------------------------------------------------------------------------- .o-dropdown{&--menu{// Makes sure the dropdown menus are already in a // fixed position before the positioning computations begin. position: fixed; margin-top: var(--Dropdown_menu-margin-y, #{map-get($spacers, 1)}); margin-bottom: var(--Dropdown_menu-margin-y, #{map-get($spacers, 1)}); &.o-dropdown--menu-submenu{--Dropdown_menu-margin-y: 0;}.dropdown-toggle:focus, .dropdown-item:focus{background-color: transparent; outline: none;}.dropdown-toggle.focus, .dropdown-item.focus{background-color: $dropdown-link-hover-bg;}.dropdown-item:not(.disabled):not(:disabled){// Needed 'cause <DropdownItem> generate <span> html tags that for // browsers are normally not clickable. &, label{cursor: pointer;}}// Correctly align sub dropdowns items with its parent's .o-dropdown > .o-dropdown--menu{// the value comes from bootstrap's ".dropdown-menu" padding and border style --o-dropdown--submenu-margin: calc(-.5rem - 1px); margin-top: var(--o-dropdown--submenu-margin); margin-bottom: var(--o-dropdown--submenu-margin);}}&.dropup > .o-dropdown--menu, &.dropdown > .o-dropdown--menu, &.dropstart > .o-dropdown--menu, &.dropend > .o-dropdown--menu{// Also makes sure that left/right stuffs are not polluted // by bootstrap rules processed by rtlcss left: auto; right: auto; margin-left: 0; margin-right: 0;}&--no-caret{> .dropdown-toggle{&::before, &::after{content: normal;}}}button.dropdown-toggle{&.active, &:hover, &:focus, &:active{outline: none; box-shadow: none !important;}&.dropdown-item{&::after, &::before{// Changes the placement of bootstrap dropdown carets for subdropdowns @include o-position-absolute($right: 0, $top: 0); transform: translate(-.6em, .6em) #{""};}}}}

/* /web/static/src/core/effects/rainbow_man.scss */
.o_reward{$-reward-base-time: 1.4s; will-change: transform; z-index: $zindex-modal; animation: reward-fading $-reward-base-time * 0.5 ease-in-out forwards; .o_reward_box{transform-box: fill-box;}&.o_reward_fading{animation: reward-fading-reverse $-reward-base-time * 0.4 ease-in-out forwards; .o_reward_face_group{animation: reward-jump-reverse $-reward-base-time * 0.4 ease-in-out forwards;}.o_reward_rainbow_line{animation: reward-rainbow-reverse $-reward-base-time * 0.5 ease-out forwards;}}.o_reward_rainbow_man{max-width: 400px;}.o_reward_rainbow_line{animation: reward-rainbow $-reward-base-time * 0.8 ease-out 1 forwards;}.o_reward_face_group{animation: reward-jump $-reward-base-time * 0.8 ease-in-out 1;}.o_reward_face_wrap{animation: reward-rotate $-reward-base-time * 0.8 cubic-bezier(.51,.92,.24,1.15) 1;}.o_reward_face{animation: reward-float $-reward-base-time ease-in-out $-reward-base-time infinite alternate;}.o_reward_star_01, .o_reward_star_03{animation: reward-stars $-reward-base-time ease-in-out infinite alternate-reverse;}.o_reward_star_02, .o_reward_star_04{animation: reward-stars $-reward-base-time * 1.2 ease-in-out infinite alternate;}.o_reward_thumbup{animation: reward-scale $-reward-base-time * 0.5 ease-in-out 0s infinite alternate;}.o_reward_shadow_container{animation: reward-float $-reward-base-time ease-in-out infinite alternate;}.o_reward_shadow{animation: reward-scale $-reward-base-time ease-in-out infinite alternate;}.o_reward_msg_container{aspect-ratio: 1 / 1; animation: reward-float-reverse $-reward-base-time ease-in-out infinite alternate-reverse;}}@keyframes reward-fading{0%{opacity: 0;}}@keyframes reward-fading-reverse{100%{opacity: 0;}}@keyframes reward-jump{0%{transform: scale(0.5);}50%{transform: scale(1.05);}}@keyframes reward-jump-reverse{50%{transform: scale(1.05);}to{transform: scale(0.5);}}@keyframes reward-rainbow{to{stroke-dashoffset: 0;}}@keyframes reward-rainbow-reverse{from{stroke-dashoffset: 0;}}@keyframes reward-float{to{transform: translateY(5px);}}@keyframes reward-float-reverse{from{transform: translateY(5px);}}@keyframes reward-stars{from{transform: scale(0.3) rotate(0deg);}50%{transform: scale(1) rotate(20deg);}to{transform: scale(0.3) rotate(80deg);}}@keyframes reward-scale{from{transform: scale(.8);}}@keyframes reward-rotate{from{transform: scale(.5) rotate(-30deg);}}

/* /web/static/src/core/emoji_picker/emoji_picker.dark.scss */
.o-EmojiPicker{--o-emoji-picker-active: #{$white};}

/* /web/static/src/core/emoji_picker/emoji_picker.scss */
.popover .o-EmojiPicker{width: 285px; height: 350px;}.o-EmojiPicker{--o-emoji-picker-active: #{$gray-200}; .o-active{background-color: var(--o-emoji-picker-active) !important;}.o-Emoji{width: 30px; font-size: 0.8rem; &:hover{background-color: var(--o-emoji-picker-active) !important;}}.o-EmojiPicker-navbar{.o-Emoji{filter: grayscale(1);}}.o-EmojiPicker-sectionIcon{filter: grayscale(1);}.o-EmojiPicker-empty{font-size: 5rem !important; filter: grayscale(0.25);}}.o-EmojiPicker-category:before{// invisible character so that category has constant height, regardless of text content. content: "\200b";}.o-EmojiPicker-search{input{&:not(:focus){& + .oi-search{color: $text-muted;}}}}

/* /web/static/src/core/errors/error_dialog.scss */
.o_error_dialog{@include media-breakpoint-up(md){padding: 1rem; .o_error_detail{overflow: auto; pre{overflow: initial; max-height: 30vh;}}}.modal-header{border: none; padding-bottom: 0; margin-bottom: -1rem; .modal-title{font-size: 1.625rem;}}.modal-footer{border: none; padding-top: 0;}}

/* /web/static/src/core/file_upload/file_upload_progress_bar.scss */
.o-file-upload-progress-bar-value{transition: width 0.1s; border-right: 1px solid darken($o-brand-primary, 7.5%); background-color: $o-brand-primary; opacity: 0.5;}.o-file-upload-progress-bar-abort{padding: 4px; color: #963535; font-size: 16px; &:active{opacity: 0.7;}}div:not(:hover) .o-file-upload-progress-bar-abort{display: none;}

/* /web/static/src/core/file_upload/file_upload_progress_record.scss */
.o_kanban_record{.o_kanban_progress_card{min-height: 80px; .o_kanban_record_bottom{color: $gray-900;}.o_kanban_image_wrapper{opacity: 0.7;}}}.o_data_row.o_list_progress_card{height: 25px; border: 1px solid #dfdfdf; .o_file_upload_upload_title{color: $headings-color; font-size: 13px; font-weight: 500;}}

/* /web/static/src/core/file_viewer/file_viewer.scss */
.o-FileViewer{z-index: -1; outline: none;}.o-FileViewer-navigation{width: 40px; height: 40px;}.o-FileViewer-header{height: $o-navbar-height;}.o-FileViewer-main{z-index: -1; padding: ($o-navbar-height * 1.125) 0;}.o-FileViewer-zoomer{padding: ($o-navbar-height * 1.125) 0;}.o-FileViewer-headerButton:hover{background-color: rgba($white, 0.1); color: lighten($gray-400, 15%);}.o-FileViewer-toolbarButton{background-color: var(--file-viewer-toolbarButton-background-color, #{$o-gray-800}); color: #fff; &:hover{filter: brightness(1.3);}}.o-FileViewer-view{background-color: #000000; box-shadow: 0 0 40px #000000; outline: none; &.o-isText{background: $white;}}

/* /web/static/src/core/install_prompt/install_prompt.scss */
.o_install_prompt{border-radius: 20px; height: unset !important; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); background: rgba($white, .7); inset: 0 auto auto 0 !important; width: fit-content !important; &.o_touch_bounce{animation: none;}@media screen and (max-width: 768px){inset: auto auto 0 0 !important; width: 90% !important; margin: 5% !important; .modal-header{background: none !important; border: none !important; button{color: $black !important;}}}}

/* /web/static/src/core/model_field_selector/model_field_selector.scss */
.o_model_field_selector{position: relative; &.o_edit_mode{cursor: pointer;}> .o_model_field_selector_value{min-height: 20px; // needed when there is no value in it and used standalone max-width: 100%; word-wrap: break-word; &:active, &:focus, &:active:focus{outline: none;}> .o_model_field_selector_chain_part{cursor: inherit; border: 1px solid darken($o-brand-lightsecondary, 10%); background: $o-brand-lightsecondary;}> i{font-size: 10px;}}}

/* /web/static/src/core/model_field_selector/model_field_selector_popover.scss */
.o_popover_field_selector{&.o-popover-top > .popover-arrow::after{border-top-color: #{$o-gray-300};}&.o-popover-bottom > .popover-arrow::after{border-bottom-color: #{$o-gray-300};}}.o_model_field_selector_popover{width: 265px; background-color: $dropdown-bg; --o-input-background-color: #{$dropdown-bg}; &:focus{outline: none;}.o_model_field_selector_popover_header, .o_model_field_selector_popover_footer{color: map-get($theme-colors, 'dark'); background: #{$o-gray-300}; font-weight: bold; padding: 5px 0.4em; .o_model_field_selector_popover_title{width: 100%; @include o-text-overflow; padding: 0px 35px; text-align: center;}.o_model_field_selector_popover_option{@include o-position-absolute($top: 0); padding: 8px; cursor: pointer; &.o_model_field_selector_popover_prev_page{left: 0;}&.o_model_field_selector_popover_close{right: 0;}&:hover{color: darken(map-get($theme-colors, 'dark'), 10%);}}}.o_model_field_selector_popover_body{.o_model_field_selector_popover_page{position: relative; height: 320px; overflow: auto; margin: 0; padding: 0; > .o_model_field_selector_popover_item{list-style: none; cursor: pointer; font-family: Arial; font-size: 13px; border-bottom: 1px solid mix($o-black, $dropdown-link-hover-bg, 8%); &.active button{background: $dropdown-link-hover-bg; border: none;}.o_model_field_selector_popover_item_title{font-size: 12px;}.o_model_field_selector_popover_item_relation{border-radius: 0px; border-left: 1px solid mix($o-black, $dropdown-link-hover-bg, 8%);}}}}}

/* /web/static/src/core/model_selector/model_selector.scss */
.o_model_selector{.o-autocomplete--dropdown-menu{width: 25ch; max-height: 350px !important; .o-autocomplete--dropdown-item a{text-overflow: ellipsis; width: inherit;}}}

/* /web/static/src/core/notebook/notebook.scss */
.o_notebook{--notebook-margin-x: 0; --notebook-padding-x: 0; --notebook-link-border-color: transparent; --notebook-link-border-color-active: #{$border-color}; --notebook-link-border-color-hover: #{$gray-200}; --notebook-link-border-color-active-accent: #{$border-color}; .o_notebook_headers{margin: 0 var(--notebook-margin-x, 0); overflow-x: auto; @include media-breakpoint-down(md){&::-webkit-scrollbar{display: none;}}}.nav{padding: 0 var(--notebook-padding-x, 0); background-color: $o-view-background-color;}.nav-item{white-space: nowrap; margin: 0 -1px 0 0; &.disabled{.nav-link{cursor: not-allowed; opacity: .3;}}}.nav-link{border-color: var(--notebook-link-border-color, transparent); &.active{&, &:hover, &:focus, &:active{border-color: var(--notebook-link-border-color-active); border-top-color: var(--notebook-link-border-color-active-accent, var(--notebook-link-border-color-active)); border-bottom-color: $o-view-background-color;}}&:hover, &:focus, &:active{outline: none;}&:hover{border-color: var(--notebook-link-border-color-hover);}}&.vertical{.o_notebook_headers{overflow-x: visible;}.nav{width: max-content; border-bottom-color: transparent; // removing the width has weird side effect due to the negative margin}.nav-item{margin: 0 0 -1px 0; &:first-child .nav-link{border-top-width: 0;}}.nav-link{margin-bottom: 0; &.active{&, &:hover, &:focus, &:active{border-color: var(--notebook-link-border-color-active); border-left-color: var(--notebook-link-border-color-active-accent, var(--notebook-link-border-color-active)); border-right-color: $o-view-background-color;}}}}@include media-breakpoint-down(lg){.o_notebook_content .oe-toolbar{@include o-position-sticky($top: 0px); margin-left: var(--notebook-margin-x, $o-horizontal-padding); margin-right: var(--notebook-margin-x, $o-horizontal-padding); width: auto;}}}

/* /web/static/src/core/notifications/notification.scss */
// Colors of the notification are not managed by this file. // It is handled by the other classes defining a background. (like danger, warning, etc.) // The notification just add overlays. .o_notification_manager{@include o-position-absolute($o-navbar-height * 1.15, map-get($spacers, 2), $left: calc(100vw - #{$o-notification-max-width})); z-index: $o-notification-zindex; .o_notification{background-color: var(--Notification__background-color, #{$o-view-background-color}); // Needed to override the background in 'website.scss' border-left-width: $o-notification-border-left-width !important; // Overrides border-[x] utility classes box-shadow: $o-notification-shadow;}.o_notification_close{@include o-position-absolute(0, 0);}}@include owl-fade(0.5s, "o_notification"); 

/* /web/static/src/core/popover/popover.scss */
 .o_popover{&.o-popover-top, &.o-popover-auto[x-placement^="top"]{margin-top: -0.5rem;}&.o-popover-right, &.o-popover-auto[x-placement^="right"]{margin-left: 0.5rem;}&.o-popover-bottom, &.o-popover-auto[x-placement^="bottom"]{margin-top: 0.5rem;}&.o-popover-left, &.o-popover-auto[x-placement^="left"]{margin-left: -0.5rem;}&.o-popover--ts .popover-arrow, &.o-popover--bs .popover-arrow{left: $popover-border-radius;}&.o-popover--te .popover-arrow, &.o-popover--be .popover-arrow{right: $popover-border-radius;}&.o-popover--ls .popover-arrow, &.o-popover--rs .popover-arrow{top: $popover-border-radius;}&.o-popover--le .popover-arrow, &.o-popover--re .popover-arrow{bottom: $popover-border-radius;}}

/* /web/static/src/core/resizable_panel/resizable_panel.scss */
.o_resizable_panel{max-width: 100vw; flex-grow: 0;}.o_resizable_panel_handle{cursor: col-resize; z-index: 10; width: 5px;}

/* /web/static/src/core/select_menu/select_menu.scss */
.o_select_menu{.o_select_menu_toggler{display: grid; grid-template-columns: auto 25px;}.o_select_menu_toggler.o_can_deselect{grid-template-columns: auto 25px 25px;}.o_select_menu_toggler_slot{flex-grow: 2;}.o_select_menu_toggler_caret{grid-column: 2;}.o_can_deselect .o_select_menu_toggler_caret{grid-column: 3;}.o_select_menu_toggler_clear{grid-column: 2;}.o_select_menu_toggler_clear:hover i{color: red;}.o_select_menu_menu{min-width: fit-content; max-height: 350px; input{cursor: text !important;}.o_select_menu_sticky{background-color: $dropdown-bg !important; &.o_select_menu_item.focus{background: $dropdown-border-color !important;}}.o_select_menu_group{top: 50px;}}.o_select_active{color: white;}.o_select_menu_multi_select{.o_select_active:hover{background: $o-danger !important; transition: background .5s;}}.o_tag{margin: 2px;}}.dropup .o_select_menu_menu{box-shadow: 0 -7px 10px rgba(8, 8, 8, 0.319);}.dropdown .o_select_menu_menu{box-shadow: 0 7px 10px rgba(8, 8, 8, 0.319);}

/* /web/static/src/core/signature/name_and_signature.scss */
.o_web_sign_name_and_signature{// for the absolute of the font selection to work position: relative;}.o_signature_stroke{position: absolute; border-top: #D1D0CE solid 2px; bottom: 33%; width: 72%; left: 14%;}

/* /web/static/src/core/tags_list/tags_list.scss */
.o_tag{font-size: var(--Tag-font-size, #{$font-size-sm}); max-width: var(--Tag-max-width, 100%); @for $size from 1 through length($o-colors){&.o_tag_color_#{$size - 1}{$-bg: adjust-color(nth($o-colors, $size), $lightness: 25%, $saturation: 15%); $-color: adjust-color(nth($o-colors, $size), $lightness: -40%, $saturation: -15%); &, &::after{@include o-print-color($-bg, background-color, bg-opacity); @include o-print-color($-color, color, text-opacity);}}}}

/* /web/static/src/core/tooltip/tooltip.scss */
.o-tooltip{@include reset-text(); @include font-size($tooltip-font-size); // Note: Not cross-browser but not such a big deal since it's // needed for minor aesthetic adaptations only. &:has(.o-tooltip--technical){max-width: $tooltip-max-width * 2; .o-tooltip--help{background-color: $info; color: color-contrast($info);}.o-tooltip--string, .o-tooltip--help{max-width: MIN($tooltip-max-width, 100%);}}.o-tooltip--string, .o-tooltip--technical--title{padding: map-get($spacers, 1) 0; color: color-contrast($tooltip-bg); font-weight: $font-weight-bold;}.o-tooltip--help, .o-tooltip--technical{margin: map-get($spacers, 1) map-get($spacers, 2) map-get($spacers, 2);}.o-tooltip--help{white-space: pre-line; padding: 0 map-get($spacers, 2);}.o-tooltip--technical{padding-left: 1.3em; font-family: $o-font-family-monospace; font-size: $o-font-size-base-smaller; list-style-type: disc; .o-tooltip--technical--title{margin-right: map-get($spacers, 1);}}+ .popover-arrow{--popover-arrow-color: #{$tooltip-arrow-color};}}

/* /web/static/src/core/tree_editor/tree_editor.scss */
.o_tree_editor{.o_tree_editor_node{.o_tree_editor_node_control_panel > button{opacity: .2;}&.o_hovered_button{.o_tree_editor_node_control_panel > button{opacity: .5; &:hover{opacity: 1;}}}}}

/* /web/static/src/core/ui/block_ui.scss */
.o_blockUI{cursor: wait; -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); background: rgba(#000, .5); color: #fff; // NOTE: The value of the z-index below mirrors the $zindex-tooltip one z-index: 1070 !important;}

/* /web/static/src/core/utils/draggable_hook_builder.scss */
@keyframes o-draggable-bounce{0%{transform: scale(1);}60%{transform: scale(.95);}100%{transform: scale(1);}}.o_draggable{-webkit-touch-callout: none; // for iOS}.o_dragged{z-index: 1000; pointer-events: none;}.o_touch_bounce{animation: o-draggable-bounce .4s forwards; user-select: none;}

/* /web/static/src/core/utils/nested_sortable.scss */
.o_nested_sortable_placeholder{background-clip: content-box; background-color: deepskyblue; height: 5px; padding-top: 0 !important; padding-bottom: 0 !important;}.o_nested_sortable_placeholder_realsize{outline: 1px dashed $o-gray-600; background-color: $o-gray-100;}

/* /web_tour/static/src/tour_pointer/tour_pointer.scss */
$o-tour-pointer-width: 28px; $o-tour-pointer-height: 38px; $o-tour-pointer-border-width: 3px; $o-tour-pointer-arrow-size: 12px; $o-tour-pointer-duration-in: 200ms; $o-tour-pointer-size-duration-in: floor($o-tour-pointer-duration-in * 3 / 4); $o-tour-pointer-size-delay-in: $o-tour-pointer-duration-in - $o-tour-pointer-size-duration-in; @keyframes o-tour-pointer-bounce-horizontal{from{transform: translateX(calc(var(--TourPointer__bounce-offset) * -1));}to{transform: translateX(var(--TourPointer__bounce-offset));}}@keyframes o-tour-pointer-bounce-vertical{from{transform: translateY(calc(var(--TourPointer__bounce-offset) * -1));}to{transform: translateY(var(--TourPointer__bounce-offset));}}@keyframes o-tour-pointer-fade-in{from{opacity: 0;}}@keyframes o-tour-pointer-info-expand{from{width: 0; height: 0;}}.o_tour_pointer{--TourPointer__anchor-space: 0; --TourPointer__bounce-offset: 3px; --TourPointer__offset: 8px; --TourPointer__scale: 1.12; --TourPointer__color: #{$o-enterprise-color}; --TourPointer__color-accent: #{lighten($o-enterprise-color, 7%)}; --TourPointer__border-width: 1px; --TourPointer__border-color-rgb: 255, 255, 255; --TourPointer__border-color: rgba(var(--TourPointer__border-color-rgb), 1); --TourPointer__arrow-size: 1rem; --TourPointer__animation-duration: 500ms; --TourPointer__expand-duration: 200ms; --TourPointer__text-color: black; --TourPointer__reveal-animation: o-tour-pointer-fade-in 400ms ease; --TourPointer__translate-x: 0; --TourPointer__translate-y: 0; z-index: $zindex-tooltip; max-width: 270px; border: var(--TourPointer__border-width) solid transparent; transform: translate(var(--TourPointer__translate-x), var(--TourPointer__translate-y)); transition: width var(--TourPointer__expand-duration), height var(--TourPointer__expand-duration); &.o_bouncing{&.o_left, &.o_right{animation: o-tour-pointer-bounce-horizontal var(--TourPointer__animation-duration) ease-in infinite alternate, var(--TourPointer__reveal-animation);}&.o_top, &.o_bottom{animation: o-tour-pointer-bounce-vertical var(--TourPointer__animation-duration) ease-in infinite alternate, var(--TourPointer__reveal-animation);}}.o_tour_pointer_tip{width: var(--TourPointer__width); height: var(--TourPointer__height); border: var(--TourPointer__border-width) solid white; border-radius: 0 50% 50% 50%; background-image: radial-gradient( var(--TourPointer__color-accent), var(--TourPointer__color) ); box-shadow: 0 0 40px 2px rgba(var(--TourPointer__border-color-rgb), 0.5);}.o_tour_pointer_content{background-color: $light; color: transparent; transition: color 0s ease var(--TourPointer__expand-duration); // Force style so that it does not depend on where the tooltip is attached line-height: $line-height-base; @include font-size($font-size-base); font-family: $font-family-sans-serif; font-weight: normal; .o_skip_tour{display: inline-block; margin-top: 4px; color: gray; cursor: pointer; &:hover{color: darken(gray, 20%);}}p:last-child{margin-bottom: 0;}}&.o_left .o_tour_pointer_tip{transform: rotate(90deg) translateY(var(--TourPointer__offset)) scaleY(var(--TourPointer__scale)) rotate(45deg);}&.o_right .o_tour_pointer_tip{transform: rotate(270deg) translateY(var(--TourPointer__offset)) scaleY(var(--TourPointer__scale)) rotate(45deg);}&.o_top .o_tour_pointer_tip{transform: rotate(180deg) translateY(var(--TourPointer__offset)) scaleY(var(--TourPointer__scale)) rotate(45deg);}&.o_bottom .o_tour_pointer_tip{transform: rotate(0deg) translateY(var(--TourPointer__offset)) scaleY(var(--TourPointer__scale)) rotate(45deg);}&.o_open{border-color: #{$o-gray-400}; background-color: #{$o-gray-300}; animation: var(--TourPointer__reveal-animation); .o_tour_pointer_tip{width: var(--TourPointer__arrow-size); height: var(--TourPointer__arrow-size); border-color: #{$o-gray-400}; border-radius: 0; background: $light; box-shadow: none;}.o_tour_pointer_content{color: $o-black;}&.o_left{--TourPointer__translate-x: calc(var(--TourPointer__arrow-size) / -2); .o_tour_pointer_tip{transform: translateX(-50%) rotate(45deg); right: calc(var(--TourPointer__arrow-size) * -1); top: calc(var(--TourPointer__arrow-size) / 2);}}&.o_right{--TourPointer__translate-x: calc(var(--TourPointer__arrow-size) / 2); .o_tour_pointer_tip{transform: translateX(50%) rotate(45deg); left: calc(var(--TourPointer__arrow-size) * -1); top: calc(var(--TourPointer__arrow-size) / 2);}}&.o_top{--TourPointer__translate-y: calc(var(--TourPointer__arrow-size) / -2); .o_tour_pointer_tip{transform: translateY(-50%) rotate(45deg); bottom: calc(var(--TourPointer__arrow-size) * -1); left: calc(var(--TourPointer__arrow-size) / 2);}}&.o_bottom{--TourPointer__translate-y: calc(var(--TourPointer__arrow-size) / 2); .o_tour_pointer_tip{transform: translateY(50%) rotate(45deg); top: calc(var(--TourPointer__arrow-size) * -1); left: calc(var(--TourPointer__arrow-size) / 2);}}// Exception for when the info bubble would overflow to the right: // we offset the content to the left &.o_expand_left{&.o_top, &.o_bottom{--TourPointer__translate-x: calc( var(--TourPointer__width) + var(--TourPointer__border-width) - 100% ); .o_tour_pointer_tip{left: initial; right: calc(var(--TourPointer__arrow-size) / 2);}}}}}@media print{.o_tour_pointer{display: none !important;}}

/* /web_editor/static/src/components/history_dialog/history_dialog.scss */
.html-history-dialog{.history-container{margin-left: 240px; >div{padding: 10px 12px; border: 1px solid #ddd; border-top: 0;}.nav{padding-left: 24px;}removed{display: inline; background-color: #f1afaf; text-decoration: line-through; opacity: 0.5;}added{display: inline; background-color: #c8f1af;}p{margin-bottom: 0.6rem;}}.revision-list{margin: 38px 0 0 8px; overflow: auto; max-height: 100%; width: 220px; float : left; .btn{border-radius: 0; display: block; text-align: left; width: 220px; margin-bottom: 8px; position: relative; &:before{content: '\f105'; font-family: 'FontAwesome'; position: absolute; right : 8px; top: 0; font-size: 34px;}}}}

/* /web_editor/static/src/components/media_dialog/media_dialog.scss */
.modal:not(.o_legacy_dialog) .o_select_media_dialog{$min-row-height: 128; $scroll-button-height: 36px; .o_we_file_selector_control_panel{top: -$modal-inner-padding; background-color: $modal-content-bg;}.o_we_existing_attachments{min-height: $min-row-height + px; .o_we_attachment_placeholder{flex-grow: $min-row-height; flex-basis: $min-row-height + px;}.o_existing_attachment_cell.o_we_image{transition: opacity 0.5s ease 0.5s; .o_we_media_dialog_img_wrapper{@extend %o-preview-alpha-background;}}.o_existing_attachment_remove{border-radius: 0 0 0 $o-we-item-border-radius; &:hover{color: $o-we-color-danger;}}}.o_we_attachment_selected{@include o-we-active-wrapper($top: 5px, $left: 5px);}.o_we_load_more{scroll-margin: $modal-inner-padding; &.o_hide_loading > *{display: none;}}.o_scroll_attachments{bottom: 0px; width: $scroll-button-height; height: $scroll-button-height; margin-top: -$scroll-button-height; z-index: 2;}.font-icons-icons > span{width: 50px;}.o_video_dialog_form textarea{min-height: 95px;}.o_video_preview{@include o-we-preview-box(); .media_iframe_video{width: 100%;}}}

/* /web_editor/static/src/components/upload_progress_toast/upload_progress_toast.scss */
.o_upload_progress_toast{font-size: 16px; .o_we_progressbar:last-child{hr{display: none;}}}

/* /web_editor/static/src/js/editor/odoo-editor/src/base_style.scss */
li.oe-nested{display: block;}.o_table tr{border-color: $o-gray-300; td{padding: 0.5rem;}}$sizes: '', 'xs-', 'sm-', 'md-', 'lg-', 'xl-', 'xxl-'; .o_text_columns{max-width: 100% !important; padding: 0 !important;}.o_text_columns > .row{margin: 0 !important; @each $size in $sizes{@for $i from 1 through 12{& > .col-#{$size}#{$i}:first-of-type{padding-left: 0;}& > .col-#{$size}#{$i}:last-of-type{padding-right: 0;}}}}.oe-tabs{display: inline-block; white-space: pre-wrap; max-width: 40px; width: 40px;}$max-depth: 25; @for $depth from 0 through $max-depth{$selectorOl: ""; $selectorUl: ""; @for $i from 0 through $depth{$selectorOl: $selectorOl + "ol "; $selectorUl: $selectorUl + "ul ";}$remainder: $depth % 3; #{$selectorOl}{@if $remainder == 0{list-style-type: decimal;}@else if $remainder == 1{list-style-type: lower-alpha;}@else if $remainder == 2{list-style-type: lower-roman;}}#{$selectorUl}{@if $remainder == 0{list-style-type: disc;}@else if $remainder == 1{list-style-type: circle;}@else if $remainder == 2{list-style-type: square;}}}

/* /web_editor/static/src/scss/web_editor.common.scss */
/// /// This file regroups basic style rules for web_editor enable page edition and /// backend utils. /// TODO many of those rules should probably not be declared for the backend. /// in particular the o_ccX rules, see code linked to the variable named /// 'prevent-backend-colors-alteration'. /// :root{@each $color, $value in $grays{@include print-variable($color, $value);}// Most of the keys of the color combination color should be null. We have // to indicate their fallback values. @for $index from 1 through length($o-color-combinations){$-bg-color: o-color(map-get($colors, 'o-cc#{$index}-bg')); $-text: map-get($colors, 'o-cc#{$index}-text') or color-contrast(o-color('o-cc#{$index}-bg')); $-headings: map-get($colors, 'o-cc#{$index}-headings') or $-text; $-h2: map-get($colors, 'o-cc#{$index}-h2') or $-headings; $-h3: map-get($colors, 'o-cc#{$index}-h3') or $-headings; $-h4: map-get($colors, 'o-cc#{$index}-h4') or $-headings; $-h5: map-get($colors, 'o-cc#{$index}-h5') or $-headings; $-h6: map-get($colors, 'o-cc#{$index}-h6') or $-headings; @if not map-get($colors, 'o-cc#{$index}-text'){@include print-variable('o-cc#{$index}-text', $-text);}@if not map-get($colors, 'o-cc#{$index}-headings'){@include print-variable('o-cc#{$index}-headings', $-headings);}@if not map-get($colors, 'o-cc#{$index}-h2'){@include print-variable('o-cc#{$index}-h2', $-h2);}@if not map-get($colors, 'o-cc#{$index}-h3'){@include print-variable('o-cc#{$index}-h3', $-h3);}@if not map-get($colors, 'o-cc#{$index}-h4'){@include print-variable('o-cc#{$index}-h4', $-h4);}@if not map-get($colors, 'o-cc#{$index}-h5'){@include print-variable('o-cc#{$index}-h5', $-h5);}@if not map-get($colors, 'o-cc#{$index}-h6'){@include print-variable('o-cc#{$index}-h6', $-h6);}$-link: map-get($colors, 'o-cc#{$index}-link'); $-link-color: if($-link, o-color($-link), map-get($theme-colors, 'primary')); @include print-variable('o-cc#{$index}-link', auto-contrast($-link-color, $-bg-color, 'o-cc#{$index}-link')); $-btn-primary: map-get($colors, 'o-cc#{$index}-btn-primary'); @if not $-btn-primary{@include print-variable('o-cc#{$index}-btn-primary', map-get($theme-colors, 'primary')); @include print-variable('o-cc#{$index}-btn-primary-text', color-contrast(map-get($theme-colors, 'primary')));}@else{@include print-variable('o-cc#{$index}-btn-primary-text', color-contrast($-btn-primary));}@if not map-get($colors, 'o-cc#{$index}-btn-primary-border'){@include print-variable('o-cc#{$index}-btn-primary-border', $-btn-primary or map-get($theme-colors, 'primary'));}$-btn-secondary: map-get($colors, 'o-cc#{$index}-btn-secondary'); @if not $-btn-secondary{@include print-variable('o-cc#{$index}-btn-secondary', map-get($theme-colors, 'secondary')); @include print-variable('o-cc#{$index}-btn-secondary-text', color-contrast(map-get($theme-colors, 'secondary')));}@else{@include print-variable('o-cc#{$index}-btn-secondary-text', color-contrast($-btn-secondary));}@if not map-get($colors, 'o-cc#{$index}-btn-secondary-border'){@include print-variable('o-cc#{$index}-btn-secondary-border', $-btn-secondary or map-get($theme-colors, 'secondary'));}}@include print-variable('o-grid-gutter-width', $grid-gutter-width); @include print-variable('o-md-container-max-width', map-get($container-max-widths, md)); @include print-variable('o-we-content-to-translate-color', $o-we-content-to-translate-color); @include print-variable('o-we-translated-content-color', $o-we-translated-content-color); @include print-variable('o-system-fonts', $o-system-fonts); @include print-variable('display-1-font-size', map-get($display-font-sizes, 1)); @include print-variable('display-2-font-size', map-get($display-font-sizes, 2)); @include print-variable('display-3-font-size', map-get($display-font-sizes, 3)); @include print-variable('display-4-font-size', map-get($display-font-sizes, 4)); @include print-variable('h1-font-size', $h1-font-size); @include print-variable('h2-font-size', $h2-font-size); @include print-variable('h3-font-size', $h3-font-size); @include print-variable('h4-font-size', $h4-font-size); @include print-variable('h5-font-size', $h5-font-size); @include print-variable('h6-font-size', $h6-font-size); @include print-variable('font-size-base', $font-size-base); @include print-variable('small-font-size', $small-font-size);}html, body{position: relative; width: 100%; height: 100%;}*[contenteditable=true]{outline: none;}[contenteditable]{overflow-wrap: unset !important;}.css_non_editable_mode_hidden{display: none !important;}.editor_enable .css_editable_mode_hidden{display: none !important;}.note-toolbar{margin-left: 0 !important;}.note-popover .popover > .arrow{display: none;}.note-popover .popover, .note-editor{.dropdown-menu .dropdown-item{> i{visibility: hidden;}&.checked > i{visibility: visible;}}}#wrapwrap, .o_editable{// Only style editor-made tables (shop/portal/... tables are not supposed to // use table-bordered...) table.table.table-bordered{table-layout: fixed; td{min-width: 20px;}}@include media-breakpoint-down(md){.table-responsive > table.table{table-layout: auto;}}}// List ul.o_checklist{list-style: none; >li{list-style: none; position: relative; margin-left: $o-checklist-margin-left; margin-right: $o-checklist-margin-left; &:not(.oe-nested)::before{content: ''; position: absolute; left: - $o-checklist-margin-left; display: block; height: $o-checklist-before-size; width: $o-checklist-before-size; top: 4px; border: 1px solid; text-align: center; cursor: pointer;}&.o_checked{text-decoration: line-through; &::before{content: "✓"; display: flex; align-items: center; justify-content: center; padding-left: 1px #{""}; padding-top: 1px;}}}}ul.o_checklist[dir="rtl"] > li:not(.oe-nested)::before{left: auto; right: - $o-checklist-margin-left; text-align: right;}ol > li.o_indent, ul > li.o_indent{margin-left: 0; list-style: none; &::before{content: none;}}// Stars widget .o_stars .fa.fa-star{color: gold;}// Medias img.o_we_custom_image{// Images added with the editor are .img-fluid by default but should // still behave like inline content. display: inline-block;}img.shadow{box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);}img.padding-small, .img.padding-small, span.fa.padding-small, iframe.padding-small{padding: 4px;}img.padding-medium, .img.padding-medium, span.fa.padding-medium, iframe.padding-medium{padding: 8px;}img.padding-large, .img.padding-large, span.fa.padding-large, iframe.padding-large{padding: 16px;}img.padding-xl, .img.padding-xl, span.fa.padding-xl, iframe.padding-xl{padding: 32px;}img.ms-auto, img.mx-auto{display: block;}.fa-6x{font-size: 6em;}.fa-7x{font-size: 7em;}.fa-8x{font-size: 8em;}.fa-9x{font-size: 9em;}.fa-10x{font-size: 10em;}.fa.mx-auto{display: block; text-align: center;}.fa.card-img, .fa.card-img-top, .fa.card-img-bottom{width: auto;}%o-small-font-size{@include font-size($o-small-font-size);}// Dedicated class to be able to keep the default "small" behavior of bootstrap: // being "smaller" that the context where it is used (em units). Here we want to // define a specific fixed font-size for a smaller font-size than the base font // size. Note that this class is designed to work as the display-x classes: an // extra "styling" class to go on an element. For the "font-size class" // equivalent, see o_small-fs below. .o_small{@extend %o-small-font-size;}@for $index from 1 through 4{.display-#{$index}-fs{@include font-size(map-get($display-font-sizes, $index));}}.h1-fs{@include font-size($h1-font-size);}.h2-fs{@include font-size($h2-font-size);}.h3-fs{@include font-size($h3-font-size);}.h4-fs{@include font-size($h4-font-size);}.h5-fs{@include font-size($h5-font-size);}.h6-fs{@include font-size($h6-font-size);}.base-fs{@include font-size($font-size-base);}// Equivalent "font-size" only for the Odoo own "o_small" class. Note that the // "o_small" class currently also changes the font-size only but this is to stay // consistent with the other classes which act that way (as display-x). .o_small-fs{@include font-size($small-font-size);}div.media_iframe_video{margin: 0 auto; text-align: center; position: relative; overflow: hidden; min-width: 100px; iframe{width: 100%; height: 100%; @include o-position-absolute($top: 0); margin: 0 auto; margin-left: -50%;}&.padding-small iframe{padding: 4px;}&.padding-medium iframe{padding: 8px;}&.padding-large iframe{padding: 16px;}&.padding-xl iframe{padding: 32px;}.media_iframe_video_size{padding-bottom: 66.5%; position: relative; width: 100%; height: 0;}.css_editable_mode_display{@include o-position-absolute(0,0,0,0); width: 100%; height: 100%; display: none; z-index: 2;}}// Fields address{.fa.fa-mobile-phone{margin: 0 3px 0 2px;}.fa.fa-file-text-o{margin-right: 1px;}}span[data-oe-type="monetary"]{white-space: nowrap;}// Menus // TODO should not be here but used by web_studio so must stay here for now ul.oe_menu_editor{.oe_menu_placeholder{outline: 1px dashed #4183C4;}ul{list-style: none;}li div{@include o-grab-cursor; :active{cursor: grabbing;}}}// Generate all spacings for all sizes @mixin o-spacing-all($factor: 1){// Generate vertical margin/padding classes used by the editor @for $i from 0 through (256 / 8){@include o-vspacing($i * 8, $factor);}@include o-vspacing(4, $factor); // 92px vertical margin is kept for compatibility @include o-vmargins(92, $factor); // Some horizontal margin classes defined for convenience // (and compatibility) @include o-hmargins(0, $factor); @include o-hmargins(4, $factor); @include o-hmargins(8, $factor); @include o-hmargins(16, $factor); @include o-hmargins(32, $factor); @include o-hmargins(64, $factor);}// Generate all spacings for one size, scalled by a given factor // (0 <= factor <= 1) @mixin o-vspacing($name, $factor: 1){@include o-vmargins($name, $factor); @include o-vpaddings($name, $factor);}@mixin o-vmargins($name, $factor: 1){@include o-vmargins-define($name, $factor * $name);}@mixin o-vpaddings($name, $factor: 1){@include o-vpaddings-define($name, $factor * $name);}@mixin o-hspacing($name, $factor: 1){@include o-hmargins($name, $factor); @include o-hpaddings($name, $factor);}@mixin o-hmargins($name, $factor: 1){@include o-hmargins-define($name, $factor * $name);}@mixin o-hpaddings($name, $factor: 1){@include o-hpaddings-define($name, $factor * $name);}// Generate all spacings for one size, given the name of the spacing and // intended size @mixin o-vmargins-define($name, $size: $name){.mt#{$name}{margin-top: $size * 1px !important;}.mb#{$name}{margin-bottom: $size * 1px !important;}}@mixin o-vpaddings-define($name, $size: $name){.pt#{$name}{padding-top: $size * 1px !important;}.pb#{$name}{padding-bottom: $size * 1px !important;}}@mixin o-hmargins-define($name, $size: $name){.ml#{$name}{margin-left: $size * 1px !important;}.mr#{$name}{margin-right: $size * 1px !important;}}@mixin o-hpaddings-define($name, $size: $name){.pl#{$name}{padding-left: $size * 1px !important;}.pr#{$name}{padding-right: $size * 1px !important;}}// Generate all margins @include o-spacing-all; // Underline a.o_underline{text-decoration: underline; &:hover{text-decoration: underline;}}.o_nocontent_help{@include o-nocontent-empty; .o_empty_folder_image:before{@extend %o-nocontent-empty-document;}}.o_we_search_prompt{position: relative; min-height: 250px; width: 100%; display: flex; align-items: center; justify-content: flex-start; & > h2{max-width: 500px; text-align: center; margin-left: 150px;}&::before{transform: scale(-1, 1); content: ""; @include o-position-absolute($top: 0, $left: 50px); width: 100px; height: 150px; opacity: .5; filter: var(--WebEditor__SearchPromptArrow-filter, invert(0)); background-image: url('/web_editor/static/src/img/curved_arrow.svg'); background-size: 100%; background-repeat: no-repeat;}}@include media-breakpoint-down(md){odoo-wysiwyg-container{.panel-heading.note-toolbar{overflow-x: auto;}.btn-group{position: static;}}// modal select media .o_technical_modal.o_web_editor_dialog{// see template 'web_editor.FieldTextHtml.fullscreen' z-index: $o-we-technical-modal-zindex; > .o_select_media_dialog{max-width: inherit !important; z-index: $o-we-technical-modal-zindex; .modal-dialog, .model-content{height: 100%;}.modal-body{.nav .nav-item.search{width: 100%; .btn-group{display: flex; justify-content: space-around; padding: 5px;}}// center pictogram .font-icons-icons{text-align: center;}// fix search image .form-control.o_we_search{height: inherit;}// attachment cells .o_we_existing_attachments > .row{flex-direction: column; > .o_existing_attachment_cell{flex: initial; max-width: 100%; > .o_existing_attachment_remove{opacity: inherit; top: 10px;}}}}}}}// BS4 blockquote has no style anymore, except bloquote <footer> blockquote{padding: $spacer/2 $spacer; border-left: 5px solid; border-color: map-get($grays, '300'); font-style: italic;}// Extend bootstrap to create background and text utilities for some colors // outside of the $theme-colors too (but not btn-, alert-, etc). @for $index from 1 through 5{$-color-name: 'o-color-#{$index}'; $-color: map-get($colors, $-color-name); @include bg-variant(".bg-#{$-color-name}", $-color); @include text-emphasis-variant(".text-#{$-color-name}", $-color);}// Bg/text color classes generation .o_cc{#{$o-color-extras-nesting-selector}{// Re-force dropdown-item colors inside presets otherwise the presets // 'link' colors take over. .dropdown-menu .dropdown-item{// Need to add +1 priority thanks to // .dropdown-menu to counter a:not(.btn) &, h6{// Quick fix: sometimes we use h6 in dropdowns color: $dropdown-link-color !important; &:hover, &:focus{color: $dropdown-link-hover-color !important;}}&.disabled, &:disabled{&, h6{// Quick fix: sometimes we use h6 in dropdowns color: $dropdown-link-disabled-color !important;}}.btn-link{// Some search autocomplete results use btn-link for extra // information that can be navigated to. (e.g. products give // access to their categories) // These need to be reset in case a dark palette is applied. color: $btn-link-color; &:hover{color: $btn-link-hover-color;}&:disabled{color: $btn-link-disabled-color;}}}.dropdown-menu .dropdown-item-text .text-muted{a{// Search autocomplete's fuzzy matched term is shown as a link // within an information message. color: $link-color; &:hover{color: $link-hover-color;}}}}}@for $index from 1 through length($o-color-combinations){$-bg: map-get($colors, 'o-cc#{$index}-bg'); $-text: map-get($colors, 'o-cc#{$index}-text'); $-headings: map-get($colors, 'o-cc#{$index}-headings'); $-h2: map-get($colors, 'o-cc#{$index}-h2'); $-h3: map-get($colors, 'o-cc#{$index}-h3'); $-h4: map-get($colors, 'o-cc#{$index}-h4'); $-h5: map-get($colors, 'o-cc#{$index}-h5'); $-h6: map-get($colors, 'o-cc#{$index}-h6'); $-link: map-get($colors, 'o-cc#{$index}-link'); $-btn-primary: map-get($colors, 'o-cc#{$index}-btn-primary'); $-btn-primary-border: map-get($colors, 'o-cc#{$index}-btn-primary-border'); $-btn-secondary: map-get($colors, 'o-cc#{$index}-btn-secondary'); $-btn-secondary-border: map-get($colors, 'o-cc#{$index}-btn-secondary-border'); // Those color classes color multiple elements when applied on a snippet. // Those rules are not important so that they can be overridden through // bg and text utility classes. ** .o_cc#{$index}{// Background & Text $-bg-color: o-color($-bg); @include o-bg-color($-bg-color, o-color($-text), $important: false, $yiq-min-opacity-threshold: 0); // In the future, we might want to use CSS variables to define all // colors for all components of o_cc and use them here. That way there // would be way less CSS rules and more advantages. For now, this only // exposes the background color which is needed in some snippets. --o-cc-bg: #{$-bg-color}; #{$o-color-extras-nesting-selector}{// Headings h1, h2, h3, h4, h5, h6{// 'inherit' comes from the o-bg-color mixin color: o-color($-headings);}h2{color: o-color($-h2);}h3{color: o-color($-h3);}h4{color: o-color($-h4);}h5{color: o-color($-h5);}h6{color: o-color($-h6);}// Links $-link-color: if($-link, o-color($-link), map-get($theme-colors, 'primary')); $-link-hover-color: darken($-link-color, 15%); a:not(.btn), .btn-link{color: auto-contrast($-link-color, $-bg-color, 'o-cc#{$index}-link'); &:hover{color: auto-contrast($-link-hover-color, $-bg-color, 'o-cc#{$index}-link');}}// Buttons // Primary $-btn-primary-color: if($-btn-primary, o-color($-btn-primary), map-get($theme-colors, 'primary')); $-btn-primary-border-color: if($-btn-primary-border, o-color($-btn-primary-border), $-btn-primary-color); .btn-fill-primary{@include button-variant($-btn-primary-color, $-btn-primary-border-color);}.btn-outline-primary{@include button-outline-variant($-btn-primary-border-color);}// Secondary $-btn-secondary-color: if($-btn-secondary, o-color($-btn-secondary), map-get($theme-colors, 'secondary')); $-btn-secondary-border-color: if($-btn-secondary-border, o-color($-btn-secondary-border), $-btn-secondary-color); .btn-fill-secondary{@include button-variant($-btn-secondary-color, $-btn-secondary-border-color);}.btn-outline-secondary{@include button-outline-variant($-btn-secondary-border-color);}// 'Active' states. Note: this only emulates very common components // used in snippets. This might need to be more complex the day we // can apply color combinations anywhere (page-item, ...). .nav-pills{.nav-link.active, .show > .nav-link{background-color: $-btn-primary-color; color: color-contrast($-btn-primary-color);}}.dropdown-menu .dropdown-item{// Need to add +1 priority thanks to // .dropdown-menu (see .o_cc). &.active, &:active{&, h6{// Quick fix: sometimes we use h6 in dropdowns @include gradient-bg($-btn-primary-color); color: color-contrast($-btn-primary-color) !important; &:hover, &:focus{color: color-contrast($-btn-primary-color) !important;}}}}a.list-group-item{color: $-btn-primary-color; &.active{background-color: $-btn-primary-color; color: color-contrast($-btn-primary-color); border-color: $-btn-primary-color;}}}}}// Buttons with custom colors .btn-custom:hover, .btn-fill-custom:hover{filter: invert(0.2);}.btn-outline-custom:not(:hover){// Custom buttons have their fill color or gradient specified in their // element style. They must only be shown on hover for outline buttons. background-color: transparent !important; background-image: none !important;}// Base snippet rules %o-we-background-layer-parent{&, & > *{// Allow background layers to be placed accordingly and snippet content // to be displayed on top. Note: we cannot just position the layers // with z-index: -1, otherwise it would go under the snippet own // background. Adding a z-index: 0 on the snippet to create its own // stacking context won't solve that either as, in that case, any BS // component inside would be using that stacking context (e.g. a // dropdown inside snippet 1 of the page would go under snippet 2 // when opened since the dropdown z-index would be confined into // snippet 1's stacking context. position: relative;}}%o-we-background-layer{@include o-position-absolute(0, 0, 0, 0); position: absolute !important; display: block; overflow: hidden; background-repeat: no-repeat; pointer-events: none;}section, .oe_img_bg, [data-oe-shape-data]{@extend %o-we-background-layer-parent;}.o_we_bg_filter{@extend %o-we-background-layer;}.o_full_screen_height{display: flex; flex-direction: column; justify-content: space-around; min-height: 100vh !important;}.o_half_screen_height{@extend .o_full_screen_height; min-height: 55vh !important;}// TODO remove cover_full and cover_mid classes (kept for compatibility for now) .cover_full{@extend .o_full_screen_height;}.cover_mid{@extend .o_half_screen_height;}// Smaller container .o_container_small{@extend .container; @include media-breakpoint-up(lg){max-width: map-get($container-max-widths, md);}}// Background Images .oe_img_bg{background-size: cover; background-repeat: no-repeat; &.o_bg_img_opt_repeat{background-size: auto; background-repeat: repeat;}&.o_bg_img_center{background-position: center;}}// Gradient // TODO should be in the editor lib since it is handled there... but could not // find the right place for it. .text-gradient{-webkit-background-clip: text; -webkit-text-fill-color: transparent; // FIXME (or wait for a fix in Chrome): the code below is needed to make // animated and highlighted text work with gradient background on Chrome. // It is not based on ".text-gradient *" only to avoid a side effect that // makes text nodes wrapped in a span (e.g. bold, italic) no longer have the // "gradient crossing the whole text" on them but their own gradient. .o_animated_text, .o_animated_text *, &.o_animated_text *, .o_text_highlight, .o_text_highlight *, &.o_text_highlight *{background-image: inherit; -webkit-background-clip: inherit; -webkit-text-fill-color: inherit;}// On Iphone (Safari & Chrome) and Mac (only Safari), the font awesome icons // are not rendered (invisible) when inside a gradient. .fa{display: inherit;}}.odoo-editor-editable.odoo-editor-qweb, .o_readonly{t, [t-if], [t-elif], [t-else], [t-foreach]{background-color: rgba(0, 0, 102, 0.1) !important;}t, [t-esc], [t-out], [t-raw]{border-radius: 2px;}[t-esc], [t-out], [t-raw]{background-color: rgba(36, 154, 255, 0.16) !important;}[t-esc]:empty::before{content: attr(t-esc);}[t-raw]:empty::before{content: attr(t-raw);}[t-out]:empty::before{content: attr(t-out);}t[t-set]{display: none;}t[data-oe-t-inline]{display: inline;}t:not([data-oe-t-inline]){display: block;}t[data-oe-t-inline]:not([data-oe-t-group-active]){display: unset;}[data-oe-t-group]:not([data-oe-t-group-active]){display: none !important;}[data-oe-t-group][data-oe-t-selectable]{outline: 1px dashed rgba(0, 0, 102, 0.4) !important;}}.oe-qweb-select{position: absolute; // Bootstrap sets .modal z-index at 1055. // Ensure qweb-select is visible in modals. z-index: 1056; background-color: white;}// Background shapes @function compute-shape-url-params($colors, $color-to-cc-bg-map){$url-params: ''; @each $i in $colors{$mapped-color: map-get($color-to-cc-bg-map, $i); $color: encode-color(#{o-color($mapped-color)}); $url-params: '#{$url-params}&c#{$i}=#{$color}';}@return $url-params;}.o_we_shape{@extend %o-we-background-layer; &.o_we_animated{will-change: transform;}// Default map to use to map shape file colors to color combination // background colors. $default-color-to-cc-bg-map: ( 1: 4, 2: 3, 3: 2, 4: 1, 5: 5, ); @each $module, $shapes in $o-bg-shapes{@each $shape, $style in $shapes{$colors: map-get($style, 'colors'); $color-to-cc-bg-map: map-merge($default-color-to-cc-bg-map, map-get($style, 'color-to-cc-bg-map') or ()); $url-params: compute-shape-url-params($colors, $color-to-cc-bg-map); $extra-mappings: map-get($style, 'extra-mappings') or (); // eg: o_website_shape_bg_1 &.o_#{$module}_#{str-replace($shape, '/', '_')}{// When the shape is not customized, this URL, built in SCSS, // allows for the shape to respond to palette changes. // Mainly useful for default pages built by the configurator. background-image: url("/web_editor/shape/#{$module}/#{$shape}.svg?#{str-slice($url-params, 2)}"); background-position: map-get($style, 'position'); background-size: map-get($style, 'size'); background-repeat: if(map-get($style, 'repeat-x'), repeat, no-repeat) if(map-get($style, 'repeat-y'), repeat, no-repeat); @each $mapping-name, $mapping in $extra-mappings{$color-to-cc-bg-map: map-merge($default-color-to-cc-bg-map, $mapping or ()); $url-params: compute-shape-url-params($colors, $color-to-cc-bg-map); &.o_#{$mapping-name}_extra_shape_mapping{background-image: url("/web_editor/shape/#{$module}/#{$shape}.svg?#{str-slice($url-params, 2)}");}}}}}}// Autocomplete dropdowns .ui-autocomplete{max-height: 45vh; overflow-y: auto; overflow-x: hidden; .ui-menu-item{padding: 0; > .ui-state-active{border: none; font-weight: normal; margin: 0;}}.fw-bold{// Needed because the font-family is not "system fonts everywhere" as // elements around it. TODO: use "system fonts everywhere" for // the 'ui-autocomplete' and remove this line. font-weight: 700 !important;}}.o_editor_banner{// force margin to ensure vertical center alignment in correlation with icon p, h1, h2, h3, ul, ol{margin-bottom: 1rem;}ol ol, ul ul, ol ul, ul ol{margin-bottom: 0;}ul.o_checklist>li:not(.oe-nested)::before{top: 0px!important;}}

/* /web_editor/static/src/scss/web_editor.frontend.scss */
@include media-breakpoint-down(md){img, .media_iframe_video{&:not(.o_animate){transform: none !important;}}// For RTL (Right-to-Left) purposes, don't disable the transform directive // for Font Awesome icons that are flipped by 180deg. $not-selectors: ''; @each $class in $rtl-fa-classes{$not-selectors: '#{$not-selectors}:not(.#{$class})';}.fa:where(#{$not-selectors}:not(.o_animate)){transform: none !important;}}.o_wysiwyg_loader{@extend :disabled; pointer-events: none; min-height: 100px; color: transparent;}.o_wysiwyg_loading{@include o-position-absolute($top: 50%, $left: 50%); transform: translate(-50%, -50%)}@include media-breakpoint-down(md){.o_we_shape:not(.o_shape_show_mobile){display: none;}}.o_we_flip_x{transform: scaleX(-1);}.o_we_flip_y{transform: scaleY(-1);}.o_we_flip_x.o_we_flip_y{transform: scale(-1);}// GRID LAYOUT .o_grid_mode{@include media-breakpoint-down(lg){// No gaps in mobile view. row-gap: 0px !important; column-gap: 0px !important;}--grid-item-padding-y: 10px; --grid-item-padding-x: 10px; > *{padding: var(--grid-item-padding-y) var(--grid-item-padding-x) !important;}}@include media-breakpoint-up(lg){.o_grid_mode{display: grid !important; grid-auto-rows: 50px; grid-template-columns: repeat(12, 1fr); row-gap: 0px; column-gap: 0px; --gutter-x: 0px; > *{margin: 0 !important; width: 100%; min-width: 0;}}.container-fluid > .o_grid_mode{--gutter-x: 30px;}.o_extra_menu_items .o_grid_mode{display: flex !important; row-gap: 0px !important; column-gap: 0px !important;}.o_grid_item_image{img, .media_iframe_video{width: 100% !important; height: 100% !important; object-fit: cover !important;}&.o_grid_item_image_contain img, img[data-shape]{object-fit: contain !important;}// Allowing "cover" for some hover effects. &:not(.o_grid_item_image_contain) img[data-shape$="geo_square"]{&:not( [data-hover-effect="dolly_zoom"], [data-hover-effect="outline"], [data-hover-effect="image_mirror_blur"], ){object-fit: cover !important;}}// Needed when "a" is "display: block". > a{width: 100%; height: 100%;}}}// Override the default image selection color used in "web_editor". This // prevents selected images from being covered with a blue filter in edit mode // (Website, Email Marketing). This allows to see the correct final rendering // of an image when it is edited. body.editor_enable:not(.o_basic_theme) .odoo-editor-editable{img::selection{background-color: transparent !important;}}

/* /portal/static/src/scss/portal.scss */
/// /// This file regroups the frontend general design rules and portal design /// rules. /// // ====== Variables ========= $o-theme-navbar-logo-height: $nav-link-height !default; $o-theme-navbar-fixed-logo-height: $nav-link-height !default; // Portal toolbar (filters, search bar) $o-portal-mobile-toolbar: true; // Enable/Disable custom design $o-portal-mobile-toolbar-border: $border-color; $o-portal-mobile-toolbar-bg: $gray-200; // Portal Tables $o-portal-table-th-pt: map-get($spacers, 1) !default; $o-portal-table-th-pb: map-get($spacers, 1) !default; $o-portal-table-td-pt: map-get($spacers, 2) !default; $o-portal-table-td-pb: map-get($spacers, 2) !default; // Frontend general body{// Set frontend direction that will be flipped with // rtlcss for right-to-left text direction. direction: ltr;}header{.navbar-brand{flex: 0 0 auto; max-width: 75%; &.logo{padding-top: 0; padding-bottom: 0; img{// object-fit does not work on IE but is only used as a fallback object-fit: contain; display: block; width: auto; height: $o-theme-navbar-logo-height; @include media-breakpoint-down(md){max-height: min($o-theme-navbar-logo-height, 5rem);}}}}.nav-link{white-space: nowrap;}}.navbar{margin-bottom: 0; .nav.navbar-nav.float-end{@include media-breakpoint-down(md){float: none!important;}}}@include media-breakpoint-up(md){.navbar-expand-md ul.nav > li.divider{display: list-item;}}ul.flex-column > li > a{padding: 2px 15px;}// Link without text but an icon a, .btn-link{&.fa:hover{text-decoration: $o-theme-btn-icon-hover-decoration;}}// Odoo options classes .jumbotron{margin-bottom: 0;}// Typography li > p{margin: 0;}// Bootstrap hacks %o-double-container-no-padding{padding-right: 0; padding-left: 0;}.container{.container, .container-fluid{@extend %o-double-container-no-padding;}}.container-fluid .container-fluid{@extend %o-double-container-no-padding;}#wrap{.container, .container-fluid{// BS3 used to do this on all containers so that margins and floats are // cleared inside containers. As lots of current odoo layouts may rely // on this for some alignments, this is restored (at least for a while) // here only for main containers of the frontend. &::before, &::after{content: ""; display: table; clear: both;}}.navbar %container-flex-properties{// Bootstrap set-up flex alignment to "space-between" here. The hack // made above to restore the BS3 protection has to be disabled. &::before, &::after{display: none;}}}[class^="col-lg-"]{min-height: 24px;}.input-group{flex-flow: row nowrap;}.list-group-item:not([class*="list-group-item-"]):not(.active){color: color-contrast($list-group-bg);}%o-portal-breadcrumbs{background-color: inherit;}// Replaces old BS3 page-header class %o-page-header{margin-bottom: $headings-margin-bottom * 2; padding-bottom: $headings-margin-bottom; border-bottom-width: $border-width; border-bottom-style: solid; border-bottom-color: $border-color;}.o_page_header{@extend %o-page-header;}// Images spacing img, .media_iframe_video, .o_image{&.float-end{margin-left: $grid-gutter-width / 2;}&.float-start{margin-right: $grid-gutter-width / 2;}}// Others ::-moz-selection{background: rgba(150, 150, 220, 0.3);}::selection{background: rgba(150, 150, 220, 0.3);}.oe_search_box{padding-right: 23px; text-overflow: ellipsis;}// Kept for (up to) saas-12 compatibility .para_large{font-size: 120%;}.jumbotron .para_large p{font-size: 150%;}.readable{font-size: 120%; max-width: 700px; margin-left: auto; margin-right: auto; .container{padding-left: 0; padding-right: 0; width: auto;}}// Background (kept for 8.0 compatibility) (! some are still used by website_blog) .oe_dark{background-color: rgba(200, 200, 200, 0.14);}.oe_black{background-color: rgba(0, 0, 0, 0.9); color: white;}.oe_green{background-color: #169C78; color: white; .text-muted{color: #ddd !important;}}.oe_blue_light{background-color: #41b6ab; color: white; .text-muted{color: #ddd !important;}}.oe_blue{background-color: #34495e; color: white;}.oe_orange{background-color: #f05442; color: white; .text-muted{color: #ddd !important;}}.oe_purple{background-color: #b163a3; color: white; .text-muted{color: #ddd !important;}}.oe_red{background-color: #9C1b31; color: white; .text-muted{color: #ddd !important;}}.oe_none{background-color: #FFFFFF;}.oe_yellow{background-color: #A2A51B;}.oe_green{background-color: #149F2C;}.o_portal{.breadcrumb{@extend %o-portal-breadcrumbs;}> tbody.o_portal_report_tbody{vertical-align: middle;}}.o_portal_wrap{.o_portal_my_home > .o_page_header > a:hover{text-decoration: none;}.o_portal_navbar{.breadcrumb{padding-left: 0; padding-right: 0; @extend %o-portal-breadcrumbs;}}.o_portal_my_doc_table{th{padding-top: $o-portal-table-th-pt; padding-bottom: $o-portal-table-th-pb; max-width: 500px;}td{padding-top: $o-portal-table-td-pt; padding-bottom: $o-portal-table-td-pb; max-width: 10rem;}td, th{vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; &:has(a){color: $primary;}}}.o_my_sidebar div[itemprop="address"] > div{margin-top: 0.5em;}@if ($o-portal-mobile-toolbar){#o_portal_navbar_content{@include media-breakpoint-down(lg){margin: $navbar-padding-y 0 0; padding: $navbar-padding-y $navbar-padding-x ; border-top: $border-width solid $o-portal-mobile-toolbar-border; background-color: $o-portal-mobile-toolbar-bg;}}}table.table tr{word-wrap: break-word;}}.o_portal_address{span[itemprop="name"]{margin-bottom: 0.3em;}div[itemprop="address"] > div{position: relative; span[itemprop="streetAddress"]{line-height: 1.2; margin-bottom: 0.3em;}.fa{line-height: $line-height-base; color: $o-gray-500; + span, + div{display: block;}}}}.oe_attachments .o_image_small{height: 40px; width: 50px; background-repeat: no-repeat;}.o_portal_sidebar{.o_portal_html_view{overflow: hidden; background: white; position: relative; .o_portal_html_loader{@include o-position-absolute(45%, 0, auto, 0);}iframe{position: relative;}}.o_portal_sidebar_content{@include media-breakpoint-up(lg){@include o-position-sticky($top: $spacer * 5); z-index: 1;}}}// ------------------------------------------------------------ // Frontend Discuss widget // ------------------------------------------------------------ // Readonly display .o_portal_chatter{padding: 10px; .o_portal_chatter_avatar{--Avatar-size: 45px;}.o_portal_chatter_header{margin-bottom: 15px;}.o_portal_chatter_composer{margin-bottom: 15px;}.o_portal_chatter_composer_body{textarea{border: 0;}> div{border: 1px solid var(--o-border-color);}}.o_portal_chatter_messages{margin-bottom: 15px; overflow-wrap: break-word; word-break: break-word; .o_portal_chatter_message{div.flex-grow-1 > p:not(.o_portal_chatter_puslished_date):last-of-type{margin-bottom: 5px;}}.o_portal_chatter_message_title{p{font-size: 85%; color: $text-muted; margin: 0px;}}}.o_portal_chatter_pager{text-align: center;}}// Readonly / Composer mix display .o_portal_chatter, .o_portal_chatter_composer{.o_portal_chatter_attachment{.o_portal_chatter_attachment_name{max-width: 200px;}.o_portal_chatter_attachment_delete{@include o-position-absolute($top: 0, $right: 0); opacity: 0;}&:hover .o_portal_chatter_attachment_delete{opacity: 1;}}.o_portal_message_internal_off{.o_portal_chatter_visibility_on{display: none;}}.o_portal_message_internal_on{.o_portal_chatter_visibility_off{display: none;}}}.o_portal_security_body{section{margin-top: map-get($spacers, 5); border-top: $border-width solid $border-color; padding-top: map-get($spacers, 4); form.oe_reset_password_form{max-width: initial; margin: initial;}label, button{white-space: nowrap;}}section[name="portal_deactivate_account"]{label{white-space: normal!important;}}}// Copyright .o_footer_copyright{.o_footer_copyright_name{vertical-align: middle;}.js_language_selector{display: inline-block;}@include media-breakpoint-up(md){.row{display: flex; > div{margin: auto 0;}}}}

/* /payment/static/src/scss/payment_form.scss */
.o_payment_form .o_outline{&:hover{border-color: $primary;}&:not(:first-child):hover{// Since list-group items, except the first child, have no top border, this emulates the top // border for the hovered state. box-shadow: 0 (-$border-width) 0 $primary;}.o_payment_option_label:before{position: absolute; inset: 0; content: ''; cursor: pointer;}}

/* /payment/static/src/scss/payment_provider.scss */
.o_form_view{.o_payment_provider_desc{margin-top: 10px; ul{list-style-type: none; padding: 0; i.fa{margin-right: 5px; &.fa-check{color: green;}}}}.o_warning_text{color: #f0ad4e;}}

/* /payment/static/src/scss/portal_templates.scss */
div[name="o_payment_status_alert"] div > p{margin-bottom: 0;}.o_payment_summary_separator{@include media-breakpoint-up(md){border-left: $border-width solid $border-color;}}

/* /sale/static/src/scss/sale_portal.scss */
 .orders_vertical_align{display: flex; align-items: center;}.orders_label_text_align{vertical-align: 15%;}.sale_tbody .o_line_note{word-break: break-word; word-wrap: break-word; overflow-wrap: break-word;}.sale_tbody input.js_quantity{min-width: 48px; text-align: center;}.sale_tbody div.input-group.w-50.pull-right{width: 100% !important;}.o_portal .sale_tbody .js_quantity_container{.js_quantity{padding: 0;}.input-group-text{padding: 0.2rem 0.4rem;}@include media-breakpoint-down(md){width: 100%;}}

/* /stock/static/src/scss/stock_traceability_report.scss */
@mixin o-stock-reports-lines($border-width: 5px, $font-weight: inherit, $border-top-style: initial, $border-bottom-style: initial){border-width: $border-width; border-left-style: hidden; border-right-style: hidden; font-weight: $font-weight; border-top-style: $border-top-style; border-bottom-style: $border-bottom-style;}.o_stock_reports_body_print{background-color: white; color: black; .o_stock_reports_level0{@include o-stock-reports-lines($border-width: 1px, $font-weight: bold, $border-top-style: solid, $border-bottom-style: groove);}}.o_main_content{.o_stock_reports_page{position: absolute;}}.o_stock_reports_page{background-color: $o-view-background-color; &.o_stock_reports_no_print{margin: $o-horizontal-padding auto; @include o-webclient-padding($top: $o-sheet-vpadding, $bottom: $o-sheet-vpadding); .o_stock_reports_level0{@include o-stock-reports-lines($border-width: 1px, $font-weight: normal, $border-top-style: solid, $border-bottom-style: groove);}.o_stock_reports_table{thead{display: table-row-group;}white-space: nowrap; margin-top: 30px;}.o_report_line_header{text-align: left; padding-left: 10px;}.o_report_header{border-top-style: solid; border-top-style: groove; border-bottom-style: groove; border-width: 2px;}}.o_stock_reports_unfolded{display: inline-block;}.o_stock_reports_nofoldable{margin-left: 17px;}a.o_stock_report_lot_action{cursor: pointer;}.o_stock_reports_unfolded td + td{visibility: hidden;}div.o_stock_reports_web_action, span.o_stock_reports_web_action, i.fa, span.o_stock_reports_unfoldable, span.o_stock_reports_foldable, a.o_stock_reports_web_action{cursor: pointer;}.o_stock_reports_caret_icon{margin-left: -3px;}th{border-bottom: thin groove;}.o_stock_reports_level1{@include o-stock-reports-lines($border-width: 2px, $border-top-style: hidden, $border-bottom-style: solid);}.o_stock_reports_level2{@include o-stock-reports-lines($border-width: 1px, $border-top-style: solid, $border-bottom-style: solid); > td > span:last-child{margin-left: 25px;}}.o_stock_reports_default_style{@include o-stock-reports-lines($border-width: 0px, $border-top-style: solid, $border-bottom-style: solid); > td > span:last-child{margin-left: 50px;}}}

/* /google_recaptcha/static/src/scss/recaptcha.scss */
// Hide google recaptcha V3 don't forget to add legal // https://developers.google.com/recaptcha/docs/faq#id-like-to-hide-the-recaptcha-badge.-what-is-allowed .grecaptcha-badge{visibility: hidden;}

/* /website/static/src/libs/zoomodoo/zoomodoo.scss */
 .zoomodoo{position: relative; display: inline-block; *display: inline; *zoom: 1; img{vertical-align: bottom;}}.zoomodoo-flyout{position:absolute; z-index: 100; overflow: hidden; background: #FFF; top: 0; width: 100%; height: 100%; img{max-width: 500%;}}.zoomodoo-hover .zoomodoo-flyout{left: 0;}.zoomodoo-next .zoomodoo-flyout{left: 100%;}

/* /website/static/src/scss/website.scss */
/// /// This file regroups the website design rules. /// $-seen-urls: (); @each $alias, $key in $o-font-aliases-to-keys{$-url: o-get-font-info($alias, 'url'); @if $-url and index($-seen-urls, $-url) == null{$-seen-urls: append($-seen-urls, $-url); {unquote($-url)}&display=swap");}@else{$-name: o-get-font-info($alias, 'name'); $-attachment: o-get-font-info($alias, 'attachment'); @if $-attachment{{$-attachment}/google-font-#{unquote($-name)}");}}}:root{// The color behind the boxed layout is forced by Odoo. The box background // color uses the `$body-bg` variable. // grep: BOXED_BODY_BG_ODOO @if o-website-value('layout') != 'full'{$-boxed-layout-body-bg: o-color('body'); --#{$variable-prefix}body-bg-rgb: #{to-rgb($-boxed-layout-body-bg)}; --#{$variable-prefix}body-bg: #{$-boxed-layout-body-bg};}// Border color // Let borders color adapt according to body and CCs. Also, set a fallback // value for browsers that don't support the color-mix function (used by // 'fade-currentColor'). --o-border-color: #{o-color('300')}; --o-border-color: #{fade-currentColor()}; // The theme customize modal JS will need to know the value of some scss // variables used to render the user website, and those may have been // customized by themes, the user or anything else (so there is no file to // parse to get them). Those will be printed here as CSS variables. @include print-variable('support-13-0-color-system', $o-support-13-0-color-system); @include print-variable('has-customized-13-0-color-system', $o-has-customized-13-0-color-system); // 1) Handle default values @include print-variable('header-font-size', $font-size-base); $-font-website-value: o-website-value('font'); @include print-variable('headings-font', $-font-website-value); @include print-variable('navbar-font', $-font-website-value); @include print-variable('buttons-font', $-font-website-value); // 2) The values in the $theme-colors map are already printed by Bootstrap. // 3) The values in the $colors map are also printed by Bootstrap. However, // we have color variables which can contain a reference to a color // combination and that is the info we want in that case. @each $key in ('menu', 'header-sales_one', 'header-sales_two', 'header-sales_three', 'header-sales_four', 'footer', 'copyright'){$-value: map-get($o-color-palette, $key); @if type-of($-value) == 'number'{@include print-variable($key, $-value);}}// 4) The Odoo values map, $o-website-values, must be printed. @each $key, $value in $o-website-values{@include print-variable($key, $value);}// 5) Use final value used by the theme @include print-variable('logo-height', $o-theme-navbar-logo-height); @include print-variable('fixed-logo-height', $o-theme-navbar-fixed-logo-height); $-font-names: map-keys($o-theme-font-configs); @include print-variable('number-of-fonts', length($-font-names)); $i: 1; @each $font-name in $-font-names{@include print-variable('font-number-#{$i}', $font-name); $i: $i + 1;}// Note: font-size are not needed as already added by web_editor for the // font-size dropdown @include print-variable('paragraph-margin-top', $paragraph-margin-top); @include print-variable('paragraph-margin-bottom', $paragraph-margin-bottom); @include print-variable('h2-line-height', $h2-line-height); @include print-variable('h3-line-height', $h3-line-height); @include print-variable('h4-line-height', $h4-line-height); @include print-variable('h5-line-height', $h5-line-height); @include print-variable('h6-line-height', $h6-line-height); @include print-variable('display-1-line-height', $display-1-line-height); @include print-variable('display-2-line-height', $display-2-line-height); @include print-variable('display-3-line-height', $display-3-line-height); @include print-variable('display-4-line-height', $display-4-line-height); // We cannot rely on $o-theme-hx-font because they contain the list of // fallback fonts (unicode...). $-headings-or-main-font: o-website-value('headings-font') or o-website-value('font'); @include print-variable('h2-font', o-website-value('h2-font') or $-headings-or-main-font); @include print-variable('h3-font', o-website-value('h3-font') or $-headings-or-main-font); @include print-variable('h4-font', o-website-value('h4-font') or $-headings-or-main-font); @include print-variable('h5-font', o-website-value('h5-font') or $-headings-or-main-font); @include print-variable('h6-font', o-website-value('h6-font') or $-headings-or-main-font); @include print-variable('display-1-font', o-website-value('display-1-font') or $-headings-or-main-font); @include print-variable('display-2-font', o-website-value('display-2-font') or $-headings-or-main-font); @include print-variable('display-3-font', o-website-value('display-3-font') or $-headings-or-main-font); @include print-variable('display-4-font', o-website-value('display-4-font') or $-headings-or-main-font); @include print-variable('set-headings-font', o-get-font-info('headings')); @include print-variable('set-h2-font', o-get-font-info('h2')); @include print-variable('set-h3-font', o-get-font-info('h3')); @include print-variable('set-h4-font', o-get-font-info('h4')); @include print-variable('set-h5-font', o-get-font-info('h5')); @include print-variable('set-h6-font', o-get-font-info('h6')); @include print-variable('set-display-1-font', o-get-font-info('display-1')); @include print-variable('set-display-2-font', o-get-font-info('display-2')); @include print-variable('set-display-3-font', o-get-font-info('display-3')); @include print-variable('set-display-4-font', o-get-font-info('display-4')); @include print-variable('headings-line-height', $headings-line-height); @include print-variable('headings-margin-top', $headings-margin-top); @include print-variable('headings-margin-bottom', $headings-margin-bottom); @include print-variable('h2-margin-top', $h2-margin-top); @include print-variable('h3-margin-top', $h3-margin-top); @include print-variable('h4-margin-top', $h4-margin-top); @include print-variable('h5-margin-top', $h5-margin-top); @include print-variable('h6-margin-top', $h6-margin-top); @include print-variable('display-1-margin-top', $display-1-margin-top); @include print-variable('display-2-margin-top', $display-2-margin-top); @include print-variable('display-3-margin-top', $display-3-margin-top); @include print-variable('display-4-margin-top', $display-4-margin-top); @include print-variable('h2-margin-bottom', $h2-margin-bottom); @include print-variable('h3-margin-bottom', $h3-margin-bottom); @include print-variable('h4-margin-bottom', $h4-margin-bottom); @include print-variable('h5-margin-bottom', $h5-margin-bottom); @include print-variable('h6-margin-bottom', $h6-margin-bottom); @include print-variable('display-1-margin-bottom', $display-1-margin-bottom); @include print-variable('display-2-margin-bottom', $display-2-margin-bottom); @include print-variable('display-3-margin-bottom', $display-3-margin-bottom); @include print-variable('display-4-margin-bottom', $display-4-margin-bottom); @include print-variable('set-buttons-font', o-get-font-info('buttons')); @include print-variable('btn-padding-y', $btn-padding-y); @include print-variable('btn-padding-x', $btn-padding-x); @include print-variable('btn-font-size', $btn-font-size); @include print-variable('btn-padding-y-sm', $btn-padding-y-sm); @include print-variable('btn-padding-x-sm', $btn-padding-x-sm); @include print-variable('btn-font-size-sm', $btn-font-size-sm); @include print-variable('btn-padding-y-lg', $btn-padding-y-lg); @include print-variable('btn-padding-x-lg', $btn-padding-x-lg); @include print-variable('btn-font-size-lg', $btn-font-size-lg); @include print-variable('btn-border-width', $btn-border-width); @include print-variable('btn-border-radius', $btn-border-radius); @include print-variable('btn-border-radius-sm', $btn-border-radius-sm); @include print-variable('btn-border-radius-lg', $btn-border-radius-lg); @include print-variable('input-padding-y', $input-padding-y); @include print-variable('input-padding-x', $input-padding-x); @include print-variable('input-font-size', $input-font-size); @include print-variable('input-padding-y-sm', $input-padding-y-sm); @include print-variable('input-padding-x-sm', $input-padding-x-sm); @include print-variable('input-font-size-sm', $input-font-size-sm); @include print-variable('input-padding-y-lg', $input-padding-y-lg); @include print-variable('input-padding-x-lg', $input-padding-x-lg); @include print-variable('input-font-size-lg', $input-font-size-lg); @include print-variable('input-border-width', $input-border-width); @include print-variable('input-border-radius', $input-border-radius); @include print-variable('input-border-radius-sm', $input-border-radius-sm); @include print-variable('input-border-radius-lg', $input-border-radius-lg); @include print-variable('color-palettes-name', $o-original-color-palette-name); @include print-variable('has-customized-colors', $o-has-customized-colors); // 6) Get list of colorpalette custom colors $custom-colors: (); @each $key, $value in $o-color-palette{$custom-colors: append($custom-colors, $key);}@include print-variable('custom-colors', $custom-colors);}@mixin body-image-bg-style(){background-image: url("/#{str-slice(o-website-value('body-image'), 2)}"); background-position: center; background-attachment: fixed; @if o-website-value('body-image-type') == 'pattern'{background-size: auto; background-repeat: repeat;}@else{background-size: cover; background-repeat: no-repeat;}}; #wrapwrap{@if o-website-value('body-image'){@include body-image-bg-style();}@if o-website-value('layout') != 'full'{> main{// The color behind the boxed layout is forced by Odoo. The box // background color uses the `$body-bg` variable. // grep: BOXED_BODY_BG_ODOO background-color: $body-bg;}@include media-breakpoint-up(sm){padding-right: $grid-gutter-width * 2; padding-left: $grid-gutter-width * 2; > *{// When the website is visually acting like a container (eg. // boxed layout), increase its maximum size to handle bigger // horizontal paddings. $-max-widths: (); @each $key, $value in $container-max-widths{$-max-widths: map-merge($-max-widths, ( #{$key}: $value + $grid-gutter-width * 2, ));}@include make-container(0); @include make-container-max-widths($-max-widths);}> header .container{max-width: 100% !important;}// Vertical alignment when top-menu has visually "no background" $-menu-color: o-color('menu-custom') or o-color('menu'); @if (not $-menu-color or $-menu-color == o-color('body')){> header{.navbar, .container{padding-left: 0; padding-right: 0;}}}}@if o-website-value('layout') == 'framed'{@include media-breakpoint-up(md){padding-top: $grid-gutter-width; padding-bottom: $grid-gutter-width * 1.5;}}@else if o-website-value('layout') == 'postcard'{@include media-breakpoint-up(md){$-border-radius: $border-radius-lg; // Don't know why (browser rounding mistake?) but the inner // border radius must be 1px lower for this to be visually ok // (despite the fact there is no border or any space) $-inner-border-radius: $-border-radius - 0.0625rem; > *{margin-bottom: $spacer * 2;}> header{&, &.o_header_affix{.navbar{@include border-bottom-radius($-border-radius);}}}> main, > footer{@include border-radius($-border-radius); .oe_structure > :first-child{@include border-top-radius($-inner-border-radius);}}> main .oe_structure > :last-child, .o_footer_copyright{@include border-bottom-radius($-inner-border-radius);}}}}}// We don't want the area to be visible in edit mode when we edit the popup that // is shared on all pages, otherwise the .o_editable area has a minimum height // when it is focused. #o_shared_blocks{min-height: 0px; height: 0px; &:empty{display: none;}}.navbar{.navbar-collapse{min-width: 0; // Allows it to shrink during loading}.btn{// This was a default bootstrap style before but it was removed from // the library at some point. It seems important in the header so that // the header does not flicker during loading. white-space: nowrap;}.o_menu_image_placeholder{width: 80px !important;}// TODO in master: remove the `#top_menu` selector. #top_menu, .top_menu{flex-wrap: nowrap !important; &.o_menu_loading{overflow: hidden !important; opacity: 0 !important;}}}.navbar-brand, .navbar-text, .navbar .nav-link, .navbar a.js_change_lang span, .navbar a.o_add_language{@if $o-theme-navbar-font != $o-theme-font{font-family: $o-theme-navbar-font;}}.navbar-light{// Style only navbar-light which Odoo is only supposed to use in standard // anyway. Automatically mimic navbar-dark if the user's menu color is dark. // Note: this only works because navbar-light is defined before navbar-dark, // we may want to use a safest way when possible. @include o-apply-colors('menu'); @include o-apply-colors('menu-custom'); $-menu-color: o-color('menu-custom') or o-color('menu'); @if ($-menu-color and color-contrast($-menu-color) != $color-contrast-dark){--NavLinkWithBackground-bg-color: #{rgba($navbar-dark-active-color, .1)}; --NavLinkWithBackground-bg-color--hover: #{rgba($navbar-dark-active-color, .2)}; --NavStretch-placeholder-color: #{rgba($navbar-dark-active-color, .3)}; --HeaderSeparator-bg-color: #{rgba($navbar-dark-active-color, .15)}; @extend .navbar-dark; .btn-close{filter: $btn-close-white-filter;}}@include o-add-gradient('menu-gradient');}// TODO this should be reviewed. While it allowed to choose a color for the // navbar text, there is no :hover effect, the active item is not visible and // the selector is probably too specific and should rather be about extending // bootstrap if possible. #wrapwrap:not(.o_header_overlay) header, header.o_header_is_scrolled{.nav-item > .nav-link > *, .nav-item > .nav-link::after, .js_language_selector span, .badge{color: o-website-value('header-text-color') !important;}}.o_navlink_background{background: var(--NavLinkWithBackground-bg-color, rgba($navbar-light-active-color, .05)); &:hover{background: var(--NavLinkWithBackground-bg-color--hover, rgba($navbar-light-active-color, .1));}}.o_navlink_background_hover:hover{background: var(--NavLinkWithBackground-bg-color, rgba($navbar-light-active-color, .05));}// Apply background color to the offcanvas menu .o_navbar_mobile{height: 100dvh; background-color: o-color('menu-custom') or o-color('menu');}$-header-nav-link-height: $nav-link-height; @if o-website-value('header-font-size'){$-header-nav-link-height: o-website-value('header-font-size') * $line-height-base + $nav-link-padding-y * 2; header{font-size: o-website-value('header-font-size'); .dropdown-menu, .btn{font-size: inherit !important;}}}@if $o-theme-navbar-logo-height{// With default values, this makes it slightly bigger than standard // navbar-brand, which is what we want header .navbar-brand{font-size: $o-theme-navbar-logo-height / $line-height-base; $-logo-padding-y: max(0, $-header-nav-link-height - $o-theme-navbar-logo-height) / 2; &, &.logo{padding-top: $-logo-padding-y; padding-bottom: $-logo-padding-y;}}}.o_footer{@include o-apply-colors('footer'); @include o-apply-colors('footer-custom'); @include o-add-gradient('footer-gradient'); .o_footer_copyright{$-footer-color: o-color('footer-custom') or o-color('footer'); @include o-apply-colors('copyright', $background: $-footer-color); @include o-apply-colors('copyright-custom', $background: $-footer-color); @include o-add-gradient('copyright-gradient');}}hr{// Move the set up color as a border color. Indeed, we may use color-mix to // define that color as a function of currentColor, in which case // Safari 16.5 is known to crash when using that to set the color property. border-top: $hr-height solid $hr-color; color: inherit; // Bootstrap sets up a "background-color" on the hr tag. As we may use a // transparent color as $hr-color, we do not want that. background-color: transparent;}h2{color: map-get($colors, 'o-cc1-h2');}h3{color: map-get($colors, 'o-cc1-h3');}h4{color: map-get($colors, 'o-cc1-h4');}h5{color: map-get($colors, 'o-cc1-h5');}h6{color: map-get($colors, 'o-cc1-h6');}$heading-font-families: () !default; $heading-font-families: map-merge(( "h2": $h2-font-family, "h3": $h3-font-family, "h4": $h4-font-family, "h5": $h5-font-family, "h6": $h6-font-family, "display-1": $display-1-font-family, "display-2": $display-2-font-family, "display-3": $display-3-font-family, "display-4": $display-4-font-family, ), $heading-font-families); $heading-line-heights: () !default; $heading-line-heights: map-merge(( "h2": $h2-line-height, "h3": $h3-line-height, "h4": $h4-line-height, "h5": $h5-line-height, "h6": $h6-line-height, "display-1": $display-1-line-height, "display-2": $display-2-line-height, "display-3": $display-3-line-height, "display-4": $display-4-line-height, ), $heading-line-heights); $heading-margin-tops: () !default; $heading-margin-tops: map-merge(( "h2": $h2-margin-top, "h3": $h3-margin-top, "h4": $h4-margin-top, "h5": $h5-margin-top, "h6": $h6-margin-top, "display-1": $display-1-margin-top, "display-2": $display-2-margin-top, "display-3": $display-3-margin-top, "display-4": $display-4-margin-top, ), $heading-margin-tops); $heading-margin-bottoms: () !default; $heading-margin-bottoms: map-merge(( "h2": $h2-margin-bottom, "h3": $h3-margin-bottom, "h4": $h4-margin-bottom, "h5": $h5-margin-bottom, "h6": $h6-margin-bottom, "display-1": $display-1-margin-bottom, "display-2": $display-2-margin-bottom, "display-3": $display-3-margin-bottom, "display-4": $display-4-margin-bottom, ), $heading-margin-bottoms); h1, h2, h3, h4, h5, h6{line-height: $headings-line-height; margin-top: $headings-margin-top; margin-bottom: $headings-margin-bottom;}@each $selector, $map-key in ("h2" "h2", "h3" "h3", "h4" "h4", "h5" "h5", "h6" "h6", ".display-1" "display-1", ".display-2" "display-2", ".display-3" "display-3", ".display-4" "display-4"){#{$selector}{@if ($headings-font-family != map-get($heading-font-families, $map-key)){font-family: map-get($heading-font-families, $map-key);}@if ($headings-line-height != map-get($heading-line-heights, $map-key)){line-height: map-get($heading-line-heights, $map-key);}@if ($headings-margin-top != map-get($heading-margin-tops, $map-key)){margin-top: map-get($heading-margin-tops, $map-key);}@if ($headings-margin-bottom != map-get($heading-margin-bottoms, $map-key)){margin-bottom: map-get($heading-margin-bottoms, $map-key);}}}.btn{@if ($o-theme-buttons-font != $o-theme-font){font-family: $o-theme-buttons-font;}}// Texts p{margin-top: $paragraph-margin-top;}font[style*='background']:not(.text-gradient), font[class*='bg-']{// Not adding any horizontal padding is important as it ensures that several // features work: // - Highlighting part of a word -> you don't want the word to be split // - Coloring a word inside a highlighted sentence -> in this case, the DOM // is a succession of 3 <font> elements, the word one with both the // background-color and the color. // - Even in the good cases, you might just not want the padding, to align // the highlighted element with the general layout. // => The user can still add surrounding spaces if needed anyway which is // actually both technically and functionally intuitive. $-base-padding: 0.05em; $-bottom-factor: 2; padding: MAX($-base-padding, 1px) 0 MAX(($-bottom-factor * $-base-padding), ($-bottom-factor * 1px));}// Icons .fa{$-size: map-get($spacers, 5); font-family: "FontAwesome" !important; &.rounded-circle, &.rounded, &.rounded-0, &.rounded-leaf, &.img-thumbnail, &.shadow{display: inline-block; vertical-align: middle; text-align: center; // fa-1x is not ouput width: $-size; height: $-size; line-height: $-size; @for $i from 2 through 5{&.fa-#{$i}x{width: $-size + $i; height: $-size + $i; line-height: $-size + $i;}}// Default, if no background-color already selected background-color: $gray-100;}&.img-thumbnail{padding: 0;}&.rounded-leaf{border-top-left-radius: $-size; border-bottom-right-radius: $-size;}&.rounded-empty-circle{@extend .rounded-circle; border-width: ceil(1.4 * $border-width); border-style: solid; background: transparent;}}// Smaller container .o_container_small{@extend .container; @include media-breakpoint-up(lg){max-width: map-get($container-max-widths, md);}}// Buttons .btn{&.flat{border: 0; letter-spacing: 0.05em; text-transform: uppercase; @include button-size(0.75rem, 1.5rem, ($font-size-base * .75), 0); &.btn-lg{@include button-size(1rem, 2rem, ($font-size-lg * .75), 0);}&.btn-sm{@include button-size(.5rem, 1rem, ($font-size-sm * .75), 0);}&.btn-xs{@include button-size(.25rem, .5rem, ($font-size-base * .5), 0);}}&.rounded-circle{border-radius: 100px !important; @include button-size(0.45rem, 1.35rem, $font-size-base, 30px); &.btn-lg{@include button-size(.6rem, 1.8rem, $font-size-lg, 30px);}&.btn-sm{@include button-size(.3rem, .9rem, $font-size-sm, 30px);}&.btn-xs{@include button-size(.15rem, .45rem, ($font-size-base * .75), 30px);}}}// Background Images .oe_img_bg{background-size: cover; background-repeat: no-repeat; &.o_bg_img_opt_repeat{background-size: auto; background-repeat: repeat;}&.o_bg_img_center{background-position: center;}// Compatibility <= 13.0, TODO remove? // ----------------------------------- &.o_bg_img_opt_contain{background-size: contain; background-position: center center;}&.o_bg_img_opt_custom{background-size: auto;}&.o_bg_img_opt_repeat_x{background-repeat: repeat-x;}&.o_bg_img_opt_repeat_y{background-repeat: repeat-y;}}// Background videos .o_bg_video_container{@extend %o-we-background-layer;}.o_bg_video_iframe{position: relative; pointer-events: none !important;}.o_bg_video_loading{@include o-position-absolute(0, 0 ,0 ,0);}.o_background_video, .parallax{@extend %o-we-background-layer-parent;}// Probably outdated // Disable fixed height @include media-breakpoint-down(md){section, .parallax, .row, .hr, .blockquote{height: auto !important;}}// Probably outdated // Table .table_desc{margin: 0 0 20px 0; width: 100%; word-break: break-all; border: 1px solid #dddddd;}.table_heading{background-color: #f5f5f5; border: 1px solid #dddddd; color: #666666; @include font-size(14px); padding: 4px;}table.table_desc tr td{text-align: left; padding: 5px; @include font-size(13px); &:first-child{width: 25%; font-weight: bold; border-bottom: 1px solid #c9c9c9; border-right: 1px solid #c9c9c9; border-left: none;}&:last-child{border-bottom: 1px solid #c9c9c9;}}// Jumbotron .jumbotron{border-radius: 0;}.o_full_screen_height{display: flex; flex-direction: column; justify-content: space-around; min-height: 100vh !important;}.o_half_screen_height{@extend .o_full_screen_height; min-height: 55vh !important;}// TODO remove cover_full and cover_mid classes (kept for compatibility for now) .cover_full{@extend .o_full_screen_height;}.cover_mid{@extend .o_half_screen_height;}// Allows custom border radius without contents overflowing. .card{overflow: hidden;}// // Snippets // // Carousel -> TODO: should be versioned in 000.scss file but how ? .s_carousel, .s_quotes_carousel{// Controls .carousel-control-prev, .carousel-control-next{position: absolute; cursor: pointer; width: 8%; opacity: 1;}@include media-breakpoint-down(md){.carousel-control-prev, .carousel-control-next{display: none; // remove arrows on mobile}}.carousel-control-prev{justify-content: flex-start;}.carousel-control-next{justify-content: flex-end;}.carousel-control-prev-icon, .carousel-control-next-icon{width: auto; height: auto; background-image: none; color: $body-color; &:before{font-family: "FontAwesome"; display: inline-block; background-color: #fff;}}// Content .carousel-inner{// Create a new stacking context to ensure that elements like indicators // and arrows will always appear on top of the carousel content. isolation: isolate; overflow: hidden; height: 100%; .carousel-item{height: 100%;}}// Indicators .carousel-indicators{position: absolute; li:hover:not(.active){background-color: rgba(255,255,255,.8);}}// Default &.s_carousel_default{// Controls - chevron .carousel-control-prev-icon:before{content: "\f053" #{""}; margin-left: 1.5rem;}.carousel-control-next-icon:before{content: "\f054" #{""}; margin-right: 1.5rem;}.carousel-control-prev-icon:before, .carousel-control-next-icon:before{background-color: rgba(0,0,0,0); @include font-size(2rem); color: #fff; text-shadow: $box-shadow-sm;}// Indicators .carousel-indicators li{height: .6rem; margin-bottom: .5rem; border: 0; border-radius: $border-radius-sm; box-shadow: $box-shadow-sm;}}// Border &.s_carousel_bordered{border: 2rem solid rgba(0,0,0,0); @include media-breakpoint-down(md){border: 0.5rem solid rgba(0,0,0,0);}// Controls - caret .carousel-control-prev-icon:before{content: "\f0d9";}.carousel-control-next-icon:before{content: "\f0da";}.carousel-control-prev-icon:before, .carousel-control-next-icon:before{width: 2rem; height: 6rem; line-height: 6rem; @include font-size(1.5rem);}// Indicators .carousel-indicators li{width: 3rem; height: 1rem;}}// Circle &.s_carousel_rounded{// Container // .carousel-inner{// border-top-left-radius: 10rem; // border-bottom-right-radius: 10rem; //}// Controls - arrow .carousel-control-prev{margin-left: 1.5rem;}.carousel-control-next{margin-right: 1.5rem;}.carousel-control-prev-icon:before{content: "\f060";}.carousel-control-next-icon:before{content: "\f061";}.carousel-control-prev-icon:before, .carousel-control-next-icon:before{width: 4rem; height: 4rem; line-height: 4rem; border-radius: 50%; @include font-size(1.25rem);}// Indicators .carousel-indicators li{width: 1rem; height: 1rem; border-radius: 50%;}}// Boxed &.s_carousel_boxed{@include make-container(); @include make-container-max-widths(); .carousel-item{padding: 0 1rem;}// Controls - angle .carousel-control-prev, .carousel-control-next{align-items: flex-end; margin-bottom: 1.25rem;}.carousel-control-prev{margin-left: 3rem;}.carousel-control-next{margin-right: 3rem;}.carousel-control-prev-icon:before{content: "\f104";}.carousel-control-next-icon:before{content: "\f105";}.carousel-control-prev-icon:before, .carousel-control-next-icon:before{width: 2rem; height: 2rem; line-height: 2rem; @include font-size(1.25rem);}// Indicators .carousel-indicators li{width: 1rem; height: 1rem; &:hover:not(.active){background-color: rgba(255,255,255,.8);}}}}.carousel .container{.carousel-img img{max-height: 95%; padding: 10px;}> .carousel-caption{@include o-position-absolute($right: 50%, $left: 50%); bottom: 20px; > div{position: absolute; text-align: left; padding: 20px; background: rgba(0, 0, 0, 0.4); bottom: 20px;}}> .carousel-image{@include o-position-absolute($top: 5%, $bottom: 5%); max-height: 90%; margin: 0 auto;}.carousel-item.text_image .container{> .carousel-caption{left: 10%; > div{right: 50%; margin-right: -20%; max-width: 550px;}}> .carousel-image{right: 10%; left: 50%;}}.carousel-item.image_text .container{> .carousel-caption{right: 10%; > div{left: 50%; margin-left: -20%; max-width: 550px;}}> .carousel-image{right: 50%; left: 10%;}}.carousel-item.text_only .container{> .carousel-caption{left: 10%; right: 10%; top: 10%; bottom: auto; > div{text-align: center; background: transparent; bottom: auto; width: 100%;}}> .carousel-image{display: none !important;}}}// Parallax .parallax{// TODO this introduces a limitation: no dropdown will be able to // overflow. Maybe there is a better way to find. &:not(.s_parallax_no_overflow_hidden){overflow: hidden;}> .s_parallax_bg{@extend %o-we-background-layer;}@include media-breakpoint-up(xl){// Fixed backgrounds are disabled when using a mobile/tablet device, // which is not a big deal but, on some of them (iOS...), defining the // background as fixed breaks the background-size/position props. // So we enable this only for >= XL devices. &.s_parallax_is_fixed > .s_parallax_bg{background-attachment: fixed;}}}// Keeps parallax snippet element selectable when Height = auto. .s_parallax{min-height: 10px;}// // Layout // $-transition-duration: 200ms; // Affixed Header .o_header_affixed{display: block; @include o-position-absolute(0, 0, auto, 0); position: fixed; &:not(.o_header_no_transition){transition: transform $-transition-duration;}&.o_header_is_scrolled{.navbar-brand{@include font-size($o-theme-navbar-fixed-logo-height / $line-height-base); img{height: $o-theme-navbar-fixed-logo-height;}}}&.o_header_standard.o_header_is_scrolled{@if index(('menu_logo_below', 'logo_menu_below'), o-website-value('header-template')) != null{.navbar-brand{&, img{transition: none;}}}}.o_header_hide_on_scroll.hidden{max-height: 0; padding-block: 0 !important; overflow: hidden;}}// Navbar .navbar .o_extra_menu_items > .show{> li{+ li{border-top: 1px solid map-get($grays, '200');}> a.dropdown-toggle{background-color: map-get($grays, '200'); color: inherit; // Useful when the toggle is active pointer-events: none; // hack to prevent clicking on it because dropdown always opened}> ul, > .o_mega_menu{// remove dropdown-menu default style as it is nested in another one position: static; float: none; display: block; max-height: none; margin-top: 0; padding: 0; border: none; box-shadow: none;}> .o_mega_menu .row > div{// remove mega menu col-lg-* style width: 100%; flex: auto;}}}$zindex-website-header: $zindex-fixed !default; header{&#top{// We need this z-index for the shadow option of the header but also // to create a stacking context so that header dropdowns appear below // and above the same elements as the header. z-index: $zindex-website-header;}&:not(.o_header_no_transition){// TODO in master: remove the `#o_main_nav` selector. #o_main_nav, .o_main_nav{transition: all $-transition-duration, color 0ms;}.navbar-brand{transition: margin $-transition-duration, font-size $-transition-duration, opacity $-transition-duration ease-out; img{transition: height $-transition-duration;}}}// Dropdown menus // In mobile there is no need to limit the height... @include media-breakpoint-up(lg){.navbar .dropdown-menu{max-height: 60vh; overflow-y: auto; overflow-x: hidden; // Needed because of container in container having 0px padding... TODO improve}}// ... but we limit the navbar-collapse height .navbar-collapse.show{max-height: 80vh; overflow-y: auto; overflow-x: hidden; // Needed because of container in container having 0px padding... TODO improve @include media-breakpoint-down(lg){.nav-link, .dropdown-item{white-space: normal;}}}&:not(.o_header_is_scrolled){$-is-hamburger: o-website-value('header-template') == 'hamburger'; @include media-breakpoint-up(md){@if $-is-hamburger{// TODO in master: remove the `#o_main_nav` selector. #o_main_nav, .o_main_nav{padding-top: $spacer * 0.5; padding-bottom: $spacer * 0.5;}}}}// TODO in master: remove the `#o_main_nav` selector. #o_main_nav, .o_main_nav{flex-direction: inherit;}nav.navbar{@if o-website-value('menu-border-width'){border: o-website-value('menu-border-style') o-color('menu-border-color') !important; border-width: 0 0 o-website-value('menu-border-width') 0 !important; &.o_border_right_only{border-width: 0 o-website-value('menu-border-width') 0 0 !important;}&.o_full_border{border-width: o-website-value('menu-border-width') !important;}}border-radius: o-website-value('menu-border-radius') !important; box-shadow: o-website-value('menu-box-shadow') !important; &.o_header_force_no_radius{border-radius: 0 !important;}}// Prevent the color of the header to impact the color of the nav. &.o_header_is_scrolled, &.o_transitioning.o_header_affixed{background-color: transparent !important;}}@if o-website-value('header-template') == 'sidebar'{@include media-breakpoint-up(lg){#wrapwrap{// Two different website options might add padding: // - The sidebar header template // - The website layout template when different than 'full' // We need to combine both using `calc`. The `border` solution does // not work on Safari. $padding-size: o-website-value('sidebar-width'); @if o-website-value('layout') != 'full'{$padding-size: calc(#{$grid-gutter-width}* 2 + #{$padding-size});}padding-left: $padding-size; > header{inset: 0 auto 0 0; position: fixed; z-index: $zindex-fixed; display: flex; width: o-website-value('sidebar-width'); transform: none !important; .navbar{width: 100%; align-items: start; padding: $spacer; .navbar-brand{max-width: 100%; padding: 0 0 $spacer 0;}// TODO in master: remove the `#o_main_nav` selector. #o_main_nav, .o_main_nav{flex-direction: column; align-items: start; padding: 0;}.navbar-nav{flex-direction: column;}.nav-link, .dropdown-item{white-space: initial;}.dropdown-menu{position: static;}}}}}}@else if o-website-value('header-template') == 'stretch'{#wrapwrap > header input::placeholder{color: #{var(--NavStretch-placeholder-color, $input-placeholder-color)};}#wrapwrap > header .o_extra_menu_items{height: 100%; border-left: $border-width solid var(--NavLinkWithBackground-bg-color--hover, rgba($navbar-light-active-color, .1)); > .nav-link{display: flex; align-items: center; height: 100%;}}}@else if o-website-value('header-template') == 'sales_one'{#wrapwrap .o_header_sales_one_bot{@include o-apply-colors('header-sales_one'); @include o-apply-colors('header-sales_one-custom'); @include o-add-gradient('menu-secondary-gradient');}header#top > nav:not(.o_header_mobile){// TODO in master: remove the `#o_main_nav` selector. #o_main_nav,.o_main_nav{> .container{// TODO: remove in master and add "align-items-center" in the XML. align-items: center;}}}}@else if o-website-value('header-template') == 'sales_two'{#wrapwrap .o_header_sales_two_top{@include o-apply-colors('header-sales_two'); @include o-apply-colors('header-sales_two-custom'); @include o-add-gradient('menu-secondary-gradient');}header#top > nav:not(.o_header_mobile){// TODO in master: remove the `#o_main_nav` and `#top_menu` selectors. #o_main_nav, .o_main_nav{#top_menu, .top_menu{// TODO: remove in master and add "align-items-center" in the XML. align-items: center;}}}}@else if o-website-value('header-template') == 'sales_three'{#wrapwrap .o_header_sales_three_top{@include o-apply-colors('header-sales_three'); @include o-apply-colors('header-sales_three-custom'); @include o-add-gradient('menu-secondary-gradient');}}@else if o-website-value('header-template') == 'sales_four'{#wrapwrap .o_header_sales_four_bot{@include o-apply-colors('header-sales_four'); @include o-apply-colors('header-sales_four-custom'); @include o-add-gradient('menu-secondary-gradient');}header#top > nav:not(.o_header_mobile){// TODO in master: remove the `#o_main_nav` selector. #o_main_nav, .o_main_nav{.navbar-nav{// TODO: remove in master and add "align-items-center" in the XML. align-items: center;}}}}.o_grid_header_3_cols{grid-template-columns: 1fr auto 1fr;}.o_grid_header_3_cols_fixed{grid-template-columns: 1fr 33% 1fr;}.o_header_separator > :not(:last-child)::before{content: ''; position: absolute; inset: 0 0 0 100%; width: $border-width * 2; height: 50%; margin: auto (map-get($spacers, 2) * -1) auto auto; background: var(--HeaderSeparator-bg-color, rgba($navbar-light-active-color, .1));}// Default border color didn't match with background custom colors. // This allows to use the same contrast system than the text but for borders. .o_border_contrast{border-color: var(--NavLinkWithBackground-bg-color--hover, rgba($navbar-light-active-color, .1)) !important;}// Mega menu .o_mega_menu{width: 100%; padding: 0; margin-top: 0 !important; border-radius: 0; background-clip: unset; // Remove the 1px gap introduced by BS4 background-color: transparent; // In order to allow the mega menu to be transparent border: 1px solid $gray-200; // Prevent to see the color of the block behind. .container, .container-fluid{// Need to reforce those because they are removed since its a container // inside another container (the one in the navbar) padding-left: $grid-gutter-width / 2; padding-right: $grid-gutter-width / 2;}}.dropdown-menu.o_mega_menu_container_size{$-header-template: o-website-value('header-template'); @if not index(('sidebar', 'hamburger'), $-header-template){$bp: if($-header-template == 'minimalist', md, lg); @include media-breakpoint-up($bp){left: 50%; transform: translateX(-50%);}}$-mm-max-widths: (); @each $k, $v in $container-max-widths{$-mm-max-widths: map-merge($-mm-max-widths, ( #{$k}: $v - $grid-gutter-width, ));}@include make-container-max-widths($-mm-max-widths);}// The design of some of the new mega menu templates required a column with // an overlay that would overflow until the end of the container. For // technical reasons, this overlay has to be hardcoded here. %s_mega_menu_gray_area{z-index: 1; &:before{content: ''; display: block; width: 100vw; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; pointer-events: none; background: rgba(0, 0, 0, .05);}}#wrapwrap.o_header_overlay{> header:not(.o_header_affixed):not(.o_header_sidebar){@include o-position-absolute(0, 0, auto, 0); z-index: 1000; > .navbar{// Prevent the nav color/gradient to impact the header color. background-color: transparent !important; background-image: none !important; border-color: transparent; color: inherit !important;}&:not(.o_top_menu_collapse_shown) > .navbar{@include o-apply-colors(1); // Reset to default colored components .nav-item{> .nav-link{&, &:hover{background-color: transparent; color: inherit;}&.active{font-weight: bolder;}}}.o_header_mobile_buttons_wrap, .btn[data-bs-toggle="offcanvas"]{color: inherit;}.navbar-toggler-icon{background-color: currentColor; background-image: none; mask: $navbar-light-toggler-icon-bg; -webkit-mask: $navbar-light-toggler-icon-bg;}}}}// Navbar Links Styles @if index(('block', 'border-bottom'), o-website-value('header-links-style')){@include media-breakpoint-up(md){.navbar, .navbar-nav{padding-top: 0; padding-bottom: 0;}}}.navbar-nav{.nav-link:not(.o_nav-link_secondary){@if o-website-value('header-links-style') == 'outline'{// Need to force the padding in this case so that it stays in mobile padding-right: $navbar-nav-link-padding-x; padding-left: $navbar-nav-link-padding-x; border: $border-width solid transparent; @include border-radius($nav-pills-border-radius);}@else if o-website-value('header-links-style') == 'block'{// There is no way to control navbar links vertical padding in BS4 // independently from nav ones, just double them here instead padding-top: $nav-link-padding-y * 2; padding-bottom: $nav-link-padding-y * 2; @include border-radius(0);}@else if o-website-value('header-links-style') == 'border-bottom'{// There is no way to control navbar links vertical padding in BS4 // independently from nav ones, just double them here instead padding-top: ($nav-link-padding-y * 2); padding-bottom: ($nav-link-padding-y * 2); border-bottom: $nav-link-padding-y solid transparent; // Replace horizontal paddings by margins (do this with an extra // class to override .navbar-expand-* paddings priority). .navbar &{padding-left: 0; padding-right: 0; margin: 0 $navbar-nav-link-padding-x;}}}@if index(('outline', 'border-bottom'), o-website-value('header-links-style')){.nav-link.active, .show > .nav-link{border-color: currentColor;}}}@if index(('slideout_slide_hover', 'slideout_shadow'), o-website-value('footer-effect')){@include media-breakpoint-up(lg){#wrapwrap.o_footer_effect_enable{> main{@if o-website-value('layout') == 'full'{// Ensure a transparent snippet at the end of the content // still appears with the same background when hovering the // footer during the scroll effect. @if o-website-value('body-image'){@include body-image-bg-style();}@else{background-color: $body-bg;}}@if o-website-value('footer-effect') == 'slideout_shadow'{box-shadow: $box-shadow;}}> footer{@include o-position-sticky(auto, 0, 0, 0); z-index: -1;}}}}// Step wizard used in /shop, /event, appointment .o_wizard{$o_wizard_circle_progress_size: 64px; .o_wizard_step_active{@include media-breakpoint-up(md){color: $body-color;}}.o_wizard_circle_progress{&, &:before{width: $o_wizard_circle_progress_size; height: $o_wizard_circle_progress_size; line-height: $o_wizard_circle_progress_size;}&:before{position: absolute; border-radius: 50%; box-shadow: inset 0 0 0 map-get($border-widths, 5) currentColor; opacity: .2; content: "";}}.o_wizard_circle_progress_left .progress-bar{border-radius: 0 ($o_wizard_circle_progress_size * .5) ($o_wizard_circle_progress_size * .5) 0; transform-origin: center left; transform: rotate(var(--leftProgress));}.o_wizard_circle_progress_right .progress-bar{border-radius: ($o_wizard_circle_progress_size * .5) 0 0 ($o_wizard_circle_progress_size * .5); transform-origin: center right; transform: rotate(var(--rightProgress));}}// Language selector .js_language_selector{.dropdown-menu{min-width: 0;}a.list-inline-item{padding: 3px 0;}}.o_lang_flag{width: 1em; height: 1em; margin-right: 0.2em; border-radius: $border-radius-pill; object-fit: cover; box-shadow: rgba(0, 0, 0, 0.429) 1px 1px 1px;}span.list-inline-item.o_add_language:last-child{display: none !important; // Hide the separator if it is the last list item}// Footer scrolltop button @if o-website-value('footer-scrolltop'){#o_footer_scrolltop_wrapper{position: relative; z-index: 1;}#o_footer_scrolltop{$-footer-color: o-color('footer-custom') or o-color('footer') or rgba(0, 0, 0, 0); $-footer-color: mix(rgba($-footer-color, 1.0), $body-bg, percentage(alpha($-footer-color))); $-copyright-color: o-color('copyright-custom') or o-color('copyright') or rgba(0, 0, 0, 0); $-copyright-color: mix(rgba($-copyright-color, 1.0), $-footer-color, percentage(alpha($-copyright-color))); box-sizing: content-box; width: 3rem; height: 3rem; border: 0; padding: 0; @include o-apply-colors($-footer-color, $with-extras: false, $background: $-footer-color); text-decoration: none; @if $-footer-color == $-copyright-color{color: rgba(color-contrast($-footer-color), 0.5);}&:hover, &:focus{@include o-apply-colors($-copyright-color, $with-extras: false, $background: $-footer-color); text-decoration: none;}}}// Figure with special style .o_figure_relative_layout{position: relative; .figure-img{margin-bottom: 0;}.figure-caption{@include o-position-absolute(auto, 0, 0, 0); @include o-bg-color(rgba(map-get($theme-colors, 'dark'), $o-theme-figcaption-opacity)); padding: $tooltip-padding-y $tooltip-padding-x; font-weight: $font-weight-bold; a{color: inherit;}}}@each $color, $value in $theme-colors{.bg-#{$color}-light{background-color: rgba($value, 0.1);}}@each $media, $color in $o-social-colors{@include text-emphasis-variant(".text-#{$media}", $color);}// TODO: Will be handled properly in master/saas-12.2, temp fix for website_event.registration_attendee_details .modal-footer > .float-start{margin-right: auto;}// CoverProperties .o_record_cover_container{position: relative; .o_record_cover_component{@include o-position-absolute(0, 0, 0, 0); background-size: cover; background-position: center; background-repeat: no-repeat;}}// Scroll down button .o_scroll_button{@include o-position-absolute(auto, 0, 0, 0); display: flex; width: 50px; height: 50px; animation: o-anim-heartbeat 2.6s ease-in-out 1s infinite; &, &:hover{text-decoration: none;}&:focus{outline: none;}&:hover{animation-iteration-count: 1;}}// Attention keeper for the "scroll down" top-banner button @keyframes o-anim-heartbeat{0%, 14%, 35%{transform: scale(1);}7%, 21%{transform: scale(1.3); background-color: rgba(map-get($theme-colors, 'primary'), 0.8);}}// Ribbons $ribbon-padding: 100px; .o_ribbon{margin: 0; @include font-size(1rem); font-weight: bold; white-space: nowrap; text-align: center; pointer-events: none;}.o_ribbon_right{@include o-ribbon-right();}.o_ribbon_left{@include o-ribbon-left();}.o_tag_right{@include o-tag-right();}.o_tag_left{@include o-tag-left();}// Conditional visibility .o_conditional_hidden{display: none !important;}// Cookies Bar #website_cookies_bar{min-height: 0px; height: 0px;}// Search results .o_search_result_item_detail{flex: 1;}.o_cookies_bar_toggle{inset-inline-end: 1rem; inset-block-end: var(--cookies-bar-toggle-inset-block-end, 1rem); z-index: $zindex-modal + 1; // Over the modal backdrop.}.o_website_btn_loading{opacity: $btn-disabled-opacity; .fa:not(.fa-spin){display: none;}}ul.o_checklist > li.o_checked::after{left: - ($o-checklist-margin-left - $o-checklist-checkmark-width) - 1; top: 0;}// Bottom fixed element (e.g. livechat button) .modal-open .o_bottom_fixed_element, .o_bottom_fixed_element_hidden{// Prevent bottom fixed elements from hidding buttons and // hide them if a modal is open. display: none !important;}// On translation editor, inputs & textareas with translatable "placeholder" and // "value" will get HTML content as translation value for the attributes. // The goal here is to hide these values until the editor's code sets the right // ones on elements. The `o_text_content_invisible` class is mainly used on JS // to have the same behaviour for textareas, since it's not possible to target // them on CSS using the "value" attribute unlike inputs. .o_text_content_invisible{color: transparent !important;}[placeholder*="data-oe-translation-initial-sha"]{&::-webkit-input-placeholder{color: transparent; opacity: 0;}&::-moz-placeholder{color: transparent; opacity: 0;}}input[value*="data-oe-translation-initial-sha"]{@extend .o_text_content_invisible;}[data-oe-translation-initial-sha]{> .o_translation_select{border: $input-border-width solid $input-border-color; @include border-radius($input-border-radius, 0); // Hide translatable `<select/>`s since we use `.o_translation_select` // elements to handle translations. + select{display: none !important;}> div:not(:last-child){border-bottom: inherit;}}}// Offcanvas menu for in page filters (e.g. product list) .o_website_offcanvas .accordion-button{// Since this nav is visible on mobile only, remove all visual // effects related to keyboard/mouse navigation. &, &:focus, &:hover{box-shadow: none; z-index: 0;}}// Notification .o_notification_manager .o_notification{--Notification__background-color: #{$body-bg};}//------------------------------------------------------------------------------ // Website Animate //------------------------------------------------------------------------------ .o_animate{// Elements with an animation must always be above the elements that are // around so that the animation is fully visible. z-index: 1; animation-duration: 1s; animation-fill-mode: both; transform: translate3d(0,0,0); // force GPU acceleration backface-visibility: hidden; // avoid flickering text-rendering: geometricPrecision; // take care of animated titles visibility: hidden; --wanim-intensity: 50; --wanim-intensity-squared: calc(var(--wanim-intensity) * var(--wanim-intensity)); --wanim-zoom-out-scale: calc(1 + (var(--wanim-intensity-squared) / 8333.3)); --wanim-zoom-in-scale: calc(1.01 - (var(--wanim-intensity) / 100 )); --wanim-zoom-in-scale-60: calc(var(--wanim-zoom-in-scale) + ((1 - var(--wanim-zoom-in-scale)) / 2)); --wanim-opacity-adjustment: 0; &:not(.o_animating):not(.o_animate_in_dropdown){transform: none !important;}}.o_animate_preview{visibility: visible;}.o_wanim_overflow_xy_hidden{overflow-x: hidden !important; &.o_rtl, .o_rtl{// Fix for Chrome and Edge bug: resolves slow/stuck scrolling during // left-overflowing animations on RTL web pages. Note: using overflow on // the main element hides animated elements outside of it (e.g. "Framed" // page layout). This may not be the ideal solution but could be the // best workaround for now. > main{overflow-x: hidden;}}.o_footer_slideout{overflow-y: hidden !important;}}.o_animated_text{display: inline-block;}.o_animate_on_scroll{animation-play-state: paused; --wanim-opacity-adjustment: 1;}// Slide ////////////////////////////////////////////////////////////////////// @keyframes o_anim_slide_in_down{0%{opacity: 0; transform: translate(0, calc(-2% * var(--wanim-intensity)));}10%{opacity: 1;}100%{transform: translate(0, 0);}}.o_anim_slide_in.o_anim_from_top{animation-name: o_anim_slide_in_down;}@keyframes o_anim_slide_in_left{0%{opacity: 0; transform: translate(calc(-2% * var(--wanim-intensity)), 0);}10%{opacity: 1;}100%{transform: translate(0, 0);}}.o_anim_slide_in.o_anim_from_left{animation-name: o_anim_slide_in_left;}@keyframes o_anim_slide_in_right{0%{opacity: 0; transform: translate(calc(2% * var(--wanim-intensity)), 0);}10%{opacity: 1;}100%{transform: translate(0, 0);}}.o_anim_slide_in.o_anim_from_right{animation-name: o_anim_slide_in_right;}@keyframes o_anim_slide_in_up{0%{opacity: 0; transform: translate(0, calc(2% * var(--wanim-intensity)));}10%{opacity: 1;}100%{transform: translate(0, 0);}}.o_anim_slide_in.o_anim_from_bottom{animation-name: o_anim_slide_in_up;}// Bounce ///////////////////////////////////////////////////////////////////// @keyframes o_anim_bounce_in{0%, 20%, 40%, 60%, 80%, 100%{transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}0%{opacity: 0; transform: scale(calc(1 - (var(--wanim-intensity) / 71.4)));}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}20%{transform: scale(calc(1 + (var(--wanim-intensity-squared) / 25000)));}40%{transform: scale(calc(1 - (var(--wanim-intensity-squared) / 25000)));}60%{opacity: 1; transform: scale(calc(1 + (var(--wanim-intensity-squared) / 83333.3)));}80%{transform: scale(calc(1 - (var(--wanim-intensity-squared) / 83333.3)));}100%{opacity: 1; transform: scale(1);}}.o_anim_bounce_in{animation-name: o_anim_bounce_in;}@keyframes o_anim_bounce_in_down{0%, 20%, 40%, 60%, 80%, 100%{transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}0%{opacity: 0; transform: translate(0, -3000px);}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}60%{opacity: 1; transform: translate(0, calc(1px * (var(--wanim-intensity-squared) / 100)));}75%{transform: translate(0, calc(-1px * (var(--wanim-intensity-squared) / 250)));}90%{transform: translate(0, calc(1px * (var(--wanim-intensity-squared) / 500)));}100%{transform: translate(0, 0);}}.o_anim_bounce_in.o_anim_from_top{animation-name: o_anim_bounce_in_down;}@keyframes o_anim_bounce_in_left{0%, 20%, 40%, 60%, 80%, 100%{transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}0%{opacity: 0; transform: translate(-3000px, 0);}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}60%{opacity: 1; transform: translate(calc(1px * (var(--wanim-intensity-squared) / 100)), 0);}75%{transform: translate(calc(-1px * (var(--wanim-intensity-squared) / 250)), 0);}90%{transform: translate(calc(1px * (var(--wanim-intensity-squared) / 500)), 0);}100%{transform: translate(0, 0);}}.o_anim_bounce_in.o_anim_from_left{animation-name: o_anim_bounce_in_left;}@keyframes o_anim_bounce_in_right{0%, 20%, 40%, 60%, 80%, 100%{transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}0%{opacity: 0; transform: translate(3000px, 0);}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}60%{opacity: 1; transform: translate(calc(-1px * (var(--wanim-intensity-squared) / 100)), 0);}75%{transform: translate(calc(1px * (var(--wanim-intensity-squared) / 250)), 0);}90%{transform: translate(calc(-1px * (var(--wanim-intensity-squared) / 500)), 0);}100%{transform: translate(0, 0);}}.o_anim_bounce_in.o_anim_from_right{animation-name: o_anim_bounce_in_right;}@keyframes o_anim_bounce_in_up{0%, 20%, 40%, 60%, 80%, 100%{transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}0%{opacity: 0; transform: translate(0, 3000px);}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}60%{opacity: 1; transform: translate(0, calc(-1px * (var(--wanim-intensity-squared) / 100)));}75%{transform: translate(0, calc(1px * (var(--wanim-intensity-squared) / 250)));}90%{transform: translate(0, calc(-1px * (var(--wanim-intensity-squared) / 500)));}100%{transform: translate(0, 0);}}.o_anim_bounce_in.o_anim_from_bottom{animation-name: o_anim_bounce_in_up;}// Fade /////////////////////////////////////////////////////////////////////// @keyframes o_anim_fade_in{0%{opacity: 0;}100%{opacity: 1;}}.o_anim_fade_in{animation-name: o_anim_fade_in;}@keyframes o_anim_fade_in_down{0%{opacity: 0; transform: translate(0, calc(-2% * var(--wanim-intensity)));}100%{opacity: 1; transform: translate(0, 0);}}.o_anim_fade_in.o_anim_from_top{animation-name: o_anim_fade_in_down;}@keyframes o_anim_fade_in_left{0%{opacity: 0; transform: translate(calc(-2% * var(--wanim-intensity)), 0);}100%{opacity: 1; transform: translate(0, 0);}}.o_anim_fade_in.o_anim_from_left{animation-name: o_anim_fade_in_left;}@keyframes o_anim_fade_in_right{0%{opacity: 0; transform: translate(calc(2% * var(--wanim-intensity)), 0);}100%{opacity: 1; transform: translate(0, 0);}}.o_anim_fade_in.o_anim_from_right{animation-name: o_anim_fade_in_right;}@keyframes o_anim_fade_in_up{0%{opacity: 0; transform: translate(0, calc(2% * var(--wanim-intensity)));}100%{opacity: 1; transform: translate(0, 0);}}.o_anim_fade_in.o_anim_from_bottom{animation-name: o_anim_fade_in_up;}@keyframes o_anim_fade_out{0%{opacity: 1;}100%{opacity: 0;}}.o_anim_fade_out{animation-name: o_anim_fade_out;}// Rotate ///////////////////////////////////////////////////////////////////// @keyframes o_anim_rotate_in{0%{opacity: 0; transform: rotate(calc(-1deg * (5 + (var(--wanim-intensity-squared) / 12.82))));}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1; transform: rotate(0);}}.o_anim_rotate_in{animation-name: o_anim_rotate_in;}@keyframes o_anim_rotate_in_down_left{0%{opacity: 0; transform-origin: left bottom; transform: rotate(calc(-1deg * (5 + (var(--wanim-intensity-squared) / 62.5))));}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1; transform-origin: left bottom; transform: rotate(0);}}.o_anim_rotate_in.o_anim_from_bottom_left{animation-name: o_anim_rotate_in_down_left;}@keyframes o_anim_rotate_in_down_right{0%{opacity: 0; transform-origin: right bottom; transform: rotate(calc(1deg * (5 + (var(--wanim-intensity-squared) / 62.5))));}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1; transform-origin: right bottom; transform: rotate(0);}}.o_anim_rotate_in.o_anim_from_bottom_right{animation-name: o_anim_rotate_in_down_right;}@keyframes o_anim_rotate_in_up_left{0%{opacity: 0; transform-origin: left top; transform: rotate(calc(1deg * (5 + (var(--wanim-intensity-squared) / 62.5))));}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1; transform-origin: left top; transform: rotate(0);}}.o_anim_rotate_in.o_anim_from_top_left{animation-name: o_anim_rotate_in_up_left;}@keyframes o_anim_rotate_in_up_right{0%{opacity: 0; transform-origin: right top; transform: rotate(calc(-1deg * (5 + (var(--wanim-intensity-squared) / 62.5))));}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1; transform-origin: right top; transform: rotate(0);}}.o_anim_rotate_in.o_anim_from_top_right{animation-name: o_anim_rotate_in_up_right;}// Zoom out /////////////////////////////////////////////////////////////////// @keyframes o_anim_zoom_out{0%{opacity: 0; transform: scale(var(--wanim-zoom-out-scale));}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1;}}.o_anim_zoom_out{animation-name: o_anim_zoom_out;}@keyframes o_anim_zoom_out_right{0%{opacity: 0; transform: scale(var(--wanim-zoom-out-scale)) translate(100%, 0);}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1;}}.o_anim_zoom_out.o_anim_from_right{animation-name: o_anim_zoom_out_right;}@keyframes o_anim_zoom_out_left{0%{opacity: 0; transform: scale(var(--wanim-zoom-out-scale)) translate(-100%, 0);}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1;}}.o_anim_zoom_out.o_anim_from_left{animation-name: o_anim_zoom_out_left;}@keyframes o_anim_zoom_out_bottom{0%{opacity: 0; transform: scale(var(--wanim-zoom-out-scale)) translate(0, 100%);}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1;}}.o_anim_zoom_out.o_anim_from_bottom{animation-name: o_anim_zoom_out_bottom;}@keyframes o_anim_zoom_out_top{0%{opacity: 0; transform: scale(var(--wanim-zoom-out-scale)) translate(0, -100%);}10%{opacity: calc(0.1 + (0.9 * (var(--wanim-opacity-adjustment))));}100%{opacity: 1;}}.o_anim_zoom_out.o_anim_from_top{animation-name: o_anim_zoom_out_top;}// Zoom in //////////////////////////////////////////////////////////////////// @keyframes o_anim_zoom_in{0%{opacity: 0; transform: scale(var(--wanim-zoom-in-scale));}10%{opacity: calc(0.2 + (0.8 * (var(--wanim-opacity-adjustment))));}50%{opacity: 1;}}.o_anim_zoom_in{animation-name: o_anim_zoom_in;}@keyframes o_anim_zoom_in_down{0%{opacity: 0; transform: scale(var(--wanim-zoom-in-scale)) translate(0, calc(-0.1px * var(--wanim-intensity-squared))); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}60%{opacity: 1; transform: scale(var(--wanim-zoom-in-scale-60)) translate(0, calc(1px * var(--wanim-intensity))); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);}}.o_anim_zoom_in.o_anim_from_top{animation-name: o_anim_zoom_in_down;}@keyframes o_anim_zoom_in_up{0%{opacity: 0; transform: scale(var(--wanim-zoom-in-scale)) translate(0, calc(0.1px * var(--wanim-intensity-squared))); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}60%{opacity: 1; transform: scale(var(--wanim-zoom-in-scale-60)) translate(0, calc(-1px * var(--wanim-intensity))); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);}}.o_anim_zoom_in.o_anim_from_bottom{animation-name: o_anim_zoom_in_up;}@keyframes o_anim_zoom_in_left{0%{opacity: 0; transform: scale(var(--wanim-zoom-in-scale)) translate(calc(-0.1px * var(--wanim-intensity-squared)), 0); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}60%{opacity: 1; transform: scale(var(--wanim-zoom-in-scale-60)) translate(calc(0.2px * var(--wanim-intensity)), 0); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);}}.o_anim_zoom_in.o_anim_from_left{animation-name: o_anim_zoom_in_left;}@keyframes o_anim_zoom_in_right{0%{opacity: 0; transform: scale(var(--wanim-zoom-in-scale)) translate(calc(0.1px * var(--wanim-intensity-squared)), 0); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);}10%{opacity: calc(0.15 + (0.85 * (var(--wanim-opacity-adjustment))));}60%{opacity: 1; transform: scale(var(--wanim-zoom-in-scale-60)) translate(calc(-0.2px * var(--wanim-intensity)), 0); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);}}.o_anim_zoom_in.o_anim_from_right{animation-name: o_anim_zoom_in_right;}// Flash / Pulse / Shake / Tada /////////////////////////////////////////////// @keyframes o_anim_flash{0%, 50%, 100%{opacity: 1;}25%, 75%{opacity: calc(1 - (var(--wanim-intensity) / 100));}}.o_anim_flash{animation-name: o_anim_flash;}@keyframes o_anim_pulse{0%{transform: scale(1);}50%{transform: scale(calc(1.01 + (0.000016 * var(--wanim-intensity-squared))));}100%{transform: scale(1);}}.o_anim_pulse{animation-name: o_anim_pulse;}@keyframes o_anim_shake{0%, 100%{transform: translate(0, 0);}10%, 30%, 50%, 70%, 90%{transform: translate(calc(-1px - (0.0036px * var(--wanim-intensity-squared))), 0);}20%, 40%, 60%, 80%{transform: translate(calc(1px + (0.0036px * var(--wanim-intensity-squared))), 0);}}.o_anim_shake{animation-name: o_anim_shake;}@keyframes o_anim_tada{0%{transform: scale(1);}10%, 20%{transform: scale(calc(1 - (0.00004 * var(--wanim-intensity-squared)))) rotate(calc(-2deg - (0.02deg * var(--wanim-intensity))));}30%, 50%, 70%, 90%{transform: scale(calc(1 + (0.00004 * var(--wanim-intensity-squared)))) rotate(calc(2deg + (0.02deg * var(--wanim-intensity))));}40%, 60%, 80%{transform: scale(calc(1 + (0.00004 * var(--wanim-intensity-squared)))) rotate(calc(-2deg - (0.02deg * var(--wanim-intensity))));}100%{transform: scale(1);}}.o_anim_tada{animation-name: o_anim_tada;}// Flip in //////////////////////////////////////////////////////////////////// @keyframes o_anim_flip_in_x{0%{transform: perspective(1000px) rotateX(calc(1deg * (5 + (var(--wanim-intensity) * 1.7)))); opacity: 0;}50%{opacity: 1;}}.o_anim_flip_in_x{backface-visibility: visible; animation-name: o_anim_flip_in_x; transition-timing-function: ease-out;}@keyframes o_anim_flip_in_y{0%{transform: perspective(1000px) rotateY(calc(1deg * (5 + (var(--wanim-intensity) * 1.7)))); opacity: 0;}50%{opacity: 1;}}.o_anim_flip_in_y{backface-visibility: visible; animation-name: o_anim_flip_in_y; transition-timing-function: ease-out;}//------------------------------------------------------------------------------ // Website Text Highlight Effects //------------------------------------------------------------------------------ .o_text_highlight{--text-highlight-color: currentColor; // Default style for irregular text highlights. &.o_text_highlight_fill{--text-highlight-color: var(--primary); --text-highlight-width: 0px !important;}// Text highlight SVG container. > .o_text_highlight_item{position: relative; display: inline-block; line-height: normal; white-space: pre-wrap; isolation: isolate; > *{text-decoration: none;}svg{z-index: -1;}}}// Compatibility <= 13.0 .o_anim_dur500{animation-duration: 500ms;}.o_anim_dur1500{animation-duration: 1500ms;}.o_anim_dur2000{animation-duration: 2000ms;}.o_anim_dur2500{animation-duration: 2500ms;}.o_anim_dur3000{animation-duration: 3000ms;}.o_anim_del500{animation-delay: 500ms;}.o_anim_del1000{animation-delay: 1000ms;}.o_anim_del1500{animation-delay: 1500ms;}.o_anim_del2000{animation-delay: 2000ms;}.o_anim_del2500{animation-delay: 2500ms;}// Odoo dropdown menu .o_dropdown_menu{@extend .dropdown-menu;}// Override web_editor's rules .o_table tr{border-color: $table-border-color;}// Disables the offset on dropdown to match relative position in mobile/offcanvas. .o_dropdown_without_offset{transform: none !important;}

/* /website/static/src/scss/website_controller_page.scss */
.o_website_tag{vertical-align: middle; @for $size from 1 through length($o-colors){&.o_tag_color_#{$size - 1}{$background-color: white; // no color selected @if $size == 1{&{color: black; background-color: $background-color; box-shadow: inset 0 0 0 1px nth($o-colors, $size);}}@else{$background-color: nth($o-colors, $size); &{color: white; background-color: $background-color;}}@at-root a#{&}{&:hover{color: color-contrast($background-color); background-color: darken($background-color, 10%);}}}}}.o_website_record{transition: box-shadow ease-in 0.1s; &:hover{box-shadow: 0 5px 25px -10px black;}.o_website_image{object-fit: cover;}}.o_website_grid{.o_website_record{grid-template-rows: auto 1.5em 8em; .o_website_tags{grid-row: 2;}.card-body{grid-row: 3;}.o_website_image{height: 12em !important;}}}.o_website_list{.o_website_record{grid-template-columns: 10% 65% 25%; height: 6em; .o_website_tags{grid-column: 3; grid-row: 1;}.card-body{grid-column: 2; grid-row: 1;}}}.o_website_record_page{.o_website_html{padding: 0 3vw;}.o_website_image{max-height: 90vh; object-fit: contain;}}

/* /website/static/src/scss/website.ui.scss */
/// /// This file regroups main website UI layout rules (when the user is connected) /// and the UI components rules. /// $-mini-nav-size: 40px; .o_frontend_to_backend_nav{@include o-position-absolute(0, auto, auto, 0); z-index: $zindex-modal; @include font-size($o-font-size-base); &::before{content: ""; @include o-position-absolute(0, auto, auto, 0); border-top: $-mini-nav-size/2 solid $o-enterprise-color; border-left: $-mini-nav-size/2 solid $o-enterprise-color; border-bottom: $-mini-nav-size/2 solid transparent; border-right: $-mini-nav-size/2 solid transparent; cursor: pointer;}&::before, .o_frontend_to_backend_icon, .o_frontend_to_backend_buttons{transform-origin: top left; transition: transform 400ms ease 1s;}.o_frontend_to_backend_buttons{transition-duration: 800ms;}.o_frontend_to_backend_buttons{transform: translateX(-250%) scaleX(0.5); > a{min-width: $-mini-nav-size; height: $-mini-nav-size; color: #FFFFFF;}}.o_frontend_to_backend_apps_menu{@include font-size($o-font-size-base); max-height: 70vh; overflow: auto;}@each $-name, $-color in ('apps': $o-enterprise-color, 'edit': $o-we-bg-lighter){.o_frontend_to_backend_#{$-name}_btn{background-color: $-color; &:hover{background-color: darken($-color, 5%);}}}.o_frontend_to_backend_edit_btn > img{height: 1.8em; margin-right: 0.5em; border-radius: 0.25rem;}&:hover{&:before, .o_frontend_to_backend_icon{transform: scale(.3); transition-delay: 0ms; transition-duration: 400ms;}.o_frontend_to_backend_buttons{transform: translateX(0); transition-delay: 0ms; transition-duration: 400ms;}}}// LAYOUTING body{// Set frontend direction that will be flipped with // rtlcss for right-to-left text direction. direction: ltr;}// LOGIN FORM .oe_login_form, .oe_signup_form, .oe_reset_password_form{max-width: 300px; position: relative; margin: 50px auto;}// POPOVER NAVIGATION .tour .popover-navigation{margin-left: 13px; margin-bottom: 8px;}// PUBLISH .css_published{.btn-danger, .css_publish{display: none;}}.css_unpublished{.btn-success, .css_unpublish{display: none;}}[data-publish='off'] > *:not(.css_options){opacity: 0.5;}// Do not show path behind the links in browser printing @media print{a[href]:after{content: initial;}}// Post Submit Links .post_link:not(.o_post_link_js_loaded){pointer-events: none;}// Mobile preview #wrapwrap.o_is_mobile{// Scrollbar &, .modal{$-foreground-color: #999; $-background-color: rgba(255, 255, 255, 0.5); // For Chrome & Safari &::-webkit-scrollbar{width: 5px; height: 5px;}&::-webkit-scrollbar-thumb{background: $-foreground-color;}&::-webkit-scrollbar-track{background: $-background-color;}// Standard version (Firefox only for now) scrollbar-color: $-foreground-color $-background-color; scrollbar-width: thin;}}

/* /website/static/src/components/autocomplete_with_pages/url_autocomplete.scss */
.o-autocomplete{.ui-autocomplete-category > .dropdown-item:hover{background-color: initial; cursor: default;}}

/* /web_enterprise/static/src/webclient/home_menu/home_menu_background.scss */
// Shared with web client and login screen .o_home_menu_background, .o_web_client.o_home_menu_background{background:{size: cover; attachment: fixed; color: var(--homeMenu-bg-color, #{$o-gray-200}); image: var(--homeMenu-bg-image, url("/web_enterprise/static/img/background-light.svg"));}}

/* /web_enterprise/static/src/webclient/navbar/navbar.scss */
// = Main Navbar // ============================================================================ .o_main_navbar{--NavBar-entry-color--active: #{$o-component-active-color}; --NavBar-entry-borderColor-active: #{$o-component-active-border}; --NavBar-entry-backgroundColor--active: #{$o-component-active-bg}; --NavBar-entry-backgroundColor--hover: #{$o-gray-200}; --NavBar-entry-backgroundColor--focus: #{$o-gray-200}; --Dropdown_menu-margin-y: #{map-get($spacers, 1)}; .o_menu_toggle{--NavBar-entry-padding-left: #{$o-horizontal-padding}; --NavBar-entry-padding-right: #{$o-horizontal-padding * .5}; @extend %-main-navbar-entry-base; @extend %-main-navbar-entry-spacing; color: var(--NavBar-menuToggle-color, #{$o-brand-odoo}); rect, g{transform-origin: 0 50%;}// Define a local mixin to handle the toggle state // -------------------------------------------------------------------- @mixin o_main_navbar_toggler_toggled(){rect{width: 6px; height: 3px; &:first-child{transform: translate(12%,0) #{""}; rx: 1;}}#o_menu_toggle_row_0{transform: scale3d(.5, 1, 1) translate(0, 45%) skewY(-22deg) #{""}; + g rect{width: 0; height: 0;}}#o_menu_toggle_row_2{transform: scale3d(.5, 1, 1) translate(0, -37%) skewY(22deg) #{""};}}&.o_menu_toggle_back{@include o_main_navbar_toggler_toggled(); transform: translateX(25%) rotateY(-180deg);}// Animate on large screen without 'reduced-motion' only. // -------------------------------------------------------------------- @include media-breakpoint-up(lg){&.hasImage:not(.o_menu_toggle_back){.o_menu_toggle_icon{opacity: 0;}&:hover{.o_menu_toggle_icon{opacity: 1;}.o_menu_brand_icon{opacity: 0;}}}@media screen and (prefers-reduced-motion: no-preference){&:hover{@include o_main_navbar_toggler_toggled();}&, g{transition: all .3s;}rect{transition: all .1s;}&.hasImage:not(.o_menu_toggle_back){transform: none; transition: none; .o_menu_toggle_icon, .o_menu_brand_icon, .o_menu_brand{will-change: transform; transition: all 0.1s;}.o_menu_toggle_icon{transform: translateX(75%);}&:hover{.o_menu_toggle_icon{transform: translateX(25%); transition: all .4s;}.o_menu_brand_icon{transform: rotateY(-90deg); transition: all .2s;}.o_menu_brand{transform: translateX(-#{map-get($spacers, 2)}); transition: all .4s;}}}}.o_menu_brand_icon{width: calc(var(--o-navbar-height) - #{$o-navbar-padding-v * 2}+ #{map-get($spacers, 1)}); object-fit: cover;}}}}// Ensuring SuperUser Design menu is not compressed in Enterprise // ============================================================================ body.o_is_superuser .o_menu_systray{border-image-outset: map-get($border-widths, 5);}

/* /rating/static/src/scss/rating_templates.scss */
.o_rating_page_thank_you{min-height: 80vh;}.o_rating_page_submit{.btn-group > .btn:not(:first-child), .btn-group > .btn-group:not(:first-child) > .btn{margin-left: 0 !important;}.o_rating_label{opacity: 0.5; &:hover{transform: scale(1.1);}img{&.bg-white:hover, &.bg-white:focus{background-color: #ffffff !important;}}}.btn-check:checked + .o_rating_label{transform: scale(1.2); opacity: 1; img{&.bg-white:hover, &.bg-white:focus{background-color: #ffffff !important;}}}}

/* /project/static/src/scss/portal_rating.scss */
.o_portal_project_rating{.thumbnail{height: 240px;}.o_top_partner_rating_image{height: 15px;}.o_top_partner_image{height: 30px; width: 30px;}.o_top_partner_feedback{word-wrap: break-word;}.o_vertical_separator{border-left: 1px solid #eeeeee}.o_rating_progress{margin-bottom: 10px;}.o_rating_count{display: inline-block; min-width: 22px}.o_smiley_no_padding_left{padding-left: 0;}.o_smiley_no_padding_right{padding-right: 0;}.o_lighter_smileys{opacity: 0.4}}.o_priority_star{display: inline-block; &.fa-star-o{color: $o-main-color-muted;}&.fa-star{color: $o-main-favorite-color;}}.o_status{display: block; background-color: map-get($grays, '200'); height: 12px; width: 12px; box-shadow: inset 0 0 0 1px rgba($black, .2); .dropdown-item > &{transform: translateX(-50%);}}

/* /project/static/src/scss/project_sharing_frontend.scss */
.o_project_sharing_container > main{display: flex;}

/* /website_mail/static/src/css/website_mail.scss */
.js_follow[data-follow='on'] .js_follow_btn, .js_follow[data-follow='on'] .follow_btn, .js_follow[data-follow='off'] .js_unfollow_btn{display: none;}.js_follow[data-follow='on'] .js_unfollow_btn{opacity: 1 !important;}.js_follow_icons_container{.js_follow_btn, .js_unfollow_btn, .follow_btn{animation: js_follow_fade 1s ease forwards; opacity: 0; small{opacity: 0; transition: opacity 0.3s ease;}&:hover, &:focus{small{transition-duration: 1s; opacity: 1;}}}.fa:before{content: "\f0f3";}.js_follow_btn:hover .fa:before{color: $body-color;}.js_unfollow_btn .fa:before{color: $primary;}.js_unfollow_btn:hover .fa:before{content: "\f1f6"; color: $danger;}}@keyframes js_follow_fade{to{opacity: 1;}}

/* /portal_rating/static/src/scss/portal_rating.scss */
 $o-w-rating-star-color: #FACC2E; .o_website_rating_static{color: $o-w-rating-star-color;}.o_website_rating_card_container{.o_message_counter{color: map-get($grays, '700');}table.o_website_rating_table{width: 100%; overflow: visible; .o_website_rating_table_star_num{min-width: 50px; white-space: nowrap;}.o_website_rating_table_progress{min-width: 120px; > .progress{margin-bottom: 2px; margin-left: 5px; margin-right: 5px;}.o_rating_progressbar{background-color: $o-w-rating-star-color;}}.o_website_rating_table_percent{text-align: right; padding-left: 5px; @include font-size($font-size-sm);}.o_website_rating_table_reset{.o_website_rating_selection_reset{color: $red;}}.o_website_rating_table_row:not(o_website_rating_table_row_selected){cursor: pointer;}}}.o_rating_star_card{margin-bottom: 5px; .stars{display: inline-flex; color: #FACC2E; margin-right: 15px;}.stars i{padding-right: 1px; padding-left: 1px; text-align: center;}.stars.enabled{cursor: pointer;}.rate_text{display: inline-block;}}.o_rating_popup_composer{.o_rating_clickable{cursor: pointer;}.o_portal_chatter_avatar{margin-right: 10px;}}

/* /website_sale/static/src/scss/website_sale.scss */
// Prevent grid gutter to be higher that bootstrap gutter width to make sure // the negative margin layout does not overflow on elements. This prevents the // use of an ugly overflow: hidden which would break box-shadows. $o-wsale-products-layout-grid-gutter-width: $grid-gutter-width / 2 !default; $o-wsale-products-layout-grid-gutter-width: min($grid-gutter-width / 2, $o-wsale-products-layout-grid-gutter-width); $input-border-color: $gray-400; @mixin wsale-break-table($-list: false){.o_wsale_products_grid_table_wrapper{table, tbody{display: block; width: 100%;}tr{display: if($-list, block, flex); width: 100%; flex-wrap: wrap;}td{display: if($-list, block, inline-block); width: if($-list, 100%, 50%);}.modal-dialog{table, tbody, tr, td{display: revert;}}@media screen and (max-width: 768px){.oe_advanced_configurator_modal{table, tbody, tr, td{display: block; width: 100%;}thead{display: none;}}}}}.oe_website_sale{// ==== Products list designs .o_wsale_design_cards{--o-wsale-card-border-width: 1px; --o-wsale-card-border-radius: #{$card-border-radius}; --o-wsale-card-info-padding: #{map-get($spacers, 2)}; --o-wsale-card-bg: #{$card-bg}; --o-wsale-card-color: #{adjust-color-to-background($body-color, $card-bg)}; --o-wsale-card-text-muted: #{adjust-color-to-background($text-muted, $card-bg, mute-color($color-contrast-light), mute-color($color-contrast-dark))}; $-br-top: calc(#{$card-border-radius}- 1px); --o-wsale-card-thumb-border-radius: #{$-br-top}#{$-br-top}0 0;}.o_wsale_design_thumbs{--o-wsale-card-border-width: 0; --o-wsale-card-info-padding: #{map-get($spacers, 3)}0; --o-wsale-card-thumb-border-radius: #{$o-wsale-products-layout-grid-gutter-width * .5}; --o-wsale-card-thumb-shadow: 0 13px 27px -5px #{scale-color(map-get($theme-colors, 'primary'), $alpha: -90%)}, 0 8px 16px -8px rgba(0, 0, 0, .28);}.o_wsale_design_grid{--o-wsale-grid-border: 1px solid #{$card-border-color}; --o-wsale-card-border-width: 0;}// ==== Products list thumb options .o_wsale_context_thumb_4_3{--o-wsale-card-thumb-aspect-ratio: 4/3;}.o_wsale_context_thumb_4_5{--o-wsale-card-thumb-aspect-ratio: 4/5;}.o_wsale_context_thumb_2_3{--o-wsale-card-thumb-aspect-ratio: 2/3;}.o_wsale_context_thumb_cover{--o-wsale-card-thumb-fill-mode: cover;}.o_wsale_filmstip_container{$-o-scrollbar-subdle-bg: rgba($dark, 0.05); transform: translateZ(0); &.o_wsale_filmstip_fancy_disabled{scrollbar-color: currentColor $-o-scrollbar-subdle-bg;}.o_wsale_filmstip_wrapper{margin-bottom: map-get($spacers, 2); scroll-snap-type: x mandatory; cursor: grab; &::-webkit-scrollbar{height: 2px;}&::-webkit-scrollbar-thumb{border-radius: $btn-border-radius-sm; background: currentColor;}&::-webkit-scrollbar-track{background: $-o-scrollbar-subdle-bg;}}&:not(.o_wsale_filmstip_fancy_disabled):hover{.o_wsale_filmstip_wrapper{margin-bottom: map-get($spacers, 1); &::-webkit-scrollbar{height: 6px;}}}}.activeDrag *{cursor: grabbing !important; cursor: -webkit-grabbing;}.o_wsale_products_grid_before_rail{scrollbar-width: none; -ms-overflow-style: none;}.o_wsale_products_grid_before_rail::-webkit-scrollbar{width: 0; height: 0;}.o_payment_form .card{border-radius: 4px !important;}.address-inline address{display: inline-block;}h1[itemprop="name"]{word-break: break-word; word-wrap: break-word; overflow-wrap: break-word;}h1[itemprop="name"]{@include font-size($h3-font-size); font-weight: $font-weight-bold;}.toggle_summary_div{@include media-breakpoint-up(xl){max-width: $o-wsale-input-max-width;}}// Extra price badge .text-bg-light .variant_price_extra.text-muted{// Needed to be visible on a dark <body> background. color: adjust-color-to-background($text-muted, $light, mute-color($color-contrast-light), mute-color($color-contrast-dark)) !important;}input.js_quantity{min-width: 48px; text-align: center;}input.quantity{padding: 0;}.table-striped tbody tr td:nth-of-type(even){--table-accent-bg: rgba(0, 0, 0, 0.025);}.table-striped tbody tr td:nth-of-type(odd){--table-accent-bg: rgba(0, 0, 0, 0);}*:not(#product_attributes_simple) > .table-sm tbody td{padding-top: 0.75rem; padding-bottom: 0.75rem;}#products_grid_before{// == Guess the distance with the navbar $-container-top-gap: calc(#{map-get($spacers, 2)}+ var(--gutter-x)); // == Guess the distance with the viewport's top. // Defined using CSS variables to ease custom-headers overrides. --o_ws_sidebar_top_gap: calc(#{$navbar-padding-y * 2}+ #{$btn-padding-y-lg * 2}+ #{$-container-top-gap}); @if (o-website-value('header-scroll-effect') == null) or (o-website-value('header-scroll-effect') == 'fixed'){top: var(--o_ws_sidebar_top_gap);}@else{top: $-container-top-gap;}.css_attribute_color{height: 32px; width: 32px;}}.o_pricelist_dropdown, .o_sortby_dropdown{//truncates the dropdown pricelist > 8rem .o_pricelist_dropdown_span{max-width: $o-wsale-dropdown-width-overflow;}}}#product_detail ~ .oe_structure.oe_empty > section:first-child{border-top: $border-width solid $border-color;}.o_alternative_product{margin: auto;}// Base style for a product card with image/description .oe_product_cart{flex-direction: var(--o-wsale-card-flex-direction, column); border: $card-border-width solid $card-border-color; border-width: var(--o-wsale-card-border-width, 0 0 1px); border-radius: var(--o-wsale-card-border-radius, 0); padding: var(--o-wsale-card-padding, 0); background-color: var(--o-wsale-card-bg); color: var(--o-wsale-card-color); .oe_product_image{min-width: var(--o-wsale-card-thumb-size); width: var(--o-wsale-card-thumb-size); .oe_product_image_link{padding-top: calc(100% / (var(--o-wsale-card-thumb-aspect-ratio, 1))); .oe_product_image_img_wrapper{@include o-position-absolute(0, 0, 0, 0); img{box-shadow: var(--o-wsale-card-thumb-shadow); border-radius: var(--o-wsale-card-thumb-border-radius); object-fit: var(--o-wsale-card-thumb-fill-mode, contain);}}}}.o_wsale_product_information{padding: var(--o-wsale-card-info-padding, #{map-get($spacers, 2)}0);}.oe_subdescription div{min-height: calc(#{$font-size-sm * 1.1}* 2); overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.1;}// Needed to be visible on a dark <body> background. The rule is defined on // the <div> child to avoid overriding the default "text-muted" color if the // "--o-wsale-card-text-muted" variable is not defined. .oe_subdescription.text-muted > div{color: var(--o-wsale-card-text-muted) !important;}.o_wsale_product_btn:empty{display: none !important;}.o_ribbon_left, .o_ribbon_right{box-shadow: 0px -10px 70px 30px rgba(black, 0.05);}.o_product_link{@include o-position-absolute(0, 0, 0, 0); z-index: 1;}}// ==== THE GRID #products_grid{.o_wsale_products_grid_table_wrapper .table:not(.o_wsale_modal_table){table-layout: fixed; td{padding: $o-wsale-products-layout-grid-gutter-width * .5; border: var(--o-wsale-grid-border, 0); @if $o-wsale-products-layout-grid-gutter-width <= 0{border: $card-border-width solid $card-border-color;}}}.o_wsale_products_grid_table_wrapper{// Necessary to compensate the outer border-spacing of the table. No // overflow will occur as the gutter width cannot be higher than the // BS4 grid gutter and the vertical margins of the wrapper's parent are // set accordingly. // Note: a possible layout could also be ok by removing the wrapper // related spacings and setting a background to it, thus including the // outer border spacing as part of the design. margin: (-$o-wsale-products-layout-grid-gutter-width / 2);}}#products_grid:not(.o_wsale_layout_list){@include media-breakpoint-down(lg){@include wsale-break-table();}@include media-breakpoint-up(lg){td.oe_product{padding-bottom: $o-wsale-products-layout-grid-gutter-width * .5; .o_wsale_product_btn{@include o-position-absolute(auto, auto, calc(100% + #{map-get($spacers, 2)}), map-get($spacers, 2)); z-index: 2;}&:not(:hover) .o_wsale_product_btn{opacity: 0;}}// Sliglty increase padding for larger blocks @for $x from 2 through 4{[class*="o_wsale_product_grid_wrapper_#{$x}_"]{--o-wsale-card-info-padding: #{map-get($spacers, 3)}0 #{map-get($spacers, 2)};}.o_wsale_design_cards [class*="o_wsale_product_grid_wrapper_#{$x}_"]{--o-wsale-card-info-padding: #{map-get($spacers, 3)}#{map-get($spacers, 3)}#{map-get($spacers, 2)};}}}}#products_grid.o_wsale_layout_list{@include wsale-break-table($-list: true); .oe_product{--o-wsale-card-border-radius: 0; --o-wsale-card-flex-direction: row; --o-wsale-card-info-padding: 0 #{map-get($spacers, 3)}; // The more an image is portait, the more its size decreases --o-wsale-card-thumb-size: calc(100px * var(--o-wsale-card-thumb-aspect-ratio, 1)); @include media-breakpoint-up(lg){--o-wsale-card-thumb-size: calc(160px * var(--o-wsale-card-thumb-aspect-ratio, 1)); h6, .h6{font-size: $font-size-base * 1.3;}}}.oe_product{--o-wsale-card-padding: #{0 0 $o-wsale-products-layout-grid-gutter-width};}.o_wsale_design_cards .oe_product{--o-wsale-card-padding: #{$o-wsale-products-layout-grid-gutter-width * .5}; --o-wsale-card-info-padding: #{map-get($spacers, 2)}#{map-get($spacers, 3)};}}.o_wsale_products_main_row{// Special case. Normally vertical margins would be set using the BS4 // mt-* / my-* / mb-* utility classes, but here we need to use the shop max // grid gutter width to prevent the grid wrapper to overflow because of its // negative margins. margin-bottom: $grid-gutter-width / 2; margin-top: $grid-gutter-width / 2;}.oe_cart{> .oe_structure{clear: both;}}div#payment_method{div.list-group{margin-left: 40px;}.list-group-item{padding-top: 5px; padding-bottom: 5px;}}.js_change_shipping, .js_change_billing{cursor: pointer;}a.no-decoration{cursor: pointer; text-decoration: none !important;}#o-carousel-product{transition: top 200ms; &.css_not_available{opacity: 0.2;}.carousel-outer{height: 400px; max-height: 90vh; .carousel-inner{img{object-fit: contain;}}}.carousel-control-prev .fa{padding-right: 2px;}.carousel-control-next .fa{padding-left: 2px;}.carousel-control-prev, .carousel-control-next{height: 70%; top: 15%; opacity: 0.5; cursor: pointer; transition: opacity 0.8s; &:focus{opacity: 0.65;}&:hover{opacity: 0.8;}> span{width: 2.5rem; height: 2.5rem; line-height: 2.5rem; color: map-get($grays, '900'); background: white; @include font-size(1.15rem); border: 1px solid map-get($grays, '400'); border-radius: 50%;}@include media-breakpoint-down(lg){> span{width: 2rem; height: 2rem; line-height: 2rem; font-size: 1rem;}}}@include media-breakpoint-up(xl){&:not(:hover){.carousel-control-prev, .carousel-control-next{opacity: 0;}}}.carousel-item, .o_carousel_product_indicators{transition: transform 0.2s ease-out;}.carousel-indicators{transition: transform 0.3s ease-in-out;}.o_carousel_product_indicators{max-height: 400px; @include media-breakpoint-up(lg){.carousel-indicators{justify-content: start; li{width: 64px; height: 64px; text-indent: unset; transition: none; border: 1px solid map-get($grays, '400'); .o_product_video_thumb{@include o-position-absolute(0, 0, 0, 0); line-height: 64px;}&.active{border-color: map-get($theme-colors, 'primary');}&:hover{opacity: 1;}}}}}@include media-breakpoint-down(lg){&.o_carousel_product_left_indicators{flex-direction: column-reverse;}.carousel-indicators{justify-content: center; li{width: 8px; height: 8px; min-width: 8px; border-radius: 50%; border: 2px solid map-get($grays, '400'); &.active{border-color: map-get($theme-colors, 'primary'); background-color: map-get($theme-colors, 'primary');}> div{display: none;}}}}@include media-breakpoint-up(lg){.carousel-indicators li{margin: 0; &:not(:first-child){margin-left: 10px;}}&.o_carousel_product_left_indicators{.carousel-outer{height: 500px;}.o_carousel_product_indicators{max-height: 500px;}.carousel-indicators li{margin: 0; &:not(:first-child){margin-top: 10px;}}}}}.ecom-zoomable{&[data-ecom-zoom-click]{img.product_detail_img{cursor: zoom-in;}}img[data-zoom]{cursor: zoom-in;}.o_editable img[data-zoom]{cursor: pointer;}.zoomodoo-flyout{box-shadow: 0 0 20px 2px rgba(black, 0.2); z-index: 1050;}}#coupon_box form{max-width: 300px;}.o_website_sale_animate{opacity: 0.7; position: absolute !important; height: 150px; width: 150px; z-index: 1020;}.o_red_highlight{background: map-get($theme-colors, 'danger') !important; box-shadow: 0 0 0 0 rgba(240,8,0,0.4); transition: all 0.5s linear;}.o_shadow_animation{box-shadow: 0 0 5px 10px rgba(240,8,0,0.4)!important;}.o_mycart_zoom_animation{transform: scale(1.4); transition: all 0.3s ease-in-out;}.o_carousel_product_card{.o_carousel_product_card_img_top{object-fit: scale-down; @include media-breakpoint-down(md){height: 12rem;}@include media-breakpoint-up(md){height: 8rem;}@include media-breakpoint-up(lg){height: 12rem;}}.o_carousel_product_img_link:hover + .o_carousel_product_remove{display: block;}}.o_carousel_product_card_wrap{@include media-breakpoint-up(sm){float: left;}}.o_carousel_product_control{top: percentage(1/3); bottom: percentage(1/3); width: 2rem; border-radius: 5px; background-color: $o-enterprise-action-color;}.o_carousel_product_remove{position: absolute; display: none; cursor: pointer; right: 5%; top: 5%;}.o_carousel_product_remove:hover{display: block;}// customer reviews .o_product_page_reviews_title{.fa{@include font-size(1.4rem); color: map-get($theme-colors, 'primary'); &:before{content: "\f067";}}&:not(.collapsed){.fa:before{content: "\f068";}}}#o_product_page_reviews_content{.o_website_rating_avg{h1{@include font-size(3.5rem);}}.o_portal_chatter_composer{position: sticky; transition: top 200ms;}.o_portal_chatter_messages > .o_portal_chatter_message{border-bottom: 1px solid rgba(0, 0, 0, 0.1);; padding: 1rem 0; margin-bottom: 1rem;}.o_portal_chatter_avatar{border-radius: 50%;}}.o_product_tag_img{height: 2rem;}.o_wsale_share_menu{min-width: 3em;}.o_website_sale_checkout{.o_total_card{// The accordion have to mimick the styling of a card background-color: $card-bg; border: $border-width solid $border-color; border-radius: $card-border-radius; .accordion-item{@include o-bg-color(rgba($card-bg, $o-card-body-bg-opacity));}// TODO VCR This value should adapt to the offsetHeight // of the header this is an arbitrary value as a temporary solution // to offset the summary regarding the tallest header (Magazine) @include media-breakpoint-up(lg){top: 9rem;}@include media-breakpoint-down(lg){border: 0; .card-body, .accordion-item, .accordion-button{border-radius: 0; background-color: var(--o-cc1-bg) !important; color: inherit;}}}#cart_total{@include media-breakpoint-down(lg){padding-top: map-get($spacers, 3); border-top: $border-width solid $border-color;}}.o_wsale_accordion{.accordion-button{background-color: unset;}.o_wsale_scrollable_table{-ms-overflow-style: none; scrollbar-width: none; &::-webkit-scrollbar{display: none;}@include media-breakpoint-up(lg){overflow-y: scroll; height: 15rem;}}}span[itemprop='name']{font-size: $h6-font-size; font-weight: $headings-font-weight; line-height: $headings-line-height;}div[itemprop="address"]{margin: map-get($spacers, 2) 0; font-size: $font-size-sm;}.o_wsale_address_fill{.col-form-label:not(.label-optional)::after{content: " *"; font-weight: normal;}}.all_shipping, .all_billing{@include media-breakpoint-down(md){overflow-x: auto; > div{width: auto;}}.o_wsale_add_address{min-height: 8rem;}}div[name="o_express_checkout_container"]{margin-bottom: -#{map-get($spacers, 3)}; margin-top: map-get($spacers, 3);}button[name="o_payment_submit_button"]{margin-left: 0 !important;}// We can't technically duplicate navigations CTA therefore we use // an absolute positioning to move the CTA from the summary to the // bottom of the page. @include media-breakpoint-down(lg){.o_cta_navigation_container{padding: 0 calc(var(--gutter-x) * .5);}}// TODO This height is arbitrary and the calculation should be improved. .o_cta_navigation_placeholder{height: o-to-rem(111px) + map-get($spacers, 4) + 2rem;}a.disabled{pointer-events: none;}}.accordion-button:not(.collapsed).bg-transparent::after{background-image: escape-svg($accordion-button-icon);}

/* /website_sale/static/src/scss/website_mail.scss */
 .oe_msg{img.oe_msg_avatar{width: 50px; margin-right: 10px;}}.oe_msg_attachment{display: inline-block; width: 120px; margin: 4px 2px; min-height: 80px; position: relative; border-radius: 3px; text-align: center; vertical-align: top; a{img.oe_attachment_embedded{display: block; position: relative; margin: 0 0 0 10px; width: 100px; height: 80px; border-radius: 1px; border: solid 3px #FFF; -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.19); -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.19); box-shadow: 0 3px 10px rgba(0, 0, 0, 0.19);}div.oe_attachment_name{display: inline-block; max-width: 100%; padding: 1px 3px; margin-top: 2px; margin-bottom: 5px; background: #F4F5FA; overflow: hidden; color: #4c4c4c; text-shadow: none; border-radius: 3px; word-wrap: break-word;}}}

/* /website_sale/static/src/scss/website_sale_frontend.scss */
//## Website Sale frontent design //## ---------------------------- .o_wsale_image_viewer{z-index: -1; .o_wsale_image_viewer_header{height: 40px; z-index: 1;}.o_wsale_image_viewer_image{.o_wsale_image_viewer_void{padding-top: 64px; padding-bottom: 156px;}img{cursor: zoom-in;}}.o_wsale_image_viewer_carousel{z-index:1; ol{list-style: none; .o_wsale_image_viewer_thumbnail{width: 128px; height: 128px;}li img{border: 1px solid #CED4DA; &.active{border-color: #35979c;}}}}.o_wsale_image_viewer_control{z-index: 1; width: 40px; height: 40px; &:hover{background-color: rgba($gray-400, 0.1);}&.o_wsale_image_viewer_previous{margin: 1px 1px 0 0; // not correctly centered for some reasons}&.o_wsale_image_viewer_next{margin: 1px 0 0 1px; // not correctly centered for some reasons}}}

/* /website_sale/static/src/scss/website_sale_delivery.scss */
@include media-breakpoint-down(md){.o_wsale_delivery_badge_price{max-width: 130px; text-overflow: ellipsis; overflow: hidden;}}#delivery_method .o_delivery_carrier_select:hover{cursor: pointer;}

/* /website/static/lib/multirange/multirange_custom.scss */
// This code has been more that widely inspired by the multirange library // which can be found on https://github.com/LeaVerou/multirange. // The license file can be found in the same folder as this file. input[type="range"][multiple]{pointer-events: none; visibility: hidden;}.multirange-wrapper{input[type="range"][multiple]{visibility: initial; &::-webkit-slider-thumb{pointer-events: auto;}&::-moz-range-thumb{pointer-events: auto;}&.reverse{direction: rtl;}&.multirange{&::-moz-range-track{border-color: transparent;}&.original::-webkit-slider-thumb{position: relative; z-index: 2;}&.ghost{// Workaround to handle Firefox's lack of support of z-index rules // for #shadow-root elements, see '&.original::-webkit-slider-thumb' // rules. The entire @media query could be removed once Firefox // will support the feature. @media all and (min--moz-device-pixel-ratio:0) and (min-resolution: .001dpcm){// Helper function to retrive the 'width' segment from a 'border' shorthand rule. @function -get-border-width($input){@each $part in $input{@if type-of($part) == number{@return $part;}}@return null;}$-thumb-border-width: #{-get-border-width($form-range-thumb-border)}; $-ghostGap: calc(#{$form-range-thumb-width}+ (#{$-thumb-border-width}* 2)); margin-inline-start: $-ghostGap; width: calc(100% - #{$-ghostGap});}&::-webkit-slider-runnable-track{background: linear-gradient(to right, transparent var(--low), var(--primary) var(--low) var(--high), transparent 0) no-repeat 50% / 100% 100%;}&::-moz-range-track{background: linear-gradient(to right, transparent var(--low), var(--primary) var(--low) var(--high), transparent 0) no-repeat 50% / 100% 100%;}}}}[x-out-of-boundaries]{display: none;}}

/* /website_sale/static/src/scss/product_configurator.scss */
.css_attribute_color{position: relative; display: inline-block; border: 5px solid $input-border-color; border-radius: 50%; text-align: center; transition: $input-transition; @include o-field-pointer(); &:before{content: ""; display: block; @include o-position-absolute(-3px, -3px, -3px, -3px); border: 4px solid white; border-radius: 50%; box-shadow: inset 0 0 3px rgba(black, 0.3);}input{margin: 8px; height: 13px; width: 13px; opacity: 0;}&.active{border: 5px solid map-get($theme-colors, 'primary');}&.custom_value{background-image: linear-gradient(to bottom right, #FF0000, #FFF200, #1E9600);}&.transparent{background-image: url(/web/static/img/transparent.png);}}.css_not_available_msg{display: none;}.css_not_available.js_product{.css_quantity{display: none !important;}.css_not_available_msg{display: block;}.availability_messages{display: none;}.js_add, .oe_price, .oe_default_price, .oe_optional{display: none;}}.css_quantity{width: initial; // We don't want the quantity form to be full-width .btn, input{border-color: $input-border-color;}input{// Needs !important because themes customize btns' padding direclty // rather than change '$input-btn-padding-X' (shared with inputs). height: auto !important; max-width: 5ch;}}option.css_not_available{color: #ccc;}$-arrow-url: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='175' height='100' fill='#000'><polygon points='0,0 100,0 50,50'/></svg>"); select.form-select.css_attribute_select{max-width: 400px; &:not([multiple]):where(:not([size]), [size="1"]){background-image: str-replace($-arrow-url, "#000", str-replace(#{$input-color}, "#", "%23")); background-size: 20px; background-position: 100% 65%; background-repeat: no-repeat; &:disabled{background-image: str-replace($-arrow-url, "#000", str-replace(#{$form-select-disabled-color}, "#", "%23"));}}}// In the case of a modal, we cannot rely on '$input-color' to define the color // of the select arrow because '$input-color' is set based on the background // color of the body. In modals, the input color is adjusted based on the // modal's background color (see 'bootstrap_review_frontend.scss'). @if ($modal-content-color == null) and ($form-select-bg == $body-bg){.modal-content{select.form-select.css_attribute_select{background-image: str-replace($-arrow-url, "#000", str-replace(#{color-contrast($modal-content-bg)}, "#", "%23"));}}}label, .o_variant_pills{&.css_not_available{opacity: 0.6;}}label.css_attribute_color.css_not_available{opacity: 1; &:after{content: ""; @include o-position-absolute(-5px, -5px, -5px, -5px); border: 2px solid map-get($theme-colors, 'danger'); border-radius: 50%; background: str-replace(url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='39' height='39'><line y2='0' x2='39' y1='39' x1='0' style='stroke:#{map-get($theme-colors, 'danger')};stroke-width:2'/><line y2='1' x2='40' y1='40' x1='1' style='stroke:rgb(255,255,255);stroke-width:1'/></svg>"), "#", "%23") ; background-position: center; background-repeat: no-repeat;}}.variant_attribute{padding-bottom: 1rem; .attribute_name{display: flex; align-items: center; @include font-size(0.9rem); text-transform: uppercase; padding-bottom: 0.5rem; &:after{content: ''; margin-left: $spacer; flex-grow: 1; border-bottom: 1px solid $border-color;}}.radio_input_value{font-weight: 400; &:not(.o_variant_pills_input_value){margin-right: $spacer; &, > span{vertical-align: middle;}}&.o_variant_pills_input_value{.badge{color: map-get($grays, '600'); background: white; border: 1px solid map-get($theme-colors, 'primary'); &, > span{vertical-align: middle;}.sign_badge_price_extra{@include font-size(1.1rem);}}}}.variant_custom_value{margin-bottom: 0.7rem; &.custom_value_radio{display: inline-block;}}select{margin-bottom: 0.5rem;}ul.list-inline{margin-left: 0;}.o_variant_pills{padding: $spacer/2 $spacer; margin-right: 0.2rem; border: none; cursor: default !important; &.btn.active{background-color: map-get($theme-colors, 'primary');}&:not(.active){color: map-get($grays, '600'); background-color: map-get($grays, '200');}input{-moz-appearance: none; -webkit-appearance: none; appearance: none; opacity: 0;}}.radio_input_value, select, label{.badge{margin-left: 3px; padding-left: 3px;}.sign_badge_price_extra{display: inline-block; width: 1rem; height: 1rem; color: map-get($theme-colors, 'primary'); background: white; line-height: 1rem; border-radius: 50%;}}}.o_product_configurator{.product_detail_img{max-height: 240px;}}.table-striped tbody tr:nth-of-type(odd){.o_select_options{background-color: rgba(0, 0, 0, 0.025);}.o_total_row{@include font-size(1.2rem);}}.modal.o_technical_modal .oe_advanced_configurator_modal .btn.js_add_cart_json{padding: 0.075rem 0.75rem;}.js_product{.td-product_name{word-wrap: break-word;}.td-product_name{min-width: 140px;}.td-img{width: 100px;}.td-qty{width: 200px; a.input-group-addon{background-color: transparent; border: 0px;}.input-group{display: inline-flex;}}.td-action{width: 30px;}.td-price, .td-price-total{width: 120px;}@include media-breakpoint-down(md){.td-img, .td-price-total{display: none;}.td-qty{width: 60px;}.td-price{width: 80px;}}@media (max-width: 476px){.td-qty{width: 60px;}#modal_optional_products table thead, .oe_cart table thead{display: none;}#modal_optional_products table td.td-img, .oe_cart table td.td-img{display: none;}}}.o_total_row{height: 50px;}.oe_striked_price{text-decoration: line-through; white-space: nowrap;}

/* /knowledge/static/src/scss/knowledge_common.scss */
.o_knowledge_icon_search{svg{width: var(--oi-font-size, 1em); aspect-ratio: 1;}&:not(:hover){--oi-color: currentColor;}}.o_knowledge_form_view, .o_knowledge_article_view_form_view{height: 100% !important; padding: 0 !important;}$knowledge-bg--active: #1ba1e4; $knowledge-bg--hover: $gray-300; // .o_knowledge_public_view refers to the article view for public users, see // template "knowledge_article_public_view" in website_knowledge .o_knowledge_form_view, .o_knowledge_public_view{background-color: var(--knowledge-view-bg, $o-white); .o_knowledge_header{.o_form_status_indicator{align-self: normal !important; display: flex;}}.o_knowledge_sidebar{.o_article:not(.o_article_has_children){.o_article_caret{// Make caret invisible if article has no child visibility: hidden;}}ul{list-style: none; padding: 0;}li > ul > li, li > ul > a.o_knowledge_article_load_more{&:not(.o_dragged){margin-left: 1.28571429em * 0.5; // Workaround to get half .fa-fw icon's width. padding-left: 0.8em; &:before, &:after{content: ''; background-color: $border-color;}&:after{@include o-position-absolute(0, auto, 0, 0); width: 1px; height: 100%;}}&.o_article_has_children:before{@include o-position-absolute($top: 1em, $left: 0); width: .6em; height: 1px;}}li > ul > li, li > ul > a:not(.o_knowledge_article_load_more_ellipsis){&:before{@include o-position-absolute($top: 1em, $left: 0); width: 1.8em; height: 1px; margin: auto;}&:last-child{padding-bottom: 0; &:after{height: 1em;}}}li > ul > a.o_knowledge_article_load_more:not(.ui-sortable-helper){padding-left: 2.5rem;}}// = Resizer // -------------------------------------------------------------------------- .o_knowledge_article_form_resizer{cursor: col-resize; touch-action: none;}.o_widget_knowledge_comments_handler{z-index: 1;}// We are applying the style only when the anchors are displayed on the user's screen. // This way when printing the style is not applied. @media screen{.o_widget_knowledge_comments_handler ~ .o_knowledge_body .o_field_knowledge_article_html_field{.knowledge-thread-comment{transition: background-color 0.3s ease-in-out; &.knowledge-thread-highlighted-comment{background-color: rgba($knowledge-bg--active, 0.171); .knowledge-thread-comment:not(.focused-comment){background-color: initial;}&.focused-comment{background-color: $knowledge-bg--active;}}}}}// = Cover // -------------------------------------------------------------------------- .o_knowledge_cover{width: 100%; img{width: 100%; height: 30vh; min-height: 150px; object-fit: cover;}&.o_cursor_grab{cursor: grab;}&.o_cursor_grabbing{cursor: grabbing;}.o_reposition_hint{background-color: black; color: white;}}}

/* /knowledge/static/src/scss/knowledge_blocks.scss */
 .o_knowledge_behavior_type_file{margin-bottom: 5px; border-radius: 5px; background-color: $o-gray-100; outline: 1px solid $o-gray-300; outline-offset: -1px; display: flex; padding: 5px;}.odoo-editor-editable .o_knowledge_behavior_type_file{.o_knowledge_file_name_container{&:hover i{visibility: visible !important;}}}.o_knowledge_behavior_type_template{margin-bottom: 1rem; border-radius: 5px; background-color: $o-gray-100; outline: 1px solid $o-gray-300; outline-offset: -1px; .o_knowledge_content{padding: 5px; border-bottom: 5px solid $o-gray-100; margin: 0 5px; background-color: $o-view-background-color; p:last-child{margin-bottom: 0;}}.o_knowledge_template_label{font-family: $font-family-base !important; font-weight: $font-weight-bold; padding: $btn-padding-y-sm $btn-padding-x-sm; color: $o-gray-600;}}.o_knowledge_behavior_type_toc{box-shadow: 0 2px 4px 4px $o-gray-200; padding: 10px; margin: 15px 0 15px 0; & > .o_knowledge_toc_content{@for $depth from 0 through 5{a.o_knowledge_toc_link_depth_#{$depth}{padding-left: calc(5px + Min(30px, 10%) * #{$depth}); font-family: $font-family-base !important; font-weight: $font-weight-bolder !important; border-radius: 5px; min-height: $line-height-base * $font-size-base; border: transparent; &:hover{background-color: rgba($knowledge-bg--active, 0.2); text-decoration: none;}}a.o_knowledge_toc_link_depth_0{// initial 5px padding to give some space to first level padding-left: 5px;}}}}.o_knowledge_behavior_type_articles_structure{box-shadow: 0 2px 4px 4px $o-gray-200; padding: 10px; margin: 15px 0; .o_knowledge_articles_structure_content{min-height: 30px; ol{list-style-type: none; padding-left: Min(30px, 10%); li{a{font-family: $font-family-base !important; font-weight: $font-weight-bolder !important; border-radius: 5px; min-height: $line-height-base * $font-size-base;}a:hover{background-color: rgba($knowledge-bg--active, 0.2); text-decoration: none;}}}> ol{padding-left: 5px;}}}.o_knowledge_behavior_type_article{border-color: $o-gray-200;}.o_knowledge_behavior_type_video{position: relative; aspect-ratio: 16 / 9; margin: 0 auto; width: 100%; max-width: 750px; iframe{@include o-position-absolute(0, 0, 0, 0); width: 100%; height: 100%; min-height: auto;}}.o_knowledge_behavior_type_embedded_view{.o_knowledge_embedded_view_placeholder{min-height: 300px; .o_knowledge_embedded_view_placeholder_cover{@include o-position-absolute(0, 0, 0, 0); background: radial-gradient($white, transparent);}}.o_kanban_renderer.o_kanban_grouped .o_kanban_group{background: #{$o-kanban-background};}}// Knowledge Toolbars .o_knowledge_toolbar{button{font-family: $font-family-base !important; font-weight: $font-weight-bold; @media screen and (max-width: 1024px){.o_knowledge_toolbar_button_text{display: none;}}}}

/* /sign/static/src/scss/sign_common.scss */
.o_sign_template_header_wrapper .o_input{--o-input-background-color: #{$o-webclient-background-color};}.o_sign_document_body{display: flex; flex-flow: column nowrap;}.o_sign_pdf_iframe{width: 100%; height: 100%; min-height: 0; flex: 0 1 100%; border: none; display: block;}.o_sign_signer_status_wrapper{flex-wrap: wrap; overflow: auto; div{display: flex;}.o_sign_non_current_signers{flex-wrap: wrap; height: 100%;}.o_sign_signer_status{flex-wrap: nowrap; overflow: auto; min-height: 100%; color: $o-action; .o_sign_signer_status_info{margin:auto;}div{line-height: 1.3; flex-shrink: 0; align-items: flex-start;}img{height: 32px; margin:auto;}}.o_sign_signer{&_waiting{color: o-text-color('info');}&_refused{color: o-text-color('danger');}&_completed{color: o-text-color('success');}}}.o_sign_document{display: flex; flex-flow: column nowrap; background-color: $o-view-background-color; > .container-fluid{flex: 0 0 auto; margin: 0;}> .container{flex: 0 0 auto;}.row{> div{> .o_page_header, > .alert{margin: 10px 0;}}}}.o_sign_image_document{display: inline-block; max-width: 100%; margin-top: $o-horizontal-padding; > img{min-width: 100px;}}.o_sign_validate_banner{display: none; opacity: 0; @include o-position-absolute($bottom: 0, $left: 0); width: 100%; padding: 10px; @include font-size(1.25em); text-align: center;}.modal:is(.o_sign_thank_you_dialog, .o_sign_next_dialog){border: none; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6), 0 6px 20px 0 rgba(0, 0, 0, 0.1); text-align: left; .btn{border-radius: 0; border: none;}.modal-header{border-top-left-radius: 0.0rem; border-top-right-radius: 0.0rem; background-color: $o-brand-odoo; color: #fff; .modal-title{line-height: 1; color: #fff;}.text-muted{color: #fff !important;}.close{color: #fff; opacity: 1; text-shadow: none;}}.modal-body{color: $o-main-text-color; .o_thankyou_message{margin-top: 14px; &.alert{border-radius: 0; margin-left: -1rem !important; margin-right: -1rem !important;}}.o_thankyou_link{margin-top: 25px; > img{width: 30px;}a{color: $o-main-text-color; &:hover{text-decoration: none; color: $o-brand-primary;}}}}.modal-footer{border-top: none; text-align: left; display: block; &:empty{padding: 0px;}}}.modal{.o_sign_frame{height: 0; position: absolute;}.o_sign_frame.active{visibility: visible; top: 30%; left: 5%; height: 65%; width: 20%; border: 3px solid #017e84; border-right: none; border-radius: 22px; border-top-right-radius: 0; border-bottom-right-radius: 0; opacity: 0.6; :before{content: attr(sign_label); font-size: 120%; color: #017E84; font-family: "Inter",Sans; left: 110%; width: 250px; display: inline-block; position: absolute; top: calc( -2% - 10px); font-weight: 600;}:after{content: attr(hash); font-size: 120%; color: #017E84; font-family: $o-font-family-monospace; width: 250px; display: inline-block; position: absolute; left: 110%; bottom: calc( -2% - 10px);}}}.modal.o_sign_signature_dialog{.modal-footer{display: flex; justify-content: flex-start;}}.modal{.o_sign_refuse_confirm_message{width: 100%;}}.oe_sign_terms{flex: auto !important;}@media only screen and (max-width:650px){.mobile-hide{display: none !important;}.flex-fill{flex: none;}}@media only screen and (max-width:768px){.mobile-tablet-hide{display: none !important;}}@include media-breakpoint-down(md){.o_sign_item_bottom_sheet{display: none; opacity: 0; &.show{opacity: 1; display: block; box-shadow: 0 0 5px 0 rgba(0,0,0,0.25);}.o_sign_next_button{text-transform: uppercase;}.o_sign_label{width: 100%; text-transform: uppercase;}}.modal.o_sign_signature_dialog .modal-footer .btn{width: calc((100% - 4 * 0.25rem) / 3) !important;}}@media only screen and (max-width:380px){.mobile-xs-hide{display: none !important;}}.mobile-xs-show{.dropdown-item{margin-bottom: 3px;}}@media only screen and (min-width:381px){.mobile-xs-show{display: none !important;}}

/* /sign/static/src/scss/sign_frontend.scss */
 .o_sign_document{height: 100%; > header{flex: 0 0 auto; height: $nav-link-height; background-color: $o-brand-lightsecondary; .o_sign_info{$logo-max-wdith: $nav-link-height * 3.75; height: 100%; width: 100%; display: flex; flex-wrap: nowrap; .o_logo_wrapper{overflow: hidden; flex-wrap: wrap; flex-shrink: 100000000; min-width: $logo-max-wdith; .o_logo{width: $logo-max-wdith; height: $nav-link-height; align-items: center; a{> img{max-height: $nav-link-height; max-width: $logo-max-wdith;}}}.o_odoo{$odoo_img_width: calc(#{$nav-link-height}* 300 / 97); width: calc(max(50vw - #{$logo-max-wdith}, #{$odoo_img_width}/ 2) + #{$odoo_img_width}/ 2); text-align: right; a{> img{height: $nav-link-height;}}}}.o_sign_signer_status_wrapper{height: $nav-link-height;}.o_sign_dropdown_placeholder{padding-right: 9px;}}}}@include media-breakpoint-down(md){.modal.o_sign_signature_dialog{h1{font-size: $h1-font-size * 3 / 4;}h2, h3, h4, h5, h6{font-size: $o-font-size-base-touch;}.card.o_web_sign_signature_group{padding: 0; .row{flex-wrap: nowrap;}}}}

/* /planning/static/src/scss/planning_calendar_report.scss */
#calendar_employee{.fc-widget-header{@include o-bg-color($o-brand-odoo, $important: false); .fc-list-heading-main, .fc-list-heading-alt{color: white;}}.fc-more-cell{color: $o-enterprise-action-color;}}.o_planning_calendar_container .o_planning_toast{top: 5em; right: 1em;}@media print{@page{size: A4 landscape;}html, body{height: unset;}.fc-time-grid .fc-content-skeleton{position: relative !important;}header, #footer, .o_main_navbar{display: none !important;}.fc-today{background-color: unset !important;}}.contact-assignee-popover{text-align: left; .popover-header{padding: 0.3rem 1rem;}.popover-body{padding: 0.5rem 1rem;}}

/* /website_event/static/src/scss/event_templates_common.scss */
$o-wevent-bg-color-base: $gray-100; $o-wevent-bg-color-base-contrast: color-contrast($o-wevent-bg-color-base); $o-wevent-bg-color-light: mix($o-wevent-bg-color-base, #E9ECEF); $o-wevent-bg-color-dark: mix($o-wevent-bg-color-base, #24363a); $o-wevent-color: $body-color; .o_wevent_index, .o_wevent_event{// Simple colored tags according to assigned background color @for $size from 1 through length($o-colors){.o_tag_color_#{$size - 1}{@if $size == 1{&{background-color: white; color: nth($o-colors, $size); box-shadow: inset 0 0 0 2px nth($o-colors, $size);}&::after{background-color: nth($o-colors, $size);}}@else{&, &::after{background-color: nth($o-colors, $size); color: $white;}}}}// Complex colored tags according to assigned background color with hover effect @for $size from 1 through length($o-colors){.o_tag_color_hovered_#{$size - 1}{$background-color: $o-wevent-bg-color-base; // no color selected @if $size == 1{&{color: color-contrast($background-color); background-color: $background-color; box-shadow: inset 0 0 0 1px nth($o-colors, $size);}}@else{$background-color: nth($o-colors, $size); &{color: white; background-color: $background-color;}}@at-root a#{&}{&:hover{background-color: darken($background-color, 20%);}}}}.o_wevent_index_topbar_filters{.dropdown-menu{max-height: 250px; overflow-y: auto;}}.o_wevent_online{// unpublished badge: put opacity to distinguish form other badges .o_wevent_online_badge_unpublished{opacity: 0.4;}.o_wesession_list_item{margin: 1rem 0; border: 1px solid; border-left: 10px solid;}// background color-based for new styling @for $size from 2 through length($o-colors){.event_color_#{$size - 1}{&.event_track{$-bg: adjust-color(nth($o-colors, $size), $lightness: 40%, $saturation: 15%); @include o-print-color($-bg, background-color, bg-opacity); > div{border-top: 3px solid adjust-color(nth($o-colors, $size), $lightness: 10%, $saturation: 15%);}}&.o_wesession_list_item{border-color: adjust-color(nth($o-colors, $size), $lightness: 30%, $saturation: 15%); background-color: unset;}}}.event_color_0{color: $o-wevent-bg-color-base-contrast; &.event_track{border-top: 1px solid lighten($o-wevent-bg-color-base-contrast, 50%);}&.o_wesession_list_item{border-color: $o-wevent-bg-color-light;}}.o_wevent_online_page_container{// Sponsor Avatar .o_wevent_online_page_avatar{min-width: 64px; img{max-width: 96px;}}}}// To be more efficiently implemented by using default Bootstrap accordion // components .o_wevent_collapse_link:not(.collapsed) .oi{transform: rotate(180deg);}.o_wevent_cta{color: #fff; background-color: $o-enterprise-color; border: $o-enterprise-color; &:hover{color: #fff; background-color: #624159; border-color: #52374b;}&:focus{outline: 0; box-shadow: 0 0 0 0.25rem rgba(134, 102, 126, 0.5);}}}.o_wevent_badge{padding: ($spacer * .5) $spacer; border-radius: 10rem; font-weight: $font-weight-normal;}.modal-open{> .modal-backdrop{z-index: $zindex-dropdown - 1;}}

/* /website_event/static/src/scss/event_templates_list.scss */
.o_wevent_sidebar_social > .o_wevent_social_link{$o_link_size: 2.3em; display: inline-flex; align-items: center; justify-content: center; width: $o_link_size; height: $o_link_size; margin: 0 0 ($spacer * .5) ($spacer * .25); line-height: $o_link_size; background-color: map-get($grays, '100'); border: $border-width solid $border-color; border-radius: 50%; text-align: center; &:hover, &:focus{background-color: map-get($grays, '300'); text-decoration: none;}}// Index .o_wevent_index{// Events List .o_wevent_events_list{.opt_events_list_columns{.card-header{height: 200px;}.card-footer{color: color-contrast($card-bg);}}.opt_events_list_rows{.card-header{min-height: 130px;}}.o_wevent_badge_event{@include o-position-absolute($top: 0, $right: 0); @include border-end-radius(0); padding: ($spacer * .5) $card-spacer-x; transform: translateY(-50%);}.o_wevent_event_date{top: $card-spacer-x; right: $card-spacer-x; display: flex; flex-direction: column; justify-content: center; width: 4rem; height: 4rem; border-radius: 50%; text-align: center; background-color: $o-wevent-bg-color-base; color: $o-wevent-bg-color-base-contrast; .o_wevent_event_day{@include font-size(1.125rem); font-weight: 300; line-height: 1;}.o_wevent_event_month{@include font-size(0.75rem); font-weight: $font-weight-bold; text-transform: uppercase;}&.left{left: $card-spacer-x;}}}.o_wevent_sidebar_title{margin: 0 0 ($spacer * 1.5) 0; border-bottom: $border-width solid $border-color; padding: 0 0 ($spacer * .5) 0; font-weight: $font-weight-bold;}.o_wevent_sidebar_block{margin: 0 0 ($spacer * 2.5) 0;}.o_wevent_sidebar_figure{position: relative; .figure-img{margin-bottom: 0;}.figure-caption{@include o-position-absolute($left: 0, $bottom: 0); width: 100%; padding: $spacer; background-color: rgba($color: #000, $alpha: 0.5); @include border-bottom-radius($border-radius); color: #fff;}}.o_half_screen_height{// Set min-height to the same value as the header min-height: 200px !important;}}

/* /website_event/static/src/scss/event_templates_page.scss */
.o_wevent_event{min-height: calc(95vh - 70px); // Multi-line event title, even in mobile mode nav > div > a.navbar-brand{text-overflow: revert; white-space: normal; overflow: hidden; max-width: calc(100% - 80px);}// Ensure menu labels are not split #o_wevent_event_submenu{li.nav-item{white-space: nowrap; > a{padding: 0; padding-right: 1rem;}}}.o_wevent_event_title{.o_wevent_event_name{font-weight: $display-font-weight; line-height: $display-line-height; @include font-size(map-get($display-font-sizes, 4));}.o_wevent_event_subtitle{font-weight: $lead-font-weight; @include font-size($lead-font-size);}}.o_wevent_registration_single{.o_wevent_nowrap{white-space: nowrap;}}.o_wevent_registration_title{font-weight: $font-weight-bold; text-transform: uppercase;}.o_wevent_registration_btn{transition: none; &:not(.collapsed){box-shadow: none;}&.collapsed{flex: 0 0 33%;}}}.o_wevent_event{.o_record_cover_container{overflow: hidden; z-index: 0; color: white; .o_record_cover_component{z-index: -1;}}}#modal_ticket_registration{// Handle overflow behaviors. #registration_form, #o_wevent_tickets, #o_wevent_tickets_collapse{position: relative; flex: 1 1 auto; display: flex; flex-direction: column; @include media-breakpoint-up(sm){:not(.s_popup) > &{overflow: auto; min-height: 0;}}}}.o_wevent_event .event_color_0{background-color: $o-wevent-bg-color-base; color: $o-wevent-color;}.o_wevent_event .event_color_1{background-color: #cccccc; color: #424242;}.o_wevent_event .event_color_2{background-color: #ffc7c7; color: #7a3737;}.o_wevent_event .event_color_3{background-color: #fff1c7; color: #756832;}.o_wevent_event .event_color_4{background-color: #e3ffc7; color: #5d6937;}.o_wevent_event .event_color_5{background-color: #c7ffd5; color: #1a7759;}.o_wevent_event .event_color_6{background-color: #c7ffff; color: #1a5d83;}.o_wevent_event .event_color_7{background-color: #c7d5ff; color: #3b3e75;}.o_wevent_event .event_color_8{background-color: #e3c7ff; color: #4c3668;}.o_wevent_event .event_color_9{background-color: #ffc7f1; color: #6d2c70;}.o_wevent_hide_sponsors .o_wevent_sponsor_wrapper{display: none !important;}

/* /mail/static/src/core/common/attachment_list.scss */
.o-mail-AttachmentCard-unlink.o-inComposer{transform: translateX(100%);}.o-mail-AttachmentCard-aside{&:not(.o-hasMultipleActions){min-width: 50px;}&.o-hasMultipleActions{min-width: 30px;}}.o-mail-AttachmentCard-aside:hover .o-mail-AttachmentCard-unlink.o-inComposer{transform: translateX(0);}.o-mail-AttachmentList-in-composer{max-height: 300px; &.o-inChatWindow{max-height: 100px;}}.o-mail-AttachmentImage{min-width: 20px; min-height: 20px; img{object-fit: contain;}}.o-viewable{cursor: zoom-in;}

/* /mail/static/src/core/common/attachment_view.scss */
@include media-breakpoint-up(xxl, $o-extra-grid-breakpoints){.o_attachment_preview{display: block; flex: 1 0 auto; overflow: hidden; width: $o-mail-Chatter-minWidth; > .o-mail-Attachment{position: relative; width: 100%; height: 100%; .arrow{width: 5%; @include o-position-absolute(50%, 0); @include o-FileViewer-arrow; transition: width 0.3s; padding-top: 30px; height: 75px; &:hover{width: 7%;}&.o_move_previous{left: 2px; right: 0px;}}> iframe{width: 100%; height: 100%;}> .o-mail-Attachment-imgContainer{position: absolute; overflow: auto; width: 100%; height: 100%; > img{margin: auto; box-shadow: 0px 0px 5px rgba(41, 41, 41, 0.43);}}}}}

/* /mail/static/src/core/common/autoresize_input.scss */
.o-mail-AutoresizeInput{--o-input-border-color: transparent; &:not([disabled]){&:hover, &:focus{--o-input-border-color: #{$border-color};}}}

/* /mail/static/src/core/common/chat_window.scss */
.o-mail-ChatWindow{height: 480px; width: $o-mail-ChatWindow-width; z-index: 999; // messaging menu is dropdown (1000) &.o-mobile{z-index: 1001; // above messaging menu (chat window takes whole screen)}box-shadow: -5px -5px 10px rgba(#000000, 0.09); outline: none; &.o-folded{height: $o-mail-Discuss-headerHeight;}}.o-mail-ChatWindow-command{color: inherit !important; &:hover, &.o-active{background-color: rgba(0, 0, 0, 0.05);}}.o-mail-ChatWindow-closePanel{z-index: 2;}.o-mail-ChatWindow-counter{padding: 3px 6px;}.o-mail-ChatWindow-header{height: $o-mail-Discuss-headerHeight; .o-mail-ChatWindow-threadAvatar img{height: 28px; width: 28px;}}.o-mail-ChatWindow-typing{font-size: $small-font-size * 0.9; z-index: $o-mail-NavigableList-zIndex - 2;}

/* /mail/static/src/core/common/chat_window_container.scss */
.o-mail-ChatWindowHiddenMenu-unreadCounter{transform: translate(50%, -50%); z-index: $zindex-tooltip; // on top of bootstrap dropup menu}.o-mail-ChatWindow-hiddenMenuContainer{z-index: 1000;}

/* /mail/static/src/core/common/composer.scss */
.o-mail-Composer{grid-template-areas: "sidebar-header core-header" "sidebar-main core-main" "sidebar-footer core-footer"; grid-template-columns: auto 1fr; grid-template-rows: auto 1fr auto; &.o-hasSelfAvatar{grid-template-columns: $o-mail-Message-sidebarWidth 1fr;}.o-mail-Composer-sidebarMain{padding-top: 0.1875rem; // avatar centered with composer text input: 36px (avatar) + 2*3px (this value) = 20px + 2 *{10px (padding) + 1px (border)}width: 48px;}.o-mail-Composer-coreHeader{grid-area: core-header;}.o-mail-Composer-coreMain{grid-area: core-main;}.o-mail-Composer-sidebarMain{grid-area: sidebar-main;}.o-mail-Composer-footer{grid-area: core-footer;}}.o-mail-Composer-actions button{opacity: 75%; &:hover{background-color: rgba(0, 0, 0, 0.1); opacity: 100%;}}.o-mail-Composer-input{padding-top: 10px; // carefully crafted to have the text in the middle in chat window padding-bottom: 10px; max-height: 100px; resize: none; line-height: 1.42857143 !important; // so that input is rounded to 20px = 14px (base font) * 1.42857143 (line-height) .o-extended &{max-height: Min(400px, 30vh);}&::placeholder{@include text-truncate();}}.o-mail-Composer-avatar{--Avatar-size: #{$o-mail-Avatar-size};}.o-mail-Composer-fake{height: 0; top: -10000px; padding-top: 10px; padding-bottom: 10px; line-height: 1.42857143 !important; // so that input is rounded to 20px = 14px (base font) * 1.42857143 (line-height)}

/* /mail/static/src/core/common/core.scss */
.o-bg-black{background-color: rgba(0, 0, 0, var(--bg-opacity, 1));}.o-discuss-badge{--o-discuss-badge-bg: #{$o-success}; // sync with --o-navbar-badge-bg color: white !important; background-color: var(--o-discuss-badge-bg) !important; &.o-muted{--o-discuss-badge-bg: #{$gray-400};}}.o-discuss-badge, .o-discuss-badgeShape{display: flex; transform: translate(0, 0) !important; // cancel systray style on badge font-size: 0.7em !important;}.o-min-height-0{min-height: 0;}.o-min-width-0{min-width: 0;}.o-smaller{font-size: smaller;}.o-text-white{color: #FFF;}.o-yellow{color: $yellow;}.o-z-index-1{z-index: 1;}a.o_mail_redirect, a.o_channel_redirect{@include button-variant(rgba($primary, .2), rgba($primary, .2), darken($link-color, 5%), rgba($primary, .3), rgba($primary, .3), darken($link-color, 10%)); @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm); padding: map-get($spacers, 1);}.o-mail-DiscussSystray{--border-color: #{$o-gray-300}!important; // cancel custom border color of dropdown}.o-mail-DiscussSystray-class{margin-top: - $o-navbar-padding-v; // cancel navbar padding margin-bottom: - $o-navbar-padding-v; // cancel navbar padding display: flex; align-items: center; &:hover, &.show{background-color: rgba(0, 0, 0, 0.075);}}.o-mail-systrayFullscreenDropdownMenu{top: $o-navbar-height !important; height: calc(100% - #{$o-navbar-height}); // no bottom-0 otherwise performance issue}

/* /mail/static/src/core/common/date_section.scss */
.o-mail-DateSection hr{opacity: $hr-opacity / 2;}

/* /mail/static/src/core/common/discuss.scss */
.o-mail-Discuss-content{.o-mail-Thread{flex-grow: 1;}}.o-mail-Discuss-inspector{flex-basis: $o-mail-Discuss-inspector; flex-shrink: 0;}.o-mail-Discuss-selfAvatar{height: $o-mail-Avatar-sizeSmall; width: $o-mail-Avatar-sizeSmall;}.o-mail-Discuss-threadName{max-width: 75%;}.o-mail-Discuss-header{height: $o-mail-Discuss-headerHeight; button{&:not(.o-isActive):hover{background-color: $gray-200;}&.o-isActive{background-color: $gray-300;}&.o-isActive:hover{background-color: $gray-300;}}}.o-mail-Discuss-threadAvatar{img{height: 36px; width: 36px;}a{i{transform: translate(-50%, -50%); opacity: 0;}&:hover{background-color: rgba($black, 0.5); i{opacity: 1;}}}}

/* /mail/static/src/core/common/dropzone.scss */
.o-mail-Dropzone{border: 2px dashed; z-index: 1000; // above chat window &.o-dragging-inside{border-width: 5px;}}

/* /mail/static/src/core/common/im_status.scss */
 .o-mail-ImStatus{width: $font-size-lg; height: $font-size-lg; .o-away{color: $yellow;}}

/* /mail/static/src/core/common/link_preview.scss */
.o-mail-LinkPreviewCard{max-width: $o-mail-LinkPreview-width; .row{min-height: $o-mail-LinkPreviewCard-height;}}.o-mail-LinkPreviewCard-description{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}.o-mail-LinkPreviewCard-hasMultineLines{display: -webkit-box; -webkit-box-orient: vertical;}.o-mail-LinkPreviewCard-imageLinkWrap{border-right: 1px solid $card-border-color;}.o-mail-LinkPreviewImage img{max-height: $o-mail-LinkPreview-height; max-width: $o-mail-LinkPreview-width;}.o-mail-ChatWindow .o-mail-LinkPreviewImage img{max-width: 100%;}.o-mail-LinkPreviewVideo{max-width: $o-mail-LinkPreview-width; .row{min-height: $o-mail-LinkPreviewCard-height;}}.o-mail-LinkPreviewVideo-hasDescription{display: -webkit-box; -webkit-box-orient: vertical; &.o-mail-LinkPreviewVideo-description{-webkit-line-clamp: 2;}&.o-mail-LinkPreviewVideo-title{-webkit-line-clamp: 3;}}.o-mail-LinkPreviewVideo-videoWrap{border-right: 1px solid $card-border-color;}.o-mail-LinkPreviewVideo-play{background: #000000; i{color: #ffffff;}}.o-mail-LinkPreview-aside{display: none;}.o-mail-LinkPreviewCard:hover, .o-mail-LinkPreviewImage:hover, .o-mail-LinkPreviewVideo:hover{.o-mail-LinkPreview-aside{display: block;}}

/* /mail/static/src/core/common/message.scss */
.o-mail-Message{transition: background-color .2s ease-out, opacity .5s ease-out, box-shadow .5s ease-out, transform .2s ease-out; &.o-highlighted{transform: translateY(-#{map-get($spacers, 3)});}}.o-mail-Message-sidebar{flex-basis: $o-mail-Message-sidebarWidth; max-width: $o-mail-Message-sidebarWidth; .o-mail-Message-date{font-size: 0.75rem;}}.o-mail-Message-avatarContainer{width: $o-mail-Avatar-size; height: $o-mail-Avatar-size;}.o-mail-Message-body > p{margin-bottom: 0 !important; &:last-of-type:has(~ .o-mail-Message-edited){display: inline-block;}}.o-mail-ChatWindow .o-mail-Message.o-selfAuthored{flex-direction: row-reverse; .o-mail-Message-core, .o-mail-Message-textContent{flex-direction: row-reverse;}.o-mail-Message-header{justify-content: flex-end;}.o-mail-Message-author{display: none;}}.o-mail-Message-actions{z-index: $o-mail-NavigableList-zIndex - 3; &.o-expanded{z-index: $o-mail-NavigableList-zIndex - 2;}button:hover, .focus{background-color: $o-gray-200 !important;}}.o-mail-Message-moreMenu{z-index: $o-mail-NavigableList-zIndex;}.o-mail-Message-searchHighlight{background: rgba($warning, 0.75);}.o-mail-Message-starred{color: $o-main-favorite-color;}.o-mail-Message-translated{color: $o-enterprise-action-color;}

/* /mail/static/src/core/common/message_in_reply.scss */
.o-mail-MessageInReply-corner{&.o-isLeftAlign{left: $o-mail-Message-sidebarWidth / 2; border-radius: $o-RoundedRectangle-small 0 0 0;}&.o-isRightAlign{right: $o-mail-Message-sidebarWidth / 2; border-radius: 0 $o-RoundedRectangle-small 0 0;}}.o-mail-MessageInReply-avatar{width: $o-mail-Avatar-size / 2; height: $o-mail-Avatar-size / 2;}.o-mail-MessageInReply-content{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}.o-mail-MessageInReply-message{// Make the body single line when possible p, div{display: inline; margin: 0;}br{display: none;}}

/* /mail/static/src/core/common/message_reaction_menu.scss */
.o-mail-MessageReactionMenu-avatar{width: $o-mail-Avatar-size; height: $o-mail-Avatar-size;}.o-mail-MessageReactionMenu{> .modal-body{padding: 0;}}.o-mail-MessageReactionMenu-persona:not(.o-isDeviceSmall){&:not(:hover) button.fa-trash{opacity: 0;}&:hover button.fa-trash{opacity: 100; &:hover{background-color: $gray-100;}}}

/* /mail/static/src/core/common/message_reactions.scss */
.o-mail-MessageReaction.o-selfReacted{background: mix($o-brand-primary, $o-view-background-color, 10%);}

/* /mail/static/src/core/common/message_seen_indicator.scss */
.o-mail-MessageSeenIndicator i{// fa icons have a line height of 1 by default which breaks alignment line-height: 1.5; &.o-second{top: -1px; left: -1px;}}

/* /mail/static/src/core/common/navigable_list.scss */
.o-mail-NavigableList{z-index: $o-mail-NavigableList-zIndex;}

/* /mail/static/src/core/common/picker.scss */
// o-mail-Picker handles the styling of picker in mobile view only .o-mail-Picker{height: 55vh ; .o-EmojiPicker{width: 100% !important; .o-Emoji{width: 40px; font-size: 1.5rem !important;}}.o-EmojiPicker-navbar{gap: 0.5rem !important;}}

/* /mail/static/src/core/common/picker_content.scss */
.popover .o-mail-PickerContent{width: 300px; height: 365px; .o-EmojiPicker{width: 100% !important; height: 100% !important;}}

/* /mail/static/src/core/common/search_messages_panel.scss */
.o-mail-SearchMessagesPanel{flex-basis: 425px;}.o-mail-MessageCardList .card-body:hover .o-mail-MessageCard-jump{opacity: 100 !important;}.o-mail-MessageCard-jump{color: white;}.o_touch_device .o-mail-MessageCard-jump.btn{font-size: 0.9rem;}

/* /mail/static/src/core/common/thread.scss */
.o-mail-Thread:focus-visible{outline: 0;}.o-mail-Thread-newMessage{transition: opacity 0.5s; span{font-size: 0.8rem;}}.o_mail_notification{& a:hover{text-decoration: underline;}display: inline;}.o-mail-Thread-jumpPresent{background-color: mix(map-get($theme-colors, 'info'), $o-webclient-background-color, 5%); z-index: $o-mail-NavigableList-zIndex - 1;}.o-mail-NotificationMessage p{margin-bottom: 0;}.o-mail-NotificationMessage:has(.o_hide_author){& .o-mail-NotificationMessage-author{display: none!important;}}

/* /mail/static/src/discuss/core/common/action_panel.scss */
.o-mail-ActionPanel-header{z-index: $o-mail-NavigableList-zIndex - 1;}.o-mail-ActionPanel-backButton{color: $o-brand-odoo;}

/* /mail/static/src/discuss/core/common/channel_invitation.scss */
.o-discuss-ChannelInvitation{min-height: 0;}.o-discuss-ChannelInvitation-has-size-constraints{width: Min(95vw, 400px); max-height: Min(calc(100vh - 140px), 530px);}.o-discuss-ChannelInvitation-selectedList{max-height: 100px;}.o-discuss-ChannelInvitation-avatar{width: $o-mail-Avatar-size; height: $o-mail-Avatar-size;}

/* /mail/static/src/discuss/core/common/channel_member_list.scss */
.o-discuss-ChannelMember.cursor-pointer:hover{background-color: $gray-200;}.o-discuss-ChannelMember-avatar{width: $o-mail-Avatar-size; height: $o-mail-Avatar-size;}

/* /mail/static/src/discuss/core/common/notification_settings.scss */
.o-discuss-NotificationSettings, .o-mail-NotificationSettings-submenu{max-width: 250px !important;}

/* /mail/static/src/discuss/call/common/call.scss */
// ------------------------------------------------------------------ // Layout // ------------------------------------------------------------------ .o-discuss-Call{height: 50%; // ensures that the view returns to the right height when resized min-height: 50%; background: var(--o-discuss-Call-bgColor, #{$dark}); &.o-minimized{height: 20%; // ensures that the view returns to the right height when resized min-height: #{"max(20%, 130px)"};}}.o-discuss-Call-main{background-color: rgba(0, 0, 0, 0.5);}.o-discuss-Call-sidebar{width: 120px; min-width: 120px; overflow-y: auto; overflow-x: hidden; &::-webkit-scrollbar{width: 0.3vw;}}.o-discuss-Call-sidebarCard{aspect-ratio: 16/9;}.o-discuss-Call-mainCardStyle{width: var(--width); height: var(--height); min-width: var(--width); min-height: var(--height); aspect-ratio: 16/9;}.o-discuss-Call-sidebarToggler{top: 50%; transform: translateY(-50%); right: 0;}// ------------------------------------------------------------------ // Style // ------------------------------------------------------------------ .o-discuss-Call-sidebar{&::-webkit-scrollbar{background: map-get($grays, '900');}&::-webkit-scrollbar-thumb{background: map-get($grays, '700');}}.o-discuss-Call-sidebarToggler{color: white; border-radius: 10px 0px 0px 10px; border-right: 0px; background-color: lighten(black, 10%);}

/* /mail/static/src/discuss/call/common/call_action_list.scss */
.o-discuss-CallActionList button:not(.btn-danger):not(.btn-success){background-color: var(--o-discuss-CallActionList-bgColor, #{$o-gray-800}); color: #FFFFFF;}

/* /mail/static/src/discuss/call/common/call_invitation.scss */
.o-discuss-CallInvitation-correspondent{width: 130px;}.o-discuss-CallInvitation img{width: 70%; height: 70%; border: 3px solid gray;}

/* /mail/static/src/discuss/call/common/call_invitations.scss */
.o-discuss-CallInvitations{z-index: $zindex-modal;}

/* /mail/static/src/discuss/call/common/call_menu.scss */
.o-discuss-CallMenu-buttonContent{max-width: 150px;}.o-discuss-CallMenu-dot{animation: flash 3s ease infinite;}

/* /mail/static/src/discuss/call/common/call_participant_card.scss */
.o-discuss-CallParticipantCard{color: white; aspect-ratio: 16/9; &.o-isTalking{box-shadow: inset 0 0 0 map-get($spacers, 1) darken($o-enterprise-action-color, 5%); &.o-inset{box-shadow: inset 0 0 0 map-get($spacers, 1)/2 darken($o-enterprise-action-color, 5%);}}&.o-inset{height: 20%; max-height: 125px !important; right: 1vh; bottom: 1vh; position: absolute !important; cursor: move !important; &.o-small{width: 30%; left: 0; top: 0;}.o-discuss-CallParticipantCard-avatar img{max-height: #{"min(70%, 70px)"}; max-width: #{"min(70%, 70px)"};}}}.o-discuss-CallParticipantCard-avatar:not(.o-minimized){background-color: var(--o-discuss-CallParticipantCard-avatarBgColor, #{$o-gray-700});}.o-discuss-CallParticipantCard-avatar img{max-height: #{"min(100%, 100px)"}; // interpolated as not supported by Sass max-width: #{"min(100%, 100px)"}; aspect-ratio: 1; border: solid $gray-500; &.o-isTalking{border: solid darken($o-enterprise-action-color, 5%);}&.o-isInvitation:not(:hover){animation: o-discuss-CallParticipantCard-avatarImag_borderPulse 3s linear infinite;}&.o-isInvitation:hover{border: solid map-get($theme-colors, 'danger');}}@keyframes o-discuss-CallParticipantCard-avatarImag_borderPulse{0%{border: solid white}20%{border: solid $gray-600}35%{border: solid $gray-100}50%{border: solid $gray-600}70%{border: solid $gray-100}85%{border: solid $gray-700}}.o-discuss-CallParticipantCard-iconBlackBg{background-color: rgba(0, 0, 0, 0.75);}.o-discuss-CallParticipantCard-overlay{margin: Min(5%, map-get($spacers, 2));}.o-discuss-CallParticipantCard-overlayBottom{background-color: rgba(0, 0, 0, 0.75); max-width: 50%;}.o-discuss-CallParticipantCard-overlay-replayButton{background-color: $o-gray-900; &:hover{background-color: $o-gray-700;}&:active{background-color: $o-gray-800;}}

/* /mail/static/src/discuss/typing/common/typing.scss */
.o-discuss-Typing-dot{animation: o_mail_Typing_animation 1.5s linear infinite; &.o-sizeMedium{width: $o-discuss-Typing-medium; height: $o-discuss-Typing-medium;}&.o-sizeSmall{width: $o-discuss-Typing-small; height: $o-discuss-Typing-small;}&.o-discuss-Typing-dot2{animation-delay: -1.35s;}&.o-discuss-Typing-dot3{animation-delay: -1.2s;}}@keyframes o_mail_Typing_animation{0%, 40%, 100%{opacity: initial;}20%{opacity: 25%;}}.o-discuss-Typing:before{// invisible character so that typing status bar has constant height, regardless of text content. content: "\200b";}

/* /im_livechat/static/src/embed/common/emoji_picker.scss */
.o-EmojiPicker{font-size: 1.2em;}

/* /im_livechat/static/src/embed/common/livechat_button.scss */
.o-livechat-LivechatButton{min-width: 100px; font-size: 14px; z-index: 5; transition: filter 0.3s; &:hover{filter: brightness(90%);}}.o-livechat-LivechatButton-notification{transform-origin: 100% 100%; bottom: 2.5em; right: 4.5em;}.o-livechat-LivechatButton-animate{animation: o-livechat-LivechatButton-notification-animation 0.6s ease-in-out forwards;}@keyframes o-livechat-LivechatButton-notification-animation{0%{opacity: 0; transform: scale(0);}20%{opacity: 0; transform: scale(0.5);}50%{opacity: 1;}75%{transform: scale(1.05);}100%{transform: scale(1);}}

/* /im_livechat/static/src/embed/common/scss/bootstrap_overridden.scss */
$nav-link-padding-y: 0.5em; $font-size-base: 1em; /// Converts px to em. /// --------------------------------------------------------------------------- /// @param{number or px value}$-px-value /// The value to convert. /// @param{number or px value}$-base /// The base font-size /// @return{number}/// `$-px-value` converted in rem units @function o-to-em($-px-value, $-base: 16){@return ($-px-value / $-base) * 1em;}$o-font-size-base: o-to-em(14) !default; $o-font-size-base-touch: o-to-em(16) !default; $o-font-size-base-small: o-to-em(13) !default; $o-font-size-base-smaller: o-to-em(12) !default; 

/* /im_livechat/static/src/embed/common/scss/shadow.scss */
// Duplicate :root/body rules into :host ruleset in order to make them work // in the shadow DOM. $o-livechat-font-size: 14px !default; // Source: bootstrap/scss/_root.scss :host{// Note: Custom variable values only support SassScript inside `#{}`. // Colors // // Generate palettes for full colors, grays, and theme colors. @each $color, $value in $colors{--#{$variable-prefix}#{$color}: #{$value};}@each $color, $value in $grays{--#{$variable-prefix}gray-#{$color}: #{$value};}@each $color, $value in $theme-colors{--#{$variable-prefix}#{$color}: #{$value};}@each $color, $value in $theme-colors-rgb{--#{$variable-prefix}#{$color}-rgb: #{$value};}--#{$variable-prefix}white-rgb: #{to-rgb($white)}; --#{$variable-prefix}black-rgb: #{to-rgb($black)}; --#{$variable-prefix}body-color-rgb: #{to-rgb($body-color)}; --#{$variable-prefix}body-bg-rgb: #{to-rgb($body-bg)}; // Fonts // Note: Use `inspect` for lists so that quoted items keep the quotes. // See https://github.com/sass/sass/issues/2383#issuecomment-336349172 --#{$variable-prefix}font-sans-serif: #{inspect($font-family-sans-serif)}; --#{$variable-prefix}font-monospace: #{inspect($font-family-monospace)}; --#{$variable-prefix}gradient: #{$gradient}; // Root and body // stylelint-disable custom-property-empty-line-before // scss-docs-start root-body-variables @if $font-size-root != null{--#{$variable-prefix}root-font-size: #{$font-size-root};}--#{$variable-prefix}body-font-family: #{$font-family-base}; --#{$variable-prefix}body-font-size: #{$font-size-base}; --#{$variable-prefix}body-font-weight: #{$font-weight-base}; --#{$variable-prefix}body-line-height: #{$line-height-base}; --#{$variable-prefix}body-color: #{$body-color}; @if $body-text-align != null{--#{$variable-prefix}body-text-align: #{$body-text-align};}--#{$variable-prefix}body-bg: #{$body-bg}; // scss-docs-end root-body-variables // stylelint-enable custom-property-empty-line-before}// Source: bootstrap/_reboot.scss :host{margin: 0; // 1 font-family: var(--#{$variable-prefix}body-font-family); @include font-size(var(--#{$variable-prefix}body-font-size)); font-weight: var(--#{$variable-prefix}body-font-weight); line-height: var(--#{$variable-prefix}body-line-height); color: var(--#{$variable-prefix}body-color); text-align: var(--#{$variable-prefix}body-text-align); background-color: var(--#{$variable-prefix}body-bg); // 2 -webkit-text-size-adjust: 100%; // 3 -webkit-tap-highlight-color: rgba($black, 0); // 4}// Source: webclient.scss :host{--o-webclient-color-scheme: #{$o-webclient-color-scheme}; font-size: $o-livechat-font-size;}// Source: ui.scss :host{& .o_hidden{display: none!important;}}

/* /im_livechat/static/src/embed/common/thread_patch.scss */
.o-livechat-NoPinMenu [data-oe-type="pin-menu"]{display: none;}

/* /website_livechat/static/src/embed/common/website_patch.scss */
// Shift cookies bar show/hide button to the side of livechat button. .o_cookies_bar_toggle{$-o-livechat-button-margin: 3%; // LivechatButton is set at 97% from left and top // LivechatButton size + margin + arbitrary gap. inset-inline-end: calc(56px + #{$-o-livechat-button-margin}+ 1rem); inset-block-end: var(--cookies-bar-toggle-inset-block-end, #{$-o-livechat-button-margin});}

/* /appointment/static/src/scss/appointment.scss */
.o_appointment_index{.o_half_screen_height{min-height: 200px !important;}.o_appointment_appointments_list{.o_appointment_unpublished{bottom: 0; padding: $card-spacer-y $card-spacer-x;}}.o_appointment_appointments_list_form{#appointment_type_id{height: 2.5rem; &:disabled{background-color: #FAFAFA;}}}.o_appointment_svg{max-width: 400px;}}.o_appointment_days{.o_today{& .o_day_wrapper::after{content: ""; @include o-position-absolute($left: 50%); width: 2.5em; height: .16em; bottom: map-get($spacers, 1); transform: translateX(-50%); background-color: map-get($theme-colors, 'danger'); border-radius: $border-radius-pill; transition: $btn-transition;}& .o_day_wrapper.active::after, .o_slot_button:hover::after{$-danger-hue: hue(map-get($theme-colors, 'danger')); $-primary-hue: hue(map-get($theme-colors, 'primary')); background-color: if($-primary-hue > ($-danger-hue + 70) or $-primary-hue < ($-danger-hue - 70), map-get($theme-colors, 'danger'), currentColor);}}}.o_appointment_month{min-height: 336px;}.o_appointment_validation_bottom_btns{.o_outlook_calendar{background-color: #1976D2; color: white; &:hover{background-color: #144c85;}}.o_google_calendar{background-color: white; font-weight: 500; color: black; border: 1px solid #DEE2E6; &:hover{background-color: $gray-200;}}}.o_appointment_avatar_container{position: relative; .o_appointment_avatar_background{@include o-position-absolute(0, 0, 0, 0); background-size: cover; background-position: center; background-repeat: no-repeat;}}.o_appointment_avatar_background{background-color: mix(map-get($theme-colors, 'primary'), $body-bg, 20%);}.o_appointment_user_avatar{width: 32px; height: 32px; margin-left: -8px; border: 1px solid #fff; font-size: 12px; background-size: cover; &:first-child{margin-left: 0px;}&:only-child{margin-right: 0.5rem;}}.o_appointment_disable_calendar{pointer-events: none; opacity: 60%;}

/* /website_hr_recruitment/static/src/scss/website_hr_recruitment.scss */
 .o_jobs_topbar_filters{.dropdown-toggle{.fa{margin-right: .4em;}&:after{margin-left: 1.2em;}}.dropdown-menu{margin-top: $navbar-padding-y; min-width: 12rem;}}.o_website_hr_recruitment_jobs_list{#jobs_grid{.o_job_infos{.fa{color: theme-color('secondary'); margin-right: .5rem;}}.card{&, *{transition: all .1s;}&:hover{box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);}}.o_jobs_unpublished{opacity: .6;}}.o_website_hr_recruitment_job_description{//The ellipsis may not be supported on all platforms, the text will just break for them max-height: 60px; //Limit to 3 lines line-height: 20px; -webkit-line-clamp: 3; -moz-line-clamp: 3; -ms-line-clamp: 3; line-clamp: 3; word-break: break-word; display: -webkit-box; -webkit-box-orient: vertical; -moz-box-orient: vertical; -ms-box-orient: vertical; box-orient: vertical; overflow: hidden;}}.o_linkedin_icon{position: absolute; height: 100%; padding: 2px 5px; margin: 0!important; border-radius: 0.25rem; background-color: #f5993c; filter: invert(1);}.o_apply_description_link:hover{filter: brightness(90%); background-color: #fff; color: #35979c;}.o_resume_input{border-color: #35979c;}.o_resume_input::file-selector-button{color: #35979c; border-color: #35979c; background-color: #fff;}%o_website_hr_recruitment_hover{transition: .5s; &:hover{transform: scale(1.01, 1.01); box-shadow: 0 0 20px rgba(0, 0, 0, 0.25) !important;}}.o_jobs_image_gallery.s_image_gallery img{@extend %o_website_hr_recruitment_hover;}#jobs_section, #jobs_thankyou{.s_company_team .o_jobs_hr_recruiter{@extend %o_website_hr_recruitment_hover;}}

/* /appointment_account_payment/static/src/scss/appointment_payment.scss */
.o_appointment_payment{min-height: 45vh;}

/* /auth_totp_portal/static/src/scss/auth_totp_portal.scss */
 .o_auth_totp_enable_2FA{.o_field_copy{height: 24px; position: relative; width: 100% !important; border-radius: 5px; border: 1px solid $primary; @include font-size($font-size-sm); text-transform: uppercase; color: $o-brand-primary; font-weight: $badge-font-weight; text-align: center; padding-right: 6rem; word-break: break-word; .o_clipboard_button{@include o-position-absolute($top: 0, $right: 0); &.o_btn_text_copy{position: absolute; top: 0; right: 0;}&.o_btn_char_copy{height: 100%;}}&.o_field_copy_url{cursor: pointer; padding-left: 3px;}}}

/* /hr_contract_salary/static/src/scss/hr_contract_salary.scss */
#hr_contract_salary{#hr_cs_form{font-family: $o-font-family-sans-serif; font-size: 13px; section{padding-bottom: 45px;}h1{margin: 45px 0 30px 0; font-weight: 400;}h2{margin: 20px 0 15px 0; font-size: 18px; font-weight: 400;}a{color: $o-brand-primary;}input:focus::-webkit-input-placeholder{color:transparent;}input:focus::-moz-placeholder{color:transparent;}input:focus:-ms-input-placeholder{color:transparent;}.form-text{display: inline-block; margin: 0.25rem 0; font-weight: 400;}#hr_cs_configurator, #hr_cs_sidebar{.row{.col-form-label{font-weight: 500;}}.col-form-label{color: $o-brand-odoo;}}#hr_cs_configurator, #hr_cs_sidebar, #hr_cs_modal{.form-control[disabled]{height: auto; padding: 0; border: 0; margin-bottom: 0; background-color: transparent; color: #000; box-shadow: none; cursor: default; text-align: right;}.input-group .form-control[disabled] + .input-group-text, .o_left{border: none; background-color: transparent;}.folded_content > span:empty{display: none;}}#hr_cs_sidebar{align-self: flex-start; @include o-position-sticky($top: 60px); .row{padding: 5px 0; &:last-child{border-bottom: 1px solid map-get($grays, '200');}.form-control[disabled].o_outdated{color: map-get($theme-colors, 'danger'); text-decoration: line-through;}.col-form-label{margin-bottom: 0;}}a{cursor: pointer;}}#hr_cs_personal_information{background-color: map-get($grays, '200'); h2{padding-bottom: 10px; border-bottom: 1px solid lighten(map-get($grays, '600'), 40%);}.form-control{&:hover, &:focus{border-color: $o-brand-primary; box-shadow: none;}}.col-form-label{color: #000;}input.bg-danger{background-color: white !important; border-color: red !important; color: #495057 !important;}a.select2-choice.bg-danger{background-color: white !important; border-color: red !important; color: #495057 !important;}.o_contract_radio.invalid_radio{border: 1px solid red; border-radius: $border-radius;}}.hr_cs_btn_submit{display: block; width: 100%; margin-top: 30px; margin-bottom: 30px; a{color: #fff;}}#hr_cs_modal{.modal-body :first-child{border-top: 0 !important;}.col-form-label{margin-bottom: 0;}.close{opacity: 1; background-color: white; border-color: white;}}.hr_cs_control{position: relative; display: inline-block; margin-right: 30px; padding-left: 30px; cursor: pointer; font-weight: 400; input{position: absolute; z-index: -1; opacity: 0;}&:focus-within{.hr_cs_control_indicator{border: 1px solid $o-brand-primary;}}}.hr_cs_control_indicator{@include o-position-absolute($top: 0, $left: 0); width: 20px; height: 20px; background-color: map-get($grays, '200'); border: 1px solid lighten(map-get($grays, '600'), 20%); &.hr_cs_control_indicator_white{background-color: #fff;}}.hr_cs_control:hover input ~ .hr_cs_control_indicator{background-color: lighten(map-get($grays, '600'), 20%); border-color: lighten(map-get($grays, '600'), 20%); &:after{display: block;}}.hr_cs_control input:checked ~ .hr_cs_control_indicator{background-color: $o-brand-primary; border-color: $o-brand-primary; &.hr_cs_control_no{background-color: #E46F78; border-color: #E46F78;}}.hr_cs_control_indicator:after{content: ""; position: absolute; display: none;}.hr_cs_control input:checked ~ .hr_cs_control_indicator:after{display: block;}.hr_cs_control_checkbox .hr_cs_control_indicator:after{top: 2px; left: 6px; width: 6px; height: 12px; transform: rotate(45deg); border: solid #fff; border-width: 0 2px 2px 0;}.hr_cs_control_radio .hr_cs_control_indicator{border-radius: 50%; &:after{top: 5px; left: 5px; width: 8px; height: 8px; border-radius: 50%; background-color: #fff;}}@mixin track{height: 5px; background-color: map-get($grays, '200'); cursor: pointer;}@mixin thumb{width: 18px; height: 18px; border: 0; margin-top: -7px; background-color: $o-brand-primary; border-radius: 50%; cursor: pointer;}@mixin progress{height: 5px; background: $o-brand-primary;}.hr_cs_control_range{width: 82%; display: inline-block; vertical-align: middle; -webkit-appearance: none; &:focus{outline: none;}&::-webkit-slider-runnable-track{@include track;}&::-moz-range-track{@include track;}&::-ms-track{@include track;}&::-webkit-slider-thumb{@include thumb; -webkit-appearance: none;}&::-moz-range-thumb{@include thumb;}&::-ms-thumb{@include thumb;}&::-moz-range-progress{@include progress;}&::-ms-fill-lower{@include progress;}}.select2-container{border: 0; box-shadow: none; .select2-choice{background-color: #fff; color: $body-color; background-image: none; height: 34px; line-height: 34px; border: $input-border-width solid $input-border-color; border-radius: 4px; .select2-arrow{width: auto; padding: 0 8px 0 10px; border-left: 0; background-color: #fff; background-image: none; font-size: .9em; border-radius: 0; b{margin: 4px 10px;}}}&.select2-container-active{.select2-choice{@include border-bottom-radius(0); border-color: $o-brand-primary; box-shadow: none;}}&:hover, &:focus{box-shadow: none; .select2-choice{border-color: $o-brand-primary;}}&.form-control-primary{.select2-choice{border-color: $o-brand-primary; .select2-arrow{background-color: $o-brand-primary; color: #fff;}}}}}.select2-drop{margin-top: 0; box-shadow: none;}.select2-drop-active{border-color: $o-brand-primary;}.select2-results .select2-highlighted{background-color: map-get($grays, '200'); color: $body-color;}}.hr_cs_brand_optional{color: $o-brand-primary;}

/* /website_sale_wishlist/static/src/scss/website_sale_wishlist.scss */
.oe_website_sale{.td-wish-btn{width: 140px;}div.css_not_available .o_add_wishlist_dyn{display: none;}.btn.o_add_wishlist_dyn.disabled i::before{content: "\f004";}}// XS size @include media-breakpoint-down(md){.oe_website_sale{.td-wish-btn{width: 100px;}}}table.table-comparator .td-img img{// allows sizing the placeholder image to the "image" size of 100px max-height: 100px;}

/* /ebs_website_extended/static/src/css/style.css */
 body{font-family: 'Roboto', sans-serif !important;}.inner_forms h1,.inner_forms h2, .inner_page h1,.inner_page h2{font-size:28px!important; color:#575756; font-family: 'Roboto', sans-serif !important; font-weight:bold!important;}.image_text_homepage_for_sub_img{z-index: 1; display: flex; flex-direction: column; position: absolute; max-width: 1208px; width: 100vw; left: 50%; transform: translateX(-50%); top: 0.25vw;}.image_text_homepage{z-index: 1; display: flex; flex-direction: column; position: absolute; max-width: 1167px; width: 100vw; left: 50%; transform: translateX(-50%); top: 1.25vw;}@media (max-width:992px){.image_text_homepage{width: 90vw !important;}}@media (max-width:600px){.promate_sub_categories2_desktop{display:none !important;}.promate_sub_categories2_mobile{display:block !important;}.promate_sub_categories2 p.lead{display:none;}.promate_sub_categories .image_text_homepage font,.promate_sub_categories2 font{font-size:14pt !important;}.promate_digital_brand_title h1{font-size: 12.74pt !important;}.promate_digital_brand_title h1 span{font-size: 20pt !important;}.promate_digital_brand_details .promate_digital_brand_detail_text{font-size:12pt;}.promate_digital_brand_details .promate_digital_brand_detail_num{font-size:16pt !important;}.promate_digital_brand_details .promate_digital_brand_detail_num span{font-size:20pt !important;}.promate_whats_tending_title h1{font-size: 20pt !important;}.mobile-view-tws-speaker h2{font-size:16pt !important;}.mobile-view-tws-speaker .learn_more{width: 55px !important; padding: 1px !important; font-size: 7px !important;}.main_title_headline{width: 200px !important;}}.mycart-popover .popover-body{max-height: unset !important; overflow-y: hidden !important;}@media (min-width:0px) and (max-width:320px){#wrapwrap{overflow:hidden !important; overflow-y:auto !important;}}@media (min-width:556px) and (max-width:600px){#wrapwrap{overflow:hidden !important; overflow-y:auto !important;}}@media (max-width:340px){#add_to_cart, .o_we_buy_now{width: 123px !important; font-size: 14px !important;}}@media (max-width:305px){.js_main_product .input-group-prepend{margin-left: 9px !important;}#add_to_cart, .o_we_buy_now{width: 112px !important;}}@media (max-width:767.98px){tr.wishlist-tr th, tr.wishlist-tr td{font-size: 8px !important;}.wishlist-tr span{font-size: 10px !important;}.add-prod-qty{flex-direction: initial !important; align-items: center;}.td-wish-btn button{width:56px; font-size: 8px !important;}.progress-wizard .no-decoration{width: 33%;}.progress-wizard{display:flex;}.progress-wizard .progress-wizard-step{text-align:center;}.progress-wizard .progress-wizard-step .progress-wizard-steplabel{margin-left: 0px !important; font-size: 16px !important;}.progress-wizard-bar.d-none.d-md-block.done,.progress-wizard-dot.d-none.d-md-inline-block{display:block !important;}.progress-wizard .progress-wizard-step .progress-wizard-dot{top:0px !important; margin:auto;}}@media (max-width:480px){.progress-wizard .progress-wizard-step .progress-wizard-steplabel{font-size: 12px !important;}}@media (max-width:340px){.progress-wizard .progress-wizard-step .progress-wizard-steplabel{font-size: 9px !important;}}@media (max-width:280px){.js_main_product .input-group-prepend{margin-left: 0px !important;}#add_to_cart, .o_we_buy_now{width: 100px !important;}}@media (max-width:567.98px){.o_page_header{padding-left:5px !important;}.col-12.col-xl.order-xl-1.oe_cart.p-0 .row{margin-right: 0px !important; margin-left: 0px !important;}form.checkout_autoformat .form-row{display: unset !important; -webkit-flex-wrap: unset !important; flex-wrap: unset !important; margin-right: 0px !important; margin-left: 0px !important;}.tab-section .nav-tabs .nav-link.active{font-size: 11px!important;}.tab-section .nav-tabs .nav-link{font-size: 11px!important;}}@media (max-width:380px){.tab-section .nav-tabs .nav-link.active{font-size: 8px!important;}.tab-section .nav-tabs .nav-link{font-size: 8px!important;}}@media (max-width:340px){.tab-section .nav-tabs .nav-link.active{font-size: 7px!important;}.tab-section .nav-tabs .nav-link{font-size: 7px!important;}}@media (max-width:768px){.promate_product_kanban .promate_products{max-width:100% !important;}.promate_product_kanban .row.o_wsale_products_main_row{display: block !important;}.mobile-view-tws-speaker p.lead{display:none;}}@media (max-width:985.98px){.job_header .navbar .navbar-brand{height: 8px !important;}.job_header .navbar-brand.logo img{max-width:98px !important;}.job_header .navbar{padding: 0rem 0rem !important; min-height: 24px !important;}.job_header #top_menu_container{min-height: 24px !important;}.career_section_title{padding-top:0px !important; padding-bottom:0px !important;}.career_section_title .row{margin-right: 0px !important; margin-left: 0px !important;}.slider_false{display:none;}}@media (max-width:768px){.oe_website_sale .td-wish-btn{width: 60px;}.login-div-section{background:unset !important;}.oe_login_buttons .forgot_password_promate,.oe_login_buttons span{font-size: 14px!important;}.o_register_form .lang-select{width:44% !important;}.promate_sub_categories .image_text_homepage .learn_more{width: 55px !important; padding: 1px !important; font-size: 7px !important;}.promate_sub_categories .image_text_homepage p.lead{display:none;}.owl-carousel .owl-item img{width: 80% !important; margin: 0 auto;}.s_carousel_wrapper.promate_home .s_main_carousel a.carousel-control-prev,.s_carousel_wrapper.promate_home .s_main_carousel a.carousel-control-next{display:none;}.promate_home .image_text_homepage p,.image_text_homepage .main_title_headline,.image_text_homepage h2{display:none !important;}.promate_home .image_text_homepage .learn_more,.promate_sub_categories2 .learn_more{width: 55px !important; padding: 1px !important; font-size: 7px !important;}.promate_home .image_text_homepage h1{font-size:10pt !important;}#myCarousel1596829188680 .image_text_homepage{margin-top: -52px !important;}}@media (max-width:567.98px){.wishlist-section #contactus_title_container .row{margin-left:0px !important; margin-right:0px !important;}}#myCarousel1596829188680 .image_text_homepage{top: 50% !important; margin-top: -140px;}.s_main_carousel a.carousel-control-next{width: 65px;}.s_main_carousel a.carousel-control-prev{width: 65px;}.pb16{padding-bottom: 16px;}.pt16{padding-top:16px;}.inner_forms p,.inner_forms .s_website_form_label_content,.jobs_container{color:#575756; font-size:16px; font-family: 'Roboto', sans-serif !important;}.inner_forms h2,.inner_page h2{font-size: 20px!important; font-family: 'Roboto', sans-serif !important;}.inner_forms p,.inner_page h2{margin:20px 0px 20px 0px;}.inner_forms .s_website_form_label_content{font-size:16px; font-family: 'Roboto', sans-serif !important;}.inner_forms .s_website_form_mark,.inner_forms ul li a:hover,.inner_page h2,.inner_page p a{color: #be202f;}#tiktok_img:hover{fill: #b2292e}.inner_forms .btn-primary{background-color: #b2292e; border-color: #b2292e; padding:5px; width:100px; font-size:13px;}.inner_forms ul{padding:0px;}.inner_forms ul li{list-style:none;}.inner_forms ul li{margin:20px 0px 20px 0px;}.inner_forms ul li a,.inner_page p,.mypromate_sidebar p,.mypromate_sidebar ul li{color:#575756; font-size:16px; font-family: 'Roboto', sans-serif !important;}.mypromate_sidebar{margin-left: 40px; border-left: 1.5px solid #be202f;}.title_headline{background: #B42B39; height: 2px; width: 100px;}.title_headline1{width:100%; height:2px; background-color: #656668; stroke:1px;}.main_title_headline{width: 240px; height: 2px; background-color: #B2292E; stroke: 1px;}.mypromate_sidebar i{color: #be202f; padding-right: 10px; font-size: 20px;}.mypromate_sidebar .contact_information{margin:0px 0px 50px 0px;}p.about_quote{font-size:17px;}p.about_quote span{font-size:14px;}.jobs_container{background: #f7f7f7; padding: 1rem 0 3rem;}.jobs_container h2{color: #be202f; font-size:16.5px; font-weight:bold;}.browse-btn{font-size:13px;}.partner_checkbox .field-checkbox{width:48%; display: inline-block; font-size:13px; color: #575756;}.s_website_form_field_social{color: #575756;}a.add-more{color:#fff; background:#B42B39; padding:6px!important; font-size:13px!important;}a.add-more:hover{color:#fff; text-decoration:none;}.newsletterlabel{font-size:12px; font-weight:normal;}.review_text{font-size:11px; margin-bottom:20px;}.inner_forms .oe_login_form input,#search-product{background:#f6f6f6; border-radius: 10px; border-color:#f6f6f6;}.inner_forms .mypromate_sidebar ul li a.active{color:#be202f; font-weight:700; border-bottom:1px solid #be202f;}.login_sidebar{margin:50px 0px 0px 0px;}.o_footer{font-family: 'Roboto', sans-serif !important; background:#fff; padding-top:0px;}.o_footer h5{color:#be202f!important; font-size: 15px; font-weight: bold;}.award_section .elements .image{height: unset !important;}.o_footer ul li{margin: 5px 0px 5px 0px;}.o_footer .o_footer_copyright{background-color: #E6E7E8 !important;}.o_footer_copyright .o_footer_copyright_name{color: #656668!important; background-color: #E6E7E8; text-align: center; font-family: 'Roboto', sans-serif !important; font-size:14px;}.o_footer ul{padding:0px;}.o_footer a{font-family: 'Roboto', sans-serif !important; font-size:14px; color:#231F20!important;}.o_footer h5{font-family: 'Roboto', sans-serif !important;}.o_footer a:hover{color:#be202f!important; text-decoration:none;}.footer_logo{width: 200px; margin-left: -1px; margin-bottom: 15px; padding-top: 30px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px;}.o_footer .stay_connected a{font-size:17px; margin-right:10px;}.o_footer .stay_connected{margin-bottom:20px;}.product-container{border:1px solid #ccc; border-radius:5px; font-family: 'Roboto', sans-serif !important; padding-bottom:20px; margin-bottom:20px;}.product-container h4{font-size:19px; font-weight:bold; padding: 10px 0px 0px 10px;}.product-container a{background-color: #be202f; border-color: #be202f; padding: 5px; font-size: 13px; color:#fff; font-weight:bold; border-radius:5px;}.product-container a:hover{color:#fff;}.product-container p{margin:0px 0px 20px 0px!important; padding: 0px 0px 0px 10px; min-height:80px;}.product-image{background-color: #f9f9f9; text-align: center; border-radius:5px;}.donwload-btn{width:100%; text-align:Center;}.pt140{padding-top:140px!important;}.pb200{padding-bottom:200px!important;}.s_main_carousel{font-family: 'Roboto', sans-serif !important;}.s_main_carousel h2{font-weight: bold; color:#575756;}.s_main_carousel p{margin-top:20px;}.s_main_carousel a,.main_masonry a{padding: 5px; width: 140px; font-size: 13px; color:#fff!important; border-radius: 30px; background-color: transparent ; border-color: #fff;}#search-product{border:none; padding:7px;}@media only screen and (max-width: 769px){.s_main_carousel .carousel-item:first-child{background-position: 50% 90% !important;}}@media only screen and (max-width: 992px){.carousel-indicators.listcarouselcss{margin-bottom:17px !important;}.mypromate_sidebar{margin-left: 0px; border-left: none; border-top:1.5px solid #be202f; padding-top:20px;}}.pagination a{color: black; float: left; padding: 8px 16px; text-decoration: none; transition: background-color .3s;}.pagination a.active{background-color: #be202f; color: white;}.product-container .product-image img:hover{transform: scale(1.2);}.product-container .donwload-btn a:hover{text-decoration: none; opacity:0.5}option.imagebacked{padding: 2px 0 2px 20px; background-repeat: no-repeat; background-position: 1px 2px; vertical-align: middle;}#myInput{box-sizing: border-box; background-image: url('/ebs_website_extended/static/src/css/searchicon.png'); background-position: 14px 12px; background-repeat: no-repeat; font-size: 16px; padding: 6px 20px 6px 21px; border: none; border-bottom: 1px solid #ddd;}#myInput:focus{outline: 3px solid #ddd;}.dropdown{position: relative; display: inline-block;}.dropdown-content{position: absolute; background-color: #f6f6f6; min-width: 360px; overflow: auto; border: 1px solid #ddd; z-index: 1; top:-16px;}.dropdown-content a{color: black; padding: 9px 11px; text-decoration: none; display: block;}.dropdown a:hover{background-color: #ddd;}.o_no_autohide_item.dropdown a:hover{background-color: unset !important;}.show{display: block;}.award_section{background:#f8f8f8; width:100%; padding:20px 0px 0px 0px;}.award_section img{max-width:50%;}.award_section p{color: #434555; font-size: 9pt; font-family: 'MYRIADPRO-REGULAR';}.award_section .elements{width: 10.1%; display: inline-block; text-align: center; margin: 0px 5px 0px 5px;}.footer_bottom{padding:20px 0px 0px 0px;}.main_masonry{font-family: 'Roboto', sans-serif !important; margin:40px 0px 40px 0px;}h2.main_title{font-family: 'Roboto', sans-serif !important; font-size:21px; font-weight:bold; color:#575756!important;}.main_masonry p{color: #575756; font-size: 14px; margin:20px 0px 20px 0px;}.pt124{padding-top:124px;}.pb124{padding-bottom:124px;}.pb30{padding-bottom:30px;}.img-hover-zoom{overflow: hidden; height:100%;}.img-hover-zoom img{transition: transform .5s ease;}.img-hover-zoom:hover img{transform: scale(1.5);}.s_main_carousel a:hover, .main_masonry a:hover{background-color: #be202f;border-color: #be202f}.featured_categories a p,{font-family: 'Roboto', sans-serif !important; color:#575756; padding:10px 0px 10px 0px;}.featured_categories a:hover p{color:#be202f!important;}.featured_categories a:hover{text-decoration:none;}.trending_products .elements,.discover_more .elements{position:relative;}.trending_products .elements .trending_description{position: absolute; top: 15%; left: 0 !important; margin-left: 0px !important; width: 98%;}.discover_more .elements .discover_more_description{position:absolute; top:6%; left:20%; margin-left:-70px; width:40%;}.trending_products .elements .trending_description h1,.discover_more .discover_more_description h1,.trending_products .elements .trending_description p,.discover_more .discover_more_description p{color:#fff;}@media only screen and (max-width: 769px){.s_main_carousel .carousel-item:first-child{background-position: 50% 90% !important;}.award_section{display:none;}}@media only screen and (max-width: 992px){.mypromate_sidebar{margin-left: 0px; border-left: none; border-top:1.5px solid #be202f; padding-top:20px;}}@media only screen and (min-width: 1500px){.image_text_homepage.second_main_div{margin-left: 36%;}}@media only screen and (min-width: 1200px) and (max-width: 1499px){.image_text_homepage.second_main_div{margin-left: 41%;}}@media only screen and (min-width: 991px) and (max-width: 1199px){.image_text_homepage.second_main_div{margin-left: 46%;}}@media only screen and (min-width: 768px) and (max-width: 990px){.image_text_homepage.second_main_div{margin-left: 32%;}}@media only screen and (min-width: 526px) and (max-width: 767px){.image_text_homepage.second_main_div{margin-left: 0%;}}@media only screen and (max-width: 526px){.image_text_homepage.second_main_div{margin-left: 0%;}}.js_language_selector span{color:#231F20!important;}.js_language_selector{float: right;}.footer_bottom{padding: 0px 0px 0px 0px;}header .navbar .product_mega_menu{overflow-y: visible !important; overflow-x: unset !important;}

/* /ebs_website_extended/static/src/css/products_css.css */
 a.file_anchor{color:#212529;}a.file_anchor h2{font-size:20px !important;}a.file_anchor:hover{text-decoration: none !important;}@media (min-width: 1199.98px) and (max-width: 1699.98px){.oe_product_cart{min-height: 400px !important;}.oe_product_cart .oe_product_image img{height: 100% !important; width: auto !important;}.oe_product_image{min-height: 170px !important;}}.page-item.active .page-link{background-color: #b42b39; border-color: #b42b39;}h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{font-family: 'Roboto', sans-serif !important;}.btn{font-family: 'Roboto', sans-serif !important;}.product_review_div{font-size:13px;}#tab-Reviews span{font-size:16px; font-family: 'Roboto', sans-serif,"FontAwesome" !important;}#tab-Reviews h3{font-size:20px; font-family: 'Roboto', sans-serif !important;}#tab-Reviews p{font-size:16px; font-family: 'Roboto', sans-serif !important;}#tab-Reviews h1{font-size:28px; font-family: 'Roboto', sans-serif !important;}#category_header{margin-bottom:0px !important;}.related-product .item{padding-left: 12px !important; padding-right: 12px !important;}.related-product .ecommerce_product_title{ont-size: 13px;font-weight: 400;margin-bottom: 10px;}.oe_website_sale h1[itemprop="name"]{font-size: 22px; font-weight: bolder;}.promate-variant .css_attribute_color.active{opacity:1 !important;}.promate-variant .css_attribute_color{opacity:0.5 !important;}.s_share a{color:#231F20!important}.s_share a:hover{text-decoration:unset !important; color:#be202f !important;}.o_we_buy_now{margin-left: 22px;}#add_to_cart,.o_we_buy_now{width:140px; font-size:16px; padding-right: 0rem !important; padding-left: 0rem !important;}.promate_products{flex: 0 0 20.666667% !important; max-width: 20.666667% !important;}li.breadcrumb-item:last-child span{color: #b42b39 !important;}.breadcrumb-item.active span{color: #b42b39 !important;}.breadcrumb-item a{color:#6C757D !important;}.breadcrumb-item a:hover{text-decoration: none !important; color:#6C757D !important;}.custom-radio .custom-control-label::before{border-radius: 0% !important;}.custom-radio .custom-control-input:checked ~ .custom-control-label::after{background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23FFFFFF' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e") !important;}.promate_product_kanban .o_wsale_products_main_row{height:100%;}.promate_product_kanban{height:100%;}.oe_product_image{background-color: #f5f5f5 !important; border-radius: 10px !important; min-height: 200px; max-height: 600px;}.o_wsale_layout_list .oe_product_image{height: auto !important; max-height: unset;}@media (min-width: 576px){#products_grid.o_wsale_layout_list .oe_product_cart .o_wsale_product_information_text .o_wsale_products_item_title{border-bottom: 0px solid #DEE2E6;}}.product-name{font-size: 16px; font-weight: 800; color: #656668 !important}.product-title{font-size: 12px; color: #656668 !important}.oe_product_cart{display: flex; margin: 8px 0 8px 0!important; background: #fff; border-radius: 15px!important; box-shadow: 0 1px 11px rgb(0 0 0 / 36%); border-color: rgba(223, 225, 229, 0)!important; border: 0px solid #f5f5f5!important;}.oe_product_cart{min-height: 390px; max-height: 1200px;}.product-title p{margin-bottom:10px !important; margin-top: 10px;}.o_wsale_layout_list .oe_product_cart{height:unset;}.o_wsale_product_grid_wrapper{height:465px;}.o_wsale_layout_list .o_wsale_product_grid_wrapper{height:unset;}.tab-section .nav-tabs .nav-link{color: #bababa; font-size: 16px; font-weight: 400!important;}.tab-section .nav-tabs .nav-link{border: 0px solid transparent; border-top-left-radius: .25rem; border-top-right-radius: .25rem;}.tab-section .nav-link{padding: .25rem 0rem; text-transform: uppercase;}.tab-section .nav-tabs .nav-link.active{color: #b42b39 !important; background-color: #fff; border-color: #dee2e6 #dee2e6 #fff; font-size: 16px; font-weight: 600!important;}.tab-section .nav-tabs .nav-item{margin: 0px 50px 0px 0px;}.custom-control-input:checked ~ .custom-control-label::before{border-color: #b42b39; background-color: #b42b39;}.css_quantity .btn:focus{box-shadow: unset;}.css_quantity .btn{background: #ffffff; color: #22262a; font-size: 11px;}.css_quantity input{background-color: #ffffff; border-left:0px; border-right:0px;}#add_to_cart_wrap{display: block !important; margin: 20px 0;}#add_to_cart_wrap .o_add_wishlist_dyn{opacity: 1 !important; color: #b42b39 !important; border-radius: 10px; padding-left: 12px !important; padding-right: 12px !important;}#o_product_terms_and_share{display:none;}.variant_attribute .attribute_name:after{content: ':' !important; font-size: 18px; border-bottom:unset !important; margin-left: unset !important; flex-grow: unset !important;}.variant_attribute .attribute_name{text-transform: initial; font-size: 13px;}.js_add_cart_variants .variant_attribute{display:flex; flex-direction: column;}.promate_grid_product .o_add_wishlist{padding-top: 0px !important; color:#000; border:0px; opacity: 1; border-color:unset; padding: 3px}.prod_temp_color{height: 20px; width: 20px; border: 3px solid #DEE2E6; margin-bottom: 0px !important; border-radius:unset !important; margin-left: 4px;}.promate_prod_review_kanban{text-align: end;}.prod_temp_color.css_attribute_color:before{content: ""; display: block; position: absolute; top: -2px; left: -2px; bottom: -2px; right: -2px; border: 1px solid white; border-radius:unset !important; box-shadow: inset 0 0 3px rgb(0 0 0 / 30%);}.prod_temp_color.css_attribute_color.active{border: 3px solid #b2292e;}.prod_temp_color input{width:5px !important; height:5px !important; margin: 5px !important;}section#product_detail>.row:first-child{display: none;}#o-carousel-product .carousel-control-prev > span, #o-carousel-product .carousel-control-next > span{border: none; font-size: 2.15rem;}.product-breadcrumb .breadcrumb{padding: 0 0rem; margin-bottom: 0; background-color: transparent;}.product-breadcrumb .breadcrumb-item + .breadcrumb-item::before{display: inline-block; padding-right: 0.5rem; color: #6C757D; content: " "; width: 0; height: 0; border-top: 5px solid transparent; border-left: 10px solid #555; border-bottom: 5px solid transparent;}#product_tab{background:#efefef;}.tab-section .nav-tabs .nav-link.active{background-color: transparent; border-color: transparent;}.tab-section .nav-tabs .nav-link{font-weight:600 !important;}.oe_product_image{background-color:transparent !important}.rating-checked{color: #be202f !important;}.triangle-topleft{position: absolute; top:0; left:0; width: 0; height: 0; border-top: 100px solid #be202f; border-right: 100px solid transparent;}.triangle-content{position: absolute; top: -90px; left: 5px; line-height: 15px; font-size: 18px; color: #fff; text-align: left;}@media (min-width: 1800px){.container-1800{max-width: 100%!important;}#product_detail{max-width: 100%!important; width:89% !important;}}.products_header{display:none;}@media (min-width: 992px){.oe_website_sale #products_grid_before{border-right: none; padding-right: 20px; background: #EFEFEF; padding-left: 6%;}}a#add_to_cart i{display: none;}.social-media .text-lg-right{text-align: left !important;}.related_pro_slider .owl-stage{min-height: 300px; margin: 0 auto; display: -webkit-flex; display: flex;}.related_pro_slider .item{padding: 10px; -webkit-flex: 1; -ms-flex: 1; flex: 1;}.related_pro_slider .owl-nav{display: block;}.carousel-wrap{padding: 0 1%; width: 100%; position: relative;}.carousel-wrap .owl-carousel .item{position: relative; z-index: 100; -webkit-backface-visibility: hidden;}.carousel-wrap .owl-nav{margin-top: -26px; position: absolute; top: 50%; color: #cdcbcd;}.carousel-wrap .owl-nav i{font-size: 30px;}.carousel-wrap .owl-nav .owl-prev{position: absolute; top: -120px; left: -12px; margin: 0;}.carousel-wrap .owl-nav .owl-next{position: absolute; top: -120px; left: 1080px; margin: 0;}.carousel-wrap .owl-theme .owl-nav [class*=owl-]:hover{background: transparent; color: #d6d6d6; text-decoration: none;}.carousel-wrap button:focus{outline: none;}@media (min-width: 2101px){.carousel-wrap .owl-nav .owl-next{left: 1970px;}}@media (min-width: 2000px) and (max-width: 2100px){.carousel-wrap .owl-nav .owl-next{left: 1970px;}}@media (min-width: 1900px) and (max-width: 1999px){.carousel-wrap .owl-nav .owl-next{left: 1760px;}}@media (min-width: 1800px) and (max-width: 1899px){.carousel-wrap .owl-nav .owl-next{left: 1550px;}}@media (min-width: 1000px) and (max-width: 1200px){.carousel-wrap .owl-nav .owl-next{left: 900px;}}@media (min-width: 768px) and (max-width: 999px){.carousel-wrap .owl-nav .owl-next{left: 665px;}}@media (min-width: 600px) and (max-width: 767px){.carousel-wrap .owl-nav .owl-prev{top: -150px;}.carousel-wrap .owl-nav .owl-next{top: -150px; left: 490px;}}@media (min-width: 560px) and (max-width: 575px){.carousel-wrap .owl-nav .owl-next{left: 525px;}}@media (min-width: 540px) and (max-width: 559px){.carousel-wrap .owl-nav .owl-next{left: 502px;}}@media (min-width: 520px) and (max-width: 539px){.carousel-wrap .owl-nav .owl-next{left: 482px;}}@media (min-width: 500px) and (max-width: 519px){.carousel-wrap .owl-nav .owl-next{left: 462px;}}@media (min-width: 480px) and (max-width: 499px){.carousel-wrap .owl-nav .owl-next{left: 442px;}}@media (min-width: 460px) and (max-width: 479px){.carousel-wrap .owl-nav .owl-next{left: 420px;}}@media (min-width: 450px) and (max-width: 459px){.carousel-wrap .owl-nav .owl-next{left: 410px;}}@media (min-width: 435px) and (max-width: 449px){.carousel-wrap .owl-nav .owl-next{left: 393px;}}@media (min-width: 435px) and (max-width: 449px){.carousel-wrap .owl-nav .owl-next{left: 410px;}}@media (min-width: 420px) and (max-width: 434px){.carousel-wrap .owl-nav .owl-next{left: 383px;}}@media (min-width: 405px) and (max-width: 419px){.carousel-wrap .owl-nav .owl-next{left: 369px;}}@media (min-width: 390px) and (max-width: 404px){.carousel-wrap .owl-nav .owl-next{left: 354px;}}@media (min-width: 375px) and (max-width: 389px){.carousel-wrap .owl-nav .owl-next{left: 340px;}}@media (min-width: 360px) and (max-width: 374px){.carousel-wrap .owl-nav .owl-next{left: 324px;}}@media (min-width: 345px) and (max-width: 359px){.carousel-wrap .owl-nav .owl-next{left: 310px;}}@media (min-width: 330px) and (max-width: 344px){.carousel-wrap .owl-nav .owl-next{left: 295px;}}@media (min-width: 320px) and (max-width: 329px){.carousel-wrap .owl-nav .owl-next{left: 280px;}}.custom-radio .custom-control-input:checked ~ .custom-control-label.pill-custom-control-label:after{background-image:unset !important; left:0 !important; top:0 !important;}.custom-radio .custom-control-label.pill-custom-control-label:before{min-width: 2rem !important; max-width: 4rem !important; height:1.5rem !important; left:0 !important; top:0 !important; z-index: -1; border-radius: 3px !important;}.custom-control.pill-custom-radio{padding-left:0px !important;}.custom-control-input:checked ~ .custom-control-label.pill-custom-control-label span{color:white;}#tab-tech_specs #product_full_description .line .title{display: flex; align-items: center; font-weight: 700; width: 25.5rem; float: left; padding-right: 2rem;}#tab-tech_specs #product_full_description .line .desc{float: left; width: calc(100% - 31.5rem); display: flex; align-items: center;}#tab-tech_specs #product_full_description .line{display: flex; align-items: stretch; padding: 0.2rem 0; border-top: 0.1rem solid #d6d6d6;}#tab-tech_specs #product_full_description .line:last-child{border-bottom: 0.1rem solid #d6d6d6;}@media (max-width: 800px){#tab-tech_specs #product_full_description .line .title{width: 15.5rem !important;}}

/* /ebs_website_extended/static/src/css/jobs.css */
.job_view .btn-primary:hover,.job_details .btn-primary.focus,.job_details .btn-primary:focus ,.job_details .btn-primary:hover ,.job_view .btn-primary.focus,.job_view .btn-primary:focus{background-color: #b42b39; border-color: #b42b39;}.job_footer_cls a{color:#656668 !important;}.job_footer_cls a:hover{color: #b42b39 !important;}.job_header .navbar{position: relative; min-height: 50px; margin-bottom: 20px; border: 1px solid transparent;}.job_header.o_header_affixed.o_header_is_scrolled .navbar-brand img{top: -1px; padding-top: 7px; padding-bottom: 12px; height: auto;}.search-job{font-size: 17px; font-weight: 300; font-family: 'Roboto', sans-serif !important; color: #000;}.search-job-div{padding-bottom: 6px;}#myBtn1,#myBtn2{color: #B42B39;}.stay_connect_jobs a{margin-right: 10px !important; font-size: 24px;}.job-footer p{color: #656668; font-family: 'Roboto', sans-serif !important; font-size: 13.4px;}.mail-btn{font-size: 20px; padding-left: 0px; border-radius: 5px; padding-right: 0px; position: absolute; right: 16px; top: 1px; background: #ffffff; color: #656668; border: 0px;}.job_header .navbar{background-color: #EFEFEF;}.find_dream_job_div{background-color: #EFEFEF; margin-top: 15px; margin-bottom: 30px;}.find_dream_job_div h1{font-family: 'Roboto', sans-serif !important; font-weight: bold; font-size: 28px!important;}.find_dream_job_div p{font-family: 'Roboto', sans-serif !important; font-size: 16px;}.find_dream_job_div p{color:#231f20;}.find_dream_job_div h1{color:#be1a2d;}.job_view p{margin: 10px 0px 10px 0px !important;}.apply_btn_job{border-radius: 0px;}.o_job_bottom_bar .apply_btn_job{border-radius: 0px !important; position:unset; right: unset !important;}.job_details .row{color: #665e60;}.job_view .page-item.active .page-link{background-color: #be202f; border-color: #be202f;}.job_view .card-horizontal:hover{border-left: 12px solid #be1a2d;}.job_view address br{display:none;}.job_inner_forms p{font-family: 'Roboto', sans-serif !important; color: #231f20 !important; font-size: 16px !important; text-align: justify;}.job_inner_forms h1{font-family: 'Roboto', sans-serif !important;color: #000;font-size: 28px!important;margin-top: 18px;}a.card-horizontal:hover{text-decoration: unset !important;}

/* /ebs_website_extended/static/src/css/main.css */
.products_header .dropdown-menu .fa-folder-o, .o_searchbar_form .dropdown-menu .fa-folder-o{display:none;}.o_wsale_products_searchbar_form{width:100%}.file-info{font-size: 0.9em; padding: 0 5px 0;}.browse-btn{background: #B42B39; color: #fff; min-height: 35px; padding: 6px 10px; border: none; border-top-left-radius: 5px; border-bottom-left-radius: 5px;}.input-container{background-color: #EDEDED; border: 1px solid #DFDFDF; border-radius: 5px;}.additional-upload-value{float: left; width: 100% !important;}

/* /ebs_website_extended/static/src/css/header.css */
 a.sub_category_name22{padding:0;}.sub_category_name2.colorAdd{color:#be202f !important;}.sub_categroy_single,.sub_categroy_second{position: relative;}.sub_category_hr_line{width: 100%; height: 1px; background-color: rgba(0, 0, 0, 0.15);}.sub_categroy_single:first-child::before{content: " "; position: absolute; border-right: 1px #ddd solid; top: 0%; left: 0; height: 100%; margin-top: auto; margin-bottom: auto;}.sub_categroy_single::after,.sub_categroy_second::after{content: " "; position: absolute; border-left: 1px solid rgba(0, 0, 0, 0.15); top: 4%; right: 0; height: 90%; margin-top: auto; margin-bottom: auto;}.sub_categroy_single:last-child::after,.sub_categroy_second:last-child::after{top: 0%; height: 100%; border-left: 1px #ddd solid;}.user-icon-promate,.search-icon-promate,.shopping-cart-promate,.heart-icon-promate{padding-left:5px !important;}.sub_category_img_div:hover{display:block !important;}.mm-title:hover a{transform: scale(1.02);}.carousel-control-prev,.carousel-control-next{background-color: unset !important; border-color: unset !important;}.carousel-control-prev:hover,.carousel-control-next:hover{background-color: unset !important; border-color: unset !important;}.learn_more:hover{border-color: #f53548 !important; background-color: #f53548 !important;}.learn_more{background: #B2292E !important; border-color: #b2292e!important;}.as-product-grid-simple .as-mm-product-grid:hover .mm-img img{-webkit-filter: none !important; filter: none !important; transform: scale(1.02);}ul#top_menu{font-family: 'Roboto', sans-serif !important;}.navbar ul li.nav-item .nav-link.active{color: #be202f !important;}.navbar ul li.nav-item .nav-link{font-weight: 500; font-family: 'Roboto', sans-serif !important; font-size: 17px; color: #656668; padding-right: 15px;}.as-product-grid-simple .as-mm-product-grid{overflow: hidden; border-radius: 10px; padding: 0px; position: relative; background: white; height: 100%;}.as-product-grid-simple .as-mm-product-grid .mm-img{position: relative; border-radius: 8px; overflow: hidden; padding: 0px;}.as-mm-product-grid .mm-title.sub_cat{padding: 0px; font-size: 12px; margin-bottom: 5px;}.as-product-grid-simple .as-mm-product-grid .mm-title a{padding-left: 1px; font-weight: 700;}.navbar ul li.nav-item .nav-link:hover{color: #be202f !important;}.as-mm-product-grid .mm-title.sub_cat{padding: 0px; font-size: 12px;}.as-mm-product-grid .mm-title a{color:grey;}.as-mm-product-grid .mm-title a:hover,.as-mm-product-grid .mm-title.sub_cat a:hover{color: #BE202E!important; background-color: #ffffff !important;}.as-mm-product-grid .mm-title.sub_cat a{padding: 2px !important; color:grey;}.as-product-grid-simple .as-mm-product-grid .mm-img img{position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 95px; height: 95px; object-fit: contain; transition: ease all 0.35s; -webkit-filter: grayscale(0); filter: grayscale(0); transform: scale(1);}.dropdown a.o_mega_menu_toggle:hover{background-color: #fff;}.dropdown:hover .dropdown-menu.o_mega_menu{display: block;}.oe_structure.oe_structure_solo{display:none;}.o_no_autohide_item.ml-lg-0{margin-left:0 !important;}.o_wsale_my_cart{margin-left: 0rem !important; margin-right: 0rem !important;}.o_wsale_my_cart a{padding-right:0px !important;}.header-heart-icon, .header-user-icon, .hearder-cart-icon{font-size: 19px; color: #000000;}@media (min-width: 992px) and (max-width:1601px){.nav-item.dropdown.position-static{margin-left: 36%;}}@media (min-width: 2801px){.nav-item.dropdown.position-static{margin-left: 47%}}@media (min-width: 2501px) and (max-width:2800px){.nav-item.dropdown.position-static{margin-left: 45% !important;}}@media (min-width: 2201px) and (max-width:2500px){.nav-item.dropdown.position-static{margin-left: 43% !important;}}@media (min-width: 2001px) and (max-width:2200px){.nav-item.dropdown.position-static{margin-left: 42% !important;}}@media (min-width: 1801px) and (max-width:2000px){.nav-item.dropdown.position-static{margin-left: 39% !important;}}@media (min-width: 1600px) and (max-width:1800px){.nav-item.dropdown.position-static{margin-left: 38% !important;}}@media (min-width: 1200px){.container.ticker-container{max-width: 1116px;}}@media (min-width: 1800px){.ticker-container{max-width: 100%!important; width: 87%!important;}#top_menu_container{max-width: 100%!important; width: 90%!important;}#contactus_title_container{padding-left: 12px!important; padding-right:12px!important}#contactus_title_container{max-width: 100%!important; width: 88%!important;}.image_text_homepage{max-width: 88%; width: 100%;}footer .container{max-width: 100%!important; width: 90%!important;}}@media (min-width: 1900px){#contactus_title_container{padding-left: 11px!important; padding-right:11px!important}}@media (min-width: 2000px){#contactus_title_container{padding-left: 10px!important; padding-right:10px!important}}@media (min-width: 2100px){#contactus_title_container{padding-left: 9px!important; padding-right:9px!important}}@media (min-width: 2200px){#contactus_title_container{padding-left: 8px!important; padding-right:8px!important}}@media (min-width: 2300px){#contactus_title_container{padding-left: 7px!important; padding-right:7px!important}}@media (min-width: 2400px){#contactus_title_container{padding-left: 6px!important; padding-right:6px!important}}@media (min-width: 2500px){#contactus_title_container{padding-left: 5px!important; padding-right:5px!important}}@media (min-width: 2600px){#contactus_title_container{padding-left: 4px!important; padding-right:4px!important}}@media (min-width: 2700px){#contactus_title_container{padding-left: 3px!important; padding-right:3px!important}}@media (min-width: 2800px){#contactus_title_container{padding-left: 2px!important; padding-right:2px!important}}@media (min-width: 2800px){#contactus_title_container{padding-left: 1px!important; padding-right:1px!important}}@media (min-width: 3000px){#contactus_title_container{padding-left: 0px!important; padding-right:0px!important}}@media (min-width: 3500px){#contactus_title_container{width: 88.3%!important;}}@media (min-width: 3800px){#contactus_title_container{width: 88.5%!important;}}@media (min-width: 4000px){#contactus_title_container{width: 88.7%!important;}}@media (min-width: 4200px){#contactus_title_container{width: 88.9%!important;}}@media (min-width: 4500px){#contactus_title_container{width: 89%!important;}}@media (min-width: 992px)and(max-width:1800px){#top_menu_container.container,#contactus_title_container{max-width: 1167px !important;}}@media (min-width: 992px){header .navbar .dropdown-menu.show{max-height: 60vh; overflow-y: unset; overflow-x: unset;}header .navbar .dropdown-menu.o_mega_menu.dropdown-menu-left.show{overflow-y: auto !important;}}.dropdown-toggle.o_mega_menu_toggle::after{display: none !important;}.slides1 a,.ticker-container a{color: #656668 !important; font-family: 'Roboto', sans-serif !important; font-size: 16px; background-color: unset !important; font-weight: 300;}.as-product-grid-simple{justify-content: center; display:unset;}.product_category.for-desktop:hover .product_sub_category{display:flex !important;}#Layer_1:hover .cls-1{stroke:#be202f !important;}.product_category a.learn_more:hover{background-color: #f53548 !important;}.product_category a:hover{color:#be202f !important; text-decoration: unset; background-color:unset !important;}.slides1 a:hover,.ticker-container a:hover{color:#be202f !important; text-decoration: unset; background-color:unset !important;}#slider1{background-color: #E1E2E3; margin:0 auto; width:80%; overflow:hidden;}.slides1{overflow:hidden; animation-name:fade; animation-duration:1s;}.o_wsale_my_wish{margin-right:0px !important;}.o_wsale_my_wish a{padding-right: 0 !important;}.as-product-grid-simple .as-mm-product-grid .mm-title a{text-align: left !important;}.navbar{padding-bottom:0 !important;}.navbar ul li{padding-bottom: 4px !important;}.fa-user-circle-o{color: #000000;}.o_no_autohide_item .dropdown-toggle::after{display: none !important; margin-left: 0.255em; vertical-align: 0.255em; content: ""; border-top: 0.3em solid; border-right: 0.3em solid transparent; border-bottom: 0; border-left: 0.3em solid transparent;}.header-heart-icon:hover, .header-user-icon:hover, .hearder-cart-icon:hover ,.search-icon:hover,.fa-user-circle-o:hover{color: #be202f !important;}.search-icon:hover{cursor: pointer;}sup{top: -.9em; right: 10px;}.my_header.navbar #top_menu.o_menu_loading{opacity: 1 !important; overflow: visible !important;}.header-middle a.navbar-brand{padding: 0px;}.img-fluid{width: 45%;}.desktop-view-tws-speaker{display:flex !important;}.no-mobile-view-cables{display:flex !important;}.mobile-view-tws-speaker{display:none !important;}.no-discover-more{display:flex !important;}.discover-more{display:none !important;}.mobile-view-cables{display:none !important;}.Wishlist-name,.cart-name,.login-name{color: #be202f;}.header-middle .hm-right li .hm-icon sup{top: -8px !important; right: 2px !important;}.owl-carousel.Test .owl-nav,.owl-carousel.Test .owl-dots{display:none;}.owl-nav{display:none;}.tws-speaker-desktop .owl-nav{display:block !important;}.tws-speaker-desktop .owl-nav .owl-next{position: absolute; font-size: 80px !important; top: 40%; right: -3%;}.tws-speaker-desktop .owl-nav .owl-next span,.tws-speaker-desktop .owl-nav .owl-prev span{color: #a4a7a9;}.tws-speaker-desktop .owl-nav button:focus{outline: unset !important;}.tws-speaker-desktop .owl-nav [class*=owl-]:hover{background:unset !important; color: #000 !important;}.tws-speaker-desktop .owl-nav .owl-prev{position: absolute; font-size: 80px !important; top: 40%; left: -3%;}.tws-speaker-desktop .owl-dots{pointer-events: auto; margin-top:12px;}.owl-dots button:focus{outline: unset !important;}.product_category.for-desktop{display:block;}.product_category.for-mobile{display:none;}.desktop_images{}.mobile_images{display:none;}@media (max-width: 985px){.desktop_images{display:none;}.mobile_images{display:block;}.owl-nav{display:none;}.no-discover-more{display:none !important;}.discover-more{display:flex !important;}.desktop-view-tws-speaker{display:none !important;}.mobile-view-tws-speaker{display:block !important;}.no-mobile-view-cables{display:none !important;}.featured_categories a p{font-size: 12px !important; margin-bottom: 5px !important;}.promate_sub_categories h1,.promate_sub_categories2 h1{margin-bottom:0px !important;}.mobile-view-tws-speaker p{margin: 0px 0px 20px 0px !important;}.mobile-view-cables{display:block !important;}.dropdown-menu.o_mega_menu.dropdown-menu-left.show{display:block !important}.dropdown-menu.o_mega_menu.dropdown-menu-left{display:none !important;}.dropdown-toggle.o_mega_menu_toggle::after{display: inline-block !important;}#top_menu_collapse #top_menu .search-icon-li,#top_menu_collapse #top_menu .o_wsale_my_cart,#top_menu_collapse #top_menu .o_no_autohide_item ,#top_menu_collapse #top_menu .o_wsale_my_wish{display:none !important;}.dropdown-menu.o_mega_menu.search-view.show{display:none !important;}.search-view-mobile.show{display: block !important;}.search-view-mobile{border: 1px solid rgba(0, 0, 0, 0.15);}.as-product-grid-simple{justify-content: unset; display:grid !important;}.product_category.for-desktop{display:none !important;}.product_category.for-mobile{display:block;}header .navbar-brand.logo img{object-fit: contain; display: block; width: auto; height: auto; max-width: 180px; background: #B2292E !important; position: inherit !important; padding-top: 4px !important; padding-left: 8px !important; padding-right: 8px !important; padding-bottom: 2px !important; margin-top: -9px !important;}.mobile-icons{display:block !important;}.headerwp.clearfix.mobile-icons li{width:33%; padding: 0.75rem 1.25rem;}.mobile-icon{display:block !important; position: absolute; right: 0px; top: 6px;}.search-icon-li{padding:0 !important;}.navbar-toggler{position: absolute; left: 1px; top: 0px;}.justify-content-start{justify-content: center !important;}.as-product-grid-simple .as-mm-product-grid .mm-img{display:none;}.nav-item.dropdown.position-static{margin-left: 0% !important; padding-bottom:0px !important;}.mobile-header-1 .nav li .hm-icon.hm-icon-user{height:32px !important;}.header-user-icon{margin-top: 0px !important;}.mobile-header-1 .nav li .hm-icon{width: 59px !important;}.login-name{display: contents !important;}.Wishlist-name, .cart-name, .login-name{color: #ffffff; position: absolute; top: 34px; font-size: 10px !important;}.logo_brand{text-align:center;}.o_wsale_products_searchbar_form{width:100% !important;}#header_search_collapse{display:contents;}.collapse:not(.show){display: none !important;}.menu-hamb{z-index: 1111; display:block !important;}.my_header{padding:0px;}.header-user-icon{margin-top: 10px;}.mobile-header-1 .nav .hm-icon-user:before{display:none !important;}.mobile-header-1 .nav li .hm-icon sup{position: absolute; top: 4px !important; right: 15px !important; border-radius: 50%; color: #be202f; background: #ffffff;}.header-heart-icon,.header-user-icon,.hearder-cart-icon{font-size: 19px; color: #000000;}header .header-icons .cart-link{display: inline-block; color: #ffffff; font-size: 1.5rem; margin-right: 0;}.header-middle{padding-top: 0px !important; padding-bottom: 0px !important;}.img-fluid{width: 35%;}.logo_brand a{width: 100%; float: left; margin-right: 0 !important;}.logo_brand .navbar-toggler{width: 3.5rem; height: 3.5rem; position: absolute; top: .2rem; left: 1rem; background-repeat: no-repeat; background-size: 2.2rem 2.2rem; background-position: center center; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4wLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL1RSLzIwMDEvUkVDLVNWRy0yMDAxMDkwNC9EVEQvc3ZnMTAuZHRkIj4NCjxzdmcgdmVyc2lvbj0iMS4wIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHdpZHRoPSIzM3B4IiBoZWlnaHQ9IjIxcHgiIHZpZXdCb3g9IjAgMCAzMyAyMSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzMgMjEiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMTExIiBzdHJva2Utd2lkdGg9IjMiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgeDE9IjAiIHkxPSIxLjUiIHgyPSIzMyIgeTI9IjEuNSIvPg0KCTxsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzExMSIgc3Ryb2tlLXdpZHRoPSIzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHgxPSIwIiB5MT0iMTAuNSIgeDI9IjMzIiB5Mj0iMTAuNSIvPg0KCTxsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzExMSIgc3Ryb2tlLXdpZHRoPSIzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHgxPSIwIiB5MT0iMTkuNSIgeDI9IjMzIiB5Mj0iMTkuNSIvPg0KPC9nPg0KPC9zdmc+DQo=);}}.header-middle .nav{float: right;}.menu-hamb{display: none; width: 3.5rem; height: 3.5rem; position: absolute; top: .2rem; right: 1rem; background-repeat: no-repeat; background-size: 2.2rem 2.2rem; background-position: center center; background-image: url("/ebs_website_extended/static/src/image/search_icon.png");}ul.hm-right li{margin-right: 7px;}.hm-user .dropdown-toggle::after{display: none;}.badge-primary{background-color: #be202f;}.btn-fill-primary, .btn-primary{background-color: #be202f; border-color: #be202f;}.my_header.navbar-light .navbar-nav .nav-link{color: rgb(255 255 255); font-weight: 800;}.my_header{background:#be202f;}

/* /ebs_website_extended/static/src/css/login.css */
.create_account{text-align:center;}.create_account a{justify-content: center; margin: auto; border: 1px solid #fff !important; border-radius: 20px; width: 130px !important; padding:10px !important;}.create_account h1,.create_account h2,.create_account p{color:#fff !important}.create_account p{text-align: justify; font-family: 'Roboto', sans-serif !important; font-size: 16px !important; font-weight:300 !important;}

/* /ebs_website_extended/static/src/css/home_search.css */
.search_product_header{display:flex;}.popover__content1{opacity: 0; visibility: hidden; position: absolute; right: 0; top: 173%; width: 340px; background-color: #ffffff; height: 95px; padding: 0px; box-shadow: 0px 2px 11px rgb(0 0 0 / 30%);}.popover__content{opacity: 0; visibility: hidden; position: absolute; right: 0; top: 150%; width: 360px; background-color: #ffffff; height: 95px; padding: 0px; box-shadow: 0px 2px 11px rgb(0 0 0 / 30%);}@media(max-width: 992px){.popover__content:before{left: 67% !important; top: -5px;}}.promate_cart_popover:before{position: absolute; z-index: 10000; content: ""; width: 10px; transform: translateX(-50%) rotate(135deg); height: 10px; top: -4px; cursor: default; background-color: #efefef; pointer-events: none; transition: all ease-out 0.15s; box-shadow: none; left: 68%; border: 1px solid white; border-left-color: rgba(0, 0, 0, 0.2); border-bottom-color: rgba(0, 0, 0, 0.2);}.popover__content:before{position: absolute; z-index: -1; content: ""; width: 10px; transform: translateX(-50%) rotate(135deg); height: 10px; top: -6%; cursor: default; background-color: #efefef; pointer-events: none; transition: all ease-out 0.15s; box-shadow: none; left: 205px; border: 1px solid white; border-left-color: rgba(0, 0, 0, 0.2); border-bottom-color: rgba(0, 0, 0, 0.2);}.search-icon-li:hover .popover__content,.search-icon-li:hover .popover__content1{z-index: 10; opacity: 1; visibility: visible; transform: translate(0, -20px); transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);}.oe_product_image{background-color:transparent !important}.rating-checked{color: #be202f !important;}.triangle-topleft{position: absolute; top:0; left:0; width: 0; height: 0; border-top: 93px solid #be202f; border-right: 92px solid transparent;}.triangle-content{position: absolute; font-family:"Roboto", sans-serif !important; top: -73px; left: 5px; line-height: 15px; font-size: 14px; color: #fff; text-align: left;}.found_product{color: #656668;}#top_menu_container{position: relative;}.product_search_sort_by{border: 1px solid #9b9b9b !important; padding-left:9px !important; padding-right:9px !important;}.product_search_sort_by::after{border-top: unset !important; border-right:unset !important; width: 9px; transform: translateX(-50%) rotate(-45deg); height: 9px; top: 24%; cursor: default; background-color: #fff; pointer-events: none; transition: all ease-out 0.15s; box-shadow: none; border: 1px solid white; border-left-color: #636669; border-bottom-color: #636669; padding: 0px; margin-left: 5px;}

/* /ebs_website_extended/static/src/css/product_filter.css */
.custom-control{padding-left: 1rem !important;}.o_products_attributes_title a{font-weight: bold !important;}.oe_website_sale #products_grid_before #wsale_products_categories_collapse ul ul{margin-left: 0rem !important;}#wsale_products_categories_collapse a, #wsale_products_price_collapse a{font-weight: bold;}.category-name.show{display:contents !important;}.products_attributes_filters a[data-toggle="collapse"],.products_filters a[data-toggle="collapse"]{color: #333333 !important; display: block; font-size: 1.0rem; line-height: 1.2rem; font-weight: normal; outline: 0; padding: 10px 0 10px;}.products_attributes_filters a[data-toggle="collapse"]:hover,.products_filters a[data-toggle="collapse"]:hover{text-decoration: unset !important;}#wsale_products_categories_collapse .font-weight-normal{margin-left: 1.3rem !important;}.font-weight-normal,.custom-control-label.font-weight-normal{line-height: 1.4rem; color: #333333; font-weight: 500 !important; font-size: 14px; font-family: 'Roboto', sans-serif !important; margin-left: 0.5rem !important;}.page_loader{display: flex; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999999; background: center no-repeat rgb(4 4 4 / 65%);}.price-range-slider p{margin: 0 0px 4px 3px; position: relative; width: 120px; text-align: left;}.go-btn-css{position: absolute; margin: 0% 0 0 0 !important; height: 35px; left: 0px; width: 45px; line-height: 30px; bottom: 1px;}.oe_website_sale #products_grid_before #wsale_products_categories_collapse i.fa{color: #333333;}.oe_website_sale #products_grid_before .custom-control.custom-checkbox .custom-control-input:checked ~ .custom-control-label:before{background-color: #b2292e; border: 2px solid #b2292e;}.css_attribute_color.active{border: 5px solid #b2292e;}.oe_website_sale #products_grid_before .custom-control.custom-checkbox label:hover{color: #b2292e;}.oe_website_sale #products_grid_before #wsale_products_categories_collapse label:hover{color: #b2292e;}#wsale_products_categories_collapse a span, #wsale_products_price_collapse a span{color: #333333;}.js_attributes a span,.js_product_filters a span{color: #333333;}

/* /ebs_website_extended/static/src/css/price_filter.css */
.ui-slider-horizontal{height: .3em !important;}.ui-slider .ui-slider-handle{width: 0.8em !important; height: 0.8em !important;}.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{border-radius: 50%; background:#efefef !important; border: 2px solid #c5c5c5;}.ui-slider-horizontal .ui-slider-range{top: 0; height: 100% !important; background: #9B9B9B;}.ui-widget-content{background:#e2e1e1 !important;}

/* /ebs_website_extended/static/src/css/register_progress_bar.css */
.bar-con{background-color: #ccc; height: 0.5em;}#password-strength{float: left; height: 100%; width: 0%;}.bar-one #password-strength{transition: width ease-in 1s; -webkit-transition: width ease-in 1s; -moz-transition: width ease-in 1s; -o-transition: width ease-in 1s;}.bar-one .progress_bar_very_week{background-color: #dc3545;}.bar-one .progress_bar_medium{background-color: #ffc107;}.bar-one .progress_bar_strong{background-color: #03AB70;}.bar-one .progress_bar_week{background-color: #ba2784;}.bar-one .progress_bar_too_short{background-color: #878687;}

/* /ebs_website_extended/static/src/css/common_header.scss */
 // it's common mixin for all header styles // Pill Menu // Fill Menu // Nav Style outline // Nav Style block // Nav Style Border Bottom @mixin as-border-menu(){>.nav-item{>.nav-link{position: relative; &:before{content: ""; position: absolute; bottom: 0; left: auto; right: 0; height: 2px; width: 0px; background-color: currentColor; transition: ease all 0.35s;}&.active{&:before{width: 100%; left: 0; right: auto;}}}&:hover, &.active, &.show{>.nav-link{&:before{width: 100%; left: 0; right: auto;}}}}}// Navbar Links Styles .my_header{&#top{z-index: 1061;}.navbar-toggler{outline: none !important; box-shadow: none !important;}.navbar-nav{// Dropdown Style .dropdown-menu{border: none; border-radius: 0px; margin: 0; padding-top: 0.6rem; padding-bottom: 0.6rem; .dropdown-item{padding: 0.55rem 1rem; background: transparent; &:hover{}&:focus{}&.active{}}}.nav-link{// Dropdown arrow &.dropdown-toggle{&:after{content: "\f107"; font-family: FontAwesome; border: 0; vertical-align: top;}}}}}// Mobile Header .my_header{.collapsing, .show{#top_menu{padding-top: 0; padding-bottom: 0; text-align: left;}}}@include media-breakpoint-up(lg){.my_header{.navbar-collapse{background: inherit !important;}}}@include media-breakpoint-down(md){.my_header{&:not(.o_header_affixed){position: relative;}.navbar-nav{>.nav-item{padding-left: 0 !important; padding-right: 0 !important; +.nav-item{}>.nav-link{padding: 0.7rem 1rem !important; &.dropdown-toggle{padding-right: .8rem; position: relative; &:after{content: "\f107" !important; font-family: FontAwesome; border: 0; vertical-align: top; display: inline-block !important; position: absolute; top: 0px; right: 12px; bottom: 0; margin: auto; height: 23px; line-height: 23px; font-size: 23px;}}}}.dropdown-menu{border-top: 1px solid #eee !important; box-shadow: none; &:not(.o_mega_menu){}&:not(.show){display: none !important;}&.show{display: block !important;}.dropdown-item{padding: 0.5rem 1rem !important; font-size: 15px;}}}.navbar{box-shadow: none !important; .navbar-collapse{position: absolute; top: 100%; left: 0; right: 0; &.show{max-height: 58vh;}}}.navbar{.navbar-collapse{position: fixed; //background: $header-color; &.show{position: fixed !important; top: 0 !important; padding: 0 !important; .o_offcanvas_menu_toggler{position: absolute; top: 5px; right: 5px; z-index: 11; padding: 0; display: inline-flex !important; align-items: center; justify-content: center; border-radius: 50%; width: 40px; height: 40px; a{padding: 0 !important; text-align: center; line-height: 40px; span{line-height: 1; font-size: 25px;}}}.navbar-nav{width: 100%; padding-top: 45px; max-width: 320px !important;}}.o_offcanvas_menu_backdrop{opacity: 0.4;}}}}.my_header{.navbar-nav{// Nav Style pills @if o-website-value('header-links-style')=='pills'{margin: 0 15px;}// Nav Style Fill @if o-website-value('header-links-style')=='fill'{margin: 0 15px;}// Nav Style outline @if o-website-value('header-links-style')=='outline'{margin: 0 15px;}// Nav Block Style @if o-website-value('header-links-style')=='block'{margin: 0 15px;}// Border Bottom @if o-website-value('header-links-style')=='border-bottom'{>.nav-item{>.nav-link{margin: 0; border: none; position: relative; &:before{content: ""; position: absolute; bottom: 0; left: auto; right: 0; height: 1px; width: 0px; background-color: currentColor; transition: ease all 0.35s; opacity: 0.5;}&.active{&:before{width: 100%; left: 0; right: auto;}}}&:hover, &.active, &.show{>.nav-link{&:before{width: 100%; left: 0; right: auto;}}}}}}}}.modal{&.header-search-modal{.modal-header{position: relative;}.close{position: absolute; top: 0; bottom: 0; right: 20px; width: 35px; height: 35px; border-radius: 50%; margin: auto; transform: rotate(45deg); opacity: 1; outline: none !important; span{width: 30px; height: 30px; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; &:after, &:before{content: ""; position: absolute; bottom: 0; left: 0; right: 0; top: 0; margin: auto; background: currentColor;}&:after{width: 18px; height: 2px;}&:before{width: 2px; height: 18px;}}}.as-modal-vertical{transform: translateX(100%); height: 100%; max-width: 400px; margin: 0 0 0 auto; transition: transform .3s ease-out; padding: 0; .modal-content{height: inherit; overflow-y: auto; border: none; border-radius: 0; box-shadow: none;}}&.show{padding-right: 0 !important; z-index: 9999; .as-modal-vertical{transform: translateX(0);}}}}.header-search-modal{.o_searchbar_form{.form-control{border-radius: 0; box-shadow: none !important; -webkit-appearance: none; -moz-appearance: none; appearance: none;}.oe_search_button{border-radius: 0; box-shadow: none !important;}}}.as-mini-cart{&.modal{&.show{.modal-dialog{transform: translateX(0);}}.modal-dialog{transform: translateX(100%); min-height: 100%; max-width: 400px; width: 100%; margin: 0 0 0 auto; transition: transform .3s ease-out; padding: 0; .modal-body{padding: 0;}}.modal-content{border: none; border-radius: 0; box-shadow: none; height: 100%;}}.min-cart-head{display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; position: sticky; top: 0; left: 0; right: 0; z-index: 3;}.as-mini-cart-products{margin: 0; padding: 20px; list-style-type: none; .as-mc-media{display: flex; + li{margin-top: 20px; padding-top: 20px;}.as-mc-img{max-width: 65px; flex: 0 0 65px;}.as-mc-info{flex: 0 0 calc(100% - 65px); max-width: calc(100% - 65px); padding-left: 15px; h6{a{text-decoration: none;}}.text-muted{span{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}}}.m_c_qty{display: flex; align-items: center; .css_quantity{margin: 0; width: 100px; .js_quantity{height: 35px;}}}.js_delete_product{margin-left: auto; width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--danger); color: var(--danger);}}}.as-cart-btn-bar{position: sticky; bottom: 0; z-index: 3; padding: 20px; display: flex; .btn{margin: 0 2px; flex: 1;}}.as-cart-summary{.card{border-radius: 0; border: none; h4{font-size: 18px; font-weight: 600; margin: 0;}.card-body{padding: 20px;}}#cart_total{table{margin: 0;}td{padding: 8px 0; text-align: left !important;}tr{&:last-child{&:not([id*="order_"]){display: none;}}}}a.btn.btn-secondary{display: none !important;}}.as-mini-cart-empty{padding: 20px; text-align: center; img{max-width: 250px;}p{font-size: 14px; margin-top: 15px;}}}.my_header{.navbar-nav{> .nav-item{> .nav-link{position: relative; .as-menu-tags{position: absolute; top: -5px; display: inline-block; right: 7px; line-height: 1; font-size: 10px; padding: 4px 5px 3px; border-radius: 2px; @include media-breakpoint-down(sm){right: auto; left: 0; top: -2px; padding: 3px 5px;}&:after{content: ""; background: inherit; position: absolute; width: 5px; height: 5px; bottom: -3px; left: 8px; transform: rotate(45deg);}}}}.dropdown-menu{> li{> a{position: relative; .as-menu-tags{position: absolute; top: -5px; display: inline-block; left: 7px; line-height: 1; font-size: 10px; padding: 4px 5px 3px; border-radius: 2px; &:after{content: ""; background: inherit; position: absolute; width: 5px; height: 5px; bottom: -3px; left: 8px; transform: rotate(45deg);}}}}}}}

/* /ebs_website_extended/static/src/css/header1.scss */
 // Dropdown menu .my_header{.navbar{padding: 0;}.dropdown-menu{border: none; border-radius: 0px; margin: 0; padding-top: 0.6rem; padding-bottom: 0.6rem; .dropdown-item{padding: 0.55rem 1.7rem; font-size: 15px; text-decoration: none; font-weight: 400; span{text-decoration: none;}&:hover, &.active{background: none !important; color: $primary !important; &:hover{background: none !important; color: $primary !important;}}}}}// Header Top .header-top{.phone-number{color: inherit; a{color: inherit !important; font-size: 13px; text-decoration: none;}}.o_pricelist_dropdown{.btn{color: inherit !important; padding: 0; line-height: 35px; font-size: 13px; text-transform: uppercase; background: transparent !important; box-shadow: none !important;}}.js_language_selector{.btn{color: inherit !important; padding: 0; line-height: 35px; font-size: 13px; text-transform: uppercase; background: transparent !important; box-shadow: none !important;}.list-inline{span{&.list-inline-item{opacity: 0.5; font-weight: 300;}}.list-inline-item{padding: 0; text-transform: uppercase; font-size: 12px; color: inherit; line-height: 35px; text-decoration: none; img{width: 16px; height: 16px;}span{text-decoration: none;}&:hover{color: inherit;}&.active{img{}}}}}.ht-search{margin-left: auto; .ht-icon{height: 35px; width: 30px; text-align: center; display: inline-flex; align-items: center; justify-content: center; .ht-search-icon{width: 18px; height: 18px; display: inline-block; vertical-align: top;}}}}// Header Middle .header-middle{position: relative; .hm-right{justify-content: flex-end; li{+li{margin-left: 20px;}a{text-decoration: none;}&.as-mini-cart{.hm-icon{cursor: pointer;}span{}}.hm-icon{position: relative; display: inline-flex; align-items: center; justify-content: center; flex-direction: column; padding: 0; sup{position: absolute; top: -6px; right: 7px; border-radius: 50%; font-weight: 400; font-size: 11px;}.fa{width: 22px; height: 22px; display: inline-block; vertical-align: top; margin: 0 auto;}span{width: 100%; display: inline-block; vertical-align: top; font-size: 12px; text-transform: uppercase; line-height: 1; padding-top: 5px;}}&.as-btn-loading{pointer-events: none; .hm-icon-cart{.fa-shopping-cart{animation: fa-spin 2s infinite linear;}}}}}.header-search{.form-control{border-radius: 0; box-shadow: none !important;}.oe_search_button{border-radius: 0; box-shadow: none !important;}}@include media-breakpoint-up(lg){.navbar-toggler{display: none;}}@include media-breakpoint-down(md){.header-search{position: absolute; top: 0; left: 0; padding: 0; min-height: inherit; form{padding: 20px;}}}}// Large Screen Style .my_header{// Default Nav Style @include media-breakpoint-up(lg){.navbar{.navbar-nav{>.nav-item{>.nav-link{@if o-website-value('header-links-style')=='default'{padding: 0 1rem; line-height: 50px; font-weight: 500; position: relative; &.dropdown-toggle{&:before{content: ""; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; border-bottom: 5px solid currentColor; border-left: 5px solid transparent; border-right: 5px solid transparent; width: 1px; opacity: 0;}}}}&.show{>.nav-link{@if o-website-value('header-links-style')=='default'{&.dropdown-toggle{&:before{opacity: 1;}}}}}.dropdown-menu{padding: 5px 10px; >li{+li{}a{padding: 10px 0;}}}}}}}// Menu Styles // All mixin mentioned in common_header.scss @include media-breakpoint-up(lg){.navbar-nav{// Nav Style pills @if o-website-value('header-links-style')=='pills'{//$m-line-height, $m-margin-x, $m-margin-y, $m-padding-x, $m-padding-y, $m-font-weight @include as-pill-menu(35px, 8px, 10px, 17px, 0px, 500);}// Nav Style Fill @if o-website-value('header-links-style')=='fill'{//$m-line-height, $m-margin-x, $m-margin-y, $m-padding-x, $m-padding-y, $m-font-weight, $m-border-radius @include as-fill-menu(50px, 0, 0, 17px, 0px, 500, 0px);}// Nav Style outline @if o-website-value('header-links-style')=='outline'{//$m-line-height, $m-margin-x, $m-margin-y, $m-padding-x, $m-padding-y, $m-font-weight, $m-border-radius @include as-outline-menu(30px, 7px, 8px, 0, 12px, 500, 0px); >.nav-item{border: none !important;}}// Nav Block Style @if o-website-value('header-links-style')=='block'{//$m-line-height, $m-margin-x, $m-margin-y, $m-padding-x, $m-padding-y, $m-font-weight, $m-border-radius @include as-block-menu(50px, 0, 0, 0, 12px, 500, 0px); >.nav-item{border: none !important;}}// Border Bottom @if o-website-value('header-links-style')=='border-bottom'{//$m-line-height, $m-margin-x, $m-margin-y, $m-padding-x, $m-padding-y, $m-font-weight, $m-border @include as-border-menu(50px, 0, 0, 0, 12px, 500, 0px); >.nav-item{border: none !important;}}}}// Toggle Button button.navbar-toggler{padding: 0; width: 42px; height: 42px; position: relative; outline: none !important; box-shadow: none !important; overflow: hidden; .navbar-toggler-icon{position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; height: 2px; width: 30px; transition: ease transform 0.35s;}}}// End Mobile Header 1 .mobile-header-1{background:#be202f; color:#000000; z-index: 111; .dropdown-menu{border: none; border-radius: 0px; margin: 0; padding-top: 0.6rem; padding-bottom: 0.6rem; .dropdown-item{padding: 0.55rem 1.7rem; font-size: 15px; text-decoration: none; font-weight: 400; span{text-decoration: none;}&:hover, &.active{background: none !important; &:hover{background: none !important;}}}}.nav{display: flex; justify-content: space-around; align-items: center; padding-top: 5px; padding-bottom: 5px; a{text-decoration: none;}li{.hm-icon{height: 47px; width: 47px; display: inline-flex; position: relative; align-items: center; justify-content: center; position: relative; sup{position: absolute; top: 0; right: 0; border-radius: 50%;}i{width: 27px; height: 27px; display: inline-flex; vertical-align: middle; align-items: center; justify-content: center;}}}.hm-icon-home{i{}}.hm-icon-cart{i{}}.as-btn-loading{.hm-icon-cart{i{animation: fa-spin 2s infinite linear;}}}.hm-icon-shop{border-radius: 50%; i{width: 24px; height: 24px;}}.hm-icon-wishlist{i{}}.hm-user{.dropdown-toggle{width: 47px; display: block; text-align: center; &:after{display: none;}img{width: 35px; height: 35px;}}}.hm-icon-user{font-size: 0; cursor: pointer; &:before{content: ""; width: 27px; height: 27px; display: inline-block; vertical-align: top; margin: 0 auto; position: relative; top: -2px;}&.as-btn-loading{pointer-events: none; &:before{animation: fa-spin 2s infinite linear;}}}}}// wrapwarp bottom padding // Shop page @include media-breakpoint-down(md){.o_wsale_products_main_row{.as-shop-top-filter{bottom: 57px;}}.as-product-sticky-cart{bottom: 70px;}}// End @if

/* /ebs_website_extended/static/src/css/mega-menu.scss */
.as-main-header{.navbar-nav{.dropdown-menu{&.o_mega_menu{padding: 0;}}}}.as-dynamic-megamenu{.as-mm-row{display: flex; flex-wrap: wrap; margin-left: -10px; margin-right: -10px; .as-mm-col{flex-basis: 0; flex-grow: 1; max-width: 100%;}&.as-mm-row-01{.as-mm-col{flex: 0 0 100%; max-width: 100%;}}&.as-mm-row-02{.as-mm-col{flex: 0 0 calc(100% / 2); max-width: calc(100% / 2);}}&.as-mm-row-03{.as-mm-col{flex: 0 0 calc(100% / 3); max-width: calc(100% / 3); @include media-breakpoint-down(sm){flex: 0 0 calc(100% / 2); max-width: calc(100% / 2);}}}&.as-mm-row-04{.as-mm-col{flex: 0 0 calc(100% / 4); max-width: calc(100% / 4); @include media-breakpoint-down(sm){flex: 0 0 calc(100% / 2); max-width: calc(100% / 2);}}}&.as-mm-row-05{.as-mm-col{flex: 0 0 calc(100% / 5); max-width: calc(100% / 5); @include media-breakpoint-down(md){flex: 0 0 calc(100% / 3); max-width: calc(100% / 3);}@include media-breakpoint-down(sm){flex: 0 0 calc(100% / 2); max-width: calc(100% / 2);}}}&.as-mm-row-06{.as-mm-col{flex: 0 0 calc(100% / 6); max-width: calc(100% / 6); @include media-breakpoint-down(md){flex: 0 0 calc(100% / 3); max-width: calc(100% / 3);}@include media-breakpoint-down(sm){flex: 0 0 calc(100% / 2); max-width: calc(100% / 2);}}}}}.as-product-grid-mega-menu{.as-mm-col{padding: 20px 10px; display: flex; flex-direction: column;}}.as-product-grid-simple{.as-mm-product-grid{overflow: hidden; border-radius: 10px; padding: 5px; position: relative; background: white; height: 100%; .mm-img{position: relative; border-radius: 8px; overflow: hidden; &:after{content: ""; padding-bottom: 100%; display: inline-block; vertical-align: top;}img{position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; // height: 100%; object-fit: contain; transition: ease all 0.35s; -webkit-filter: grayscale(0); filter: grayscale(0); transform: scale(1);}a{position: absolute; top: 0; left: 0; right: 0; bottom: 0;}}.mm-title{a{padding: 10px 5px 5px; display: block; text-align: center; font-weight: 500; text-decoration: none;}}&:hover{.mm-title{a{// color: $primary;}}.mm-img{img{-webkit-filter: grayscale(1); filter: grayscale(1); transform: scale(1.02);}}}}}.as-product-grid-modern{.as-mm-product-grid{.mm-img{position: relative; transform: translateY(0); transition: ease all 0.35s; border-radius: 50%; box-shadow: 0px 0px 12px 0 rgba(0, 0, 0, 0.05); overflow: hidden; border: 7px solid white; &:after{content: ""; padding-bottom: 100%; display: inline-block; vertical-align: top;}img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; object-fit: scale-down;}a{position: absolute; top: 10px; left: 10px; right: 10px; bottom: 10px; background: dark; border-radius: 50%; transition: ease all 0.35s; transform: scale(0); opacity: 0.4;}}.mm-title{padding-top: 10px; text-align: center; line-height: 1.2; font-size: 16px; a{color: inherit; padding-top: 5px; font-weight: 600; background: linear-gradient(45deg, currentColor, currentColor); background-size: 0 1px; background-repeat: no-repeat; background-position: left bottom; transition: ease all 0.35s; text-decoration: none; .as-dynamic-megamenu:not(.o_cc) &{color: dark;}}}&:hover{.mm-img{transform: translateY(-2px); a{transform: scale(1);}}.mm-title{a{background-size: 100% 1px;}}}}}.as-product-grid-classic{.as-mm-product-grid{position: relative; z-index: 1; &:after{content: ""; position: absolute; top: 43%; left: 0; right: 0; bottom: 0; background: #fff; z-index: -1; border-radius: 60px 50px 10px 10px; border: 1px solid gray; box-shadow: 0px 0px 12px 0 rgba(0, 0, 0, 0.05);}.mm-img{position: relative; transform: translateY(0); transition: ease all 0.35s; border-radius: 50%; box-shadow: 0px 4px 2px 0px rgba(0, 0, 0, 0.05), 0px -4px 2px 0px rgba(0, 0, 0, 0.05); overflow: hidden; border: 7px solid white; margin: 0 15px; background: white; &:after{content: ""; padding-bottom: 100%; display: inline-block; vertical-align: top;}img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; object-fit: scale-down;}a{position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; // background: rgba($primary, 0.8); border-radius: 50%; transition: ease all 0.35s; transform: scale(0); &:after{content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 20px; height: 20px; border-top: 4px solid white; border-right: 4px solid white; margin: auto; transform: rotate(45deg) translate(-1px);}}}.mm-title{text-align: center; line-height: 1.2; font-size: 15px; a{color: inherit; font-weight: 600; text-decoration: none; padding: 13px 10px; display: inline-block; vertical-align: top; color: dark;}}&:hover{.mm-img{transform: translateY(-2px); a{transform: scale(1);}}.mm-title{a{// color: $primary;}}}}}.as-product-list-simple{padding-top: 15px; padding-bottom: 15px; .as-mm-col{padding-left: 10px; padding-right: 10px;}.as-mm-product-list{padding: 8px 0; padding-left: 20px; a{color: dark !important; position: relative; display: inline-block; vertical-align: top; text-decoration: none; font-size: 15px; &:after{content: ""; position: absolute; top: 7px; left: -20px; width: 8px; height: 8px; // border-bottom: 2px solid lighten($primary, 15%); // border-right: 2px solid $primary; transform: rotate(-45deg);}&:before{content:""; position: absolute; bottom: 0; right: auto; left: 0; height: 1px; width: 0px; background: currentColor; transition: ease all 0.35s;}&:hover{&:before{width: 100%; right: 0; left: auto;}}}}}.as-product-list-modern{padding-top: 15px; padding-bottom: 15px; .as-mm-col{padding-left: 10px; padding-right: 10px;}.as-mm-product-list{padding: 8px 0; padding-left: 20px; a{// color: $as-dark !important; position: relative; display: inline-block; vertical-align: top; text-decoration: none; font-size: 15px; &:after{content: ""; position: absolute; top: 7px; left: -15px; width: 8px; height: 8px; // border: 1px solid $primary; border-radius: 50%; transition: all 0.6s ease-in-out;}&:before{content:""; position: absolute; bottom: 2px; right: auto; left: 0; height: 4px; width: 0px; // background: $primary; transition: all 0.6s ease-in-out; opacity:0.3;}&:hover{// color: $primary !important; &:after{// background: $primary; transition: all 10ms ease-in-out;}&:before{width: 100%; right: 0; left: auto; transition: all 10ms ease-in-out;}}}}}.as-product-list-classic{padding-top: 15px; padding-bottom: 15px; .as-mm-col{padding-left: 10px; padding-right: 10px;}.as-mm-product-list{padding: 6px 0px; border-bottom: 1px solid #eee; margin: 0 0 10px; a{// color: $as-dark !important; font-weight: 500; text-decoration: none; &:hover{// color: $primary !important;}}}}.as-category-grid-mega-menu{.as-mm-col{padding: 20px 10px;}}.as-category-grid-simple{.as-mm-category-grid{.mm-img{border-radius: 5px; overflow: hidden; padding: 5px; // border: 1px solid $as-gray-300; // background: $as-white; margin: 0 0 10px; img{border-radius: 5px; transform: scale(1); transition: ease all 0.35s;}}.mm-title{padding: 10px 0 5px; position: relative; margin: 0 0 15px; &:after{content: ""; position: absolute; bottom: 0; left: 0; // background: $primary; width: 18px; height: 2px;}a{// color: $as-dark !important; font-weight: 600; font-size: 18px; text-decoration: none;}}.mm-sub-cat{margin: 0; padding: 0; list-style: none; li{+li{margin-top: 8px;}a{// color: $body-color !important; position: relative; text-decoration: none; &:after{content: ""; position: absolute; left: 0; right: auto; bottom: 0; width: 0px; height: 1px; background: currentColor; transition: ease all 0.35s;}&:hover{// color: $primary !important; &:after{width: 100%; left: auto; right: 0;}}}}}&:hover{.mm-img{img{transform: scale(1.05);}}}}}.as-category-grid-modern{.as-mm-category-grid{position: relative; padding: 20px; display: flex; flex-direction: column; height: 100%; .mm-img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 1; transition: ease all 0.35s; // background: $as-white; a{pointer-events: none;}img{height: 100%; width: 100%; object-fit: cover; transition: ease all 0.35s;}}.mm-title{font-size: 18px; font-weight: 600; margin-bottom: 20px; position: relative; opacity: 0; transition: ease all 0.35s; a{// color: $primary; position: relative; z-index: 1; display: inline-block; vertical-align: top; padding: 2px 12px; text-decoration: none; &:after{content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 100%; // background-image: linear-gradient(45deg, $as-white, $as-white); z-index: -1; background-repeat: no-repeat; background-size: 0% 100%; transition: ease all 0.35s;}}}.mm-sub-cat{margin: 0; padding: 0; list-style: none; position: relative; opacity: 0; transition: ease all 0.35s; li{+li{padding-top: 8px;}}a{// color: $body-color !important; position: relative; text-decoration: none; z-index: 1; display: inline-block; vertical-align: top; padding: 2px 10px; font-size: 14px; &:after{content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 100%; // background-image: linear-gradient(45deg, $as-white, $as-white); z-index: -1; background-repeat: no-repeat; background-size: 0% 100%; transition: ease all 0.35s;}&:hover{// color: $primary !important;}}}&:hover{.mm-img{// background: $as-black; img{opacity: 0.4; transition: ease all 0.35s;}}.mm-title{opacity: 1; a{&:after{background-size: 100% 100%;}}}.mm-sub-cat{opacity: 1; a{&:after{background-size: 100% 100%;}}}}}}.as-category-grid-classic{.as-mm-category-grid{.mm-img{position: relative; &:before, &:after{content: ""; position: absolute; width: 0; height: 0; transition: ease all 0.35s; pointer-events: none;}&:after{top: 10px; left: 10px; // border-top: 1px solid $as-dark; // border-left: 1px solid $as-dark;}&:before{bottom: 10px; right: 10px; // border-bottom: 1px solid $as-dark; // border-right: 1px solid $as-dark;}}.mm-title{// border-bottom: 1px solid $as-gray-300; position: relative; margin: 0 0 25px; padding-bottom: 10px; margin-top: 20px; &:after{content: ""; position: absolute; bottom: -1px; left: 0; height: 3px; // background: $primary; width: 25px;}a{// color: $as-dark !important; font-weight: 400; text-transform: uppercase; letter-spacing: 1px; font-size: 15px; text-decoration: none;}}.mm-sub-cat{margin: 0; padding: 0; list-style: none; li{+ li{margin-top: 8px;}a{// color: $body-color !important; font-size: 15px; text-decoration: none; position: relative; &:after{content:""; position: absolute; left: -12px; top: 6px; width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: 0;}&:hover{// color: $primary !important; &:after{opacity: 1; animation: mm_blinker 1s linear infinite;}}}}}&:hover{.mm-img{&:after, &:before{width: 25%; height: 25%;}}}}}@keyframes mm_blinker{50%{opacity: 0;}}.as-category-list-simple{.as-mm-category-list{position: relative; display: flex; flex-direction: column; height: 100%; .mm-title{font-size: 17px; font-weight: 600; margin-bottom: 20px; position: relative; a{// color: $as-dark; text-decoration: none; letter-spacing: 1px; text-transform: uppercase;}}.mm-sub-cat{margin: 0; padding: 0; list-style: none; li{+li{padding-top: 8px;}}a{// color: $body-color !important; text-decoration: none; font-size: 15px; &:hover{// color: $primary !important;}}}}}.as-category-list-modern{.as-mm-category-list{.mm-title{padding: 0 0 10px; position: relative; margin: 0 0 20px; &:after{content: ""; position: absolute; bottom: 0; left: 0; // background: $primary; width: 18px; height: 2px;}a{// color: $as-dark !important; font-weight: 600; font-size: 18px; text-decoration: none;}}.mm-sub-cat{margin: 0; padding: 0; list-style: none; li{+li{margin-top: 8px;}a{// color: $body-color !important; position: relative; text-decoration: none; font-size: 15px; &:after{content: ""; position: absolute; left: 0; right: auto; bottom: 0; width: 0px; height: 1px; background: currentColor; transition: ease all 0.35s;}&:hover{// color: $primary !important; &:after{width: 100%; left: auto; right: 0;}}}}}}}.as-category-list-classic{.as-mm-category-list{.mm-title{// border-bottom: 1px solid $as-gray-300; position: relative; margin: 0 0 25px; padding-bottom: 10px; margin-top: 20px; &:after{content: ""; position: absolute; bottom: -1px; left: 0; height: 3px; // background: $primary; width: 25px;}a{// color: $as-dark !important; font-weight: 400; text-transform: uppercase; letter-spacing: 1px; font-size: 15px; text-decoration: none;}}.mm-sub-cat{margin: 0; padding: 0; list-style: none; li{+ li{margin-top: 8px;}a{// color: $body-color !important; font-size: 15px; text-decoration: none; position: relative; &:after{content:""; position: absolute; left: -12px; top: 6px; width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: 0;}&:hover{// color: $primary !important; &:after{opacity: 1; animation: mm_blinker 1s linear infinite;}}}}}}}

/* /ebs_website_extended/static/src/css/marquee.scss */
*{box-sizing: border-box;}$duration: 25s; @keyframes ticker{0%{transform: translateX(0);}100%{transform: translateX(-2300px);}}.ticker-wrap{position: relative; bottom: 0; overflow: hidden; height: 4rem; padding-left: 100%; box-sizing: content-box; .ticker{display: inline-block; height: 4rem; color:#753939 !important; line-height: 2rem; white-space: nowrap; padding-right: 100%; box-sizing: content-box; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-name: ticker; animation-name: ticker; -webkit-animation-duration: $duration; animation-duration: $duration; &__item{display: inline-block; padding: 0 2rem; color: #753939; margin: 0px 100px 0px 0px;}}}

/* /ebs_website_extended/static/src/css/style1.css */
header .navbar-brand.logo{margin-right:0px !important;}.navbar-toggler-icon{width: 1.3em; height: 1.3em;}.no-mobile-view-cables .owl-stage{margin:auto;}@media (max-width: 1300px){.dropdown-content{min-width:175px;}}@media (max-width: 985px){.pagination a{padding: 3px 6px;}#top_menu_container{min-height: 35px;}#contactus_title_container div.col-lg-12.p-0,#contactus_title_container div.col-lg-12.pl-0{padding-left:15px !important; padding-right:15px !important;}}#top_menu_container{padding: 0; padding-left:0px !important; padding-right:0px !important;}@media (min-width: 1800px){.container-1800{max-width: 100%!important; width:89% !important;}}.dropdown-menu.js_usermenu{border-radius:0px !important; box-shadow: 0px 2px 11px rgb(0,0,0,0.3); border:unset;}.o_logout_btn{margin: auto; border-radius: 30px; width: 70px !important; padding: 3px; color: #fff; font-family: 'Roboto', sans-serif !important; font-size: 15px!important; display:block; background-color: #be202f !important; border-color: #be202f !important;}@media(max-width: 992px){.Shipping_kanban{max-width:100% !important; margin-top:5px !important; margin-left:0% !important}}.confirm_order_page.toggle_summary_div .promate_order_summary_qty span{font-size:1.15rem !important;}.confirm_order_page.toggle_summary_div .img-fluid{width: 160px !important;}.confirm_order_page.toggle_summary_div{max-width:100% !important;}@media(max-width: 767.98px){.confirm_shipping_kanban,.confirm_payment_kanban{max-width:100% !important; margin-top:5px !important; margin-left:0% !important}}@media(min-width: 992px){#become_partner_lead #l_name{width: 80% !important;}}#become_partner_lead .border_class{border: 1px solid #9b9b9b;}.about_us_p{color: #231f20 !important; text-align: justify; font-size: 16px !important; font-family: 'Roboto', sans-serif !important; font-weight: 400;}.title_headline2{border-bottom: 2px solid #B42B39; color:#000;}.contact_information_contain img.map_promate_icon{margin-bottom: 50px !important;}.contact_information_contain img{width:23px;}.contact_information_contain h2{margin-bottom:0px !important; font-size: 16px !important; font-family: 'Roboto', sans-serif !important; font-weight: 400 !important;}.contact_information_contain h1{font-family: 'Roboto', sans-serif !important; font-size: 26px !important;}.contact_information_contain h1,.contact_information_contain h2{color:#fff !important}.contact_information_contain h3{color: #fff; font-family: 'Roboto', sans-serif !important; font-weight: bold; font-size: 16px; font-weight: 400 !important;}.contact_information_section h1{font-family: 'Roboto', sans-serif !important; font-size: 20px !important; margin-top:10px;}.contact_information_section h1,.contact_information_section h2{color:#000 !important;}.s_website_form_input{font-size: 16px !important; font-family: 'Roboto', sans-serif !important;}.contact_information_section h3{color: #000; font-size: 11px !important; font-family: 'Roboto', sans-serif !important; font-weight: bold!important;}.contact_information{text-align:center;}.contact_information_section{background: #e1e2e3}.image_text_aboutpage h1,.image_text_aboutpage .about_quote{color: #fff !important;}.image_text_aboutpage h1{font-family: 'Roboto', sans-serif !important; font-size: 28px !important; font-weight: 500 !important;}.image_text_aboutpage{z-index: 1; display: flex; flex-direction: column; position: absolute; max-width: 1167px; width: 100vw; left: 50%; transform: translateX(-50%); top: 86%;}@media(max-width: 1200px){.image_text_aboutpage{max-width: 900px; top: 78% !important; left: 46%;}}@media(max-width: 1100px){.image_text_aboutpage{max-width: 800px; left: 41%;}}@media(max-width: 1000px){.image_text_aboutpage{max-width: 700px; left: 48%;}}@media(max-width: 992px){.last_name_label{width: 210px !important;}}@media(max-width: 992px){.image_text_aboutpage{max-width: 600px; left: 41%; top: 76% !important;}}@media(max-width: 764px){.image_text_aboutpage{max-width: 430px; left: 41%; top: 76% !important;}}@media(max-width: 576px){.image_text_aboutpage{top: 44% !important; left: 47% !important; max-width: 370px !important;}}.dk-footer-form button[type=submit]{position: absolute; top: 0; right: 0; padding: 3px 14px 4px 14px; border: 1px solid #b42b39; background: #b42b39; color: #fff;}.subscription{border: 1px solid #b42b39; background: #b42b39; color: #fff;}.js_language_selector{display:none !important;}.categories-desk .owl-nav [class*=owl-]:hover{background: unset !important; color: #000 !important;}.categories-desk .owl-nav button:focus{outline: unset !important;}.categories-desk .owl-nav .owl-next span,.categories-desk .owl-nav .owl-prev span{color: #a4a7a9;}.categories-desk .owl-nav .owl-prev{position: absolute; left: 0%;}.categories-desk .owl-nav .owl-next{position: absolute; right: 0%;}.categories-desk .owl-nav{display:block; position: absolute; top: 19%; font-size: 42px; width: 100%;}.o_footer .stay_connected a{margin-right : 8px !important;}.no-mobile-view-cables img:hover{-ms-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1);}.o_header_affixed.o_header_is_scrolled .navbar-brand img{top: 0px; padding-top: 7px; padding-bottom: 8px; height: auto;}#slider1{margin: 0 auto; width: 100%; overflow: hidden; background: #EFEFEF; padding: 2px;}header .navbar-brand.logo img{margin-top: -8px; object-fit: contain; display: block; width: auto; height: auto; background: #B2292E !important; position: absolute; top: -39px; padding-top: 48px; padding-bottom: 14px; padding-left:10px; padding-right:10px;}.badge{display: inline-block; padding: 3px 5px; font-size: 10px; font-weight: 700; line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: 7px; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;}sup{top: -11px; right: 7px;}.Wishlist-name{display:none;}@font-face{font-family: 'SF-Pro-Display-Bold'; src: url('/ebs_website_extended/static/src/font/SF-Pro-Display-Bold.otf');}@font-face{font-family: 'SF-Pro-Display-Heavy'; src: url('/ebs_website_extended/static/src/font/SF-Pro-Display-Heavy.otf');}@font-face{font-family: 'SF-Pro-Display-Light'; src: url('/ebs_website_extended/static/src/font/SF-Pro-Display-Light.otf');}@font-face{font-family: 'SF-Pro-Display-Medium'; src: url('/ebs_website_extended/static/src/font/SF-Pro-Display-Medium.otf');}@font-face{font-family: 'SF-Pro-Display-Regular'; src: url('/ebs_website_extended/static/src/font/SF-Pro-Display-Regular.otf');}@font-face{font-family: 'SF-Pro-Display-Semibold'; src: url('/ebs_website_extended/static/src/font/SF-Pro-Display-Semibold.otf');}@font-face{font-family: 'MYRIADPRO-REGULAR'; src: url('/ebs_website_extended/static/src/font/MYRIADPRO-REGULAR.OTF');}.featured_categories a p{font-family: 'Roboto', sans-serif !important; font-size: 14px; margin-bottom:25px; color: #989898; padding: 0px 0px 0px 0px;}

/* /ebs_website_extended/static/src/css/product_color_filter.css */
.color-tool{display:block; height:70px; width:70px; background:#fff; border:1px solid #eeeeee; color:black !important; border-radius:5px; font-size:12px; text-align:center; margin-left:3px; margin-top:2px;}.check-tooltip::after{content: ""; position: absolute; width: 10px; transform: translateX(-50%) rotate(-45deg); height: 10px; top: 95%; cursor: default; background-color: #fff; pointer-events: none; transition: all ease-out 0.15s; box-shadow: none; left: 50%; border: 1px solid white; border-left-color: rgba(0, 0, 0, 0.2); border-bottom-color: rgba(0, 0, 0, 0.2);}.check-tooltip{border-radius:5px; background:#fff; color:#000 !important; border: 2px solid #eeeeee; font-size:12px; position: absolute; display: block; width:80px; height:100px; text-align: center; bottom: 115%; left: -118%;}.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after{background-image: unset !important; border: 2px solid #b42b39;}.custom-control-label.custom-control-label-color::after{width: 1.5rem; height: 1.5rem;}.custom-control-label.custom-control-label-color::before{width: 1.5rem; height: 1.5rem;}

/* /ebs_website_extended/static/src/css/forgot_password.css */
.fade:not(.show){opacity: 1;}.modal:not([data-backdrop="false"]){background-color: rgb(239 ,239, 239 , 90%); overflow:hidden !important;}.reset-close a:hover{text-decoration: none;}@media(max-width: 700px){.forgot-password-modal .modal-content,.forgot-password-modal .modal-content .modal-body{width:400px !important;}}@media(max-width: 450px){.forgot-password-modal .modal-content,.forgot-password-modal .modal-content .modal-body{width:300px !important;}.oe_reset_password_form .field-login{padding-left:10px; padding-right:10px;}}

/* /ebs_website_extended/static/src/css/wishlist.css */
.wishlist_title_container h1{font-weight: 600; font-size: 16px;}.wishlist-section table td{padding: 0.2rem;}input[type=text].product-qty{width: 30px; height: 30px; border-radius: 50%; background-color: #000 !important; border: none; text-align: center; color: #fff;}.wishlist-add-cart{background-color: #B2292E; color: #fff; padding: 5px 0px; border-radius: 30px;}tr.text-center.wishlist-tr td{vertical-align: inherit;}@media (min-width: 1800px){.wishlist_title_container{max-width: 100%!important; width: 88%!important;}}@media (max-width: 991px){tr.wishlist-tr th,tr.wishlist-tr td{padding-left:0.15rem; padding-right:0.15rem; font-size:13px;}}@media (max-width: 599px){tr.wishlist-tr th,tr.wishlist-tr td{padding-left:0.1rem; padding-right:0.1rem; font-size:12px;}}.wish_list_prod_title p{display:initial;}

/* /ebs_website_extended/static/src/css/cart.css */
.progress-wizard .progress-wizard-step .progress-wizard-dot{width: 0 !important; height: 0 !important; top: 42px; border-left: 13px solid transparent !important; border-right: 13px solid transparent !important; border-top: 13px solid #b42b39 !important; border-radius: unset !important; box-shadow:unset !important;}.progress-wizard-bar.done{background-color: #b42b39 !important;}@media (min-width: 768px){.progress-wizard .progress-wizard-step .progress-wizard-steplabel{margin: 5px !important;}}.progress-wizard .progress-wizard-step .progress-wizard-steplabel{color: #212529 !important; font-weight: 600;}.o_delivery_carrier_select .checkmark{border: 1px solid #9b9b9b; background-color: #fff;}.o_delivery_carrier_select{border-color:#9b9b9b; padding: 1rem 1.25rem;}.o_delivery_carrier_select .job_container input:checked ~ .checkmark{background-color: #fffefe; border: 1px solid #b42b39;}.o_delivery_carrier_select .job_container .checkmark:after{top: 1.6px; left: 1.6px; width: 12px; height: 12px; border-radius: 50%; background: #b42b39;}.o_delivery_carrier_select label,.o_delivery_carrier_select span{color: #212529 !important; font-weight: 500; margin-bottom: 0px;}

/* /ebs_website_extended/static/src/css/summary.css */
#cart_total table{margin-bottom: 0rem !important;}.order-summary-box strong{font-size: 12px; font-weight:500; font-family: 'Roboto', sans-serif !important;}.order-summary-box p{font-size: 12px; font-family: 'Roboto', sans-serif !important; color: #212529;}.promate_order_summary_qty span{font-size: 13px; font-family: 'Roboto', sans-serif !important;}.pay-card p{font-size: 15px; font-weight:300; font-family: 'Roboto', sans-serif !important; color: #212529;}.pay-card strong{font-size: 15px; font-weight:500; font-family: 'Roboto', sans-serif !important;}.pay-card{border: none;}.pay-summary-box{border-radius: 6px; border: 1px solid #9b9b9b;}}.pay-summary-box table{margin-bottom:0px !important;}.order-summary-title{border-radius: 6px 6px 0 0;}#place_order{border-radius: 0 0 6px 6px;}#continue_payment{border-radius: 0 0 6px 6px;}#place_order_lock{border-radius: 0 0 6px 6px;}#cart_checkout{border-radius: 6px;}.prod-detail:last-child{border-bottom:none !important;}.amount-sec-title{font-size: 20px;}.amount-sec-value{font-weight: 600; font-size: 25px;}input[type=text].product-qty{width: 25px; min-width: 25px; height: 25px; border-radius: 50%; background-color: #000 !important; border: none; text-align: center; color: #fff; font-size:small;}.cart-qty{width: 45px; height: 45px; border-radius: 50%; background-color: #000 !important; border: none; text-align: center; color: #fff;}.order-summary-box tr td:first-child{text-align: left !important;}.px-12{padding-left:12px; padding-right:12px;}tr#order_total{background: #efefef;}.order-summary-box form .input-group{padding: 0 12px;}.order-summary-box form .input-group input{margin-right: 30px; border-top-right-radius: 4px !important; border-bottom-right-radius: 4px !important; border:1px solid #9b9b9b;}.order-summary-box form .input-group .a-submit{border-top-left-radius: 4px; border-bottom-left-radius: 4px;}#cart_total{text-transform: uppercase;}#order_total + tr{display: none;}.cart-summary-box #cart_total tr{display: none;}.cart-summary-box #cart_total tr#order_total{display: flex; justify-content:space-between; align-items:center;}.popover-body{padding:0.5rem 0;}.btn-coupon-apply{background: #b42b39; border-color: #b42b39;}.mycart-popover{width: 350px; border: 1px solid #9b9b9b;}.popover-header{border-bottom:none !important; font-size:18px; font-weight:500;}.cart-summary-box tr td{border-top:none !important;}.p-detail p{display:inline;}div#cart_total tr td:last-child{font-size: 1.15rem !important; font-weight: 900; font-family: 'Roboto', sans-serif !important;}#order_total td:last-child strong{font-size: 1.15rem !important; font-weight: 900; font-family: 'Roboto', sans-serif !important;}.btn-primary:hover, .btn-secondary:hover{color: rgb(255, 255, 255); background-color: #be202f !important; border-color: #be202f !important;}

/* /ebs_website_extended/static/src/css/address.css */
 .o_page_header{border-bottom-width: 0px !important; border-bottom-style: unset !important; border-bottom-color: unset !important;}.o_page_header{color: #000000; font-family: 'Roboto', sans-serif !important; font-size: 16px!important; font-weight: 500!important;}.checkout_autoformat input,.checkout_autoformat select{font-family: 'Roboto', sans-serif !important; fonr-size:300!important; color: #9b9b9b; font-size: 16px; border: 1px solid #9b9b9b;}.checkout_autoformat label{color: #231f20; font-family: 'Roboto', sans-serif !important; fonr-size:300!important; font-size: 16px; font-weight: 300; margin-bottom: 0px;}.checkout_autoformat .btn-secondary{background-color: #b42b39 !important; border-color: #b42b39 !important;}.shipping_addresses .card-body{border: 1px solid #9b9b9b !important;}form label.label-optional{font-weight: 300;}.o_payment_option_card .checkmark{top:3px !important;}.o_payment_option_card .job_container{margin-bottom: 0px;}#continue_final_review{border-radius: 0 0 6px 6px;}.o_delivery_carrier_select .checkmark{top:2.5px !important;}@media(min-width: 1800px){.o_delivery_carrier_select div{max-width:81% !important;}}

/* /ebs_website_extended/static/src/css/variants.css */
.promate-variant .css_attribute_color:before{border: unset; border-radius: 0% !important; box-shadow: unset !important;}.promate-variant .css_attribute_color.active{border: 1px solid #b2292e;}.promate-variant .css_attribute_color{border-radius: 0% !important; border: 1px solid #DEE2E6;}

/* /ebs_website_extended/static/src/css/product_responsive.css */
.oe_product_cart .oe_product_image img{height: 100%; width: auto; object-fit: scale-down;}#product_detail #o-carousel-product .carousel-outer{height: 530px; max-height: 90vh;}@media (min-width: 764px) and (max-width: 1200px){.promate_prod_review_kanban{font-size:8px !important;}.prod_temp_color{height: 12px; width: 12px;}}@media (min-width: 2000px) and (max-width: 2500px){#product_detail #o-carousel-product .carousel-outer{height: 40vh; max-height: 134vh;}}@media (min-width: 2501px) and (max-width: 4000px){#product_detail #o-carousel-product .carousel-outer{height: 50vh; max-height: 134vh;}}@media (min-width: 4001px) and (max-width: 10000px){#product_detail #o-carousel-product .carousel-outer{height: 60vh; max-height: 134vh;}}@media (min-width: 3001px) and (max-width: 3500px){.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-title{font-size: 18px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-name{font-size: 28px !important;}.o_wsale_product_information .o_wsale_product_information_text .d-flex.justify-content-between.align-items-center{height:50px !important;}.o_wsale_product_information .o_wsale_product_information_text .product_price{font-size: 18px !important;}.o_wsale_product_information .o_wsale_product_information_text .prod_temp_color{height: 36px; width: 36px;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title{height:100px !important;}.promate_prod_review_kanban{font-size:18px;}}.promate_prod_review_kanban{font-size:13px;}@media (min-width: 3501px) and (max-width: 4000px){.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-title{font-size: 22px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-name{font-size: 34px !important;}.o_wsale_product_information .o_wsale_product_information_text .d-flex.justify-content-between.align-items-center{height:60px !important;}.o_wsale_product_information .o_wsale_product_information_text .product_price{font-size: 22px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title{height:120px !important;}.promate_prod_review_kanban{font-size:22px;}.o_wsale_product_information .o_wsale_product_information_text .prod_temp_color{height: 42px; width: 42px;}}@media (min-width: 4001px) and (max-width: 4500px){.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-title{font-size: 26px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-name{font-size: 40px !important;}.o_wsale_product_information .o_wsale_product_information_text .d-flex.justify-content-between.align-items-center{height:70px !important;}.o_wsale_product_information .o_wsale_product_information_text .product_price{font-size: 26px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title{height:130px !important;}.promate_prod_review_kanban{font-size:26px;}.o_wsale_product_information .o_wsale_product_information_text .prod_temp_color{height: 48px; width: 48px;}}@media (min-width: 4501px) and (max-width: 5000px){.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-title{font-size: 30px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-name{font-size: 44px !important;}.o_wsale_product_information .o_wsale_product_information_text .d-flex.justify-content-between.align-items-center{height:80px !important;}.o_wsale_product_information .o_wsale_product_information_text .product_price{font-size: 30px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title{height:140px !important;}.promate_prod_review_kanban{font-size:30px;}.o_wsale_product_information .o_wsale_product_information_text .prod_temp_color{height: 52px; width: 52px;}}@media (min-width: 5001px) and (max-width: 5500px){.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-title{font-size: 34px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-name{font-size: 50px !important;}.o_wsale_product_information .o_wsale_product_information_text .d-flex.justify-content-between.align-items-center{height:100px !important;}.o_wsale_product_information .o_wsale_product_information_text .product_price{font-size: 35px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title{height:230px !important;}.promate_prod_review_kanban{font-size:35px;}.o_wsale_product_information .o_wsale_product_information_text .prod_temp_color{height: 56px; width: 56px;}}@media (min-width: 5501px) and (max-width: 6000px){.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-title{font-size: 40px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title .product-name{font-size: 58px !important;}.o_wsale_product_information .o_wsale_product_information_text .d-flex.justify-content-between.align-items-center{height:120px !important;}.o_wsale_product_information .o_wsale_product_information_text .product_price{font-size: 42px !important;}.o_wsale_product_information .o_wsale_product_information_text .o_wsale_products_item_title{height:250px !important;}.promate_prod_review_kanban{font-size:42px;}.o_wsale_product_information .o_wsale_product_information_text .prod_temp_color{height: 65px; width: 65px;}}@media (min-width: 1000px) and (max-width: 1010px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 20px !important;}}@media (min-width: 1010px) and (max-width: 1020px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 25px !important;}}@media (min-width: 1020px) and (max-width: 1030px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 30px !important;}}@media (min-width: 1030px) and (max-width: 1040px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 35px !important;}}@media (min-width: 1040px) and (max-width: 1050px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 40px !important;}}@media (min-width: 1050px) and (max-width: 1060px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 45px !important;}}@media (min-width: 1060px) and (max-width: 1070px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 50px !important;}}@media (min-width: 1070px) and (max-width: 1080px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 55px !important;}}@media (min-width: 1080px) and (max-width: 1090px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 60px !important;}}@media (min-width: 1090px) and (max-width: 1100px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 65px !important;}}@media (min-width: 1100px) and (max-width: 1110px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 70px !important;}}@media (min-width: 1111px) and (max-width: 1120px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 75px !important;}}@media (min-width: 1121px) and (max-width: 1130px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 80px !important;}}@media (min-width: 1131px) and (max-width: 1140px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 85px !important;}}@media (min-width: 1141px) and (max-width: 1150px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 90px !important;}}@media (min-width: 1151px) and (max-width: 1160px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 95px !important;}}@media (min-width: 1161px) and (max-width: 1170px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 105px !important;}}@media (min-width: 1171px) and (max-width: 1180px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 110px !important;}}@media (min-width: 1181px) and (max-width: 1190px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 115px !important;}}@media (min-width: 1191px) and (max-width: 1200px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 120px !important;}}@media (min-width: 1200px) and (max-width: 1210px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 32px !important;}}@media (min-width: 1211px) and (max-width: 1220px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 40px !important;}}@media (min-width: 1221px) and (max-width: 1230px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 36px !important;}}@media (min-width: 1231px) and (max-width: 1240px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 41px !important;}}@media (min-width: 1241px) and (max-width: 1250px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 46px !important;}}@media (min-width: 1251px) and (max-width: 1260px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 52px !important;}}@media (min-width: 1261px) and (max-width: 1270px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 65px !important;}}@media (min-width: 1271px) and (max-width: 1280px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 70px !important;}}@media (min-width: 1281px) and (max-width: 1290px){.promate_products{flex: 0 0 20.666667% !important; max-width: 56.666667% !important; padding-left: 75px !important;}}@media (min-width: 1291px) and (max-width: 1300px){.promate_products{flex: 0 0 21.666667% !important; max-width: 56.666667% !important; padding-left: 80px !important;}}@media (min-width: 1300px) and (max-width: 1310px){.promate_products{flex: 0 0 21.666667% !important; max-width: 56.666667% !important; padding-left: 85px !important;}}@media (min-width: 1311px) and (max-width: 1320px){.promate_products{flex: 0 0 21.666667% !important; max-width: 56.666667% !important; padding-left: 90px !important;}}@media (min-width: 1321px) and (max-width: 1330px){.promate_products{flex: 0 0 22.666667% !important; max-width: 56.666667% !important; padding-left: 95px !important;}}@media (min-width: 1331px) and (max-width: 1340px){.promate_products{flex: 0 0 22.666667% !important; max-width: 56.666667% !important; padding-left: 100px !important;}}@media (min-width: 1341px) and (max-width: 1350px){.promate_products{flex: 0 0 22.666667% !important; max-width: 56.666667% !important; padding-left: 105px !important;}}@media (min-width: 1351px) and (max-width: 1360px){.promate_products{flex: 0 0 22.666667% !important; max-width: 56.666667% !important; padding-left: 110px !important;}}@media (min-width: 1361px) and (max-width: 1370px){.promate_products{flex: 0 0 23.666667% !important; max-width: 56.666667% !important; padding-left: 115px !important;}}@media (min-width: 1371px) and (max-width: 1380px){.promate_products{flex: 0 0 23.666667% !important; max-width: 56.666667% !important; padding-left: 120px !important;}}@media (min-width: 1381px) and (max-width: 1390px){.promate_products{flex: 0 0 23.666667% !important; max-width: 56.666667% !important; padding-left: 125px !important;}}@media (min-width: 1391px) and (max-width: 1400px){.promate_products{flex: 0 0 23.666667% !important; max-width: 56.666667% !important; padding-left: 130px !important;}}@media (min-width: 1400px) and (max-width: 1410px){.promate_products{flex: 0 0 24.666667% !important; max-width: 56.666667% !important; padding-left: 135px !important;}}@media (min-width: 1411px) and (max-width: 1420px){.promate_products{flex: 0 0 24.666667% !important; max-width: 56.666667% !important; padding-left: 140px !important;}}@media (min-width: 1421px) and (max-width: 1430px){.promate_products{flex: 0 0 24.666667% !important; max-width: 56.666667% !important; padding-left: 145px !important;}}@media (min-width: 1431px) and (max-width: 1440px){.promate_products{flex: 0 0 24.666667% !important; max-width: 56.666667% !important; padding-left: 150px !important;}}@media (min-width: 1441px) and (max-width: 1450px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 155px !important;}}@media (min-width: 1451px) and (max-width: 1460px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 160px !important;}}@media (min-width: 1461px) and (max-width: 1470px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 165px !important;}}@media (min-width: 1471px) and (max-width: 1480px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 170px !important;}}@media (min-width: 1481px) and (max-width: 1490px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 175px !important;}}@media (min-width: 1491px) and (max-width: 1500px){.promate_products{flex: 0 0 25.666667% !important; max-width: 56.666667% !important; padding-left: 180px !important;}}@media (min-width: 1500px) and (max-width: 1510px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 185px !important;}}@media (min-width: 1511px) and (max-width: 1520px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 190px !important;}}@media (min-width: 1521px) and (max-width: 1530px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 195px !important;}}@media (min-width: 1531px) and (max-width: 1540px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 200px !important;}}@media (min-width: 1541px) and (max-width: 1550px){.promate_products{flex: 0 0 26.666667% !important; max-width: 56.666667% !important; padding-left: 205px !important;}}@media (min-width: 1551px) and (max-width: 1560px){.promate_products{flex: 0 0 27.666667% !important; max-width: 576.666667% !important; padding-left: 210px !important;}}@media (min-width: 1561px) and (max-width: 1570px){.promate_products{flex: 0 0 27.666667% !important; max-width: 56.666667% !important; padding-left: 215px !important;}}@media (min-width: 1571px) and (max-width: 1580px){.promate_products{flex: 0 0 27.666667% !important; max-width: 56.666667% !important; padding-left: 220px !important;}}@media (min-width: 1581px) and (max-width: 1590px){.promate_products{flex: 0 0 27.666667% !important; max-width: 56.666667% !important; padding-left: 225px !important;}}@media (min-width: 1591px) and (max-width: 1600px){.promate_products{flex: 0 0 27.666667% !important; max-width: 56.666667% !important; padding-left: 230px !important;}}@media (min-width: 1600px) and (max-width: 1610px){.promate_products{flex: 0 0 28.666667% !important; max-width: 56.666667% !important; padding-left: 235px !important;}}@media (min-width: 1611px) and (max-width: 1620px){.promate_products{flex: 0 0 28.666667% !important; max-width: 56.666667% !important; padding-left: 240px !important;}}@media (min-width: 1621px) and (max-width: 1630px){.promate_products{flex: 0 0 28.666667% !important; max-width: 56.666667% !important; padding-left: 245px !important;}}@media (min-width: 1631px) and (max-width: 1640px){.promate_products{flex: 0 0 28.666667% !important; max-width: 56.666667% !important; padding-left: 250px !important;}}@media (min-width: 1641px) and (max-width: 1650px){.promate_products{flex: 0 0 28.666667% !important; max-width: 56.666667% !important; padding-left: 255px !important;}}@media (min-width: 1651px) and (max-width: 1660px){.promate_products{flex: 0 0 29.666667% !important; max-width: 576.666667% !important; padding-left: 260px !important;}}@media (min-width: 1661px) and (max-width: 1670px){.promate_products{flex: 0 0 29.666667% !important; max-width: 56.666667% !important; padding-left: 265px !important;}}@media (min-width: 1671px) and (max-width: 1680px){.promate_products{flex: 0 0 29.666667% !important; max-width: 56.666667% !important; padding-left: 270px !important;}}@media (min-width: 1681px) and (max-width: 1690px){.promate_products{flex: 0 0 29.666667% !important; max-width: 56.666667% !important; padding-left: 275px !important;}}@media (min-width: 1691px) and (max-width: 1700px){.promate_products{flex: 0 0 29.666667% !important; max-width: 56.666667% !important; padding-left: 280px !important;}}@media (min-width: 1700px) and (max-width: 1710px){.promate_products{flex: 0 0 30.666667% !important; max-width: 56.666667% !important; padding-left: 285px !important;}}@media (min-width: 1711px) and (max-width: 1720px){.promate_products{flex: 0 0 30.666667% !important; max-width: 56.666667% !important; padding-left: 290px !important;}}@media (min-width: 1721px) and (max-width: 1730px){.promate_products{flex: 0 0 30.666667% !important; max-width: 56.666667% !important; padding-left: 295px !important;}}@media (min-width: 1731px) and (max-width: 1740px){.promate_products{flex: 0 0 30.666667% !important; max-width: 56.666667% !important; padding-left: 300px !important;}}@media (min-width: 1741px) and (max-width: 1750px){.promate_products{flex: 0 0 30.666667% !important; max-width: 56.666667% !important; padding-left: 305px !important;}}@media (min-width: 1751px) and (max-width: 1760px){.promate_products{flex: 0 0 31.666667% !important; max-width: 576.666667% !important; padding-left: 310px !important;}}@media (min-width: 1761px) and (max-width: 1770px){.promate_products{flex: 0 0 31.666667% !important; max-width: 56.666667% !important; padding-left: 315px !important;}}@media (min-width: 1771px) and (max-width: 1780px){.promate_products{flex: 0 0 31.666667% !important; max-width: 56.666667% !important; padding-left: 320px !important;}}@media (min-width: 1781px) and (max-width: 1790px){.promate_products{flex: 0 0 31.666667% !important; max-width: 56.666667% !important; padding-left: 325px !important;}}@media (min-width: 1791px) and (max-width: 1800px){.promate_products{flex: 0 0 31.666667% !important; max-width: 56.666667% !important; padding-left: 330px !important;}}@media (min-width: 1800px) and (max-width: 1825px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 104px !important;}}@media (min-width: 1825px) and (max-width: 1850px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 105px !important;}}@media (min-width: 1850px) and (max-width: 1875px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 107px !important;}}@media (min-width: 1875px) and (max-width: 1900px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 108px !important;}}@media (min-width: 1900px) and (max-width: 1925px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 109px !important;}}@media (min-width: 1925px) and (max-width: 1950px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 110px !important;}}@media (min-width: 1950px) and (max-width: 1975px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 111px !important;}}@media (min-width: 1975px) and (max-width: 2000px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 112px !important;}}@media (min-width: 2000px) and (max-width: 2025px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 113px !important;}}@media (min-width: 2025px) and (max-width: 2050px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 114px !important;}}@media (min-width: 2050px) and (max-width: 2075px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 115px !important;}}@media (min-width: 2075px) and (max-width: 2100px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 116px !important;}}@media (min-width: 2100px) and (max-width: 2125px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 117px !important;}}@media (min-width: 2125px) and (max-width: 2150px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 118px !important;}}@media (min-width: 2150px) and (max-width: 2175px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 120px !important;}}@media (min-width: 2175px) and (max-width: 2200px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 121px !important;}}@media (min-width: 2200px) and (max-width: 2225px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 122px !important;}}@media (min-width: 2225px) and (max-width: 2250px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 123px !important;}}@media (min-width: 2250px) and (max-width: 2275px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 124px !important;}}@media (min-width: 2275px) and (max-width: 2300px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 125px !important;}}@media (min-width: 2300px) and (max-width: 2325px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 126px !important;}}@media (min-width: 2325px) and (max-width: 2350px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 127px !important;}}@media (min-width: 2350px) and (max-width: 2375px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 128px !important;}}@media (min-width: 2375px) and (max-width: 2400px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 129px !important;}}@media (min-width: 2400px) and (max-width: 2425px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 131px !important;}}@media (min-width: 2425px) and (max-width: 2450px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 132px !important;}}@media (min-width: 2450px) and (max-width: 2475px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 134px !important;}}@media (min-width: 2475px) and (max-width: 2500px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 135px !important;}}@media (min-width: 2500px) and (max-width: 2525px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 137px !important;}}@media (min-width: 2525px) and (max-width: 2550px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 138px !important;}}@media (min-width: 2550px) and (max-width: 2575px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 139px !important;}}@media (min-width: 2575px) and (max-width: 2600px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 140px !important;}}@media (min-width: 2600px) and (max-width: 2625px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 142px !important;}}@media (min-width: 2625px) and (max-width: 2650px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 143px !important;}}@media (min-width: 2650px) and (max-width: 2675px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 145px !important;}}@media (min-width: 2675px) and (max-width: 2700px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 146px !important;}}@media (min-width: 2700px) and (max-width: 2725px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 147px !important;}}@media (min-width: 2725px) and (max-width: 2750px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 148px !important;}}@media (min-width: 2750px) and (max-width: 2775px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 150px !important;}}@media (min-width: 2775px) and (max-width: 2800px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 151px !important;}}@media (min-width: 2800px) and (max-width: 2825px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 153px !important;}}@media (min-width: 2825px) and (max-width: 2850px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 154px !important;}}@media (min-width: 2850px) and (max-width: 2875px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 156px !important;}}@media (min-width: 2875px) and (max-width: 2900px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 157px !important;}}@media (min-width: 2900px) and (max-width: 2925px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 159px !important;}}@media (min-width: 2925px) and (max-width: 2950px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 160px !important;}}@media (min-width: 2950px) and (max-width: 2975px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 162px !important;}}@media (min-width: 2975px) and (max-width: 3000px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 163px !important;}}@media (min-width: 3000px) and (max-width: 3025px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 165px !important;}}@media (min-width: 3025px) and (max-width: 3050px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 166px !important;}}@media (min-width: 3050px) and (max-width: 3075px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 167px !important;}}@media (min-width: 3075px) and (max-width: 3100px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 168px !important;}}@media (min-width: 3100px) and (max-width: 3125px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 165px !important;}}@media (min-width: 3125px) and (max-width: 3150px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 166px !important;}}@media (min-width: 3150px) and (max-width: 3175px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 167px !important;}}@media (min-width: 3175px) and (max-width: 3200px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 168px !important;}}@media (min-width: 3200px) and (max-width: 3225px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 170px !important;}}@media (min-width: 3225px) and (max-width: 3250px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 171px !important;}}@media (min-width: 3250px) and (max-width: 3275px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 173px !important;}}@media (min-width: 3275px) and (max-width: 3300px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 174px !important;}}@media (min-width: 3300px) and (max-width: 3325px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 176px !important;}}@media (min-width: 3325px) and (max-width: 3350px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 177px !important;}}@media (min-width: 3350px) and (max-width: 3375px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 179px !important;}}@media (min-width: 3375px) and (max-width: 3400px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 180px !important;}}@media (min-width: 3400px) and (max-width: 3425px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 182px !important;}}@media (min-width: 3425px) and (max-width: 3450px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 183px !important;}}@media (min-width: 3450px) and (max-width: 3475px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 185px !important;}}@media (min-width: 3475px) and (max-width: 3500px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 186px !important;}}@media (min-width: 3500px) and (max-width: 3525px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 188px !important;}}@media (min-width: 3525px) and (max-width: 3550px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 187px !important;}}@media (min-width: 3550px) and (max-width: 3575px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 189px !important;}}@media (min-width: 3575px) and (max-width: 3600px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 190px !important;}}@media (min-width: 3600px) and (max-width: 3625px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 192px !important;}}@media (min-width: 3625px) and (max-width: 3650px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 193px !important;}}@media (min-width: 3650px) and (max-width: 3675px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 195px !important;}}@media (min-width: 3675px) and (max-width: 3700px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 196px !important;}}@media (min-width: 3700px) and (max-width: 3825px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 198px !important;}}@media (min-width: 3725px) and (max-width: 3850px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 199px !important;}}@media (min-width: 3750px) and (max-width: 3875px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 200px !important;}}@media (min-width: 3775px) and (max-width: 3800px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 201px !important;}}@media (min-width: 3800px) and (max-width: 3825px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 203px !important;}}@media (min-width: 3825px) and (max-width: 3850px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 204px !important;}}@media (min-width: 3850px) and (max-width: 3875px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 205px !important;}}@media (min-width: 3875px) and (max-width: 3900px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 206px !important;}}@media (min-width: 3900px) and (max-width: 3925px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 208px !important;}}@media (min-width: 3925px) and (max-width: 3950px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 209px !important;}}@media (min-width: 3950px) and (max-width: 3975px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 211px !important;}}@media (min-width: 3975px) and (max-width: 4000px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 212px !important;}}@media (min-width: 4000px) and (max-width: 4050px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 213px !important;}}@media (min-width: 4050px) and (max-width: 4100px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 216px !important;}}@media (min-width: 4100px) and (max-width: 4150px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 219px !important;}}@media (min-width: 4150px) and (max-width: 4200px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 222px !important;}}@media (min-width: 4200px) and (max-width: 4250px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 225px !important;}}@media (min-width: 4250px) and (max-width: 4300px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 228px !important;}}@media (min-width: 4300px) and (max-width: 4350px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 231px !important;}}@media (min-width: 4350px) and (max-width: 4400px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 234px !important;}}@media (min-width: 4400px) and (max-width: 4450px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 237px !important;}}@media (min-width: 4450px) and (max-width: 4500px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 240px !important;}}@media (min-width: 4500px) and (max-width: 4550px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 243px !important;}}@media (min-width: 4550px) and (max-width: 4600px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 246px !important;}}@media (min-width: 4600px) and (max-width: 4650px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 249px !important;}}@media (min-width: 4650px) and (max-width: 4700px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 252px !important;}}@media (min-width: 4700px) and (max-width: 4750px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 254px !important;}}@media (min-width: 4750px) and (max-width: 4800px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 254px !important;}}@media (min-width: 4800px) and (max-width: 4850px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 254px !important;}}@media (min-width: 4850px) and (max-width: 4900px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 256px !important;}}@media (min-width: 4900px) and (max-width: 4950px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 258px !important;}}@media (min-width: 4950px) and (max-width: 5000px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 260px !important;}}@media (min-width: 5000px) and (max-width: 5050px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 262px !important;}}@media (min-width: 5050px) and (max-width: 5100px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 264px !important;}}@media (min-width: 5100px) and (max-width: 5150px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 266px !important;}}@media (min-width: 5150px) and (max-width: 5200px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 269px !important;}}@media (min-width: 5200px) and (max-width: 5300px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 272px !important;}}@media (min-width: 5300px) and (max-width: 5400px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 282px !important;}}@media (min-width: 5400px) and (max-width: 5500px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 286px !important;}}@media (min-width: 5500px) and (max-width: 5600px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 290px !important;}}@media (min-width: 5600px) and (max-width: 5700px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 294px !important;}}@media (min-width: 5700px) and (max-width: 5800px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 300px !important;}}@media (min-width: 5800px) and (max-width: 5900px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 305px !important;}}@media (min-width: 5900px) and (max-width: 6000px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 310px !important;}}@media (min-width: 6000px) and (max-width: 6100px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 315px !important;}}@media (min-width: 6100px) and (max-width: 6200px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 320px !important;}}@media (min-width: 6200px) and (max-width: 6300px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 325px !important;}}@media (min-width: 6300px) and (max-width: 6400px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 330px !important;}}@media (min-width: 6400px) and (max-width: 6500px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 335px !important;}}@media (min-width: 6500px) and (max-width: 6700px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 340px !important;}}@media (min-width: 6700px) and (max-width: 6800px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 345px !important;}}@media (min-width: 6800px) and (max-width: 6900px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 350px !important;}}@media (min-width: 6900px) and (max-width: 7000px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 355px !important;}}@media (min-width: 7000px) and (max-width: 7500px){.promate_products{flex: 0 0 17.666667% !important; max-width: 56.666667% !important; padding-left: 380px !important;}}

/* /ebs_website_extended/static/src/css/roboto.css */
@font-face{font-family: 'Roboto-Black'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-Black.woff'); font-weight: 900; font-style: normal; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-BoldItalic.woff'); font-weight: bold; font-style: italic; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-BlackItalic.woff'); font-weight: 900; font-style: italic; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-Bold.woff'); font-weight: bold; font-style: normal; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-Medium.woff'); font-weight: 500; font-style: normal; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-Italic.woff'); font-weight: normal; font-style: italic; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-MediumItalic.woff'); font-weight: 500; font-style: italic; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-LightItalic.woff'); font-weight: 300; font-style: italic; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-Light.woff'); font-weight: 300; font-style: normal; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-Regular.woff'); font-weight: normal; font-style: normal; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-Thin.woff'); font-weight: 100; font-style: normal; font-display: swap;}@font-face{font-family: 'Roboto'; src: url('/ebs_website_extended/static/src/font/roboto/Roboto-ThinItalic.woff'); font-weight: 100; font-style: italic; font-display: swap;}

/* /ebs_website_extended/static/src/css/country_selection.css */
.vodiapicker{display: none;}#a{padding-left: 0px;}#a img, .btn-select img{width: 18px; margin-left: 9px;}#a li{list-style: none; padding-top: 5px; padding-bottom: 5px; margin: 10px 0px 10px 0px !important;}#a li:hover{background-color: #F4F3F3;}#a li img{margin-left: 15px;;}#a li span, .btn-select li span{margin-left: 17px;}.b{position: absolute; background: white; display: none; width: 100%; max-height:400px; overflow:auto; z-index:111; max-width: 500px; box-shadow: 0 6px 12px rgba(0,0,0,.175); border: 1px solid rgba(0,0,0,.15); border-radius: 5px;}.open{display: show !important;}.o_register_form button .promate_btn.btn-select{width:100% !important;}.promate_btn.btn-select{border-radius: 5px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100% !important; max-width: 350px; height: 41px; color: #9b9b9b !important; padding: 0px !important; background-color: #fff; border: 1px solid #9b9b9b; font-family: 'Roboto', sans-serif !important; fonr-size:300!important; font-size: 19px !important;}.btn-select li{list-style: none; float: left; padding-bottom: 0px;}.btn-select:hover li{margin-left: 0px;}.btn-select:hover{border: 1px solid transparent; box-shadow: inset 0 0px 0px 1px #ccc;}.btn-select:focus{outline:none;}.lang-select{}

/* /ebs_website_extended/static/src/css/responsive.css */
@media(max-width: 576px){.contact_information_contain div{padding:0px !important; margin-bottom: 0.5rem;}}

/* /ebs_website_extended/static/src/css/product_detail_responsive.css */
#product_detail{margin-left: 260px; width: 83%;}@media (min-width: 993px) and (max-width: 1000px){#product_detail{margin-left: 21px; width: 97%}}@media (min-width: 1000px) and (max-width: 1010px){#product_detail{margin-left: 22px; width: 97%}}@media (min-width: 1010px) and (max-width: 1020px){#product_detail{margin-left: 28px; width: 97%}}@media (min-width: 1020px) and (max-width: 1030px){#product_detail{margin-left: 32px; width: 97%}}@media (min-width: 1030px) and (max-width: 1040px){#product_detail{margin-left: 38px; width: 96%}}@media (min-width: 1040px) and (max-width: 1050px){#product_detail{margin-left: 44px; width: 95%}}@media (min-width: 1050px) and (max-width: 1060px){#product_detail{margin-left: 50px; width: 94%}}@media (min-width: 1060px) and (max-width: 1070px){#product_detail{margin-left: 56px; width: 93%}}@media (min-width: 1070px) and (max-width: 1080px){#product_detail{margin-left: 62px; width: 93%;}}@media (min-width: 1080px) and (max-width: 1090px){#product_detail{margin-left: 68px; width: 92%}}@media (min-width: 1090px) and (max-width: 1100px){#product_detail{margin-left: 74px; width: 92%}}@media (min-width: 1100px) and (max-width: 1110px){#product_detail{margin-left: 77px; width: 92%}}@media (min-width: 1111px) and (max-width: 1120px){#product_detail{margin-left: 82px; width: 91%}}@media (min-width: 1121px) and (max-width: 1130px){#product_detail{margin-left: 87px; width: 91%}}@media (min-width: 1131px) and (max-width: 1140px){#product_detail{margin-left: 92px; width: 90%}}@media (min-width: 1141px) and (max-width: 1150px){#product_detail{margin-left: 97px; width: 90%}}@media (min-width: 1151px) and (max-width: 1160px){#product_detail{margin-left: 102px; width: 90%}}@media (min-width: 1161px) and (max-width: 1170px){#product_detail{margin-left: 107px; width: 90%}}@media (min-width: 1171px) and (max-width: 1180px){#product_detail{margin-left: 112px; width: 90%}}@media (min-width: 1181px) and (max-width: 1190px){#product_detail{margin-left: 117px; width: 89%}}@media (min-width: 1191px) and (max-width: 1200px){#product_detail{margin-left: 122px; width: 89%}}@media (min-width: 1200px) and (max-width: 1210px){#product_detail{margin-left: 33px; width: 97%}}@media (min-width: 1211px) and (max-width: 1220px){#product_detail{margin-left: 37px; width: 96%}}@media (min-width: 1221px) and (max-width: 1230px){#product_detail{margin-left: 42px; width: 96%}}@media (min-width: 1231px) and (max-width: 1240px){#product_detail{margin-left: 47px; width: 96%}}@media (min-width: 1241px) and (max-width: 1250px){#product_detail{margin-left: 52px; width: 95%}}@media (min-width: 1251px) and (max-width: 1260px){#product_detail{margin-left: 57px; width: 95%}}@media (min-width: 1261px) and (max-width: 1270px){#product_detail{margin-left: 62px; width: 94%}}@media (min-width: 1271px) and (max-width: 1280px){#product_detail{margin-left: 67px; width: 94%}}@media (min-width: 1281px) and (max-width: 1290px){#product_detail{margin-left: 72px; width: 94%}}@media (min-width: 1291px) and (max-width: 1300px){#product_detail{margin-left: 77px; width: 93%}}@media (min-width: 1311px) and (max-width: 1320px){#product_detail{margin-left: 82px; width: 93%}}@media (min-width: 1321px) and (max-width: 1330px){#product_detail{margin-left: 87px; width: 93%}}@media (min-width: 1331px) and (max-width: 1340px){#product_detail{margin-left: 92px; width: 93%}}@media (min-width: 1341px) and (max-width: 1350px){#product_detail{margin-left: 97px; width: 92%}}@media (min-width: 1351px) and (max-width: 1360px){#product_detail{margin-left: 103px; width: 92%}}@media (min-width: 1361px) and (max-width: 1370px){#product_detail{margin-left: 108px; width: 92%}}@media (min-width: 1371px) and (max-width: 1380px){#product_detail{margin-left: 113px; width: 91%}}@media (min-width: 1381px) and (max-width: 1390px){#product_detail{margin-left: 118px; width: 91%}}@media (min-width: 1391px) and (max-width: 1400px){#product_detail{margin-left: 123px; width: 91%}}@media (min-width: 1400px) and (max-width: 1410px){#product_detail{margin-left: 128px; width: 91%}}@media (min-width: 1411px) and (max-width: 1420px){#product_detail{margin-left: 132px; width: 90%}}@media (min-width: 1421px) and (max-width: 1430px){#product_detail{margin-left: 137px; width: 90%}}@media (min-width: 1431px) and (max-width: 1440px){#product_detail{margin-left: 142px; width: 90%}}@media (min-width: 1441px) and (max-width: 1450px){#product_detail{margin-left: 147px; width: 89%}}@media (min-width: 1451px) and (max-width: 1460px){#product_detail{margin-left: 152px; width: 89%}}@media (min-width: 1461px) and (max-width: 1470px){#product_detail{margin-left: 157px; width: 89%}}@media (min-width: 1471px) and (max-width: 1480px){#product_detail{margin-left: 162px; width: 89%}}@media (min-width: 1481px) and (max-width: 1490px){#product_detail{margin-left: 167px; width: 88%}}@media (min-width: 1491px) and (max-width: 1500px){#product_detail{margin-left: 172px; width: 88%}}@media (min-width: 1500px) and (max-width: 1510px){#product_detail{margin-left: 177px; width: 88%}}@media (min-width: 1511px) and (max-width: 1520px){#product_detail{margin-left: 182px; width: 87%}}@media (min-width: 1521px) and (max-width: 1530px){#product_detail{margin-left: 187px; width: 87%}}@media (min-width: 1531px) and (max-width: 1540px){#product_detail{margin-left: 192px; width: 87%}}@media (min-width: 1541px) and (max-width: 1550px){#product_detail{margin-left: 197px; width: 87%}}@media (min-width: 1551px) and (max-width: 1560px){#product_detail{margin-left: 202px; width: 87%}}@media (min-width: 1561px) and (max-width: 1570px){#product_detail{margin-left: 207px; width: 86%}}@media (min-width: 1571px) and (max-width: 1580px){#product_detail{margin-left: 212px; width: 86%}}@media (min-width: 1581px) and (max-width: 1590px){#product_detail{margin-left: 217px; width: 86%}}@media (min-width: 1591px) and (max-width: 1600px){#product_detail{margin-left: 222px; width: 86%}}@media (min-width: 1600px) and (max-width: 1610px){#product_detail{margin-left: 227px; width: 86%}}@media (min-width: 1611px) and (max-width: 1620px){#product_detail{margin-left: 232px; width: 85%}}@media (min-width: 1621px) and (max-width: 1630px){#product_detail{margin-left: 237px; width: 85%}}@media (min-width: 1631px) and (max-width: 1640px){#product_detail{margin-left: 242px; width: 85%}}@media (min-width: 1641px) and (max-width: 1650px){#product_detail{margin-left: 247px; width: 84%}}@media (min-width: 1651px) and (max-width: 1660px){#product_detail{margin-left: 252px; width: 84%}}@media (min-width: 1661px) and (max-width: 1670px){#product_detail{margin-left: 257px; width: 84%}}@media (min-width: 1671px) and (max-width: 1680px){#product_detail{margin-left: 262px; width: 84%}}@media (min-width: 1681px) and (max-width: 1690px){#product_detail{margin-left: 267px; width: 84%}}@media (min-width: 1691px) and (max-width: 1700px){#product_detail{margin-left: 272px; width: 83%}}@media (min-width: 1700px) and (max-width: 1710px){#product_detail{margin-left: 277px; width: 83%}}@media (min-width: 1711px) and (max-width: 1720px){#product_detail{margin-left: 282px; width: 83%}}@media (min-width: 1721px) and (max-width: 1730px){#product_detail{margin-left: 287px; width: 83%}}@media (min-width: 1731px) and (max-width: 1740px){#product_detail{margin-left: 292px; width: 83%}}@media (min-width: 1741px) and (max-width: 1750px){#product_detail{margin-left: 297px; width: 82%}}@media (min-width: 1751px) and (max-width: 1760px){#product_detail{margin-left: 302px; width: 82%%}}@media (min-width: 1761px) and (max-width: 1770px){#product_detail{margin-left: 307px; width: 82%}}@media (min-width: 1771px) and (max-width: 1780px){#product_detail{margin-left: 312px; width: 82%}}@media (min-width: 1781px) and (max-width: 1790px){#product_detail{margin-left: 317px; width: 82%%}}@media (min-width: 1791px) and (max-width: 1800px){#product_detail{margin-left: 322px; width: 82%}}@media (min-width: 1800px) and (max-width: 1825px){#product_detail{margin-left: 102px !important; width: 94% !important;}}@media (min-width: 1825px) and (max-width: 1850px){#product_detail{margin-left: 103px !important; width: 94% !important;}}@media (min-width: 1850px) and (max-width: 1875px){#product_detail{margin-left: 103px !important; width: 94% !important;}}@media (min-width: 1875px) and (max-width: 1900px){#product_detail{margin-left: 103px !important; width: 94% !important;}}@media (min-width: 1900px) and (max-width: 1925px){#product_detail{margin-left: 103px !important; width: 94% !important;}}@media (min-width: 1925px) and (max-width: 1950px){#product_detail{margin-left: 103px !important; width: 94% !important;}}@media (min-width: 1950px) and (max-width: 1975px){#product_detail{margin-left: 104px !important; width: 94% !important;}}@media (min-width: 1975px) and (max-width: 2000px){#product_detail{margin-left: 103px !important; width: 94% !important;}}@media (min-width: 2000px) and (max-width: 2025px){#product_detail{margin-left: 115px; width: 94% !important;}}@media (min-width: 2025px) and (max-width: 2050px){#product_detail{margin-left: 115px; width: 93% !important;}}@media (min-width: 2050px) and (max-width: 2075px){#product_detail{margin-left: 116px; width: 93% !important;}}@media (min-width: 2075px) and (max-width: 2100px){#product_detail{margin-left: 117px; width: 93% !important;}}@media (min-width: 2100px) and (max-width: 2125px){#product_detail{margin-left: 120px; width: 93% !important;}}@media (min-width: 2125px) and (max-width: 2150px){#product_detail{margin-left: 121px; width: 93% !important;}}@media (min-width: 2150px) and (max-width: 2175px){#product_detail{margin-left: 122px; width: 93% !important;}}@media (min-width: 2175px) and (max-width: 2200px){#product_detail{margin-left: 123px; width: 93% !important;}}@media (min-width: 2200px) and (max-width: 2225px){#product_detail{margin-left: 124px; width: 93% !important;}}@media (min-width: 2225px) and (max-width: 2250px){#product_detail{margin-left: 125px; width: 93% !important;}}@media (min-width: 2250px) and (max-width: 2275px){#product_detail{margin-left: 126px; width: 93% !important;}}@media (min-width: 2275px) and (max-width: 2300px){#product_detail{margin-left: 127px; width: 93% !important;}}@media (min-width: 2300px) and (max-width: 2325px){#product_detail{margin-left: 128px; width: 93% !important;}}@media (min-width: 2325px) and (max-width: 2350px){#product_detail{margin-left: 129px; width: 93% !important;}}@media (min-width: 2350px) and (max-width: 2375px){#product_detail{margin-left: 130px; width: 93% !important;}}@media (min-width: 2375px) and (max-width: 2400px){#product_detail{margin-left: 131px; width: 93% !important;}}@media (min-width: 2400px) and (max-width: 2425px){#product_detail{margin-left: 132px; width: 93% !important;}}@media (min-width: 2425px) and (max-width: 2450px){#product_detail{margin-left: 133px; width: 93% !important;}}@media (min-width: 2450px) and (max-width: 2475px){#product_detail{margin-left: 134px; width: 93% !important;}}@media (min-width: 2475px) and (max-width: 2500px){#product_detail{margin-left: 135px; width: 93% !important;}}@media (min-width: 2500px) and (max-width: 2525px){#product_detail{margin-left: 142px; width: 93% !important;}}@media (min-width: 2525px) and (max-width: 2550px){#product_detail{margin-left: 143px; width: 93% !important;}}@media (min-width: 2550px) and (max-width: 2575px){#product_detail{margin-left: 144px; width: 93% !important;}}@media (min-width: 2575px) and (max-width: 2600px){#product_detail{margin-left: 145px; width: 93% !important;}}@media (min-width: 2600px) and (max-width: 2625px){#product_detail{margin-left: 146px; width: 93% !important;}}@media (min-width: 2625px) and (max-width: 2650px){#product_detail{margin-left: 147px; width: 93% !important;}}@media (min-width: 2650px) and (max-width: 2675px){#product_detail{margin-left: 148px; width: 93% !important;}}@media (min-width: 2675px) and (max-width: 2700px){#product_detail{margin-left: 149px; width: 93% !important;}}@media (min-width: 2700px) and (max-width: 2725px){#product_detail{margin-left: 152px; width: 93% !important;}}@media (min-width: 2725px) and (max-width: 2750px){#product_detail{margin-left: 153px; width: 93% !important;}}@media (min-width: 2750px) and (max-width: 2775px){#product_detail{margin-left: 154px; width: 93% !important;}}@media (min-width: 2775px) and (max-width: 2800px){#product_detail{margin-left: 155px; width: 93% !important;}}@media (min-width: 2800px) and (max-width: 2825px){#product_detail{margin-left: 156px; width: 93% !important;}}@media (min-width: 2825px) and (max-width: 2850px){#product_detail{margin-left: 157px; width: 93% !important;}}@media (min-width: 2850px) and (max-width: 2875px){#product_detail{margin-left: 158px; width: 93% !important;}}@media (min-width: 2875px) and (max-width: 2900px){#product_detail{margin-left: 159px; width: 93% !important;}}@media (min-width: 2900px) and (max-width: 2925px){#product_detail{margin-left: 161px; width: 93% !important;}}@media (min-width: 2925px) and (max-width: 2950px){#product_detail{margin-left: 162px; width: 93% !important;}}@media (min-width: 2950px) and (max-width: 2975px){#product_detail{margin-left: 163px; width: 93% !important;}}@media (min-width: 2975px) and (max-width: 3000px){#product_detail{margin-left: 164px; width: 93% !important;}}@media (min-width: 3000px) and (max-width: 3025px){#product_detail{margin-left: 165px; width: 93% !important;}}@media (min-width: 3025px) and (max-width: 3050px){#product_detail{margin-left: 166px; width: 93% !important;}}@media (min-width: 3050px) and (max-width: 3075px){#product_detail{margin-left: 167px; width: 93% !important;}}@media (min-width: 3075px) and (max-width: 3100px){#product_detail{margin-left: 168px; width: 93% !important;}}@media (min-width: 3100px) and (max-width: 3125px){#product_detail{margin-left: 171px; width: 93% !important;}}@media (min-width: 3125px) and (max-width: 3150px){#product_detail{margin-left: 172px; width: 93% !important;}}@media (min-width: 3150px) and (max-width: 3175px){#product_detail{margin-left: 173px; width: 93% !important;}}@media (min-width: 3175px) and (max-width: 3200px){#product_detail{margin-left: 174px; width: 93% !important;}}@media (min-width: 3200px) and (max-width: 3225px){#product_detail{margin-left: 175px; width: 94% !important;}}@media (min-width: 3225px) and (max-width: 3250px){#product_detail{margin-left: 176px; width: 94% !important;}}@media (min-width: 3250px) and (max-width: 3275px){#product_detail{margin-left: 177px; width: 94% !important;}}@media (min-width: 3275px) and (max-width: 3300px){#product_detail{margin-left: 178px; width: 94% !important;}}@media (min-width: 3300px) and (max-width: 3325px){#product_detail{margin-left: 181px; width: 94% !important;}}@media (min-width: 3325px) and (max-width: 3350px){#product_detail{margin-left: 182px; width: 94% !important;}}@media (min-width: 3350px) and (max-width: 3375px){#product_detail{margin-left: 183px; width: 94% !important;}}@media (min-width: 3375px) and (max-width: 3400px){#product_detail{margin-left: 184px; width: 93% !important;}}@media (min-width: 3400px) and (max-width: 3425px){#product_detail{margin-left: 185px; width: 94% !important;}}@media (min-width: 3425px) and (max-width: 3450px){#product_detail{margin-left: 186px; width: 94% !important;}}@media (min-width: 3450px) and (max-width: 3475px){#product_detail{margin-left: 187px; width: 94% !important;}}@media (min-width: 3475px) and (max-width: 3500px){#product_detail{margin-left: 188px; width: 94% !important;}}@media (min-width: 3500px) and (max-width: 3525px){#product_detail{margin-left: 190px; width: 94% !important;}}@media (min-width: 3525px) and (max-width: 3550px){#product_detail{margin-left: 191px; width: 94% !important;}}@media (min-width: 3550px) and (max-width: 3575px){#product_detail{margin-left: 192px; width: 94% !important;}}@media (min-width: 3575px) and (max-width: 3600px){#product_detail{margin-left: 188px; width: 94% !important;}}@media (min-width: 3600px) and (max-width: 3625px){#product_detail{margin-left: 193px; width: 94% !important;}}@media (min-width: 3625px) and (max-width: 3650px){#product_detail{margin-left: 194px; width: 94% !important;}}@media (min-width: 3650px) and (max-width: 3675px){#product_detail{margin-left: 196px; width: 94% !important;}}@media (min-width: 3675px) and (max-width: 3700px){#product_detail{margin-left: 197px; width: 94% !important;}}@media (min-width: 3700px) and (max-width: 3825px){#product_detail{margin-left: 198px; width: 94% !important;}}@media (min-width: 3725px) and (max-width: 3850px){#product_detail{margin-left: 199px; width: 94% !important;}}@media (min-width: 3750px) and (max-width: 3875px){#product_detail{margin-left: 200px; width: 94% !important;}}@media (min-width: 3775px) and (max-width: 3800px){#product_detail{margin-left: 201px; width: 94% !important;}}@media (min-width: 3800px) and (max-width: 3825px){#product_detail{margin-left: 202px; width: 94% !important;}}@media (min-width: 3825px) and (max-width: 3850px){#product_detail{margin-left: 203px; width: 94% !important;}}@media (min-width: 3850px) and (max-width: 3875px){#product_detail{margin-left: 204px; width: 94% !important;}}@media (min-width: 3875px) and (max-width: 3900px){#product_detail{margin-left: 205px; width: 94% !important;}}@media (min-width: 3900px) and (max-width: 3925px){#product_detail{margin-left: 206px; width: 94% !important;}}@media (min-width: 3925px) and (max-width: 3950px){#product_detail{margin-left: 207px; width: 94% !important;}}@media (min-width: 3950px) and (max-width: 3975px){#product_detail{margin-left: 208px; width: 94% !important;}}@media (min-width: 3975px) and (max-width: 4000px){#product_detail{margin-left: 209px; width: 94% !important;}}@media (min-width: 4000px) and (max-width: 4050px){#product_detail{margin-left: 209px; width: 94% !important;}}@media (min-width: 4050px) and (max-width: 4100px){#product_detail{margin-left: 211px; width: 94% !important;}}@media (min-width: 4100px) and (max-width: 4150px){#product_detail{margin-left: 212px; width: 94% !important;}}@media (min-width: 4150px) and (max-width: 4200px){#product_detail{margin-left: 213px; width: 94% !important;}}@media (min-width: 4200px) and (max-width: 4250px){#product_detail{margin-left: 214px; width: 94% !important;}}@media (min-width: 4250px) and (max-width: 4300px){#product_detail{margin-left: 216px; width: 94% !important;}}@media (min-width: 4300px) and (max-width: 4350px){#product_detail{margin-left: 217px; width: 94% !important;}}@media (min-width: 4350px) and (max-width: 4400px){#product_detail{margin-left: 218px; width: 94% !important;}}@media (min-width: 4400px) and (max-width: 4450px){#product_detail{margin-left: 219px; width: 94% !important;}}@media (min-width: 4450px) and (max-width: 4500px){#product_detail{margin-left: 221px; width: 94% !important;}}@media (min-width: 4500px) and (max-width: 4550px){#product_detail{margin-left: 222px; width: 94% !important;}}@media (min-width: 4550px) and (max-width: 4600px){#product_detail{margin-left: 223px; width: 94% !important;}}@media (min-width: 4600px) and (max-width: 4650px){#product_detail{margin-left: 240px; width: 94% !important;}}@media (min-width: 4650px) and (max-width: 4700px){#product_detail{margin-left: 242px; width: 94% !important;}}@media (min-width: 4700px) and (max-width: 4750px){#product_detail{margin-left: 244px; width: 94% !important;}}@media (min-width: 4750px) and (max-width: 4800px){#product_detail{margin-left: 246px; width: 94% !important;}}@media (min-width: 4800px) and (max-width: 4850px){#product_detail{margin-left: 248px; width: 94% !important;}}@media (min-width: 4850px) and (max-width: 4900px){#product_detail{margin-left: 250px; width: 94% !important;}}@media (min-width: 4900px) and (max-width: 4950px){#product_detail{margin-left: 252px; width: 94% !important;}}@media (min-width: 4950px) and (max-width: 5000px){#product_detail{margin-left: 254px; width: 94% !important;}}@media (min-width: 5000px) and (max-width: 5050px){#product_detail{margin-left: 258px; width: 94% !important;}}@media (min-width: 5050px) and (max-width: 5100px){#product_detail{margin-left: 262px; width: 94% !important;}}@media (min-width: 5100px) and (max-width: 5150px){#product_detail{margin-left: 266px; width: 94% !important;}}@media (min-width: 5150px) and (max-width: 5200px){#product_detail{margin-left: 270px; width: 94% !important;}}@media (min-width: 5200px) and (max-width: 5300px){#product_detail{margin-left: 274px; width: 94% !important;}}@media (min-width: 5300px) and (max-width: 5400px){#product_detail{margin-left: 278px; width: 94% !important;}}@media (min-width: 5400px) and (max-width: 5500px){#product_detail{margin-left: 282px; width: 94% !important;}}@media (min-width: 5500px) and (max-width: 5600px){#product_detail{margin-left: 286px; width: 94% !important;}}@media (min-width: 5600px) and (max-width: 5700px){#product_detail{margin-left: 290px; width: 94% !important;}}@media (min-width: 5700px) and (max-width: 5800px){#product_detail{margin-left: 294px; width: 94% !important;}}@media (min-width: 5800px) and (max-width: 5900px){#product_detail{margin-left: 296px; width: 94% !important;}}@media (min-width: 5900px) and (max-width: 6000px){#product_detail{margin-left: 300px; width: 94% !important;}}@media (min-width: 6000px) and (max-width: 6100px){#product_detail{margin-left: 304px; width: 94% !important;}}@media (min-width: 6100px) and (max-width: 6200px){#product_detail{margin-left: 308px; width: 94% !important;}}@media (min-width: 6200px) and (max-width: 6300px){#product_detail{margin-left: 312px; width: 94% !important;}}@media (min-width: 6300px) and (max-width: 6400px){#product_detail{margin-left: 316px; width: 94% !important;}}@media (min-width: 6400px) and (max-width: 6500px){#product_detail{margin-left: 320px; width: 94% !important;}}@media (min-width: 6500px) and (max-width: 6700px){#product_detail{margin-left: 326px; width: 94% !important;}}@media (min-width: 6700px) and (max-width: 6800px){#product_detail{margin-left: 332px; width: 94% !important;}}@media (min-width: 6800px) and (max-width: 6900px){#product_detail{margin-left: 338px; width: 94% !important;}}@media (min-width: 6900px) and (max-width: 7000px){#product_detail{margin-left: 344px; width: 94% !important;}}@media (min-width: 7000px) and (max-width: 7500px){#product_detail{margin-left: 370px; width: 94% !important;}}

/* /ebs_website_extended/static/src/css/bootstrap-select-country.min.css */
.f16 .flag{display:inline-block;height:16px;width:16px;vertical-align:text-top;line-height:16px;background:url(/ebs_website_extended/static/src/css/images/flags16.png) no-repeat}.f16 ._African_Union{background-position:0 -16px}.f16 ._Arab_League{background-position:0 -32px}.f16 ._ASEAN{background-position:0 -48px}.f16 ._CARICOM{background-position:0 -64px}.f16 ._CIS{background-position:0 -80px}.f16 ._Commonwealth{background-position:0 -96px}.f16 ._England{background-position:0 -112px}.f16 ._European_Union,.f16 .eu{background-position:0 -128px}.f16 ._Islamic_Conference{background-position:0 -144px}.f16 ._Kosovo{background-position:0 -160px}.f16 ._NATO{background-position:0 -176px}.f16 ._Northern_Cyprus{background-position:0 -192px}.f16 ._Northern_Ireland{background-position:0 -208px}.f16 ._Olimpic_Movement{background-position:0 -224px}.f16 ._OPEC{background-position:0 -240px}.f16 ._Red_Cross{background-position:0 -256px}.f16 ._Scotland{background-position:0 -272px}.f16 ._Somaliland{background-position:0 -288px}.f16 ._Tibet{background-position:0 -304px}.f16 ._United_Nations{background-position:0 -320px}.f16 ._Wales{background-position:0 -336px}.f16 .ad{background-position:0 -352px}.f16 .ae{background-position:0 -368px}.f16 .af{background-position:0 -384px}.f16 .ag{background-position:0 -400px}.f16 .ai{background-position:0 -416px}.f16 .al{background-position:0 -432px}.f16 .am{background-position:0 -448px}.f16 .ao{background-position:0 -464px}.f16 .aq{background-position:0 -480px}.f16 .ar{background-position:0 -496px}.f16 .as{background-position:0 -512px}.f16 .at{background-position:0 -528px}.f16 .au{background-position:0 -544px}.f16 .aw{background-position:0 -560px}.f16 .ax{background-position:0 -576px}.f16 .az{background-position:0 -592px}.f16 .ba{background-position:0 -608px}.f16 .bb{background-position:0 -624px}.f16 .bd{background-position:0 -640px}.f16 .be{background-position:0 -656px}.f16 .bf{background-position:0 -672px}.f16 .bg{background-position:0 -688px}.f16 .bh{background-position:0 -704px}.f16 .bi{background-position:0 -720px}.f16 .bj{background-position:0 -736px}.f16 .bm{background-position:0 -752px}.f16 .bn{background-position:0 -768px}.f16 .bo{background-position:0 -784px}.f16 .br{background-position:0 -800px}.f16 .bs{background-position:0 -816px}.f16 .bt{background-position:0 -832px}.f16 .bw{background-position:0 -848px}.f16 .by{background-position:0 -864px}.f16 .bz{background-position:0 -880px}.f16 .ca{background-position:0 -896px}.f16 .cg{background-position:0 -912px}.f16 .cf{background-position:0 -928px}.f16 .cd{background-position:0 -944px}.f16 .ch{background-position:0 -960px}.f16 .ci{background-position:0 -976px}.f16 .ck{background-position:0 -992px}.f16 .cl{background-position:0 -1008px}.f16 .cm{background-position:0 -1024px}.f16 .cn{background-position:0 -1040px}.f16 .co{background-position:0 -1056px}.f16 .cr{background-position:0 -1072px}.f16 .cu{background-position:0 -1088px}.f16 .cv{background-position:0 -1104px}.f16 .cy{background-position:0 -1120px}.f16 .cz{background-position:0 -1136px}.f16 .de{background-position:0 -1152px}.f16 .dj{background-position:0 -1168px}.f16 .dk{background-position:0 -1184px}.f16 .dm{background-position:0 -1200px}.f16 .do{background-position:0 -1216px}.f16 .dz{background-position:0 -1232px}.f16 .ec{background-position:0 -1248px}.f16 .ee{background-position:0 -1264px}.f16 .eg{background-position:0 -1280px}.f16 .eh{background-position:0 -1296px}.f16 .er{background-position:0 -1312px}.f16 .es{background-position:0 -1328px}.f16 .et{background-position:0 -1344px}.f16 .fi{background-position:0 -1360px}.f16 .fj{background-position:0 -1376px}.f16 .fm{background-position:0 -1392px}.f16 .fo{background-position:0 -1408px}.f16 .fr{background-position:0 -1424px}.f16 .bl,.f16 .cp,.f16 .mf,.f16 .yt{background-position:0 -1424px}.f16 .ga{background-position:0 -1440px}.f16 .gb{background-position:0 -1456px}.f16 .sh{background-position:0 -1456px}.f16 .gd{background-position:0 -1472px}.f16 .ge{background-position:0 -1488px}.f16 .gg{background-position:0 -1504px}.f16 .gh{background-position:0 -1520px}.f16 .gi{background-position:0 -1536px}.f16 .gl{background-position:0 -1552px}.f16 .gm{background-position:0 -1568px}.f16 .gn{background-position:0 -1584px}.f16 .gp{background-position:0 -1600px}.f16 .gq{background-position:0 -1616px}.f16 .gr{background-position:0 -1632px}.f16 .gt{background-position:0 -1648px}.f16 .gu{background-position:0 -1664px}.f16 .gw{background-position:0 -1680px}.f16 .gy{background-position:0 -1696px}.f16 .hk{background-position:0 -1712px}.f16 .hn{background-position:0 -1728px}.f16 .hr{background-position:0 -1744px}.f16 .ht{background-position:0 -1760px}.f16 .hu{background-position:0 -1776px}.f16 .id{background-position:0 -1792px}.f16 .mc{background-position:0 -1792px}.f16 .ie{background-position:0 -1808px}.f16 .il{background-position:0 -1824px}.f16 .im{background-position:0 -1840px}.f16 .in{background-position:0 -1856px}.f16 .iq{background-position:0 -1872px}.f16 .ir{background-position:0 -1888px}.f16 .is{background-position:0 -1904px}.f16 .it{background-position:0 -1920px}.f16 .je{background-position:0 -1936px}.f16 .jm{background-position:0 -1952px}.f16 .jo{background-position:0 -1968px}.f16 .jp{background-position:0 -1984px}.f16 .ke{background-position:0 -2000px}.f16 .kg{background-position:0 -2016px}.f16 .kh{background-position:0 -2032px}.f16 .ki{background-position:0 -2048px}.f16 .km{background-position:0 -2064px}.f16 .kn{background-position:0 -2080px}.f16 .kp{background-position:0 -2096px}.f16 .kr{background-position:0 -2112px}.f16 .kw{background-position:0 -2128px}.f16 .ky{background-position:0 -2144px}.f16 .kz{background-position:0 -2160px}.f16 .la{background-position:0 -2176px}.f16 .lb{background-position:0 -2192px}.f16 .lc{background-position:0 -2208px}.f16 .li{background-position:0 -2224px}.f16 .lk{background-position:0 -2240px}.f16 .lr{background-position:0 -2256px}.f16 .ls{background-position:0 -2272px}.f16 .lt{background-position:0 -2288px}.f16 .lu{background-position:0 -2304px}.f16 .lv{background-position:0 -2320px}.f16 .ly{background-position:0 -2336px}.f16 .ma{background-position:0 -2352px}.f16 .md{background-position:0 -2368px}.f16 .me{background-position:0 -2384px}.f16 .mg{background-position:0 -2400px}.f16 .mh{background-position:0 -2416px}.f16 .mk{background-position:0 -2432px}.f16 .ml{background-position:0 -2448px}.f16 .mm{background-position:0 -2464px}.f16 .mn{background-position:0 -2480px}.f16 .mo{background-position:0 -2496px}.f16 .mq{background-position:0 -2512px}.f16 .mr{background-position:0 -2528px}.f16 .ms{background-position:0 -2544px}.f16 .mt{background-position:0 -2560px}.f16 .mu{background-position:0 -2576px}.f16 .mv{background-position:0 -2592px}.f16 .mw{background-position:0 -2608px}.f16 .mx{background-position:0 -2624px}.f16 .my{background-position:0 -2640px}.f16 .mz{background-position:0 -2656px}.f16 .na{background-position:0 -2672px}.f16 .nc{background-position:0 -2688px}.f16 .ne{background-position:0 -2704px}.f16 .ng{background-position:0 -2720px}.f16 .ni{background-position:0 -2736px}.f16 .nl{background-position:0 -2752px}.f16 .bq{background-position:0 -2752px}.f16 .no{background-position:0 -2768px}.f16 .bv,.f16 .nq,.f16 .sj{background-position:0 -2768px}.f16 .np{background-position:0 -2784px}.f16 .nr{background-position:0 -2800px}.f16 .nz{background-position:0 -2816px}.f16 .om{background-position:0 -2832px}.f16 .pa{background-position:0 -2848px}.f16 .pe{background-position:0 -2864px}.f16 .pf{background-position:0 -2880px}.f16 .pg{background-position:0 -2896px}.f16 .ph{background-position:0 -2912px}.f16 .pk{background-position:0 -2928px}.f16 .pl{background-position:0 -2944px}.f16 .pr{background-position:0 -2960px}.f16 .ps{background-position:0 -2976px}.f16 .pt{background-position:0 -2992px}.f16 .pw{background-position:0 -3008px}.f16 .py{background-position:0 -3024px}.f16 .qa{background-position:0 -3040px}.f16 .re{background-position:0 -3056px}.f16 .ro{background-position:0 -3072px}.f16 .rs{background-position:0 -3088px}.f16 .ru{background-position:0 -3104px}.f16 .rw{background-position:0 -3120px}.f16 .sa{background-position:0 -3136px}.f16 .sb{background-position:0 -3152px}.f16 .sc{background-position:0 -3168px}.f16 .sd{background-position:0 -3184px}.f16 .se{background-position:0 -3200px}.f16 .sg{background-position:0 -3216px}.f16 .si{background-position:0 -3232px}.f16 .sk{background-position:0 -3248px}.f16 .sl{background-position:0 -3264px}.f16 .sm{background-position:0 -3280px}.f16 .sn{background-position:0 -3296px}.f16 .so{background-position:0 -3312px}.f16 .sr{background-position:0 -3328px}.f16 .st{background-position:0 -3344px}.f16 .sv{background-position:0 -3360px}.f16 .sy{background-position:0 -3376px}.f16 .sz{background-position:0 -3392px}.f16 .tc{background-position:0 -3408px}.f16 .td{background-position:0 -3424px}.f16 .tg{background-position:0 -3440px}.f16 .th{background-position:0 -3456px}.f16 .tj{background-position:0 -3472px}.f16 .tl{background-position:0 -3488px}.f16 .tm{background-position:0 -3504px}.f16 .tn{background-position:0 -3520px}.f16 .to{background-position:0 -3536px}.f16 .tr{background-position:0 -3552px}.f16 .tt{background-position:0 -3568px}.f16 .tv{background-position:0 -3584px}.f16 .tw{background-position:0 -3600px}.f16 .tz{background-position:0 -3616px}.f16 .ua{background-position:0 -3632px}.f16 .ug{background-position:0 -3648px}.f16 .us{background-position:0 -3664px}.f16 .uy{background-position:0 -3680px}.f16 .uz{background-position:0 -3696px}.f16 .va{background-position:0 -3712px}.f16 .vc{background-position:0 -3728px}.f16 .ve{background-position:0 -3744px}.f16 .vg{background-position:0 -3760px}.f16 .vi{background-position:0 -3776px}.f16 .vn{background-position:0 -3792px}.f16 .vu{background-position:0 -3808px}.f16 .ws{background-position:0 -3824px}.f16 .ye{background-position:0 -3840px}.f16 .za{background-position:0 -3856px}.f16 .zm{background-position:0 -3872px}.f16 .zw{background-position:0 -3888px}.f16 .sx{background-position:0 -3904px}.f16 .cw{background-position:0 -3920px}.f16 .ss{background-position:0 -3936px}.f16 .nu{background-position:0 -3952px}.countrypicker .inline-flag{margin-right:5px}.countrypicker .filter-option.flag{padding-left:20px;margin-top:3px}.countrypicker .dropdown-menu.open{padding:0}

/* /ebs_website_extended/static/src/css/ticker.css */
.grid{display: block; font-size: 0;}.cell{display: inline-block; font-size: 2rem; font-weight: 700; position: relative; width: 100%; text-align: center; cursor: pointer;}.cell .content{display: block; position: relative; padding: 5px; color: #555; box-shadow: 0 2px 10px -10px #ccc;}.cell.w16{width: 16%; width: -webkit-calc(100% / 6); width: calc(100% / 6)}.cell.w25{width: 25%}.cell.w33{width: 33% width: -webkit-calc(100% / 3); width: calc(100% / 3)}.cell.w50{width: 50%}.cell.w66{width: 66%; width: -webkit-calc(100% / (3 / 2)); width: calc(100% / (3 / 2))}.cell.w75{width: 75%}.cell.w83{width: 83%; width: -webkit-calc(100% / (6 / 5)); width: calc(100% / (6 / 5))}.cell.w85{width: 85%; width: -webkit-calc(100% / (6 / 5)); width: calc(100% / (6 / 5))}.cell.w95{width: 98%; width: -webkit-calc(98%); width: calc(98%)}.cell.w100{width: 100%}

/* /hr_job_position/static/src/css/bootstrap.css */
 #hr_recruitment_form{text-align: center; position: relative; margin-top: -10px;}#hr_recruitment_form .action-button{width: auto; background: #b32b39; font-weight: bold; color: white; border: 0 none; padding: 10px 15px; margin: 10px 5px; text-align: center; float: right;}#hr_recruitment_form .action-button:hover, #hr_recruitment_form .action-button:focus{box-shadow: 0 0 0 2px white, 0 0 0 3px #b32b39;}.fs-title{text-align: center; margin-top: 10px; font-size: x-large; font-weight: bold; padding-left: 10%;}.required-label{color: red; font-size: 20px; vertical-align: top;}.required-label-normal{color: red; font-size: 20px;}.fieldlabels{width: 280px; text-align: left; font-size: small;}.job_container{display: block; position: relative; padding-left: 35px; margin-bottom: 12px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}.job_container input{position: absolute; opacity: 0; cursor: pointer; z-index: 11;}.checkmark{position: absolute; top: 0; left: 0; height: 17px; width: 17px; background-color: #eee; border-radius: 50%; z-index: 0;}.job_container:hover input ~ .checkmark{background-color: #ccc;}.job_container input:checked ~ .checkmark{background-color: #b42b39;}.checkmark:after{content: ""; position: absolute; display: none;}.job_container input:checked ~ .checkmark:after{display: block;}.job_container .checkmark:after{top: 5px; left: 5px; width: 7px; height: 7px; border-radius: 50%; background: white;}

/* /sale_timesheet/static/src/scss/sale_timesheet_portal.scss */
.o_timesheet_accordion{.card-header{a{text-decoration: none; &:after{content: "\f0d7"; font-family: 'FontAwesome';}&.collapsed:after{content: "\f0da"; font-family: 'FontAwesome';}}}}

/* /social_push_notifications/static/src/scss/social_push_notifications_frontend.scss */
.o_social_push_notifications_permission_request{bottom: 0; z-index: $zindex-tooltip + 100; @include media-breakpoint-up(sm){top: 0; bottom: auto; // Reach 91px position left compensating the container's padding padding-left: 91px - ($grid-gutter-width * .5); &.o_social_push_notifications_permission_with_menubar{top: $o-navbar-height + 4px;}.o_social_push_notifications_permission_content{max-width: $popover-max-width;}}.close{@include o-position-absolute(0, 0);}.dropdown-toggle:after{display: none;}.o_social_push_notifications_permission_content{min-width: 150px;}}

/* /website_knowledge/static/src/scss/knowledge_public.scss */
.o_knowledge_public_view{--knowledge-article-sidebar-size: 300px; // Header // -------------------------------------------------------------------------- .o_knowledge_header{cursor: default;}h1, h2, h3, h4, h5, h6{transition: background-color 0.5s ease; &.o_knowledge_header_highlight{border-radius: 0.25rem; background-color: rgba($knowledge-bg--active, 0.2);}}.o_view_nocontent_empty_folder:before{@extend %o-nocontent-empty-document;}// Body, cover and icon // -------------------------------------------------------------------------- .o_knowledge_icon:not(.o_full_width), .o_knowledge_article:not(.o_full_width){width: 750px; max-width: 100%; margin-left: auto; margin-right: auto;}.o_knowledge_cover + .o_knowledge_icon{margin-top: -70px;}.o_knowledge_icon{@include font-size(80px);}// = Resizer // -------------------------------------------------------------------------- .o_knowledge_article_form_resizer{// Use '$spacers' measures to match surrounding elements padding $-resizer-spacing: map-get($spacers, 1); $-resizer-line-width: map-get($spacers, 1); @include o-position-absolute(0, auto, 0, $-resizer-spacing * -1); span{@include o-position-absolute(0, auto, 0, $-resizer-spacing + ($-resizer-line-width * -0.5));}}// Sidebar // -------------------------------------------------------------------------- .o_knowledge_sidebar{width: clamp(200px, var(--knowledge-article-sidebar-size), 576px); transition: width 0.15s linear; .o_article_active > div{background-color: rgba($knowledge-bg--active, 0.2); &:hover{background-color: rgba($knowledge-bg--active, 0.3);}}.o_article_name a{cursor: pointer; color: inherit; text-decoration: none;}}.o_knowledge_embedded_view_placeholder{.o_knowledge_embedded_view_placeholder_cover{@include o-position-absolute(0, 0, 0, 0); background: radial-gradient($white, transparent);}}}@include media-breakpoint-down(sm){.o_knowledge_public_view{.o_knowledge_sidebar{width: 100%;}}}@include media-breakpoint-up(sm){.o_knowledge_public_view{.o_scroll_view{@include o-position-absolute(0, 0, 0, 0); overflow-y: auto; overflow-x: hidden;}}}.o_knowledge_public_virality{table-layout: fixed;}

/* /website_links/static/src/css/website_links.css */
.no-link-style{color: black; text-decoration: none;}.required-form-control{background-color: #CECDFF;}#filters li a, #filters li.active a, #filters li.active a.active, #filters li.active a:hover, #filters li.active a:focus, #filters li a:hover{padding: 0px 5px; border-radius: 0px; border: 0px; border-color: transparent; border-right: 1px solid #999; padding-bottom: 0; background-color: #FFFFFF;}#filters li.active a{color: #999;}#filters li:last-child a, #filters li:last-child a:hover, #filters li:last-child a:focus{border-right: 0px;}.nav-tabs-inline{font-size: 14px;}#o_website_links_recent_links{min-height:30em;}.o_website_links_code_error{display:none; color:red; font-weight:bold;}.truncate_text{white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 500px;}

/* /website_mass_mailing/static/src/scss/website_mass_mailing_popup.scss */
.o_newsletter_modal{.modal-header{padding: 0; border: none;}.modal-title{display: none;}.close{z-index: $zindex-modal; @include o-position-absolute(0, 0); width: $font-size-lg * 2; height: $font-size-lg * 2; line-height: $font-size-lg * 2; margin: 0; padding: 0; @include o-bg-color(color-contrast(o-color('primary')), o-color('primary'), $with-extras: false); box-shadow: $box-shadow-sm; opacity: 1;}}

/* /website_sale_product_configurator/static/src/scss/website_sale_options.scss */
.css_not_available.js_product{.product_price{display: none !important;}}div#modal_optional_products table tr td{border: 0;}@include media-breakpoint-down(md){div#modal_optional_products .td-qty{display: none;}}

/* /mass_mailing/static/src/snippets/s_alert/000.scss */
.o_mail_snippet_general .s_mail_alert [class^="col-lg"]{padding-left: 0!important; padding-right: 0!important;}.s_mail_alert{.s_alert{margin: auto; border-width: $alert-border-width; border-style: solid; border-radius: $alert-border-radius; p, ul, ol{&:last-child{margin-bottom: 0;}}}.s_alert_sm{padding: $grid-gutter-width/3; font-size: $font-size-sm;}.s_alert_md{padding: $grid-gutter-width/2; font-size: $font-size-base;}.s_alert_lg{padding: $grid-gutter-width; font-size: $font-size-lg;}.s_alert_icon{float: left; margin-right: 10px;}.s_alert_content{overflow: hidden;}}

/* /mass_mailing/static/src/snippets/s_features_grid/000.scss */
 .s_mail_features_grid{.s_mail_features_grid_content{overflow: hidden; p{margin-bottom: 0;}}.s_mail_features_grid_icon{float: left;}}

/* /mass_mailing/static/src/snippets/s_hr/000.scss */
 .o_layout .s_hr{line-height: 0; hr{padding: 0; border: 0; border-top: 1px solid currentColor; margin: auto; color: inherit;}}

/* /mass_mailing/static/src/snippets/s_masonry_block/001.scss */
.o_mail_snippet_general.s_masonry_block[data-vcss='001']{.row > div{display: flex; flex-direction: column; justify-content: center;}.o_masonry_grid_container > .row{height: 100%;}}

/* /mass_mailing/static/src/snippets/s_media_list/001.scss */
.s_media_list[data-vcss="001"]{.s_media_list_item > .row{overflow: hidden; // To support rounded option}.s_media_list_body{padding: $spacer * 2;}.s_media_list_img{object-fit: cover;}}

/* /mass_mailing/static/src/snippets/s_rating/001.scss */
.o_mail_snippet_general .s_rating{padding-left: 0!important; padding-right: 0!important;}.s_rating[data-vcss="001"]{&.s_rating_inline{display: flex; align-items: center; .s_rating_title{margin: 0; margin-right: 0.5em;}.s_rating_icons{margin-left: auto;}}}

/* /website/static/src/snippets/s_title/000.scss */
 .s_title:not([data-vcss]){.s_title_boxed{> *{display: inline-block; padding: $grid-gutter-width; border: 1px solid;}}.s_title_lines{overflow: hidden; &:before, &:after{content: ""; display: inline-block; vertical-align: middle; width: 100%; border-top: 1px solid; border-top-color: inherit;}&:before{margin: 0 $grid-gutter-width/2 0 -100%;}&:after{margin: 0 -100% 0 $grid-gutter-width/2;}}.s_title_underlined{@extend %o-page-header;}.s_title_small_caps{font-variant: small-caps;}.s_title_transparent{opacity: .5;}.s_title_thin{font-weight: 300;}}

/* /website/static/src/snippets/s_alert/000.scss */
 .s_alert{margin: $grid-gutter-width/2 0; border: $alert-border-width solid; border-radius: $alert-border-radius; p, ul, ol{&:last-child{margin-bottom: 0;}}&.s_alert_sm{padding: $grid-gutter-width/3; @include font-size($font-size-sm);}&.s_alert_md{padding: $grid-gutter-width/2; @include font-size($font-size-base);}&.s_alert_lg{padding: $grid-gutter-width; @include font-size($font-size-lg);}.s_alert_icon{float: left; margin-right: 10px;}.s_alert_content{overflow: hidden;}}

/* /website/static/src/snippets/s_card/000.scss */
 .s_card{margin: $grid-gutter-width/2 0; .card-body{// color: initial; p, ul, ol{&:last-child{margin-bottom: 0;}}}}

/* /website/static/src/snippets/s_share/000.scss */
 .s_share{> *{display: inline-block; vertical-align: middle;}.s_share_title{margin: 0 .4rem 0 0;}a{i.fa{display: flex; justify-content: center; align-items: center;}margin: .2rem;}&:not(.no_icon_color){.s_share_facebook{&, &:hover, &:focus{@extend .text-facebook;}}.s_share_twitter{&, &:hover, &:focus{@extend .text-twitter;}}.s_share_linkedin{&, &:hover, &:focus{@extend .text-linkedin;}}.s_share_google{&, &:hover, &:focus{@extend .text-google-plus;}}.s_share_whatsapp{&, &:hover, &:focus{@extend .text-whatsapp;}}.s_share_pinterest{&, &:hover, &:focus{@extend .text-pinterest;}}.s_share_github{&, &:hover, &:focus{@extend .text-github;}}.s_share_instagram{&, &:hover, &:focus{@extend .text-instagram;}}.s_share_youtube{&, &:hover, &:focus{@extend .text-youtube;}}}}

/* /website/static/src/snippets/s_rating/001.scss */
 .s_rating[data-vcss="001"]{&.s_rating_inline{display: flex; align-items: center; .s_rating_title{margin: 0; margin-right: 0.5em;}.s_rating_icons{margin-left: auto;}}}

/* /website/static/src/snippets/s_hr/000.scss */
 .s_hr{line-height: 0; hr{padding: 0; // TODO we already change the way the color is applied (using a border) // in website.css. In master, we should just let that system work the // way it is and not force something here. border: 0; border-top: 1px solid $border-color; margin: 0; // Bootstrap sets a configurable "opacity" on hr tag, we remove that // here to let users set the color as they want. opacity: 1;}}

/* /website/static/src/snippets/s_image_gallery/001.scss */
 .s_image_gallery[data-vcss="001"]{&.o_grid, &.o_masonry{.img{width: 100%;}}&.o_grid{&.o_spc-none div.row{margin-bottom: 0px;}&.o_spc-small div.row > div{margin-bottom: $spacer;}&.o_spc-medium div.row > div{margin-bottom: $spacer * 2;}&.o_spc-big div.row > div{margin-bottom: $spacer * 3;}}&.o_masonry{&.o_spc-none div.o_masonry_col{padding: 0; > img, > a > img, > .media_iframe_video{margin: 0 !important;}}&.o_spc-small div.o_masonry_col{padding: 0 ($spacer * .5); > img, > a > img, > .media_iframe_video{margin-bottom: $spacer !important;}}&.o_spc-medium div.o_masonry_col{padding: 0 $spacer; > img, > a > img, > .media_iframe_video{margin-bottom: $spacer * 2 !important;}}&.o_spc-big div.o_masonry_col{padding: 0 ($spacer * 1.5); > img, > a > img, > .media_iframe_video{margin-bottom: $spacer * 3 !important;}}}&.o_nomode{&.o_spc-none .row > div{padding-top: 0; padding-bottom: 0;}&.o_spc-small .row > div{padding-top: $spacer * .5; padding-bottom: $spacer * .5;}&.o_spc-medium .row > div{padding-top: $spacer; padding-bottom: $spacer;}&.o_spc-big .row > div{padding-top: $spacer * 1.5; padding-bottom: $spacer * 1.5;}}&:not(.o_slideshow){img{cursor: pointer;}}&.o_slideshow{.carousel{.carousel-item.active, .carousel-item-next, .carousel-item-prev, .carousel-control-next, .carousel-control-prev{padding-bottom: 64px;}ul.carousel-indicators li{border: 1px solid #aaa;}.media_iframe_video{// 70% because the carousel controls are each 15% and the user // must be able to click on the video buttons. width: 70%; height: 100%;}}ul.carousel-indicators{position: absolute; left: 0%; bottom: 0; width: 100%; height: auto; margin-left: 0; padding: 0; border-width: 0; > *{list-style-image: none; display: inline-block; width: 40px; height: 40px; line-height: 40px; margin: 2.5px 2.5px 2.5px 2.5px; padding: 0; border: 1px solid #aaa; text-indent: initial; background-size: cover; background-color: #fff; background-position: center; border-radius: 0; vertical-align: bottom; flex: 0 0 40px; &:not(.active){opacity: 0.8; filter: grayscale(1);}}}> .container, > .container-fluid, > .o_container_small{height: 100%;}&.s_image_gallery_cover .carousel-item{> a{width: 100%; height: 100%;}> a > img, > img{width: 100%; height: 100%; object-fit: cover;}}&:not(.s_image_gallery_show_indicators) .carousel{ul.carousel-indicators{display: none;}.carousel-item.active, .carousel-item-next, .carousel-item-prev, .carousel-control-next, .carousel-control-prev{padding-bottom: 0px;}}&.s_image_gallery_indicators_arrows_boxed, &.s_image_gallery_indicators_arrows_rounded{.carousel{.carousel-control-prev, .carousel-control-next{// Directional icons replaced by oi but keeping fa here, it // is still used by already dropped snippet .fa, .oi{text-shadow: none;}}}}&.s_image_gallery_indicators_arrows_boxed{.carousel{.carousel-control-prev{.fa:before{content: "\f104";}.oi:before, .fa:before{padding-right: 2px;}}.carousel-control-next{.fa:before{content: "\f105";}.oi:before, .fa:before{padding-left: 2px;}}.carousel-control-prev, .carousel-control-next{.fa:before, .oi:before{display: block; width: 3rem; height: 3rem; line-height: 3rem; color: black; background: white; border: 1px solid $gray-500;}.fa:before{@include font-size(1.25rem);}.oi:before{@include font-size(0.75rem);}}}}&.s_image_gallery_indicators_arrows_rounded{.carousel{.carousel-control-prev{.fa:before{content: "\f060";}.oi:before{content: "\e842";}}.carousel-control-next{.fa:before{content: "\f061";}.oi:before{content: "\e843";}}.carousel-control-prev, .carousel-control-next{.fa:before, .oi:before{color: black; background: white; @include font-size(1.25rem); border-radius: 50%; padding: 1.25rem; border: 1px solid $gray-500;}}}}&.s_image_gallery_indicators_rounded{.carousel{ul.carousel-indicators li{border-radius: 50%;}}}&.s_image_gallery_indicators_dots{.carousel{ul.carousel-indicators{height: 40px; margin: auto; li{max-width: 8px; max-height: 8px; margin: 0 6px; border-radius: 10px; background-color: $black; background-image: none !important; &:not(.active){opacity: .4;}}}}}@extend %image-gallery-slideshow-styles;}.carousel-inner .item img{max-width: none;}}.s_gallery_lightbox{.modal-dialog{height: 100%; background-color: rgba(0,0,0,0.7);}@include media-breakpoint-up(sm){.modal-dialog{max-width: 100%; padding: 0;}}ul.carousel-indicators{display: none;}.modal-body.o_slideshow{@extend %image-gallery-slideshow-styles;}}%image-gallery-slideshow-styles{&:not(.s_image_gallery_cover) .carousel-item{> a{display: flex; height: 100%; width: 100%;}> a > img, > img{max-height: 100%; max-width: 100%; margin: auto;}}.carousel{height: 100%; .carousel-inner{height: 100%;}.carousel-item.active, .carousel-item-next, .carousel-item-prev, .carousel-control-next, .carousel-control-prev{display: flex; align-items: center; height: 100%;}.carousel-control-next, .carousel-control-prev{.fa, .oi{text-shadow: 0px 0px 3px $gray-800;}}}}

/* /website/static/src/snippets/s_product_catalog/001.scss */
.s_product_catalog[data-vcss='001']{.s_product_catalog_dish{// Title .s_product_catalog_dish_title{line-height: $headings-line-height;}// Description .s_product_catalog_dish_description{margin-bottom: $spacer;}&:last-child{.s_product_catalog_dish_description{margin-bottom: 0;}}// Dot Leaders .s_product_catalog_dish_dot_leaders{display: flex; flex-grow: 1; align-items: center; &::after{content: ''; margin-left: $spacer/2; flex: 1 0 auto; border-bottom: 1px dotted;}}}}

/* /website/static/src/snippets/s_comparisons/000.scss */
 .s_comparisons{.card-body{.card-title{margin: 0;}.s_comparisons_currency, .s_comparisons_price, .s_comparisons_decimal{display: inline-block; vertical-align: middle;}.s_comparisons_currency, .s_comparisons_decimal{font-size: 80%;}.s_comparisons_price{font-size: 200%;}}}

/* /website/static/src/snippets/s_company_team/000.scss */
 .s_company_team{@include media-breakpoint-down(lg){img{max-width: 50%;}}}

/* /website/static/src/snippets/s_references/000.scss */
 .s_references .img-thumbnail{border: none;}

/* /website/static/src/snippets/s_popup/001.scss */
.s_popup[data-vcss='001']{.modal-content{min-height: $font-size-lg * 2; border: 0; border-radius: 0; box-shadow: $modal-content-box-shadow-sm-up;}// Close icon .s_popup_close{z-index: $zindex-modal; @include o-position-absolute(0, 0); width: $font-size-lg * 2; height: $font-size-lg * 2; line-height: $font-size-lg * 2; @include o-bg-color(color-contrast(o-color('primary')), o-color('primary'), $with-extras: false); box-shadow: $box-shadow-sm; cursor: pointer; @include font-size($font-size-lg); text-align: center;}// Size option - Full .s_popup_size_full{padding: 0 !important; max-width: 100%; > .modal-content{// Use the backdrop color as background-color background-color: transparent; box-shadow: none; border-radius: 0;}}// Position option .modal-dialog{margin: 0 0 0 auto; min-height: 100%; &:not(.s_popup_size_full){padding: $spacer !important;}}.s_popup_top .modal-dialog{align-items: flex-start;}.s_popup_middle .modal-dialog{align-items: center; margin-right: auto;}.s_popup_bottom .modal-dialog{align-items: flex-end;}// No backdrop .s_popup_no_backdrop{// Allow scrolling on elements behind pointer-events: none; // Allow Chrome to scroll the modal content even if there is no scroll on the document behind. // Not needed for Firefox and Safari .modal-dialog{height: 100%; .modal-content{max-height:100%; overflow-y: auto; overflow-x: hidden;}}}}

/* /website/static/src/snippets/s_faq_collapse/000.scss */
.s_faq_collapse{.accordion .card{.card-header{cursor: pointer; display: inline-block; width: 100%; position: relative; padding: .5em 1em; padding-left: 2.25em; border-radius: 0; outline: none; &:before{content: '\f056'; font-family: 'FontAwesome'; color: $gray-600; position: absolute; margin-left: -1.5em;}&.collapsed:before{content: '\f055';}&:hover, &:focus{text-decoration: none;}}.s_faq_collapse_right_icon{padding-left: 1em; &:before{position: static; float: right; margin-left: 0;}& + div .card-body{padding-left: 1em;}}.card-body{padding: 1em; padding-left: 2.25em;}}.card-body p:last-child, .card-body ul:last-child{margin-bottom: 0;}&.s_faq_collapse_light{.accordion .card{border-left: 0; border-right: 0; border-radius: 0; .card-header{background-color: transparent; &:before{content:'\f068';}&.collapsed:before{content:'\f067';}}.s_faq_collapse_right_icon{padding-left: 0;}.card-header + div .card-body{padding-left: 0; padding-right: 0;}}}&.s_faq_collapse_big{.accordion .card{border: 0; .card-header{background-color: transparent; @include font-size($font-size-lg * 1.5); &:before{content:'\f068';}&.collapsed:before{content:'\f067';}}.s_faq_collapse_right_icon{padding-left: 0;}.card-header + div .card-body{padding-left: 0; padding-right: 0;}}}&.s_faq_collapse_boxed{.accordion .card{border: 0; margin: $btn-padding-y-lg 0; &:first-child{margin-top: 0;}&:last-child{margin-bottom: 0;}.card-header{border: 0;}.card-header.collapsed{background-color: transparent;}.collapse.show, .collapsing{.card-body{background-color: rgba(0, 0, 0, 0.03) !important;}}}}}

/* /website/static/src/snippets/s_features_grid/000.scss */
 .s_features_grid{.s_features_grid_content{overflow: hidden; p{margin-bottom: 0;}}.s_features_grid_icon{float: left; margin-right: $grid-gutter-width/2;}}

/* /website/static/src/snippets/s_tabs/001.scss */
// Tabs .s_tabs[data-vcss="001"]{.s_tabs_content{&.s_tabs_slide_up, &.s_tabs_slide_down, &.s_tabs_slide_left, &.s_tabs_slide_right{> .tab-pane.fade{transition: all 0.2s;}> .tab-pane.fade.show{transform: translateX(0rem) translateY(0rem);}}&.s_tabs_slide_up > .tab-pane.fade{transform: translateY(-1rem);}&.s_tabs_slide_down > .tab-pane.fade{transform: translateY(1rem);}&.s_tabs_slide_left > .tab-pane.fade{transform: translateX(-1rem);}&.s_tabs_slide_right > .tab-pane.fade{transform: translateX(1rem);}}}

/* /website/static/src/snippets/s_table_of_content/000.scss */
.s_table_of_content:not([data-vcss]){.s_table_of_content_navbar_wrap{&.s_table_of_content_navbar_sticky{&.s_table_of_content_horizontal_navbar, &.s_table_of_content_vertical_navbar .s_table_of_content_navbar{@include o-position-sticky($top: 0px);}&.s_table_of_content_vertical_navbar .s_table_of_content_navbar{overflow: auto;}}&:not(.s_table_of_content_navbar_sticky){&, .s_table_of_content_navbar{top: 0px !important;}}&.s_table_of_content_vertical_navbar .s_table_of_content_navbar{overflow-wrap: break-word; > a.list-group-item-action{background: none; color: inherit; opacity: 0.7; font-weight: $font-weight-normal + 100; padding-left: 3px; transition: padding 0.1s; &:before{@include o-position-absolute(10px, auto, 10px, 0); width: 2px; content: "";}&:hover{opacity: 1;}&:focus{background: none;}&.active{background: none; padding-left: 8px; opacity: 1; &:before{background-color: map-get($theme-colors, 'primary');}}}}&.s_table_of_content_horizontal_navbar{z-index: 1; padding-top: $navbar-padding-y; padding-bottom: $navbar-padding-y; margin-bottom: $spacer * 2; .s_table_of_content_navbar{display: inline; > a{&.list-group-item-action{width: auto;}&.list-group-item{display: inline-block; margin-bottom: 2px;}}}}}}

/* /website/static/src/snippets/s_quotes_carousel/001.scss */
.s_quotes_carousel_wrapper[data-vcss='001']{.s_blockquote{margin-bottom: 0; @include media-breakpoint-down(md){width: 100% !important; // TODO add the right class in the xml when it's possible}}}

/* /website/static/src/snippets/s_masonry_block/001.scss */
.s_masonry_block[data-vcss='001'] .row > div{display: flex; flex-direction: column; justify-content: center;}.s_masonry_block[data-vcss='001'] .row.o_grid_mode{> div.o_grid_item_image{--grid-item-padding-y: 0px; --grid-item-padding-x: 0px;}}

/* /website/static/src/snippets/s_media_list/001.scss */
.s_media_list[data-vcss="001"]{.s_media_list_item > .row{overflow: hidden; // To support rounded option}.s_media_list_body{padding: $spacer * 2;}.s_media_list_img{object-fit: cover;}}

/* /website/static/src/snippets/s_showcase/002.scss */
.s_showcase[data-vcss='002']{.s_showcase_icon{// Avoid images stretched depending on title size (when icons // are images an not Font Awesome icons). Because the default // value of "align-self" is "strech". align-self: flex-start;}}

/* /website/static/src/snippets/s_timeline/000.scss */
.s_timeline{.s_timeline_line{position: relative; border-color: map-get($grays, '800'); // For inheritance, not actual border &:before{content: ''; display: block !important; // override portal '#wrap .container' value position: absolute; width: 1px; top: 0px; bottom: 0px; left: 50%; border-left: 1px solid; border-color: inherit;}}.s_timeline_row{align-items: center; .s_timeline_content{align-items: center; justify-content: flex-end; width: 100%; ~ .s_timeline_content{justify-content: flex-start;}}&.flex-row-reverse{.s_timeline_content{flex-direction: row-reverse;}}@include media-breakpoint-up(md){&.flex-row-reverse{.s_timeline_content{flex-direction: row-reverse; &:not(:last-child){margin-left: 10%;}}}&:not(.flex-row-reverse){.s_timeline_content:last-child{margin-left: 10%;}}}}.s_timeline_date{position: relative; margin: 20px 0px; padding: 5px; background-color: var(--o-cc-bg, #{$body-bg}); text-align: center; @include media-breakpoint-up(md){position: absolute; left: 50%; transform: translateX(-50%);}.fa{margin: 0 $grid-gutter-width/2;}}.s_timeline_icon{flex: 0 0 auto; margin: $grid-gutter-width/2; z-index: 1;}}

/* /website/static/src/snippets/s_text_highlight/000.scss */
.s_text_highlight{padding: 1.5rem; border-radius: $border-radius; :last-child{margin-bottom: 0;}}

/* /website/static/src/snippets/s_blockquote/000.scss */
.s_blockquote{// Reset border: 0; padding: 0; .s_blockquote_icon{@include font-size($font-size-base);}.s_blockquote_author{opacity: .75;}// Classic &.s_blockquote_classic{.s_blockquote_icon{float: left; border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; &.float-end{border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important;}}.s_blockquote_content{overflow: hidden; padding: $spacer * 1.5; .blockquote-footer{&::before{content: '';}.s_blockquote_avatar{max-height: $spacer * 2.5;}}}}// Cover &.s_blockquote_cover{text-align: center; .s_blockquote_icon{position: relative; z-index: 1; float: none; margin-bottom: -$spacer * 1.5;}p:last-of-type{margin-bottom: $spacer * .5;}.s_blockquote_content, .s_blockquote_filter{// s_blockquote_filter is there for compatibility padding: $spacer * 3 $spacer * 2 $spacer * 2;}// Compatibility .s_blockquote_filter{margin: $spacer * -3 $spacer * -2 $spacer * -2;}.quote_char{margin: $spacer * 2 0 $spacer 0; & ~ .blockquote-footer{padding-bottom: $spacer * 2;}}}// Minimalist &.s_blockquote_minimalist{border-left: 5px solid; border-color: o-color('secondary'); .s_blockquote_content{padding: $spacer; @include border-end-radius($border-radius); p:last-of-type{margin-bottom: 0;}}}}

/* /website/static/src/snippets/s_badge/000.scss */
 .s_badge{padding: $s-badge-padding; margin: $s-badge-margin; border-radius: if($s-badge-border-radius != null, $s-badge-border-radius, $badge-border-radius); @include font-size($font-size-sm); .fa{margin: $s-badge-i-margin;}}

/* /website/static/src/snippets/s_color_blocks_2/000.scss */
.s_color_blocks_2{// Needed to be able to stretch the inner container so that // the snippet works with the 50% and 100% height &.o_half_screen_height, &.o_full_screen_height{> :first-child{// container &, > .row{min-height: inherit;}}}.row{display: flex; flex-flow: row wrap; // Fix for safari browser as it 'supports' flex but not with the right // behavior &::before, &::after{width: 0;}}[class*="col-lg-"]{padding: 8% 5%; padding-top: 8vw; // A flex item cannot have % padding top and bottom (even if it works on chrome) padding-bottom: 8vw; // Solution is vw units but we keep 8% as a fallback}img{max-width: 100%; height: auto;}}

/* /website/static/src/snippets/s_product_list/000.scss */
 .s_product_list{padding-top: 20px; > div > .row:not(.o_grid_mode) > div{height: 200px;}> div > .row > div{position: relative; margin-bottom: 20px; // without this style the columns go directly to the top of the bellow ones. text-align: center; a{display: block;}img{margin: auto; max-height: 130px; @include s-product-list-img-hook;}.s_product_list_item_link{@include o-position-absolute($left: 10%, $bottom: 0, $right: 10%); > .btn{width: 100%; padding: 5px !important; @include font-size(16px); @media only screen and (max-width : 1280px){// FIXME font-size: 12px;}.fa{@include font-size(18px); padding-right: 5px; @media only screen and (max-width : 1024px){// FIXME display: block; font-size: 25px;}}}}}}

/* /website/static/src/snippets/s_mega_menu_thumbnails/000.scss */
.s_mega_menu_thumbnails:not([data-vcss]){.s_mega_menu_thumbnails_footer:not(.o_cc){// TODO this should be replaced by proper structure and color // classes @extend %s_mega_menu_gray_area; &::before{@include o-position-absolute(0, 0, 0, 0); width: auto; height: auto;}}}

/* /website/static/src/snippets/s_mega_menu_little_icons/000.scss */
 .s_mega_menu_little_icons:not([data-vcss]){.nav-link{&:hover, &:focus{background: rgba(0, 0, 0, .05);}}.s_mega_menu_gray_area:last-child{@extend %s_mega_menu_gray_area;}}

/* /website/static/src/snippets/s_mega_menu_images_subtitles/000.scss */
 .s_mega_menu_images_subtitles:not([data-vcss]){.d-flex img{max-width: 64px;}.nav-link{&:hover, &:focus{background: rgba(0, 0, 0, .05);}}}

/* /website/static/src/snippets/s_mega_menu_menus_logos/000.scss */
 .s_mega_menu_menus_logos:not([data-vcss]){.s_mega_menu_gray_area:last-child{@extend %s_mega_menu_gray_area;}.s_mega_menu_menus_logos_wrapper{// Apply color transparency to match with the preset used border-color: rgba(0, 0, 0, .05) !important;}}

/* /website/static/src/snippets/s_mega_menu_odoo_menu/000.scss */
 .s_mega_menu_odoo_menu:not([data-vcss]){.s_mega_menu_odoo_menu_footer{// Apply color transparency to match with the preset used border-color: rgba(0, 0, 0, .05); .row > div:not(.o_cc){// TODO this should be replaced by proper structure and color // classes @extend %s_mega_menu_gray_area; &::before{@include o-position-absolute(0, 0, 0, 0); width: auto; height: auto;}}}}

/* /website/static/src/snippets/s_mega_menu_cards/000.scss */
 .s_mega_menu_cards:not([data-vcss]){.nav-link{&:hover, &:focus{background: rgba(0, 0, 0, .05);}}}

/* /website/static/src/snippets/s_google_map/000.scss */
 $s-google-map-desc-bg: map-get($theme-colors, 'primary') !default; $s-google-map-desc-alpha: 0.80 !default; $s-google-map-desc-hover-bg: map-get($theme-colors, 'primary') !default; $s-google-map-desc-hover-alpha: 0.55 !default; .s_google_map{position: relative; min-height: 100px; .map_container{@include o-position-absolute(0, 0, 0, 0);}.description{@include o-position-absolute(auto, 0, 0, 0); z-index: 99; padding: 0 1em; background: rgba($s-google-map-desc-bg, $s-google-map-desc-alpha); color: color-contrast(rgba($s-google-map-desc-bg, $s-google-map-desc-alpha)); transition: background-color 250ms ease; font{float: left; margin-top: 20px; margin-bottom: 15px; font-weight: bold; text-transform: uppercase;}span{float: left; text-transform: none; font-weight: normal; margin-top: 20px; margin-left: 10px;}}&:hover .description{background: $s-google-map-desc-hover-bg; background: rgba($s-google-map-desc-hover-bg, $s-google-map-desc-hover-alpha); color: color-contrast(rgba($s-google-map-desc-hover-bg, $s-google-map-desc-hover-alpha));}}

/* /website/static/src/snippets/s_map/000.scss */
 $s-map-desc-bg: map-get($theme-colors, 'primary') !default; $s-map-desc-alpha: 0.80 !default; $s-map-desc-hover-bg: map-get($theme-colors, 'primary') !default; $s-map-desc-hover-alpha: 0.55 !default; .s_map{position: relative; min-height: 100px; .map_container{@include o-position-absolute(0, 0, 0, 0);}.description{@include o-position-absolute(auto, 0, 0, 0); z-index: 99; padding: 0 1em; background: rgba($s-map-desc-bg, $s-map-desc-alpha); color: color-contrast(rgba($s-map-desc-bg, $s-map-desc-alpha)); transition: background-color 250ms ease; font{float: left; margin-top: 20px; margin-bottom: 15px; font-weight: bold; text-transform: uppercase;}span{float: left; text-transform: none; font-weight: normal; margin-top: 20px; margin-left: 10px;}}&:hover .description{background: $s-map-desc-hover-bg; background: rgba($s-map-desc-hover-bg, $s-map-desc-hover-alpha); color: color-contrast(rgba($s-map-desc-hover-bg, $s-map-desc-hover-alpha));}.s_map_color_filter{@include o-position-absolute(0, 0, 0, 0); position: absolute !important; pointer-events: none;}}.editor_enable .s_map{iframe{pointer-events: none;}}

/* /website/static/src/snippets/s_dynamic_snippet/000.scss */
.s_dynamic{&.o_dynamic_empty{display: none !important;}[data-url]{cursor: pointer;}.card-img-top{height: 12rem;}img{object-fit: scale-down;}}

/* /website/static/src/snippets/s_dynamic_snippet_carousel/000.scss */
.s_dynamic{.carousel-control-prev, .carousel-control-next{position: absolute; width: 4rem; > span.fa{color: map-get($grays, '700'); background: radial-gradient($white 50%, transparent 50%);}}.dynamic_snippet_template .card-footer a, .dynamic_snippet_template .card-footer button, .o_dynamic_snippet_btn_wrapper{z-index: 2;}.dynamic_snippet_template .card-body .card-text{display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden;}.s_dynamic_snippet_arrow_bottom{> .carousel-control-prev, .carousel-control-next{position: relative;}}}

/* /website/static/src/snippets/s_embed_code/000.scss */
 .editor_enable .s_embed_code{min-height: $o-font-size-base;}

/* /website/static/src/snippets/s_website_form/001.scss */
.editor_enable .s_website_form[data-vcss="001"]{// Hidden field is only partially hidden in editor .s_website_form_field_hidden{display: block; opacity: 0.5;}// Fields with conditional visibility are visible and identifiable in the editor .s_website_form_field_hidden_if{display: block !important; background-color: $o-we-fg-light;}// Select inputs do not trigger the default browser behavior // Since we use a custom editable element .s_website_form_field select{pointer-events: none;}// Display the editable select as a single big field #editable_select.form-control{height: auto; .s_website_form_select_item{&.selected{font-weight: bold;}&:empty::before{content: attr(data-empty-value); pointer-events: none; font-style: italic; font-weight: normal; opacity: 0.6;}}}}.s_website_form[data-vcss="001"]{.s_website_form_label{@include media-breakpoint-down(sm){width: auto !important;}}.s_website_form_field_hidden{display: none;}span.s_website_form_mark{@include font-size(0.85em); font-weight: 400;}.s_website_form_dnone{display: none;}.s_website_form_submit, .s_website_form_recaptcha{.s_website_form_label{float: left; height: 1px;}}.s_website_form_no_submit_label{.s_website_form_label{display: none;}}// File blocks. div.o_files_zone{div.o_file_wrap{border: 1px solid $o-gray-400; border-radius: 0.25rem; @include font-size(0.9em); line-height: normal; div.o_file_name{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}i.o_file_delete{max-width: 25%; padding: 2px 4px 3px 4px; color: $primary; cursor: pointer; &:hover{color: darken($primary, 7.5%);}}}}.o_add_files_button{background-color: $o-gray-200; width: fit-content; &:hover{background-color: darken($o-gray-200, 4.5%);}}}body:not(.editor_enable) .s_website_form[data-vcss="001"]{.s_website_form_date, .s_website_form_datetime{&:not(.s_website_form_datepicker_initialized){[value]{color: transparent;}}}}

/* /website_payment/static/src/snippets/s_donation/000.scss */
.s_donation:not([data-vcss]){@include o-input-number-no-arrows(); .s_donation_btn{transition: background 0.2s; &:focus{box-shadow: none !important;}}#s_donation_amount_input{border: none; outline: none; max-width: 145px; background-color: transparent; font-size: inherit; color: inherit; &::placeholder{opacity: 0.6; color: inherit;}}.s_donation_range_slider_wrap{// not at 100% to prevent the bubble overflowing the viewport // to the right (with small device when set with max value) width: 90%; #s_donation_range_slider{margin-bottom: 50px;}.s_range_bubble{position: absolute; left: 0%; margin-top: 28px; padding: 0.5rem 1rem; color: color-contrast(o-color('primary')); background: map-get($theme-colors, 'primary'); @include font-size(1.15rem); border-radius: 0.3rem; transform: translateX(-50%); &::after{content: ""; position: absolute; top: -5px; left: 50%; width: 0; border-style: solid; border-color: map-get($theme-colors, 'primary') transparent; border-width: 0 5px 5px; margin-left: -5px;}}}}

/* /website_sale/static/src/snippets/s_dynamic_snippet_products/000.scss */
// class name are dynamically added. // If you don't find it with a grep, don't consider it as useless without extra check. .s_product_product_centered{.card{overflow: visible; margin-top: 6rem; padding-top: 6rem;}.o_carousel_product_img_link{max-width: 75%; margin-top: -12rem; left: 0; right: 0;}}.s_product_product_banner{img{max-height: 400px;}}.s_product_product_horizontal_card img{img{height: 100%;}}@include media-breakpoint-down(lg){.s_product_product_horizontal_card img{height: 12rem;}}.o_dynamic_product_hovered{img{transition: transform 250ms ease;}&:hover img{transform: scale(1.15);}}.o_carousel_multiple_rows{.row{padding: 1rem;}}// Cover image img.o_img_product_cover{object-fit: cover;}// Force the image to have a square ratio img.o_img_product_square{aspect-ratio: 1 / 1;}.o_card_group{> .row{padding-left: $grid-gutter-width / 2; padding-right: $grid-gutter-width / 2; > div{padding: 0 !important; &:first-child > .o_carousel_product_card{border-left: $card-border-width solid $card-border-color !important;}}&:first-child{.o_carousel_product_card{border-top: $card-border-width solid $card-border-color !important;}> div:first-child .o_carousel_product_card{@include border-top-start-radius($border-radius-lg !important);}> div:last-child .o_carousel_product_card{@include border-top-end-radius($border-radius-lg !important);}}&:last-child{> div:first-child .o_carousel_product_card{@include border-bottom-start-radius($border-radius-lg !important);}> div:last-child .o_carousel_product_card{@include border-bottom-end-radius($border-radius-lg !important);}}}}

/* /website/static/src/snippets/s_social_media/000.scss */
 .s_social_media{> *{display: inline-block; vertical-align: middle;}.s_social_media_title{margin: 0 .4rem 0 0;}a{i.fa, span.fa{display: flex; justify-content: center; align-items: center;}margin: .2rem;}&:not(.no_icon_color){.s_social_media_facebook{&, &:hover, &:focus{@extend .text-facebook;}}.s_social_media_twitter{&, &:hover, &:focus{@extend .text-twitter;}}.s_social_media_linkedin{&, &:hover, &:focus{@extend .text-linkedin;}}.s_social_media_google{&, &:hover, &:focus{@extend .text-google-plus;}}.s_social_media_whatsapp{&, &:hover, &:focus{@extend .text-whatsapp;}}.s_social_media_pinterest{&, &:hover, &:focus{@extend .text-pinterest;}}.s_social_media_github{&, &:hover, &:focus{@extend .text-github;}}.s_social_media_instagram{&, &:hover, &:focus{@extend .text-instagram;}}.s_social_media_youtube{&, &:hover, &:focus{@extend .text-youtube;}}.s_social_media_tiktok{&, &:hover, &:focus{@extend .text-tiktok;}}}}

/* /website/static/src/snippets/s_process_steps/001.scss */
.s_process_steps[data-vcss='001']{$process-step-icon-size: 5rem; .s_process_step{position: relative; .s_process_step_icon{position: relative; margin: $grid-gutter-width 0; .fa, img{display: block; height: $process-step-icon-size; width: $process-step-icon-size; line-height: $process-step-icon-size; // Note that we use contain and not cover. For "full images" // (like a photo which is a rectangle with colors on the edges), // cover would be better. But for "image icons", contain is a // better fit (as we want the full icon to be visible). Also // in the case of "photos", the user has to be possibility to // crop the image to a square, that way it would act as cover. object-fit: contain;}}.s_process_step_content{padding: 0 $grid-gutter-width/2; text-align: center;}.s_process_step_connector{position: absolute; z-index: 1; height: $process-step-icon-size; width: calc(100% - #{$process-step-icon-size}); left: calc(50% + #{$process-step-icon-size / 2}); margin: $grid-gutter-width 0; path{stroke: $border-color; stroke-width: 2; fill: transparent;}}&:last-child .s_process_step_connector{display: none;}}&.s_process_steps_connector_curved_arrow{.s_process_step:nth-child(odd) .s_process_step_connector{transform: scale(1, -1);}}.s_process_steps_arrow_head path{fill: map-get($grays, '600'); stroke: transparent;}@include media-breakpoint-down(lg){.s_process_step_connector{display: none;}}}

/* /website_event/static/src/snippets/s_events/000.scss */
.s_dynamic{.s_events_event_title{font-weight: $headings-font-weight; line-height: 1;}.s_events_event_subtitle{@include font-size($font-size-base);}&.s_event_event_picture{.s_events_event{margin: 0; min-height: 150px; figcaption{position: relative; justify-content: center; pointer-events: auto;}.s_events_event_cover{min-height: 100%; .o_record_cover_container{top: 0;}}.s_events_event_title{@include font-size($h3-font-size); margin-bottom: 0.5em;}}.row{align-items: stretch; .s_events_event_subtitle{margin: 0;}}}&.s_event_event_card{.card{height: 100%; .s_events_event_cover{height: 150px; .o_record_cover_container{background-color: transparent !important; .o_record_cover_image{@extend .card-img-top; height: inherit;}}.s_events_event_date{top: $card-spacer-x; right: $card-spacer-x; display: flex; flex-direction: column; justify-content: center; width: map-get($display-font-sizes, 4); height: map-get($display-font-sizes, 4); border-radius: 50%; text-align: center; .s_events_event_month{@include font-size($font-size-sm); font-weight: $font-weight-bold; text-transform: uppercase;}.s_events_event_day{@include font-size($font-size-lg); font-weight: $font-weight-light;}}}a{color: color-contrast($o-brand-primary); &:hover{text-decoration: none;}}}}}

/* /website/static/src/snippets/s_text_cover/000.scss */
.s_text_cover{// Needed to be able to stretch the inner container so that // the snippet works with the 50% and 100% height > *{&, > .row{min-height: inherit;}}}

/* /website/static/src/snippets/s_instagram_page/000.scss */
.s_instagram_page{div.container-fluid{padding: 0;}}

/* /website/static/src/scss/user_custom_rules.scss */
// // This file is meant to regroup your design customizations. For example, doing // this will separate your footer with a dotted border using your primary color. // // footer{// border-top: 5px dotted map-get($theme-colors, 'primary'); //}//