/************* TARIFS *************/ /******* price tab ********/ .headband { background-color: var(--ifm-color-frame); border-radius: var(--ifm-button-border-radius); padding-bottom: 2px; padding-top: 10px; margin-bottom: -30px; width: 170px; margin-left: auto; margin-right: auto; } .headband p { font-weight: 600; color: var(--ifm-color-success); } .price { text-align: center; } .card_price { background-color: var(--ifm-color-secondary-lightest); margin-top: 20px; margin-bottom: 20px; } .tabs-etang .tabs__item { line-height: 16px; margin: 4px; padding: 0.5em; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; text-align: center; } .tabs-etang .tabs__item--active { background-color: var(--ifm-color-light-green); border: 0; border-radius: var(--ifm-global-radius); color: var(--ifm-color-white); } .tabs-etang-hide { display: none; } /******** Monthly & annual buttons********/ .tabs-monthly-annual { margin-top: 30px; margin-bottom: 30px; width: 21rem; height: 3.7rem; margin-left: auto; margin-right: auto; } .tabs-monthly-annual .tabs__item { line-height: 50px; margin: 10px; padding: 0.2em; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; text-align: center; background-color: var(--ifm-button-selection); color: var(--ifm-color-light-green); border: 2px solid var(--ifm-color-light-green); } .tabs-monthly-annual .tabs__item:hover { transition: 0.4s; background-color: var(--ifm-color-light-green); color: var(--ifm-color-white); border: 2px solid var(--ifm-color-light-green); } .tabs-monthly-annual .tabs__item--active { border: 0; border-radius: var(--ifm-global-radius); color: var(--ifm-color-white); background-color: var(--ifm-color-light-green); } /********Buttons in cards ********/ .button-noclick:not(.button--outline) { color: var(--ifm-color-secondary-darkest); border: 2px solid var(--ifm-color-secondary-darkest); } .button--price:not(.button--outline) { background-color: var(--ifm-button-selection); color: var(--ifm-color-light-green); border: 2px solid var(--ifm-color-light-green); } .button--price:not(.button--outline):hover { background-color: var(--ifm-color-light-green); color: var(--ifm-color-white); border: 2px solid var(--ifm-color-light-green); } /******** Text in cards ********/ .small_price { font-size: 12px; } /******** Disabled cards ********/ .disable_col p, .disable_col h2 { color: var(--ifm-color-secondary-darkest); } .disable_col, .card-demo { margin-top: 50px; box-shadow: var(--ifm-global-shadow-tl); border-radius: var(--ifm-card-border-radius); }