1464 lines
82 KiB
CSS
1464 lines
82 KiB
CSS
@charset "utf-8";
|
|
/******************************************************************** General ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle *,
|
|
.mpStyle *::after,
|
|
.mpStyle *::before { -webkit-box-sizing: border-box; box-sizing: border-box; }
|
|
body { margin: 0; padding: 0; }
|
|
body.noScroll { overflow: hidden; }
|
|
/******/
|
|
.mpStyle { font-size: var(--fs); font-weight: var(--fw); color: var(--d_color); line-height: 1.5; width: 100%; }
|
|
.mpStyle,
|
|
.mpStyle [data-collapse].mActive { display: block; }
|
|
.mpStyle table th[data-collapse].mActive,
|
|
.mpStyle table td[data-collapse].mActive { display: table-cell; }
|
|
.mpStyle p:not(.mp_wp_editor p) { margin: 0; padding: 0; line-height: 1.5; font-size: var(--fs); }
|
|
.mpStyle a:not(.mp_wp_editor a) { color: var(--color_theme); text-decoration: none; }
|
|
.mpStyle a:hover { opacity: 0.5; }
|
|
.mpStyle a:not(.mp_wp_editor a),
|
|
.mpStyle a:hover { text-decoration: none; }
|
|
[data-collapse-target],
|
|
[data-target-popup],
|
|
[data-icon-change],
|
|
[data-icon-change] { cursor: pointer; }
|
|
div.mpStyle [data-required],
|
|
div.mpStyle [data-collapse] { display: none; }
|
|
/*******/
|
|
div.mpStyle a,
|
|
div.mpStyle button,
|
|
div.mpStyle [data-bg-image],
|
|
div.mpStyle [data-tabs-target],
|
|
div.mpPopup,
|
|
div.mpPopup .popupClose,
|
|
div.mpStyle .customCheckbox,
|
|
div.mpStyle .mpTransition,
|
|
div.mpStyle [class*="_mpTransition"] { -webkit-transition: all 350ms ease-in-out; -moz-transition: all 350ms ease-in-out; -o-transition: all 350ms ease-in-out; transition: all 350ms ease-in-out; }
|
|
}
|
|
/******************************************************************** Shadow content ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.mpStyle .dShadow,
|
|
div.mpStyle [class*='_dShadow'] {
|
|
-webkit-box-shadow: var(--dShadow);
|
|
-moz-box-shadow: var(--dShadow);
|
|
-o-box-shadow: var(--dShadow);
|
|
box-shadow: var(--dShadow);
|
|
}
|
|
.groupRadioCheck [data-radio-check].mpActive,
|
|
div.mpStyle .dShadow_1, [class*='_dShadow_1'] {
|
|
-webkit-box-shadow: 0 5px 10px rgba(0, 44, 102, 0.2);
|
|
-moz-box-shadow: 0 5px 10px rgba(0, 44, 102, 0.2);
|
|
-o-box-shadow: 0 5px 10px rgba(0, 44, 102, 0.2);
|
|
box-shadow: 0 5px 10px rgba(0, 44, 102, 0.2);
|
|
}
|
|
div.mpStyle .dShadow_2, [class*='_dShadow_2'] {
|
|
-webkit-box-shadow: 0 1px 2px rgb(3 54 63 / 40%), 0 -1px 2px rgb(3 54 63 / 4%);
|
|
-moz-box-shadow: 0 1px 2px rgb(3 54 63 / 40%), 0 -1px 2px rgb(3 54 63 / 4%);
|
|
-o-box-shadow: 0 1px 2px rgb(3 54 63 / 40%), 0 -1px 2px rgb(3 54 63 / 4%);
|
|
box-shadow: 0 1px 2px rgb(3 54 63 / 40%), 0 -1px 2px rgb(3 54 63 / 4%);
|
|
}
|
|
div.mpStyle .dShadow_3, [class*='_dShadow_3'],
|
|
div.mpStyle [class*='slideIndicatorItem'].active {
|
|
-webkit-box-shadow: 0 2px 10px #444;
|
|
-moz-box-shadow: 0 2px 10px #444;
|
|
-o-box-shadow: 0 2px 10px #444;
|
|
box-shadow: 0 2px 10px #444;
|
|
}
|
|
div.mpStyle .dShadow_4, [class*='_dShadow_4'],
|
|
div.mpStyle ul.mp_input_select_list {
|
|
-webkit-box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
|
|
-moz-box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
|
|
-o-box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
|
|
box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
|
|
}
|
|
div.mpStyle .dShadow_5, [class*='_dShadow_5'],
|
|
div.mpStyle [class*="dButton"] {
|
|
-webkit-box-shadow: var(--button_shadows);
|
|
-moz-box-shadow: var(--button_shadows);
|
|
-o-box-shadow: var(--button_shadows);
|
|
box-shadow: var(--button_shadows);
|
|
}
|
|
div.mpStyle .dShadow_6, [class*='_dShadow_6'] {
|
|
-webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
|
|
-moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
|
|
-o-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
|
|
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);;
|
|
}
|
|
div.mpStyle .dShadow_7, [class*='_dShadow_7'] {
|
|
-webkit-box-shadow: 5px 4px 30px rgba(189, 189, 189, 0.07);
|
|
-moz-box-shadow: 5px 4px 30px rgba(189, 189, 189, 0.07);
|
|
-o-box-shadow: 5px 4px 30px rgba(189, 189, 189, 0.07);
|
|
box-shadow: 5px 4px 30px rgba(189, 189, 189, 0.07);
|
|
}
|
|
div.mpStyle .formControl,
|
|
div.mpStyle .dShadow_8, [class*='_dShadow_8'] {
|
|
-webkit-box-shadow: 2px 4px 40px rgba(103, 103, 103, 0.1);
|
|
-moz-box-shadow: 2px 4px 40px rgba(103, 103, 103, 0.1);
|
|
-o-box-shadow: 2px 4px 40px rgba(103, 103, 103, 0.1);
|
|
box-shadow: 2px 4px 40px rgba(103, 103, 103, 0.1);
|
|
}
|
|
.mpStyle .formControl:focus,
|
|
div.mpStyle .dShadow_9, [class*='_dShadow_9'] {-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);}
|
|
div.mpStyle .selectCheckbox input:focus ~ .customCheckbox::before,
|
|
div.mpStyle .dShadow_10, [class*='_dShadow_10'] {-webkit-box-shadow: 0 0 0 3px rgba(0, 119, 204, 0.3); box-shadow: 0 0 0 3px rgba(0, 119, 204, 0.3);}
|
|
.mpStyle .groupContent input[type="radio"],
|
|
.mpStyle .groupContent input[type="radio"] ~ input:focus,
|
|
div.mpStyle [class*='noShadow'] { -webkit-box-shadow: none; -moz-box-shadow: none; -o-box-shadow: none; box-shadow: none; }
|
|
}
|
|
/******************************************************************** Font Size & Font weight ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.mpStyle label,
|
|
div.mpStyle h1,
|
|
div.mpStyle h2,
|
|
div.mpStyle h3,
|
|
div.mpStyle h4,
|
|
div.mpStyle h5,
|
|
div.mpStyle h6 { margin: 0; padding: 0; line-height: 1.25; }
|
|
div.mpStyle strong { font-weight: var(--fw-bold); }
|
|
div.mpStyle .extraBold { font-weight: 900; }
|
|
div.mpStyle h1 { font-size: var(--fs_h1); font-weight: var(--fw-bold); }
|
|
div.mpStyle h2 { font-size: var(--fs_h2); font-weight: var(--fw-bold); }
|
|
div.mpStyle h3 { font-size: var(--fs_h3); font-weight: var(--fw-medium); }
|
|
div.mpStyle h4 { font-size: var(--fs_h4); font-weight: var(--fw-medium); }
|
|
div.mpStyle h5 { font-size: var(--fs_h5); font-weight: var(--fw-medium); }
|
|
div.mpStyle h6 { font-size: var(--fs_h6); font-weight: var(--fw-normal); }
|
|
div.mpStyle label { font-size: var(--fs_label); font-weight: var(--fw-medium); }
|
|
}
|
|
/******************************************************************** Flex Section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle [class*="_equalChild"], .mpStyle .equalChild, .mpStyle .flexEqual, .mpStyle [class*="listEqual"],
|
|
.mpStyle [class*="_dFlex"], .mpStyle .dFlex,
|
|
.mpStyle .mpMenu li { display: -webkit-flex; display: flex; }
|
|
.mpStyle .groupContent,
|
|
.mpStyle .buttonGroup,
|
|
.mpStyle .inputGroup,
|
|
.mpStyle .inputInline .mpForm,
|
|
.mpStyle [class^="mpMenu"] { display: -webkit-inline-flex; display: inline-flex; }
|
|
.mpStyle .mpRow,
|
|
.mpStyle .flexWrap,
|
|
.mpStyle .listInline,
|
|
.mpStyle .mage_menu { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
|
|
.mpStyle [class*="_wrap"] { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
|
|
.mpStyle .flexNowrap { display: -webkit-flex; display: flex; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; }
|
|
.mpStyle ul.list_inline_two,
|
|
.mpStyle .flexWrapJustifyBetween { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
|
|
[data-bg-image],
|
|
.mpStyle .allCenter, .mpStyle [class*="_allCenter"],
|
|
.mpStyle .mp_remove_icon,
|
|
.mpStyle [class*="mage_qty"],
|
|
.mpStyle .mpMenu li a,
|
|
.mpTabs.tabBorder > .tabLists li,
|
|
.mpStyle [class*="addonGroupContent"],
|
|
.mpStyle button, .mpStyle .mpBtn, .mpStyle [class*="_mpBtn"],
|
|
.mpStyle [class*="slideIndicator"],
|
|
.mpStyle [class*="circleIcon"],
|
|
div[class*="dLoader"], div[class*="simpleSpinner"],
|
|
div.mpPopup.in,
|
|
div.mpPopup .popupClose { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
|
|
/************/
|
|
.mpStyle [class*="_flexAuto"], .mpStyle .flexAuto { -webkit-flex: auto; flex: auto; }
|
|
/************/
|
|
.mpStyle .justifyStart { display: -webkit-flex; display: flex; -webkit-justify-content: flex-start; justify-content: flex-start; }
|
|
.mpStyle [class*="_justifyStart"] { -webkit-justify-content: flex-start; justify-content: flex-start; }
|
|
.mpStyle .justifyCenter { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; }
|
|
.mpStyle [class*="_justifyCenter"] { -webkit-justify-content: center; justify-content: center; }
|
|
.mpStyle .justifyBetween { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; }
|
|
.mpStyle [class*="_justifyBetween"] { -webkit-justify-content: space-between; justify-content: space-between; }
|
|
.mpStyle .justifyAround { display: -webkit-flex; display: flex; -webkit-justify-content: space-around; justify-content: space-around; }
|
|
.mpStyle [class*="_justifyAround"] { -webkit-justify-content: space-around; justify-content: space-around; }
|
|
.mpStyle .justifyEnd { display: -webkit-flex; display: flex; -webkit-justify-content: flex-end; justify-content: flex-end; }
|
|
.mpStyle [class*="_justifyEnd"] { -webkit-justify-content: flex-end; justify-content: flex-end; }
|
|
/********/
|
|
.mpStyle label,
|
|
.mpStyle .customRadio,
|
|
.mpStyle .formControl,
|
|
.mpStyle .title_on_border,
|
|
.mpStyle .alignCenter, .mpStyle [class*="_alignCenter"] {
|
|
display: -webkit-flex; display: flex;
|
|
-webkit-align-items: center; align-items: center;
|
|
-webkit-flex-wrap: nowrap; flex-wrap: nowrap;
|
|
}
|
|
[class*="_alignCenter"] { -webkit-align-items: center; align-items: center; }
|
|
.mpStyle .alignBaseline { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; }
|
|
[class*="_alignBaseline"] { -webkit-align-items: baseline; align-items: baseline; }
|
|
.mpStyle .alignStart { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; }
|
|
[class*="_alignStart"] { -webkit-align-items: flex-start; align-items: flex-start; }
|
|
/*****************/
|
|
.mpStyle .ffColumn,
|
|
.mpStyle .flexColumn { display: -webkit-flex; display: flex; -webkit-flex-flow: column; flex-flow: column; }
|
|
[class*="_ffColumn"] { -webkit-flex-flow: column; flex-flow: column; }
|
|
.mpStyle .fdColumn { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; }
|
|
[data-bg-image],
|
|
[class*="_fdColumn"] { -webkit-flex-direction: column; flex-direction: column; }
|
|
.flexEqual > *, .equalChild > *, [class*="_equalChild"] > *,
|
|
[class*="listEqual"] > li,
|
|
.mpTabs.tabBorder > .tabLists li,
|
|
.inputInline .inputList { -webkit-flex: 1; -ms-flex: 1; flex: 1; }
|
|
}
|
|
/******************************************************************** Radios Section************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle img,
|
|
.mpStyle [class*="dButton"],
|
|
div.filter_item,
|
|
.mpStyle .formControl,
|
|
div.mpPopup .popupMainArea, div.mpPopup .popupClose,
|
|
.mpStyle [class*="clickSlide"],
|
|
.mpStyle [class*="slideIndicatorItem"],
|
|
.mpStyle [class*="dLayout"],
|
|
.mpStyle .groupContent,
|
|
.mpStyle [class*="_dBR"] { -webkit-border-radius: var(--dBR); border-radius: var(--dBR); }
|
|
.mpStyle div.mp_input_select .formControl:focus,
|
|
.mpStyle [class*="_dBR_T"] { -webkit-border-radius: var(--dBR) var(--dBR) 0 0; border-radius: var(--dBR) var(--dBR) 0 0; }
|
|
.mpStyle .buttonGroup > :last-child,
|
|
.mpStyle [class*="_dBR_R"] { -webkit-border-radius: 0 var(--dBR) var(--dBR) 0; border-radius: 0 var(--dBR) var(--dBR) 0; }
|
|
.mpStyle ul.mp_input_select_list,
|
|
.mpStyle [class*="_dBR_B"] { -webkit-border-radius: 0 0 var(--dBR) var(--dBR); border-radius: 0 0 var(--dBR) var(--dBR); }
|
|
.mpStyle .buttonGroup > :first-child,
|
|
.mpStyle [class*="_dBR_L"] { -webkit-border-radius: var(--dBR) 0 0 var(--dBR); border-radius: var(--dBR) 0 0 var(--dBR); }
|
|
.mpStyle [class*="_dBRL"] { -webkit-border-radius: var(--dBRL); border-radius: var(--dBRL); }
|
|
.mpStyle [class*="_dBRL_T"] { -webkit-border-radius: var(--dBRL) var(--dBRL) 0 0; border-radius: var(--dBRL) var(--dBRL) 0 0; }
|
|
.mpStyle [class*="_dBRL_R"] { -webkit-border-radius: 0 var(--dBRL) var(--dBRL) 0; border-radius: 0 var(--dBRL) var(--dBRL) 0; }
|
|
.mpStyle [class*="_dBRL_B"] { -webkit-border-radius: 0 0 var(--dBRL) var(--dBRL); border-radius: 0 0 var(--dBRL) var(--dBRL); }
|
|
.mpStyle [class*="_bB_50"] { -webkit-border-radius: 50px; border-radius: 50px; }
|
|
.mpStyle .mp_remove_icon,
|
|
.mpStyle [class*="circle"] { -webkit-border-radius: 50%; border-radius: 50%; }
|
|
.mpStyle .buttonGroup > *,
|
|
.mpStyle .groupContent .formControl,
|
|
.mpStyle .zeroRadius, .mpStyle [class*="_zeroRadius"] { -webkit-border-radius: 0; border-radius: 0; }
|
|
}
|
|
/******************************************************************** Button Section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle .mpBtn, .mpStyle [class*="_mpBtn"],
|
|
.mpStyle button { position: relative; font-size: var(--button_fs); font-weight: var(--fw-medium); line-height: 1; cursor: pointer; overflow: visible; border: none; -webkit-appearance: button; text-transform: capitalize; }
|
|
.mpStyle button[disabled] { cursor: not-allowed; opacity: 0.8; background-color: #DDD; }
|
|
.mpStyle button:hover, .mpStyle button:focus { text-decoration: none; opacity: 0.8; background-color: var(--d_color); color: #FFF; }
|
|
.mpStyle button:hover span, .mpStyle button:focus span { color: #FFF; }
|
|
.mpStyle .mpBtn, .mpStyle [class*="_mpBtn"] { padding: var(--dMP_xs) var(--dMP); color: var(--d_color); background-color: transparent; border: 1px solid var(--color_border); }
|
|
.mpStyle .mpBtn_xs, .mpStyle [class*="_mpBtn_xs"] { padding: 7px var(--dMP_xs); }
|
|
.mpStyle .mpBtn.mpActive, .mpStyle [class*="_mpBtn"].mpActive { border-color: var(--color_theme); color: var(--color_theme); }
|
|
.mpStyle .mpBtn.mActive, .mpStyle [class*="_mpBtn"].mActive,
|
|
.mpStyle .mpBtn.mpActive:hover, .mpStyle [class*="_mpBtn"].mpActive:hover { background-color: var(--color_theme); color: var(--color_theme_alter); }
|
|
/***/
|
|
.mpStyle [class*="dButton"] { padding: 0 var(--dMP); min-width: var(--button_width); height: auto; min-height: var(--button_height); color: var(--color_button); background-color: var(--button_bg); }
|
|
.mpStyle [class*="dButton"] span { margin: 0 var(--dMP_xs) 0 0; }
|
|
.mpStyle .dButton, .mpStyle [class*="_dButton"] { color: var(--color_button); background-color: var(--button_bg); }
|
|
.mpStyle .dButton span, .mpStyle [class*="_dButton"] span { color: var(--color_button); }
|
|
/***/
|
|
.mpStyle .themeButton, .mpStyle [class*="_themeButton"] { background-color: var(--color_theme); color: var(--color_theme_alter); padding: var(--dMP_xs) var(--dMP); border: 2px solid var(--color_theme); }
|
|
.mpStyle .themeButton span, .mpStyle [class*="_themeButton"] span { color: var(--color_theme_alter); }
|
|
.mpStyle .themeButton:hover, .mpStyle [class*="_themeButton"]:hover { background-color: #000; color: var(--color_theme_alter); border-color: #000; }
|
|
.mpStyle .themeButton:hover span, .mpStyle [class*="_themeButton"]:hover span { color: var(--color_theme_alter); }
|
|
/****/
|
|
.mpStyle .warningButton, .mpStyle [class*="_warningButton"] { background-color: var(--color_warning); color: var(--color_theme_alter); padding: var(--dMP_xs) var(--dMP); border: 2px solid var(--color_warning); }
|
|
.mpStyle .warningButton span, .mpStyle [class*="_warningButton"] span { color: var(--color_theme_alter); }
|
|
.mpStyle .warningButton:hover, .mpStyle [class*="_warningButton"]:hover { background-color: var(--color_light); color: var(--color_warning); }
|
|
.mpStyle .warningButton:hover span, .mpStyle [class*="_warningButton"]:hover span { color: var(--color_warning); }
|
|
/*********/
|
|
.mpStyle .successButton, .mpStyle [class*="_successButton"] { background-color: var(--color_success); color: var(--color_theme_alter); padding: var(--dMP_xs) var(--dMP); border: 2px solid var(--color_success); }
|
|
.mpStyle .successButton span, .mpStyle [class*="_successButton"] span { color: var(--color_theme_alter); }
|
|
.mpStyle .successButton:hover, .mpStyle [class*="_successButton"]:hover { background-color: var(--color_light); color: var(--color_success); }
|
|
.mpStyle .successButton:hover span, .mpStyle [class*="_successButton"]:hover span { color: var(--color_success); }
|
|
/*********/
|
|
.mpStyle .navy_blueButton, .mpStyle [class*="_navy_blueButton"] { background-color: var(--color_navy_blue); color: var(--color_theme_alter); padding: var(--dMP_xs) var(--dMP); border: 2px solid var(--color_navy_blue); }
|
|
.mpStyle .navy_blueButton span, .mpStyle [class*="_navy_blueButton"] span { color: var(--color_theme_alter); }
|
|
.mpStyle .navy_blueButton:hover, .mpStyle [class*="_navy_blueButton"]:hover { background-color: var(--color_theme_alter); color: var(--color_navy_blue); border-color: var(--color_navy_blue); }
|
|
.mpStyle .navy_blueButton:hover span, .mpStyle [class*="_navy_blueButton"]:hover span { color: var(--color_navy_blue); }
|
|
/****/
|
|
.mpStyle [class*="Button_xs"] { min-width: auto; min-height: var(--button_height_xs); padding: 7px var(--dMP_xs); font-size: var(--fs); }
|
|
/*************************/
|
|
.mpStyle [class*="dButton"].mpActive { background-color: var(--color_theme); color: var(--color_theme_alter); }
|
|
}
|
|
/******************************************************************** Helper Section************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle small { font-size: var(--fs_small); }
|
|
/********Helper Class***********/
|
|
.mpStyle .divider, .mpStyle [class*="_divider"], .mpStyle hr { margin: var(--dMP_xs) 0; line-height: 1; border-color: var(--color_border); display: block; height: 1px; background-color: var(--color_border); width: 100%; }
|
|
.mpStyle .divider_3, .mpStyle [class*="_divider_3"]{ margin: var(--dMP_xs) 0; line-height: 1; border-color: var(--color_border); display: block; height: 3px; background-color: var(--color_border); width: 100%; }
|
|
.mpStyle .dividerL, .mpStyle [class*="_dividerL"] { margin: var(--dMP) 0; line-height: 1; border-color: var(--color_border); display: block; height: 1px; background-color: var(--color_border); width: 100%; }
|
|
.mpStyle .separatorRight > *, .mpStyle [class*="_separatorRight"] > * { border-right: 2px solid var(--color_border); }
|
|
.mpStyle .separatorRight > *, .mpStyle [class*="_separatorRight"] > :last-child { border-right: none; }
|
|
div.mpStyle .mpDisabled { cursor: no-drop; opacity: 0.7; pointer-events: none; }
|
|
.mpStyle .strikeLine { position: relative; padding: 0 var(--dMP_xs); color: var(--color_warning); }
|
|
.mpStyle .strikeLine:before { content: " "; display: block; width: 100%; border-top: 1px solid #8B0000AA; position: absolute; left: 0; right: 0; top: 11px; transform: rotate(-11deg); }
|
|
/**************/
|
|
.mpStyle .rotate_90, .mpStyle [class*="_rotate_90"] {transform: rotate(90deg);}
|
|
/**************/
|
|
div.mpStyle .mp_hidden_content,
|
|
.mpStyle .dNone, .mpStyle [class*="_dNone"] { display: none; }
|
|
.mpStyle .dBlock, .mpStyle [class*="_dBlock"] { display: block; }
|
|
.mpStyle .dInlineBlock, .mpStyle [class*="_dInlineBlock"],
|
|
.mpStyle small, .mpStyle span, .mpStyle strong { display: inline-block; }
|
|
/**************/
|
|
.mpStyle .fLeft, .mpStyle [class*="_fLeft"] { float: left; }
|
|
.mpStyle .fRight, .mpStyle [class*="_fRight"] { float: right; }
|
|
/**************/
|
|
/**************/
|
|
.mpStyle .textLeft, .mpStyle [class*="_textLeft"] { text-align: left; }
|
|
.mpStyle .textCenter, .mpStyle [class*="_textCenter"] { text-align: center; }
|
|
.mpStyle .textRight, .mpStyle [class*="_textRight"] { text-align: right; }
|
|
.mpStyle .textCapitalize, .mpStyle [class*="_textCapitalize"] { text-transform: capitalize; }
|
|
.mpStyle .textNowrap, .mpStyle [class*="_textNowrap"] { white-space: nowrap; }
|
|
/**************/
|
|
.mpStyle [class*="_dotted"] { border-style: dotted; }
|
|
.mpStyle [class*="_border"] { border: 1px solid var(--color_border); }
|
|
.mpStyle .bT, .mpStyle [class*="_bT"] { border-top: 1px solid var(--color_border); }
|
|
.mpStyle [class*="_bDot"] { border: 1px dotted var(--color_border); }
|
|
.mpStyle [class*="_bDash"] { border: 1px dashed var(--color_border); }
|
|
.mpStyle [class*="_bR"] { border-right: 1px solid var(--color_border); }
|
|
.mpStyle [class*="_bR_dash"] { border-right: 1px dashed var(--color_border); }
|
|
.mpStyle [class*="_bR_dot"] { border-right: 1px dotted var(--color_border); }
|
|
.mpStyle [class*="_bB"], .mpStyle .borB { border-bottom: 1px solid var(--color_border); }
|
|
.mpStyle [class*="_bB_dot"] { border-bottom: 1px dotted var(--color_border); }
|
|
.mpStyle .zeroBorder, .mpStyle [class*="_zeroBorder"] { border: none; }
|
|
/**************/
|
|
.mpStyle .padZero, .mpStyle span.padZero, .mpStyle [class*="_pad_zero"] { padding: 0; }
|
|
.mpStyle .padding, .mpStyle [class*="_padding"] { padding: var(--dMP); }
|
|
.mpStyle .padding_xs, .mpStyle [class*="_padding_xs"] { padding: var(--dMP_xs); }
|
|
.mpStyle .pad_25, .mpStyle [class*="_pad_25"] { padding: 25px; }
|
|
.mpStyle .pT, .mpStyle [class*="_pT"] { padding-top: var(--dMP); }
|
|
.mpStyle .pT_xs, .mpStyle [class*="_pT_xs"] { padding-top: var(--dMP_xs); }
|
|
.mpStyle .pR, .mpStyle [class*="_pR"] { padding-right: var(--dMP); }
|
|
.mpStyle .pR_xs, .mpStyle [class*="_pR_xs"] { padding-right: var(--dMP_xs); }
|
|
.mpStyle .pR_5, .mpStyle [class*="_pR_5"] { padding-right: 5%; }
|
|
.mpStyle .pr_15 { padding-right: 15%; }
|
|
.mpStyle .pB, .mpStyle [class*="_pB"] { padding-bottom: var(--dMP); }
|
|
.mpStyle .pB_xs, .mpStyle [class*="_pB_xs"] { padding-bottom: var(--dMP_xs); }
|
|
.mpStyle .pL, .mpStyle [class*="_pL"] { padding-left: var(--dMP); }
|
|
.mpStyle .pL_xs, .mpStyle [class*="_pL_xs"] { padding-left: var(--dMP_xs); }
|
|
.mpStyle .pTB, .mpStyle [class*="_pTB"] { padding: var(--dMP) 0; }
|
|
.mpStyle .pTB_xs, .mpStyle [class*="pTB_xs"] { padding: var(--dMP_xs) 0; }
|
|
/**************/
|
|
.mpStyle .margin { margin: var(--dMP); }
|
|
div.mpStyle .mZero, div.mpStyle [class*="_mZero"], .mpStyle span[class*="_icon"] { margin: 0; }
|
|
div.mpStyle .mAuto, div.mpStyle [class*="_mAuto"] { margin: 0 auto; }
|
|
.mpStyle .mT, .mpStyle [class*="_mT"] { margin-top: var(--dMP); }
|
|
.mpStyle .mT_xs, .mpStyle [class*="_mT_xs"] { margin-top: var(--dMP_xs); }
|
|
.mpStyle .mT_25, .mpStyle [class*="_mT_25"] { margin-top: 25px; }
|
|
.mpStyle .mT_40, .mpStyle [class*="_mT_40"] { margin-top: 40px; }
|
|
.mpStyle .mR, .mpStyle [class*="_mR"] { margin-right: var(--dMP); }
|
|
.mpStyle .mR_xs, .mpStyle [class*="_mR_xs"] { margin-right: var(--dMP_xs); }
|
|
.mpStyle .mR_5, .mpStyle [class*="_mR_5"] { margin-right: 5%; }
|
|
.mpStyle .mB, .mpStyle [class*="_mB"] { margin-bottom: var(--dMP); }
|
|
.mpStyle .mB_xs, .mpStyle [class*="_mB_xs"] { margin-bottom: var(--dMP_xs); }
|
|
.mpStyle .mL, .mpStyle [class*="_mL"] { margin-left: var(--dMP); }
|
|
.mpStyle .mL_xs, .mpStyle [class*="_mL_xs"] { margin-left: var(--dMP_xs); }
|
|
.mpStyle .mL_20, .mpStyle [class*="_mL_20"] { margin-left: 20px; }
|
|
.mpStyle .mL_25, .mpStyle [class*="_mL_25"] { margin-left: 25px; }
|
|
.mpStyle .mTB, .mpStyle [class*="_mTB"] { margin: var(--dMP) 0; }
|
|
.mpStyle .mTB_xs, .mpStyle [class*="_mTB_xs"] { margin: var(--dMP_xs) 0; }
|
|
.mpStyle .mLR, .mpStyle [class*="_mLR"] { margin: 0 var(--dMP); }
|
|
.mpStyle .mLR_xs, .mpStyle [class*="_mLR_xs"] { margin: 0 var(--dMP_xs); }
|
|
/***************/
|
|
div.mpStyle .mp_zero { margin: 0; padding: 0; }
|
|
/***************/
|
|
.mpStyle .oAuto, .mpStyle [class*="_oAuto"] { overflow: auto; }
|
|
.mpStyle .ovAuto, .mpStyle [class*="_ovAuto"] { overflow: auto; }
|
|
.mpStyle .ovAuto > *, .mpStyle [class*="_ovAuto"] > *,
|
|
.mpStyle .ovHidden, .mpStyle [class*="_ovHidden"] { overflow: hidden; }
|
|
/***************/
|
|
.mpStyle .offsetRight_1 { margin-right: 8.3333333333%; }
|
|
/***************/
|
|
.mpStyle .textUppercase { text-transform: uppercase; }
|
|
/*****************/
|
|
.mpStyle .noBR, .mpStyle [class*="_noBR"] { border: none; -webkit-border-radius: 0; border-radius: 0; }
|
|
/*****************/
|
|
.mpStyle .contentScroll { overflow: auto; }
|
|
/*****************/
|
|
.mpStyle .verticalTop, .mpStyle [class*="_verticalTop"] { vertical-align: top; }
|
|
/*****************/
|
|
/*****************/
|
|
@media only screen and (max-width: 900px) {
|
|
.mpStyle .hidden_sm { display: none; }
|
|
}
|
|
@media only screen and (max-width: 767px) {
|
|
.mpStyle .hidden_xs { display: none; }
|
|
}
|
|
}
|
|
/******************************************************************** Loader Section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div[class*="dLoader"],
|
|
div[class*="simpleSpinner"] { position: absolute; z-index: 11111; left: 0; right: 0; top: 0; bottom: 0; font-size: var(--fs_h1); width: 100%; height: 100%; }
|
|
div[class*="dLoader"] { background: #0003; color: var(--color_theme); }
|
|
div[class*="dLoader"].pFixed { position: fixed; max-width: 100vw; max-height: 100vh; }
|
|
div.dLoader_xs { font-size: var(--fs_h5); }
|
|
div[class*="dLoader"].border_spin_loader span {
|
|
border-top: 5px solid var(--color_theme_alter); border-right: 5px solid var(--color_theme);
|
|
border-bottom: 5px solid var(--color_theme_alter); border-left: 5px solid var(--color_theme);
|
|
width: 60px; height: 60px;
|
|
-webkit-animation: spin 1000ms linear infinite; animation: spin 1000ms linear infinite;
|
|
}
|
|
div[class*="dLoader_xs"].border_spin_loader span { border-width: 2px; width: 20px; height: 20px; }
|
|
@keyframes spin {
|
|
0% { transform: rotate(0deg); }
|
|
25% { transform: rotate(90deg); }
|
|
50% { transform: rotate(180deg); }
|
|
75% { transform: rotate(270deg); }
|
|
100% { transform: rotate(360deg); }
|
|
}
|
|
div[class*="simpleSpinner"] { padding: var(--dMP); color: var(--color_theme); }
|
|
/******/
|
|
.placeholderLoader .placeholder_area { background-color: #FFF; position: relative; padding: var(--dMP_xs); }
|
|
.placeholderLoader .placeholder_area::before {
|
|
position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 111; content: '';
|
|
/*background: #f6f7f8;*/
|
|
/*background: linear-gradient(to right, rgba(255, 255, 255, 0) 46%, rgba(255, 255, 255, 0.35) 50%, rgba(255, 255, 255, 0) 54%) 50% 50%;*/
|
|
background: linear-gradient(to right, rgba(255, 255, 255, 0) 2%, rgba(255, 255, 255, 0.4) 18%, rgba(255, 255, 255, 0) 33%);
|
|
-webkit-animation: placeholderAnimate 3s linear infinite; animation: placeholderAnimate 3s linear infinite;
|
|
}
|
|
.placeholderLoader [data-placeholder] { position: relative; overflow: hidden; }
|
|
.placeholderLoader [data-placeholder]::before { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 11; content: ''; background: #DDD; }
|
|
@-webkit-keyframes placeholderAnimate {
|
|
0% { background-position: -100% 0; }
|
|
100% { background-position: 100% 0; }
|
|
}
|
|
@keyframes placeholderAnimate {
|
|
0% { background-position: -1000px 0; }
|
|
100% { background-position: 1000px 0; }
|
|
}
|
|
}
|
|
/******************************************************************** Menu section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
nav.mpStyle { background-color: var(--color_4); }
|
|
.mpStyle .mpMenu li { position: relative; border-left: 1px dotted var(--color_border); }
|
|
.mpStyle .mpMenu li:last-child { border-right: 1px dotted var(--color_border); }
|
|
.mpStyle .mpMenu li a { color: var(--color_white); font-weight: 500; text-align: center; font-size: var(--fs_h6); padding: var(--dMP) var(--dMP_xs); width: 100%; }
|
|
.mpStyle .mpMenu li a:hover { color: var(--color_theme); }
|
|
.mpStyle .mpMenu li.current_page_item a { color: var(--color_5); }
|
|
.mpStyle .mpSubMenu { display: none; position: absolute; top: 100%; left: 0; right: 0; background-color: var(--color_4); min-width: 280px; z-index: 111111; }
|
|
.mpStyle .mpSubMenu .mpSubMenu { top: -1px; left: 100%; border-left: 2px solid var(--color_theme); }
|
|
.mpStyle .mpMenu li:last-child .mpSubMenu { right: 0; left: inherit; }
|
|
.mpStyle .mpMenu li:hover > .mpSubMenu { display: block; }
|
|
.mpStyle .mpSubMenu { border-top: 1px dotted var(--color_border); border-bottom: 1px dotted var(--color_border); }
|
|
.mpStyle .mpSubMenu li { border-bottom: 1px dotted var(--color_border); border-left: none; border-right: none; }
|
|
.mpStyle .mpSubMenu li a { padding: var(--dMP_xs); text-align: left; }
|
|
.mpStyle .mpSubMenu li:last-child { border: none; }
|
|
.mpStyle .menu-item-has-children > a::after { content: '✛'; margin: 0 0 0 10px; color: var(--color_theme); font-weight: bold; float: right; }
|
|
}
|
|
/******************************************************************** Image/slider Section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle img:not(.mp_wp_editor img) {width: 100%;height: auto;max-width: 100%;}
|
|
/*******Click slider***************/
|
|
.mpStyle [class*='clickSlide'] {
|
|
background-color: var(--color_white);
|
|
padding: var(--dMP);
|
|
}
|
|
.mpStyle [class*='slideItem'] {
|
|
display: none;
|
|
}
|
|
.mpStyle [class*='slideItem'].active {
|
|
display: block;
|
|
}
|
|
.mpStyle [class*='slideItem'] img {
|
|
width: 100%;
|
|
}
|
|
.mpStyle [class*='slideIndicator'] {
|
|
margin: var(--dMP) 0 0 0;
|
|
}
|
|
.mpStyle [class*='slideIndicatorItem'] {
|
|
border: 3px solid var(--color_border);
|
|
margin: 0 5px;
|
|
background-color: var(--color_border);
|
|
}
|
|
.mpStyle [class*='slideIndicatorItem'].active {
|
|
border-color: var(--color_active);
|
|
background-color: var(--color_active)
|
|
}
|
|
.mpStyle [class*='slideIndicatorItem'] img {
|
|
height: 30px;
|
|
width: auto;
|
|
}
|
|
.mpStyle [class*='slideIndicatorItem'].active img {
|
|
height: 35px;
|
|
}
|
|
/***********Bg Image****************/
|
|
div.bg_image_area { width: 100%; overflow: hidden; position: relative; height: max-content; }
|
|
[data-bg-image] { background-size: 100% 100%; background-position: center center; position: relative; height: 100%; width: 100%; min-height: inherit;}
|
|
[data-bg-image] > * { color: #FFF; }
|
|
div.bg_image_area:hover [data-bg-image],
|
|
[data-bg-image]:hover { -ms-transform: scale(1.1); transform: scale(1.1); -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
|
|
[data-href] { cursor: pointer; }
|
|
[data-bg-image].circle {overflow: hidden;}
|
|
/**************** Super slider **********************************************/
|
|
div.superSlider .iconIndicator,
|
|
div.superSlider .sliderPopup .popupClose {
|
|
-webkit-transition: 350ms ease-in-out;
|
|
-moz-transition: 350ms ease-in-out;
|
|
-o-transition: 350ms ease-in-out;
|
|
transition: 350ms ease-in-out;
|
|
}
|
|
/******************************/
|
|
div.superSlider .sliderPopup.in,
|
|
div.superSlider .sliderPopup .popupClose,
|
|
div.superSlider .slideIndicator,
|
|
div.superSlider .sliderMoreItem {
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
-webkit-justify-content: center;
|
|
justify-content: center;
|
|
-webkit-align-items: center;
|
|
align-items: center;
|
|
}
|
|
/***************************/
|
|
div.superSlider {
|
|
overflow: hidden;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
background-color: #FFF;
|
|
position: relative;
|
|
}
|
|
div.superSlider .area_column {
|
|
-webkit-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
div.superSlider .sliderAllItem {
|
|
width: 100%;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
div.superSlider .sliderItem img {
|
|
width: 100%;
|
|
max-height: 100%;
|
|
}
|
|
div.superSlider .sliderItem {
|
|
position: relative;
|
|
float: left;
|
|
width: 100%;
|
|
margin-right: -100%;
|
|
-ms-transform: translateX(100%);
|
|
transform: translateX(100%);
|
|
backface-visibility: hidden;
|
|
-webkit-transition: -webkit-transform .06s ease-in-out;
|
|
transition: transform .6s ease-in-out, -webkit-transform .6s ease-in-out;
|
|
}
|
|
div.superSlider .sliderItem.activeSlide {
|
|
z-index: 1;
|
|
transform: translateX(0);
|
|
}
|
|
div.superSlider .sliderItem.prevSlider {
|
|
transform: translateX(-100%);
|
|
z-index: 0;
|
|
}
|
|
div.superSlider .sliderItem.nextSlider {
|
|
transform: translateX(100%);
|
|
z-index: 0;
|
|
}
|
|
/*************Image Showcase***************/
|
|
div.superSlider .sliderShowcase {
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
-webkit-justify-content: space-between;
|
|
justify-content: space-between;
|
|
}
|
|
div.superSlider .sliderShowcase.right,
|
|
div.superSlider .sliderShowcase.left {
|
|
width: 18.65%;
|
|
min-width: 18.65%;
|
|
-webkit-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
div.superSlider .sliderShowcase.style_2,
|
|
div.superSlider .sliderShowcase.style_2 {
|
|
width: 39%;
|
|
min-width: 39%;
|
|
-webkit-flex-direction: initial;
|
|
flex-direction: initial;
|
|
-webkit-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
}
|
|
div.superSlider .sliderShowcase.style_2 > div {
|
|
width: calc(50% - 5px);
|
|
margin: 0 var(--dMP_xs) 0 0;
|
|
}
|
|
div.superSlider .sliderShowcase.style_2 > div:first-child {
|
|
width: 100%;
|
|
margin: 0 0 var(--dMP_xs) 0;
|
|
}
|
|
div.superSlider .sliderShowcase.style_2 > div:last-child {
|
|
margin: 0;
|
|
}
|
|
div.superSlider .sliderShowcase.left {
|
|
margin: 0 var(--dMP_xs) 0 0;
|
|
}
|
|
div.superSlider .sliderShowcase.right {
|
|
margin: 0 0 0 var(--dMP_xs);
|
|
}
|
|
div.superSlider .area_column .sliderShowcase {
|
|
width: 100%;
|
|
min-width: 100%;
|
|
}
|
|
div.superSlider .sliderShowcase.top {
|
|
margin: 0 0 var(--dMP_xs) 0;
|
|
}
|
|
div.superSlider .sliderShowcase.bottom {
|
|
margin: var(--dMP_xs) 0 0 0;
|
|
}
|
|
div.superSlider .sliderShowcaseItem {
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
div.superSlider .area_column .sliderShowcaseItem {
|
|
width: calc(25% - var(--dMP_xs));
|
|
}
|
|
div.superSlider .sliderShowcase div.superSlider .area_column {
|
|
margin: 0 0 var(--dMP_xs) 0;
|
|
position: relative;
|
|
cursor: pointer;
|
|
overflow: hidden;
|
|
}
|
|
div.superSlider .sliderShowcaseItem img {
|
|
height: 100%;
|
|
}
|
|
div.superSlider .sliderMoreItem {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
-webkit-border-radius: 5px;
|
|
border-radius: 5px;
|
|
background-color: #000B;
|
|
font-size: 18px;
|
|
color: #FFF;
|
|
}
|
|
div.superSlider .sliderMoreItem span {
|
|
margin: 0 5px;
|
|
font-size: 10px;
|
|
}
|
|
div.superSlider .sliderMoreItem span:last-child {
|
|
font-size: 18px;
|
|
}
|
|
/*******image indicator***************/
|
|
div.superSlider .slideIndicator {
|
|
-webkit-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
margin: 5px -5px;
|
|
}
|
|
div.superSlider .slideIndicatorItem {
|
|
border: 3px solid #DDD;
|
|
margin: 5px;
|
|
background-color: #DDD;
|
|
width: 75px;
|
|
overflow: hidden;
|
|
position: relative;
|
|
}
|
|
div.superSlider .slideIndicatorItem.activeSlide {
|
|
border-color: var(--color_active);
|
|
background-color: var(--color_active);
|
|
}
|
|
/*******Icon indicator***************/
|
|
div.superSlider .iconIndicator {
|
|
position: absolute;
|
|
z-index: 111;
|
|
top: calc(50% - 15px);
|
|
font-size: 30px;
|
|
cursor: pointer;
|
|
color: #222;
|
|
}
|
|
div.superSlider .iconIndicator:hover {
|
|
color: #FFF;
|
|
}
|
|
div.superSlider .iconIndicator.prevItem {
|
|
left: 20px;
|
|
}
|
|
div.superSlider .iconIndicator.nextItem {
|
|
right: 20px;
|
|
}
|
|
/*************popup slider***************/
|
|
[data-target-popup] {
|
|
cursor: pointer;
|
|
}
|
|
div.superSlider .sliderPopup div.superSlider {
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
-webkit-justify-content: space-between;
|
|
justify-content: space-between;
|
|
-webkit-flex-direction: column;
|
|
flex-direction: column;
|
|
-webkit-align-items: center;
|
|
align-items: center;
|
|
height: 100%;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
margin: 0;
|
|
position: relative;
|
|
}
|
|
div.superSlider .sliderPopup {
|
|
display: none;
|
|
position: fixed;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
z-index: 1111;
|
|
overflow: hidden auto;
|
|
background: #000C;
|
|
}
|
|
div.superSlider .sliderPopup .popupClose {
|
|
position: absolute;
|
|
z-index: 1111;
|
|
cursor: pointer;
|
|
top: 100%;
|
|
right: 50px;
|
|
width: 50px;
|
|
height: 50px;
|
|
background-color: #FFF;
|
|
color: #222;
|
|
font-size: 20px;
|
|
}
|
|
div.superSlider .sliderPopup .popupClose:hover {
|
|
color: #FFF;
|
|
background-color: #222;
|
|
}
|
|
div.superSlider .sliderPopup .sliderAllItem {
|
|
height: 70vh;
|
|
background-color: transparent;
|
|
margin: 0 auto;
|
|
overflow: hidden;
|
|
position: relative;
|
|
}
|
|
div.superSlider .sliderPopup .sliderAllItem img {
|
|
width: auto;
|
|
height: 100%;
|
|
}
|
|
div.superSlider .sliderPopup .popupHeader {
|
|
border-bottom: 1px solid #FFF;
|
|
}
|
|
div.superSlider .sliderPopup .popupHeader,
|
|
div.superSlider .sliderPopup .popupFooter {
|
|
color: #FFF;
|
|
padding: 15px;
|
|
max-height: 15vh;
|
|
overflow: hidden auto;
|
|
margin: 0 auto;
|
|
width: 100%;
|
|
background-color: #222;
|
|
position: relative;
|
|
}
|
|
div.superSlider .sliderPopup .popupHeader {
|
|
overflow: visible;
|
|
}
|
|
div.superSlider .sliderPopup .popupHeader h2 {
|
|
color: #FFF;
|
|
text-align: center;
|
|
}
|
|
div.superSlider .sliderPopup .popupFooter {
|
|
border-top: 1px solid #FFF;
|
|
}
|
|
div.superSlider .sliderPopup .popupBody {
|
|
position: relative;
|
|
width: 80%;
|
|
max-width: 100vh;
|
|
}
|
|
div.superSlider .sliderPopup .slideIndicator {
|
|
margin: 0;
|
|
}
|
|
}
|
|
/******************************************************************** Layout Section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
/***********Circular***********/
|
|
.mpStyle .circleIcon, .mpStyle [class*="_circleIcon"] { width: 40px; height: 40px; min-width: 40px; background-color: var(--color_theme); color: var(--color_theme_alter); margin: 0 var(--dMP) 0 0; }
|
|
.mpStyle .circleIcon_xs, .mpStyle [class*="_circleIcon_xs"] { width: 25px; height: 25px; min-width: 25px; font-size: var(--fs_small); margin: 0 var(--dMP_xs) 0 0; }
|
|
/*****Remove icon******/
|
|
.mpStyle .mp_remove_area { position: relative; }
|
|
.mpStyle .mp_remove_icon { position: absolute; top: -5px; right: -5px; width: 20px; height: 20px; cursor: pointer; opacity: 0; font-size: var(--fs); background-color: var(--color_danger); color: var(--color_theme_alter); }
|
|
/**************Default************************/
|
|
.mpStyle .dLayout, .mpStyle [class*="_dLayout"] { padding: var(--dMP); margin-bottom: var(--dMP); background-color: var(--color_white); border: 1px solid var(--color_border); }
|
|
.mpStyle .dLayout_xs, .mpStyle [class*="_dLayout_xs"] { padding: var(--dMP_xs); background-color: var(--color_white); border: 1px solid var(--color_border); margin-bottom: var(--dMP_xs); }
|
|
/***********info***********/
|
|
.mpStyle .infoLayout, .mpStyle [class*="_infoLayout"] { padding: var(--dMP); background-color: var(--color_light); margin-bottom: var(--dMP); }
|
|
.mpStyle .infoLayout_xs, .mpStyle [class*="_infoLayout_xs"] { padding: var(--dMP_xs); margin-bottom: var(--dMP_xs); }
|
|
}
|
|
/******************************************************************** position Section************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
/********Absolute Content********/
|
|
.mpStyle .pFixed, .mpStyle [class*="_pFixed"] { position: fixed; }
|
|
.mpStyle .pRelative, .mpStyle [class*="_pRelative"] { position: relative; }
|
|
.mpStyle [class*="pRelative"]:hover [class*="hoverAbsolute"] { display: block; }
|
|
.mpStyle .pAbsolute, .mpStyle [class*="_pAbsolute"] { position: absolute; }
|
|
.mpStyle .fullAbsolute, .mpStyle [class*="_fullAbsolute"] { position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 11; width: 100%; height: 100%; }
|
|
.mpStyle [class*="hoverAbsolute"] { position: absolute; right: 0; top: 100%; left: 0; display: none; padding: 7px; border: 1px solid var(--color_border); font-size: 15px; z-index: 111; }
|
|
.mpStyle .abTopRight, .mpStyle [class*="_abTopRight"] { position: absolute; right: 0; top: 0; }
|
|
.mpStyle .abTopRight_xs, .mpStyle [class*="_abTopRight_xs"] { position: absolute; right: var(--dMP_xs); top: var(--dMP_xs); }
|
|
.mpStyle .abTopLeft_xs, .mpStyle [class*="_abTopLeft_xs"] { position: absolute; left: var(--dMP_xs); top: var(--dMP_xs); z-index: 1; }
|
|
.mpStyle .abTopLeft, .mpStyle [class*="_abTopLeft"] { position: absolute; left: var(--dMP); top: var(--dMP); z-index: 1; }
|
|
.mpStyle .abBottomRight, .mpStyle [class*="_abBottomRight"] { position: absolute; right: -1px; bottom: -1px; z-index: 1; padding: 5px; font-size: 20px; font-weight: 500; }
|
|
.mpStyle .abLeftRightBottom, .mpStyle [class*="_abLeftRightBottom"] { position: absolute; left: 0; right: 0; top: 100%; z-index: 111; padding: var(--dMP_xs); }
|
|
.mpStyle .abLeftRightBottom_inside, .mpStyle [class*="_abLeftRightBottom_inside"] { position: absolute; left: 0; right: 0; top: inherit; bottom: 0; z-index: 111; padding: var(--dMP_xs); }
|
|
/****************/
|
|
.mpStyle .ribbon { position: absolute; top: var(--dMP); left: 0; width: auto; height: auto; padding: 5px var(--dMP); background: var(--color_warning); color: #FFF; border-radius: 3px 6px 6px 0; -webkit-box-shadow: 1px 2px 2px 0 rgba(0, 0, 0, 0.4); box-shadow: 1px 2px 2px 0 rgba(0, 0, 0, 0.4); z-index: 1; }
|
|
.mpStyle .ribbon::before { content: ''; position: absolute; left: 0; bottom: -10px; width: 0; height: 0; border: 5px solid var(--color_warning); border-bottom-color: transparent; border-left-color: transparent; z-index: -1; }
|
|
/****************/
|
|
.mpStyle .title_on_border { line-height: 1; height: 40px; position: absolute; top: -20px; left: 30px; color: var(--color_theme); background-color: var(--color_theme_alter); padding: 0 var(--dMP); border-radius: var(--dBR); }
|
|
/********fixed Content********/
|
|
div.mpStyle .mp_sticky_area.mpSticky { position: fixed; }
|
|
div.mpStyle .mp_sticky_area.mpSticky .mp_sticky_on_scroll { overflow: auto;z-index: 1111; }
|
|
}
|
|
/******************************************************************** Form section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle input,
|
|
.mpStyle optgroup,
|
|
.mpStyle select,
|
|
.mpStyle textarea,
|
|
.mpStyle button { font-family: inherit; line-height: 1.25; margin: 0; }
|
|
.mpStyle .formControl:-webkit-autofill,
|
|
.mpStyle .formControl:-webkit-autofill:hover,
|
|
.mpStyle .formControl:-webkit-autofill:focus,
|
|
.mpStyle .formControl:-webkit-autofill:active { -webkit-transition: color 9999s ease-out, background-color 9999s ease-out; transition: color 9999s ease-out, background-color 9999s ease-out; -webkit-transition-delay: 9999s; transition-delay: 9999s; }
|
|
div.mpStyle form { margin: 0; padding: 0; line-height: 1.25; }
|
|
.mpStyle label { position: relative; }
|
|
.mpStyle label span:not(.woocommerce-Price-currencySymbol) { margin: 0 var(--dMP_xs) 0 0;white-space: nowrap }
|
|
/***************************/
|
|
.mpStyle .formControl::placeholder { color: #0005; }
|
|
.mpStyle .formControl:disabled { background-color: #DDD5; color: #FFF; }
|
|
/***************************/
|
|
div.mpStyle .formControl { width: 100%; height: auto; min-width: auto; max-width: inherit; min-height: 34px; border: 1px solid var(--color_border); padding: 5px var(--dMP_xs); font-size: var(--fs); color: var(--d_color); background-color: #FFF; }
|
|
.mpStyle .formControl:focus { outline: 0; background-color: #FFF; border-color: #80BDFF; }
|
|
div.mpStyle select.formControl {
|
|
background-image: url('../images/arrow_down.png');background-repeat: no-repeat;background-position: calc(100% - var(--dMP_xs));background-size: auto;
|
|
-webkit-appearance: none; padding: var(--dMP_xs) 35px var(--dMP_xs) var(--dMP_xs);
|
|
}
|
|
div.mpStyle select.formControl:focus { background-color: var(--color_theme_aa); }
|
|
div.mpStyle .formControl.date_type,
|
|
div.mpStyle .formControl[type='date'] {
|
|
background-image: url('../images/calendar.png');background-repeat: no-repeat; background-position: var(--dMP_xs) center; background-size: auto;
|
|
-webkit-appearance: none;
|
|
font-size: var(--fs_h6); font-weight: var(--fw-medium);
|
|
padding: var(--dMP_xs) var(--dMP_xs) var(--dMP_xs) 50px;
|
|
}
|
|
div.mpStyle textarea.formControl { height: auto; }
|
|
.mpStyle .mpForm label { margin: var(--dMP_xs) 0 0 0; text-transform: capitalize; }
|
|
.mpStyle .mpForm label span { width: 100%; margin: 0 0 var(--dMP_xs) 0; }
|
|
.mpStyle .mpForm label span::before { padding: 0 var(--dMP_xs); }
|
|
/****************/
|
|
.mpStyle .inputList { margin: var(--dMP) 0 0 0; position: relative; }
|
|
.mpStyle .inputList textarea.formControl { height: auto; }
|
|
/******* group form*********/
|
|
.mpStyle .inputGroup { width: 100%; padding: 0 0 var(--dMP_xs) 0; }
|
|
.mpStyle .inputGroup label { width: auto; padding: 0 var(--dMP) 0 0; }
|
|
.mpStyle .inputGroup label input[type="checkbox"] { margin: 0 var(--dMP_xs); }
|
|
/******* input as a select*********/
|
|
div.mpStyle div.mp_input_select .formControl:focus { border-color: var(--color_border); }
|
|
.mpStyle div.mp_input_select { position: relative; }
|
|
.mpStyle ul.mp_input_select_list {
|
|
display: none; z-index: 111; overflow: auto;
|
|
max-height: 250px; height: auto; width: 100%;
|
|
margin: 1px 0 0 0; padding: 10px;
|
|
position: absolute; left: 0; top: 100%; right: 0;
|
|
border: 1px solid var(--color_border); background-color: var(--color_white);
|
|
}
|
|
.mpStyle ul.mp_input_select_list li { padding: 10px; cursor: pointer; border-bottom: 1px solid var(--color_border); margin: 0; list-style-type: none; }
|
|
.mpStyle ul.mp_input_select_list li:last-child { border-bottom: none; }
|
|
.mpStyle ul.mp_input_select_list li:hover { background-color: #777; color: #FFF; }
|
|
/*****Form inline*******/
|
|
.mpStyle .inputInline { padding: var(--dMP); margin: var(--dMP) 0 0 0; }
|
|
.mpStyle .inputInline .inputList { max-width: calc(20% - 10px); width: 100%; margin: 0 5px; }
|
|
/********Form Horizontal**************/
|
|
.mpStyle .inputHorizontal .mpForm { max-width: 500px; width: 100%; }
|
|
/**********Checkbox Radio*********/
|
|
div.mpStyle .customRadioLabel { font-size: var(--fs_h6); font-weight: var(--fw-medium); -webkit-flex-wrap: wrap; flex-wrap: wrap; }
|
|
div.mpStyle .customRadioLabel input[type="radio"] ~ .formControl,
|
|
.mpStyle .customRadioLabel input[type="radio"] { display: none; }
|
|
.mpStyle .customRadio { padding: 0 var(--dMP_xs) 0 30px; margin: 0 var(--dMP_xs) var(--dMP_xs) 0; position: relative; cursor: pointer; line-height: 1; white-space: nowrap; min-height: 20px; }
|
|
.mpStyle .customRadio::before { content: ""; position: absolute; left: 0; top: 0; height: 20px; width: 20px; background-color: #FFF; border: 2px rgba(0, 0, 0, 0.5) solid;; border-radius: 50%; }
|
|
.mpStyle .customRadioLabel input[type="radio"]:checked ~ .formControl { display: block; }
|
|
.mpStyle .customRadioLabel input[type="radio"]:checked ~ .customRadio::after,
|
|
.mpStyle .customRadio.active::after { content: ""; position: absolute; left: 5px; top: 5px; height: 10px; width: 10px; background-color: var(--color_theme); border: 1px solid rgba(0, 0, 0, 0.5); border-radius: 50%; }
|
|
.mpStyle .customRadio.button_type {
|
|
padding: var(--dMP_xs); margin: 5px; min-width: 120px; text-align: center;
|
|
border: 1px solid var(--color_theme_alter);
|
|
color: var(--color_theme_alter); background-color: var(--color_theme);
|
|
}
|
|
.mpStyle .customRadio.button_type.active { background-color: grey; color: var(--color_theme_alter); }
|
|
.mpStyle .customRadio.button_type::before,
|
|
.mpStyle .customRadio.button_type::after { display: none; }
|
|
/**********Checkbox Custom*********/
|
|
.mpStyle .customCheckbox { padding: 3px 0 0 30px; position: relative; line-height: 1; min-width: auto; }
|
|
.mpStyle .customCheckbox::before {
|
|
content: ""; position: absolute; left: 0; top: 0; height: 20px; width: 20px;
|
|
background-color: var(--color_theme_alter);
|
|
border: 2px solid var(--d_color); border-radius: 2px; }
|
|
.mpStyle .customCheckboxLabel { padding: 0 0 10px 0; cursor: pointer; font-weight: var(--fw-medium); }
|
|
.mpStyle .customCheckboxLabel input:checked ~ .customCheckbox::before { background: var(--d_color); }
|
|
/*******************/
|
|
div.mpStyle .selectCheckbox { min-width: 150px; padding: var(--dMP_xs); width: auto; border: 1px solid var(--color_border); cursor: pointer; }
|
|
div.mpStyle .customCheckboxLabel input[type="checkbox"],
|
|
div.mpStyle .selectCheckbox input[type='checkbox'] { display: none; }
|
|
div.mpStyle .selectCheckbox .customCheckbox::before { border: none; background-color: transparent; }
|
|
div.mpStyle .customCheckboxLabel input:focus ~ .customCheckbox::before,
|
|
div.mpStyle .selectCheckbox input:focus ~ .customCheckbox::before { outline: 0; }
|
|
div.mpStyle .customCheckboxLabel input:checked ~ .customCheckbox::after,
|
|
div.mpStyle .selectCheckbox input:checked ~ .customCheckbox::after {
|
|
content: ""; position: absolute; left: 2px; top: 4px; height: 8px; width: 16px;
|
|
border: 2px solid var(--color_theme_alter); border-top: none; border-right: none;
|
|
z-index: 11; background-color: transparent; -ms-transform: rotate(-45deg); transform: rotate(-45deg);
|
|
}
|
|
div.mpStyle .active_select { background-color: var(--color_theme); color: var(--color_theme_alter); }
|
|
div.mpStyle .customCheckboxLabel.only_checkbox {width: 20px;margin: 0;}
|
|
div.mpStyle .customCheckboxLabel.only_checkbox span {padding: 0;}
|
|
/*********Input Switch*******/
|
|
.mpStyle .roundSwitchLabel input[type='checkbox'] { display: none; }
|
|
.mpStyle .roundSwitch {
|
|
width: 60px; height: 25px; min-width: auto;
|
|
position: relative; background-color: #CCC; border-radius: 30px;
|
|
-webkit-transition: .4s; transition: .4s;
|
|
}
|
|
.mpStyle .roundSwitch::before {
|
|
position: absolute; content: "";height: 17px; width: 17px; left: 4px; bottom: 4px;
|
|
background-color: white; border-radius: 50%;
|
|
-webkit-transition: .4s; transition: .4s;
|
|
}
|
|
.mpStyle .roundSwitchLabel input:checked + .roundSwitch { background-color: var(--color_success); }
|
|
.mpStyle .roundSwitchLabel input:focus + .roundSwitch { box-shadow: 0 0 1px #2276D2; }
|
|
.mpStyle .roundSwitchLabel input:checked + .roundSwitch:before { -ms-transform: translateX(35px); transform: translateX(35px); }
|
|
/*********Group radio check*******/
|
|
.groupRadioCheck [data-radio-check] { cursor: pointer; -webkit-justify-content: flex-start; justify-content: flex-start; }
|
|
.groupRadioCheck button[data-radio-check] { -webkit-justify-content: center; justify-content: center; }
|
|
.groupRadioCheck [data-radio-check]:hover { border-color: var(--color_theme_88); }
|
|
.groupRadioCheck [data-radio-check].mpActive { border-color: var(--color_theme); }
|
|
/*********Group Content*******/
|
|
.mpStyle .groupContent {
|
|
font-size: var(--fs); border: 1px solid var(--color_border);
|
|
background-color: var(--color_theme); color: var(--color_theme_alter);
|
|
text-align: center; position: relative;
|
|
}
|
|
div.mpStyle div.groupContent > * { border-left: 1px solid var(--color_border); margin: 0; }
|
|
div.mpStyle div.groupContent > *:first-child { border: none; }
|
|
div.mpStyle div.groupContent .formControl { text-align: center; border: none; background-color: var(--color_white); height: 100%; border-radius: 0; }
|
|
.mpStyle .groupContent textarea.formControl { text-align: left; }
|
|
.mpStyle .groupContent input[type="radio"] { }
|
|
.mpStyle .groupContent input[type="radio"]::after {
|
|
position: absolute; content: ''; width: 20px; height: 20px; left: 0; top: 0;
|
|
border: 1px solid var(--color_border); border-radius: 50%;margin: 10px;
|
|
}
|
|
div.mpStyle .groupContent input[type="radio"]:checked::after { border-color: var(--color_theme); }
|
|
.mpStyle .groupContent input[type="radio"]:checked::before {
|
|
position: absolute; content: ''; width: 14px; height: 14px; left: 3px; top: 3px;
|
|
border: 1px solid var(--color_theme); border-radius: 50%; background-color: var(--color_theme);margin: 10px;
|
|
}
|
|
.mpStyle .addonGroupContent { min-width: 30px; cursor: pointer; background-color: #FFF; color: var(--color_theme_88); }
|
|
.mpStyle .addonGroupContent:hover { background-color: #555; color: #F2F2F2; }
|
|
.mpStyle .groupContent .select2-container--default .select2-selection--single {border: none;border-radius: 0;}
|
|
/*****Form Qty inc dec*******/
|
|
.mpStyle .qtyIncDec { max-width: 100px; }
|
|
/**********Responsive*********/
|
|
@media only screen and (max-width: 1250px) {
|
|
.mpStyle .inputInline .inputList { max-width: calc(25% - 10px); }
|
|
}
|
|
@media only screen and (max-width: 1050px) {
|
|
.mpStyle .inputInline .inputList { max-width: calc(33.33% - 10px); }
|
|
}
|
|
@media only screen and (max-width: 850px) {
|
|
.mpStyle .inputInline .inputList { max-width: calc(50% - 10px); }
|
|
}
|
|
@media only screen and (max-width: 600px) {
|
|
.mpStyle .inputInline .inputList { max-width: 100%; min-width: 100%; }
|
|
}
|
|
@media only screen and (max-width: 450px) {
|
|
.mpStyle .addonGroupContent { min-width: 25px; }
|
|
}
|
|
}
|
|
/******************************************************************** List section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle ul:not(.mp_wp_editor ul) { list-style-type: none; margin: 0; padding: 0; line-height: 1.25; }
|
|
.mpStyle ul li { margin: 0; padding: 0; line-height: inherit; }
|
|
/******List inline**********/
|
|
.mpStyle ul.listInline li { text-align: center; border-right: 1px solid; }
|
|
.mpStyle ul.listInline li:last-child { border: none; }
|
|
.mpStyle ul.listInline li a { padding: var(--dMP_xs); display: block; }
|
|
.mpStyle ul.listInline li.mage_active { background-color: var(--color_active) }
|
|
.mpStyle ul.listInline li.mage_active a { color: #FFF; }
|
|
/******list Horizontal*****/
|
|
.mpStyle ul.mp_list { margin: var(--dMP_xs) 0 0 0; }
|
|
.mpStyle ul.mp_list li { padding: 5px 0; border-bottom: 1px dotted var(--color_border); width: 100%; }
|
|
.mpStyle ul.mp_list li:last-child { border: none; }
|
|
/******All in one line*****/
|
|
.mpStyle ul.listEqual li { text-align: center; border-right: 1px solid; }
|
|
.mpStyle ul.listEqual li a { padding: var(--dMP_xs); display: block; }
|
|
.mpStyle ul.listEqual li.mage_active { background-color: var(--color_active) }
|
|
.mpStyle ul.listEqual li.mage_active a { color: #FFF; }
|
|
/***list inline two li***/
|
|
.mpStyle ul.list_inline_two li { width: 45%; padding: 5px; border-bottom: 1px solid var(--color_border); }
|
|
.mpStyle ul.list_inline_two li span { margin: 0 var(--dMP_xs) 0 0; }
|
|
}
|
|
/******************************************************************** Table section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle table { border-collapse: collapse; width: 100%; }
|
|
.mpStyle table.layoutFixed,
|
|
.mpStyle table[class*='_layoutFixed'] { table-layout: fixed; }
|
|
.mpStyle table th,
|
|
.mpStyle table td { border: 1px solid var(--color_border); padding: var(--dMP_xs); }
|
|
.mpStyle table thead th {vertical-align: middle; padding: var(--dMP_xs); font-weight: bold; font-size: var(--fs); white-space: nowrap; background-color: var(--color_light); color: var(--d_color); }
|
|
.mpStyle table th { vertical-align: top; }
|
|
.mpStyle table td { padding: var(--dMP_xs); font-weight: var(--fw); font-size: var(--fs); line-height: 1.25; color: var(--d_color); vertical-align: middle; }
|
|
/**************/
|
|
.mpStyle table tr[data-collapse].mActive { display: table-row; }
|
|
.mpStyle table th[data-collapse].mActive,
|
|
.mpStyle table td[data-collapse].mActive { display: table-cell; }
|
|
}
|
|
/******************************************************************** Tabs section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.mpStyle .tabLists,
|
|
.mpStyle .leftTabs { display: -webkit-flex; display: flex; }
|
|
.mpStyle .tabLists { font-size: var(--fs_h6); width: 100%; }
|
|
.mpStyle .tabLists span { margin: 0 var(--dMP_xs) 0 0; }
|
|
.leftTabs > .tabLists { -webkit-flex-flow: column; flex-flow: column; min-width: 250px; max-width: 250px; }
|
|
div.mpStyle [data-tabs-target] {
|
|
display: -webkit-flex; display: flex;
|
|
-webkit-align-items: center; align-items: center;
|
|
-webkit-flex-wrap: nowrap; flex-wrap: nowrap;
|
|
position: relative; text-align: left; cursor: pointer;
|
|
padding: var(--dMP_xs); color: var(--d_color);
|
|
}
|
|
.mpStyle [data-tabs-target]:hover { font-weight: var(--fw-medium); border-color: var(--color_theme); color: var(--color_theme) }
|
|
.mpStyle [data-tabs-target].active { font-weight: var(--fw-medium); background-color: var(--color_theme); color: var(--color_theme_alter); }
|
|
.topTabs [data-tabs-target] { border-right: 1px solid var(--color_border); -webkit-justify-content: center; justify-content: center; }
|
|
.topTabs [data-tabs-target]:last-child { border-right: none; }
|
|
.leftTabs [data-tabs-target] { border-bottom: 1px solid var(--color_border); }
|
|
.mpStyle .tabsContent { position: relative; overflow: hidden; width: 100%; padding: var(--dMP); }
|
|
.tabsContent [data-tabs] { display: none; }
|
|
/**************/
|
|
.mpTabs.tabBorder { border: 1px solid var(--color_border); }
|
|
.mpTabs.tabBorder > .tabLists { }
|
|
/******Tab next*********/
|
|
.mpStyle .mpTabsNext { }
|
|
.mpTabsNext .tabListsNext { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; }
|
|
.mpTabsNext .tabItemNext {
|
|
position: relative; min-height: 80px;
|
|
display: -webkit-flex; display: flex;
|
|
-webkit-align-items: center; align-items: center;
|
|
-webkit-flex-direction: column; flex-direction: column;
|
|
-webkit-flex: 1; flex: 1;
|
|
}
|
|
.mpTabsNext .tabItemNext [class*="circleIcon"] { background-color: var(--color_light); color: var(--d_color); margin: 0; z-index: 1; }
|
|
.mpTabsNext .tabItemNext .circleTitle { color: var(--d_color); margin: var(--dMP_xs) 0 0 0; left: 0; top: 40px; width: 100%; position: absolute; text-align: center; }
|
|
.mpTabsNext .tabItemNext.active [class*="circleIcon"] { background-color: var(--color_theme); color: var(--color_theme_alter); }
|
|
.mpTabsNext .tabItemNext.active [class*="circleIcon"].success {background-color: var(--color_success);}
|
|
.mpTabsNext .tabItemNext.active .circleTitle { color: var(--color_theme_aa); }
|
|
.mpTabsNext .tabItemNext.active .circleTitle.success {color: var(--color_success);}
|
|
.mpTabsNext .tabItemNext [class*="circleIcon"]::after { content: ""; right: 0; left: calc(50% + 20px); top: 20px; position: absolute; border-bottom: 1px solid var(--color_border); z-index: -1; width: 100%; }
|
|
.mpTabsNext .tabItemNext.active [class*="circleIcon"]::after { border-color: var(--color_theme); }
|
|
.mpTabsNext .tabItemNext:last-child [class*="circleIcon"]::after { border: none; width: 0; }
|
|
.mpStyle .tabsContentNext { position: relative; overflow: hidden; width: 100%; padding: var(--dMP); }
|
|
.tabsContentNext [data-tabs-next] { display: none; }
|
|
.tabsContentNext [data-tabs-next].active { display: block; }
|
|
.nextTab_prev_link {cursor: pointer;}
|
|
}
|
|
/******************************************************************** Panel section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.mpStyle .mpPanel { position: relative; border: 1px solid var(--color_border); border-radius: var(--dBR); }
|
|
div.mpStyle .mpPanelHeader { padding: 10px var(--dMP); background-color: #555; color: #FFF; }
|
|
div.mpStyle .mpPanelHeader .panelTitle,
|
|
div.mpStyle .mpPanelHeader .panelTitle span { color: #FFF; }
|
|
div.mpStyle .mpPanelBody { padding: var(--dMP); background-color: var(--color_3); overflow-x: auto; }
|
|
}
|
|
/******************************************************************** Faq section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.mp_faq_item {margin: 0 0 var(--dMP_xs) 0;}
|
|
div.mp_faq_item .mp_faq_title {background-color: #FFF;border: 1px solid #DDD;border-radius: 5px;font-weight: normal;text-transform: none;}
|
|
div.mp_faq_item .mp_faq_title.active {border-color: var(--color_theme);border-radius: 5px 5px 0 0;background-color: var(--color_theme);color: var(--color_theme_alter); }
|
|
div.mp_faq_item .mp_faq_title span {padding: 10px;}
|
|
div.mp_faq_content {background-color: #FFF;padding: var(--dMP);border: 1px solid var(--color_theme);border-radius: 0 0 5px 5px;overflow: hidden;color: #606b7b;font-size: var(--fs_label);}
|
|
div.mp_faq_item div.superSlider {min-width: 300px;max-width: 50%; margin: 0 var(--dMP_xs) var(--dMP_xs) 0;float: left;}
|
|
}
|
|
/******************************************************************** Popup section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
[data-target-popup] { cursor: pointer; }
|
|
div.mpPopup { display: none; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 111111; overflow: hidden; background: #000C; }
|
|
div.mpPopup .popupMainArea {
|
|
min-width: 500px; max-width: 700px; width: auto; min-height: 250px; max-height: 100vh; height: auto;
|
|
background-color: #FFF; border: 20px solid #444; position: relative;
|
|
display: -webkit-flex; display: flex;
|
|
-webkit-justify-content: space-between; justify-content: space-between;
|
|
-webkit-flex-flow: column; flex-flow: column;
|
|
}
|
|
div.mpPopup .popupMainArea.fullWidth { max-width: 100vw; width: 100%; }
|
|
div.mpPopup .popupClose { position: fixed; z-index: 1111; cursor: pointer; top: 50px; right: 50px; width: 50px; height: 50px; background-color: #444; color: #FFF; font-size: 20px; }
|
|
div.mpPopup .popupClose:hover { color: #FFF; background-color: #6B003E; }
|
|
div.mpPopup .popupHeader { border-bottom: 4px double var(--color_border); padding: var(--dMP_xs); }
|
|
div.mpPopup .popupBody { padding: var(--dMP); overflow: auto; }
|
|
div.mpPopup .popupFooter { border-top: 4px double var(--color_border); padding: var(--dMP_xs); }
|
|
div.mpPopup .dLayout, div.mpPopup [class*='_dLayout'] { margin: 0; }
|
|
}
|
|
/******************************************************************** Pagination section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.pagination_area { margin: var(--dMP_xs) 0 0 0; }
|
|
div.pagination_area button[class*="dButton_xs"] { min-width: 50px; }
|
|
div.pagination_area button.active_pagination { color: var(--color_theme_alter); background-color: var(--color_active); min-width: 75px; font-size: var(--fs_h4); }
|
|
div.pagination_area button.ellipse_left { display: none; }
|
|
div.pagination_area button.ellipse_left,
|
|
div.pagination_area button.ellipse_right { color: var(--color_theme); background-color: transparent; }
|
|
}
|
|
/******************************************************************** Grid Section************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
/********Sidebar Content**************/
|
|
.mpStyle .leftSidebar,
|
|
.mpStyle .leftSidebar .mp_sticky_area { width: 100%; max-width: var(--sidebarLeft); }
|
|
.mpStyle .rightSidebar { width: 100%; max-width: var(--sidebarRight); }
|
|
.mpStyle .mainSection { width: 100%; max-width: var(--mainSection); margin: 0 0 0 var(--dMP); }
|
|
/**************************************/
|
|
body.theme-astra div.mpContainer,
|
|
body.theme-twentytwenty div.mpContainer,
|
|
body.theme-twentytwentyone div.mpContainer,
|
|
body.theme-twentytwentytwo div.mpContainer,
|
|
div.mpContainer { max-width: var(--dContainer_Width); width: 100%; margin: 0 auto; }
|
|
div.mpRow { min-height: 1px; }
|
|
/************************/
|
|
div.mpStyle .fullHeight, div.mpStyle [class*="_fullHeight"] { height: 100%; }
|
|
div.mpStyle [class*="_h_100"] { height: 100px; }
|
|
div.mpStyle [class*="_h_200"] { height: 200px; }
|
|
/************************/
|
|
div.mpStyle [class*="_w_50"] { width: 50px; min-width: 50px; }
|
|
div.mpStyle [class*="_w_100"] { width: 100px; min-width: 100px; max-width: 100px;}
|
|
div.mpStyle [class*="_w_125"] { width: 125px; min-width: 125px; }
|
|
div.mpStyle [class*="_w_150"] { width: 150px; min-width: 150px; }
|
|
div.mpStyle [class*="_w_200"] { width: 200px; min-width: 200px; }
|
|
div.mpStyle [class*="_w_300"] { width: 300px; min-width: 300px; }
|
|
div.mpStyle [class*="_w_400"] { width: 400px; min-width: 400px; }
|
|
div.mpStyle [class*="_w_500"] { width: 500px; min-width: 500px; }
|
|
div.mpStyle [class*="_w_600"] { width: 600px; min-width: 600px; }
|
|
div.mpStyle [class*='_fullWidth'] { width: 100%; max-width: 100%; }
|
|
/************************/
|
|
div.mpStyle .max_100, div.mpStyle [class*="_max_100"] { max-width: 100px; width: 100%; }
|
|
div.mpStyle .max_150, div.mpStyle [class*="_max_150"] { max-width: 150px; width: 100%; }
|
|
div.mpStyle .max_200, div.mpStyle [class*="_max_200"] { max-width: 200px; width: 100%; }
|
|
div.mpStyle .max_300, div.mpStyle [class*="_max_300"] { max-width: 300px; width: 100%; }
|
|
div.mpStyle .max_400, div.mpStyle [class*="_max_400"] { max-width: 400px; width: 100%; }
|
|
div.mpStyle .max_500, div.mpStyle [class*="_max_500"] { max-width: 500px; width: 100%; }
|
|
div.mpStyle .max_600, div.mpStyle [class*="_max_600"] { max-width: 600px; width: 100%; }
|
|
div.mpStyle .max_700, div.mpStyle [class*="_max_700"] { max-width: 700px; width: 100%; }
|
|
div.mpStyle .max_800, div.mpStyle [class*="_max_800"] { max-width: 800px; width: 100%; }
|
|
div.mpStyle .max_900, div.mpStyle [class*="_max_900"] { max-width: 900px; width: 100%; }
|
|
div.mpStyle .max_1000, div.mpStyle [class*="_max_1000"] { max-width: 1000px; width: 100%; }
|
|
div.mpStyle .max_1100, div.mpStyle [class*="_max_1100"] { max-width: 1100px; width: 100%; }
|
|
div.mpStyle .max_1200, div.mpStyle [class*="_max_1200"] { max-width: 1200px; width: 100%; }
|
|
div.mpStyle .max_full, div.mpStyle [class*="_max_full"] { max-width: 100%; width: 100%; }
|
|
/************************/
|
|
div.mpStyle .min_50, div.mpStyle [class*="_min_50"] { min-width: 50px; }
|
|
div.mpStyle .min_100, div.mpStyle [class*="_min_100"] { min-width: 100px; }
|
|
div.mpStyle .min_125, div.mpStyle [class*="_min_125"] { min-width: 125px; }
|
|
div.mpStyle .min_150, div.mpStyle [class*="_min_150"] { min-width: 150px; }
|
|
div.mpStyle .min_200, div.mpStyle [class*="_min_200"] { min-width: 200px; }
|
|
div.mpStyle .min_250, div.mpStyle [class*="_min_250"] { min-width: 250px; }
|
|
div.mpStyle .min_300, div.mpStyle [class*="_min_300"] { min-width: 300px; }
|
|
div.mpStyle .min_400, div.mpStyle [class*="_min_400"] { min-width: 400px; }
|
|
div.mpStyle .min_500, div.mpStyle [class*="_min_500"] { min-width: 500px; }
|
|
div.mpStyle .min_600, div.mpStyle [class*="_min_600"] { min-width: 600px; }
|
|
div.mpStyle .min_700, div.mpStyle [class*="_min_700"] { min-width: 700px; }
|
|
div.mpStyle .min_800, div.mpStyle [class*="_min_800"] { min-width: 800px; }
|
|
div.mpStyle .min_900, div.mpStyle [class*="_min_900"] { min-width: 900px; }
|
|
div.mpStyle .min_1000, div.mpStyle [class*="_min_1000"] { min-width: 1000px; }
|
|
div.mpStyle .min_auto, div.mpStyle [class*="_min_auto"] { min-width: auto; }
|
|
/**********************/
|
|
div.grid_1 { width: 100%; }
|
|
div.grid_2 { width: calc(50% - var(--dMP)); }
|
|
div.grid_3 { width: calc(33.333333% - var(--dMP)); }
|
|
div.grid_4 { width: calc(25% - var(--dMP)); }
|
|
div.grid_5 { width: calc(20% - var(--dMP)); }
|
|
div.grid_6 { width: calc(16.66666667% - var(--dMP)); }
|
|
div.grid_7 { width: calc(14.285715% - var(--dMP)); }
|
|
div.grid_8 { width: calc(12.5% - var(--dMP)); }
|
|
div.grid_9 { width: calc(11.1111111111% - var(--dMP)); }
|
|
div.grid_10 { width: calc(10% - var(--dMP)); }
|
|
/**********************/
|
|
.mpStyle .col_1 { width: 8.3333333333%; }
|
|
.mpStyle .col_2 { width: 16.666666667%; }
|
|
.mpStyle .col_3 { width: 25%; }
|
|
.mpStyle .col_4 { width: 33.333333333%; }
|
|
.mpStyle .col_5 { width: 41.666666667%; }
|
|
.mpStyle .col_6 { width: 50%; }
|
|
.mpStyle .col_7 { width: 58.333333333%; }
|
|
.mpStyle .col_8 { width: 66.666666667%; }
|
|
.mpStyle .col_9 { width: 75%; }
|
|
.mpStyle .col_10 { width: 83.33333333%; }
|
|
.mpStyle .col_11 { width: 91.66666667%; }
|
|
.mpStyle .col_12 { width: 100%; }
|
|
/**********************/
|
|
@media only screen and (max-width: 1200px) {
|
|
.mpStyle .col_1_1200 { width: 8.3333333333%; }
|
|
.mpStyle .col_2_1200 { width: 16.666666667%; }
|
|
.mpStyle .col_3_1200 { width: 25%; }
|
|
.mpStyle .col_4_1200 { width: 33.333333333%; }
|
|
.mpStyle .col_5_1200 { width: 41.666666667%; }
|
|
.mpStyle .col_6_1200 { width: 50%; }
|
|
.mpStyle .col_7_1200 { width: 58.333333333%; }
|
|
.mpStyle .col_8_1200 { width: 66.666666667%; }
|
|
.mpStyle .col_9_1200 { width: 75%; }
|
|
.mpStyle .col_10_1200 { width: 83.33333333%; }
|
|
.mpStyle .col_11_1200 { width: 91.66666667%; }
|
|
.mpStyle .col_12_1200 { width: 100%; }
|
|
}
|
|
/**********************/
|
|
@media only screen and (max-width: 1100px) {
|
|
.mpStyle .col_1_1100 { width: 8.3333333333%; }
|
|
.mpStyle .col_2_1100 { width: 16.666666667%; }
|
|
.mpStyle .col_3_1100 { width: 25%; }
|
|
.mpStyle .col_4_1100 { width: 33.333333333%; }
|
|
.mpStyle .col_5_1100 { width: 41.666666667%; }
|
|
.mpStyle .col_6_1100 { width: 50%; }
|
|
.mpStyle .col_7_1100 { width: 58.333333333%; }
|
|
.mpStyle .col_8_1100 { width: 66.666666667%; }
|
|
.mpStyle .col_9_1100 { width: 75%; }
|
|
.mpStyle .col_10_1100 { width: 83.33333333%; }
|
|
.mpStyle .col_11_1100 { width: 91.66666667%; }
|
|
.mpStyle .col_12_1100 { width: 100%; }
|
|
}
|
|
/**********************/
|
|
@media only screen and (max-width: 1000px) {
|
|
.mpStyle .col_1_1000 { width: 8.3333333333%; }
|
|
.mpStyle .col_2_1000 { width: 16.666666667%; }
|
|
.mpStyle .col_3_1000 { width: 25%; }
|
|
.mpStyle .col_4_1000 { width: 33.333333333%; }
|
|
.mpStyle .col_5_1000 { width: 41.666666667%; }
|
|
.mpStyle .col_6_1000 { width: 50%; }
|
|
.mpStyle .col_7_1000 { width: 58.333333333%; }
|
|
.mpStyle .col_8_1000 { width: 66.666666667%; }
|
|
.mpStyle .col_9_1000 { width: 75%; }
|
|
.mpStyle .col_10_1000 { width: 83.33333333%; }
|
|
.mpStyle .col_11_1000 { width: 91.66666667%; }
|
|
.mpStyle .col_12_1000 { width: 100%; }
|
|
}
|
|
/**********************/
|
|
@media only screen and (max-width: 900px) {
|
|
.mpStyle .col_1_900 { width: 8.3333333333%; }
|
|
.mpStyle .col_2_900 { width: 16.666666667%; }
|
|
.mpStyle .col_3_900 { width: 25%; }
|
|
.mpStyle .col_4_900 { width: 33.333333333%; }
|
|
.mpStyle .col_5_900 { width: 41.666666667%; }
|
|
.mpStyle .col_6_900 { width: 50%; }
|
|
.mpStyle .col_7_900 { width: 58.333333333%; }
|
|
.mpStyle .col_8_900 { width: 66.666666667%; }
|
|
.mpStyle .col_9_900 { width: 75%; }
|
|
.mpStyle .col_10_900 { width: 83.33333333%; }
|
|
.mpStyle .col_11_900 { width: 91.66666667%; }
|
|
.mpStyle .col_12_900 { width: 100%; }
|
|
}
|
|
/**********************/
|
|
@media only screen and (max-width: 800px) {
|
|
.mpStyle .col_1_800 { width: 8.3333333333%; }
|
|
.mpStyle .col_2_800 { width: 16.666666667%; }
|
|
.mpStyle .col_3_800 { width: 25%; }
|
|
.mpStyle .col_4_800 { width: 33.333333333%; }
|
|
.mpStyle .col_5_800 { width: 41.666666667%; }
|
|
.mpStyle .col_6_800 { width: 50%; }
|
|
.mpStyle .col_7_800 { width: 58.333333333%; }
|
|
.mpStyle .col_8_800 { width: 66.666666667%; }
|
|
.mpStyle .col_9_800 { width: 75%; }
|
|
.mpStyle .col_10_800 { width: 83.33333333%; }
|
|
.mpStyle .col_11_800 { width: 91.66666667%; }
|
|
.mpStyle .col_12_800 { width: 100%; }
|
|
}
|
|
/**********************/
|
|
@media only screen and (max-width: 700px) {
|
|
.mpStyle .col_1_700 { width: 8.3333333333%; }
|
|
.mpStyle .col_2_700 { width: 16.666666667%; }
|
|
.mpStyle .col_3_700 { width: 25%; }
|
|
.mpStyle .col_4_700 { width: 33.333333333%; }
|
|
.mpStyle .col_5_700 { width: 41.666666667%; }
|
|
.mpStyle .col_6_700 { width: 50%; }
|
|
.mpStyle .col_7_700 { width: 58.333333333%; }
|
|
.mpStyle .col_8_700 { width: 66.666666667%; }
|
|
.mpStyle .col_9_700 { width: 75%; }
|
|
.mpStyle .col_10_700 { width: 83.33333333%; }
|
|
.mpStyle .col_11_700 { width: 91.66666667%; }
|
|
.mpStyle .col_12_700 { width: 100%; }
|
|
}
|
|
/**********************/
|
|
@media only screen and (max-width: 600px) {
|
|
.mpStyle .col_1_600 {width: 8.3333333333%;}
|
|
.mpStyle .col_2_600 {width: 16.666666667%;}
|
|
.mpStyle .col_3_600 {width: 25%;}
|
|
.mpStyle .col_4_600 {width: 33.333333333%;}
|
|
.mpStyle .col_5_600 {width: 41.666666667%;}
|
|
.mpStyle .col_6_600 {width: 50%;}
|
|
.mpStyle .col_7_600 {width: 58.333333333%;}
|
|
.mpStyle .col_8_600 {width: 66.666666667%;}
|
|
.mpStyle .col_9_600 {width: 75%;}
|
|
.mpStyle .col_10_600 {width: 83.33333333%;}
|
|
.mpStyle .col_11_600 {width: 91.66666667%;}
|
|
.mpStyle .col_12_600 {width: 100%;}
|
|
}
|
|
/**********************/
|
|
@media only screen and (max-width: 500px) {
|
|
.mpStyle .col_1_500 {width: 8.3333333333%;}
|
|
.mpStyle .col_2_500 {width: 16.666666667%;}
|
|
.mpStyle .col_3_500 {width: 25%;}
|
|
.mpStyle .col_4_500 {width: 33.333333333%;}
|
|
.mpStyle .col_5_500 {width: 41.666666667%;}
|
|
.mpStyle .col_6_500 {width: 50%;}
|
|
.mpStyle .col_7_500 {width: 58.333333333%;}
|
|
.mpStyle .col_8_500 {width: 66.666666667%;}
|
|
.mpStyle .col_9_500 {width: 75%;}
|
|
.mpStyle .col_10_500 {width: 83.33333333%;}
|
|
.mpStyle .col_11_500 {width: 91.66666667%;}
|
|
.mpStyle .col_12_500 {width: 100%;}
|
|
}
|
|
/**********************/
|
|
@media only screen and (max-width: 400px) {
|
|
.mpStyle .col_1_400 {width: 8.3333333333%;}
|
|
.mpStyle .col_2_400 {width: 16.666666667%;}
|
|
.mpStyle .col_3_400 {width: 25%;}
|
|
.mpStyle .col_4_400 {width: 33.333333333%;}
|
|
.mpStyle .col_5_400 {width: 41.666666667%;}
|
|
.mpStyle .col_6_400 {width: 50%;}
|
|
.mpStyle .col_7_400 {width: 58.333333333%;}
|
|
.mpStyle .col_8_400 {width: 66.666666667%;}
|
|
.mpStyle .col_9_400 {width: 75%;}
|
|
.mpStyle .col_10_400 {width: 83.33333333%;}
|
|
.mpStyle .col_11_400 {width: 91.66666667%;}
|
|
.mpStyle .col_12_400 {width: 100%;}
|
|
}
|
|
}
|
|
/******************************************************************** Color section ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.mpStyle .error { background-color: red; color: #FFF; }
|
|
div.mpStyle .mDisabled { cursor: not-allowed; opacity: 0.8; background-color: #F2F2F2; color: #777; }
|
|
/*****Theme*********/
|
|
div.mpStyle .textTheme, div.mpStyle [class*='_textTheme'] { color: var(--color_theme); }
|
|
div.mpStyle .bgTheme, div.mpStyle [class*='_bgTheme'] { background-color: var(--color_theme); color: var(--color_theme_alter); }
|
|
div.mpStyle [class*='_bTheme'], .bTheme { border: 1px solid var(--color_theme); }
|
|
/*****default*********/
|
|
div.mpStyle [class*='textDefault'] { color: var(--d_color); }
|
|
div.mpStyle [class*='bgDefault'] { background-color: var(--d_color); }
|
|
/*****Success*********/
|
|
div.mpStyle [class*='textSuccess'] { color: var(--color_success); }
|
|
div.mpStyle [class*='bgSuccess'] { background-color: var(--color_success); }
|
|
/*****Success*********/
|
|
div.mpStyle [class*='textInfo'] { color: var(--color_info); }
|
|
div.mpStyle [class*='bgInfo'] { background-color: var(--color_info); }
|
|
/*****danger*********/
|
|
div.mpStyle .textDanger, div.mpStyle [class*='_textDanger'] { color: var(--color_danger); }
|
|
div.mpStyle .bgDanger, div.mpStyle [class*='_bgDanger'] { background-color: var(--color_danger); }
|
|
/*****warning*********/
|
|
div.mpStyle .textWarning, div.mpStyle [class*='_textWarning'] { color: var(--color_warning); }
|
|
div.mpStyle .bgWarning, div.mpStyle [class*='_bgWarning'] { background-color: var(--color_warning); }
|
|
/*****required*********/
|
|
div.mpStyle .textRequired, div.mpStyle [class*='_textRequired'] { color: var(--color_required); }
|
|
div.mpStyle .bgRequired, div.mpStyle [class*='_bgRequired'] { background-color: var(--color_required); }
|
|
div.mpStyle .mpRequired, div.mpStyle [class*='_mpRequired'] { border-color: var(--color_required); }
|
|
/*****Light*********/
|
|
div.mpStyle .textLight, div.mpStyle [class*='_textLight'] { color: var(--color_light); }
|
|
div.mpStyle .bgLight, div.mpStyle [class*='_bgLight'] { background-color: var(--color_light); }
|
|
div.mpStyle .textLight_1, div.mpStyle [class*='_textLight_1'] { color: var(--color_light_1); }
|
|
div.mpStyle .bgLight_1, div.mpStyle [class*='_bgLight_1'] { background-color: var(--color_light_1); }
|
|
div.mpStyle .textLight_2, div.mpStyle [class*='_textLight_2'] { color: var(--color_light_2); }
|
|
div.mpStyle .bgLight_2, div.mpStyle [class*='_bgLight_2'] { background-color: var(--color_light_2); }
|
|
div.mpStyle .btLight_2, div.mpStyle [class*='_btLight_2'] { background-color: var(--color_light_2); color: var(--color_info);}
|
|
/*****Gray*********/
|
|
div.mpStyle .textGray, div.mpStyle [class*='_textGray'] { color: gray; }
|
|
div.mpStyle .bgGray, div.mpStyle [class*='_bgGray'] { background-color: gray; }
|
|
/*****Black*********/
|
|
div.mpStyle .textBlack, div.mpStyle [class*='_textBlack'] { color: var(--color_black); }
|
|
div.mpStyle .bgBlack, div.mpStyle [class*='_bgBlack'] { background-color: var(--color_black);}
|
|
/*****yellow*********/
|
|
div.mpStyle .textYellow, div.textYellow, .mpStyle [class*='textYellow'] { color: var(--color_yellow); }
|
|
div.mpStyle [class*='bgYellow'] { background-color: var(--color_yellow); }
|
|
div.mpStyle [class*='bgYellow_99'] { background-color: #FFFF0099; }
|
|
div.mpStyle [class*='bgYellow_77'] { background-color: #FFFF0077; }
|
|
/*****white*********/
|
|
div.mpStyle [class*='textWhite'] { color: #FFF; }
|
|
div.mpStyle [class*='bgWhite'] { background-color: #FFF; }
|
|
/*****blue*********/
|
|
div.mpStyle [class*='textBlue'] { color: var(--color_blue); }
|
|
div.mpStyle .bgBlue, div.mpStyle [class*='_bgBlue'] { background-color: var(--color_blue); }
|
|
div.mpStyle [class*='borderBlue'] { border-color: var(--color_blue); }
|
|
div.mpStyle [class*='textBorderBlue'] { border-color: var(--color_blue); color: var(--color_blue); }
|
|
/*****Navy blue*********/
|
|
div.mpStyle .textNavyBlue, div.mpStyle [class*='_textNavyBlue'] { color: var(--color_navy_blue); }
|
|
div.mpStyle .bgNavyBlue, div.mpStyle [class*='_bgNavyBlue'] { background-color: var(--color_navy_blue); }
|
|
/*****Color_1*********/
|
|
div.mpStyle .textColor_1, div.mpStyle [class*='_textColor_1'] { color: var(--color_1); }
|
|
div.mpStyle .bgColor_1, div.mpStyle [class*='_bgColor_1'] { background-color: var(--color_1); }
|
|
/*****Color_2*********/
|
|
div.mpStyle .textColor_2, div.mpStyle [class*='_textColor_2'] { color: var(--color_2); }
|
|
div.mpStyle .bgColor_2, div.mpStyle [class*='_bgColor_2'] { background-color: var(--color_2); }
|
|
/*****Color_2*********/
|
|
div.mpStyle .textColor_3, div.mpStyle [class*='_textColor_3'] { color: #F2FFC3; }
|
|
div.mpStyle .bgColor_3, div.mpStyle [class*='_bgColor_3'] { background-color: #F2FFC3; }
|
|
}
|
|
/******************************************************************** Icon Section************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
/*****Seat icon******/
|
|
[class*='mage_icon'] { display: inline-block; }
|
|
span[class*='mp_chair_icon'] { position: relative; width: 30px; height: 35px; border: 1px solid var(--color_border); text-align: center; padding: 5px 0 0 0; }
|
|
span[class*='mp_chair_icon_xs'] { width: 20px; height: 25px; padding: 3px 0 0 0; }
|
|
span[class*='mp_chair_icon'] ::before,
|
|
span[class*='mp_chair_icon'] ::after,
|
|
span[class*='mp_chair_icon'] { -webkit-border-radius: 2px; border-radius: 2px; }
|
|
span[class*='mp_chair_icon'] ::before,
|
|
span[class*='mp_chair_icon'] ::after { content: ""; position: absolute; width: 7px; height: 20px; border: 1px solid var(--color_border); bottom: -1px; background-color: #FFF; }
|
|
span[class*='mp_chair_icon_xs'] ::before,
|
|
span[class*='mp_chair_icon_xs'] ::after { width: 4px; height: 12px; }
|
|
span[class*='mp_chair_icon'] ::before { left: -4px; }
|
|
span[class*='mp_chair_icon'] ::after { right: -4px; }
|
|
span[class*='mp_chair_icon'] span.seat_handle { position: absolute; width: 25px; height: 6px; bottom: 0; left: 4px; border-top: 1px solid var(--color_border); background-color: #FFF; }
|
|
span[class*='mp_chair_icon_xs'] span.seat_handle { width: 15px; height: 4px; }
|
|
}
|
|
/******************************************************************** select_2 custom css************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.mpStyle span.selection,
|
|
div.mpStyle span.select2-container.select2,
|
|
div.mpStyle span.select2-container span.select2-selection { min-width: auto; width: 100% !important; height: 100%; }
|
|
div.mpStyle span.selection { overflow: hidden; max-width: 100%; }
|
|
div.mpStyle span.select2-container span.select2-selection__rendered { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 100%; }
|
|
div.mpStyle span.select2-container .select2-selection__arrow { top: 2px; height: 37px; }
|
|
div.mpStyle span.select2-container span { font-size: var(--fs); margin: 0; }
|
|
}
|
|
/******************************************************************** Owl Carousel************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.mpStyle .owl-nav { display: none; }
|
|
}
|
|
/******************************************************************** Load More************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
div.mpStyle .mp_load_more_text_area { color: var(--d_color); }
|
|
div.mpStyle [data-read] { color: var(--color_theme); cursor: pointer;}
|
|
}
|
|
/******************************************************************** Woocommerce cart ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
.woocommerce-cart table.cart .product-remove { vertical-align: top; padding: var(--dMP_xs); width: 50px; }
|
|
.woocommerce-cart table.cart .product-remove a:hover { color: var(--color_danger); border-color: var(--color_danger); }
|
|
.woocommerce-cart table.cart .product-thumbnail { min-width: 20%; vertical-align: top; padding: var(--dMP_xs); }
|
|
div.woocommerce .dLayout_xs,
|
|
div.woocommerce .dLayout { background-color: transparent; }
|
|
div.woocommerce ul.cart_list { list-style-type: none; line-height: 1.25; font-size: var(--fs); color: var(--d_color); }
|
|
div.woocommerce ul.cart_list li { padding: 3px 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
|
|
div.woocommerce ul.cart_list li span { margin: 0 var(--dMP_xs) 0 0; }
|
|
div.woocommerce .cart_product_item { border: 1px solid var(--color_border); margin: var(--dMP_xs) 0 0 0; padding: var(--dMP_xs); border-radius: var(--dBR); }
|
|
div.woocommerce td.product-name { font-size: var(--fs_h5); font-weight: 500; color: var(--color_theme); }
|
|
div.woocommerce td.product-name dl.variation { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; color: var(--d_color); margin: 0;}
|
|
div.woocommerce td.product-name dl.variation dd {margin: var(--dMP_xs) 0 0 0;}
|
|
.woocommerce-order-details ul.wc-item-meta li { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: var(--dMP_xs) 0 0 0; }
|
|
.woocommerce-order-details ul.wc-item-meta li > p { margin: 0; color: var(--d_color); }
|
|
}
|
|
/******************************************************************** Date picker ************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
#ui-datepicker-div {width: 342px;border-color: var(--color_theme);padding: 0;background-color: #FFF;}
|
|
#ui-datepicker-div .ui-datepicker-header {
|
|
background-color: var(--color_theme);background-image: none;border-color: var(--color_theme);
|
|
padding: var(--dMP_xs);color: var(--color_theme_alter);border-radius: 0;
|
|
display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;
|
|
font-size: var(--fs_h6);
|
|
}
|
|
#ui-datepicker-div .ui-datepicker-header .ui-icon {display: none;}
|
|
#ui-datepicker-div .ui-datepicker-prev {top: var(--dMP_xs);left: 5px;height: 30px;width: 30px;}
|
|
#ui-datepicker-div .ui-datepicker-next {top: var(--dMP_xs);right: 5px;height: 30px;width: 30px;}
|
|
#ui-datepicker-div .ui-datepicker-prev:hover,
|
|
#ui-datepicker-div .ui-datepicker-prev:focus,
|
|
#ui-datepicker-div .ui-datepicker-next:focus,
|
|
#ui-datepicker-div .ui-datepicker-next:hover {box-shadow: 0 0 0 2px #FFF, 0 0 2px 1px #FFF; outline: 1px solid transparent}
|
|
#ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev::before,
|
|
#ui-datepicker-div .ui-datepicker-header a.ui-datepicker-next::before { position: absolute;content: '>';color: #FFF;left: 10px;font-size: var(--fs_h3);top: 5px;font-weight: bold;line-height: 1;}
|
|
#ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev::before {content: '<';}
|
|
#ui-datepicker-div .ui-datepicker-header .ui-state-hover {background-color: var(--color_theme);background-image: none;border-color: var(--color_theme);}
|
|
#ui-datepicker-div .ui-state-default {
|
|
background-color: transparent;background-image: none;border: none;border-radius: 50%;
|
|
width: 35px;height: 35px;color: var(--color_theme);font-weight: bold;padding: 0;
|
|
display: -webkit-flex;display: flex;-webkit-align-items: center;align-items: center;-webkit-justify-content: center;justify-content: center;
|
|
}
|
|
#ui-datepicker-div a.ui-state-default:hover {background-color: darksalmon;}
|
|
#ui-datepicker-div .ui-state-active {background-color: var(--color_theme);color: var(--color_theme_alter);background-image: none;}
|
|
#ui-datepicker-div .ui-datepicker-title {background-color: var(--color_theme);color: var(--color_theme_alter);background-image: none;font-size: var(--fs_h5);display: -webkit-flex;display: flex;margin: 0;}
|
|
#ui-datepicker-div .ui-datepicker-title select {min-width: 100px;height: 30px;font-size: var(--fs);padding: 0 var(--dMP_xs);text-align: left;}
|
|
#ui-datepicker-div.ui-datepicker td {background-color: floralwhite;border: 1px dotted #000;padding: 4px 6px;}
|
|
}
|
|
/********************************************************************************************************************/
|
|
@media only screen and (min-width: 10px) {
|
|
} |