0% found this document useful (0 votes)
9 views

01) CSS - Easy Custom CSS

This document contains CSS code for customizing various elements on a website like headings, buttons, forms, cart, and footer. It includes CSS rules for styling elements, adjusting spacing and positioning. The CSS is targeted at different screen sizes using media queries.
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
9 views

01) CSS - Easy Custom CSS

This document contains CSS code for customizing various elements on a website like headings, buttons, forms, cart, and footer. It includes CSS rules for styling elements, adjusting spacing and positioning. The CSS is targeted at different screen sizes using media queries.
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 25

EASY CUSTOM CSS

.is-empty .cart__empty-text, .is-empty .cart__warnings {

display: block;

MARGIN-BOTTOM: 18px;

.cart__login-paragraph {

margin-top: 11px!important;

.drawer.active .drawer__inner {

padding-bottom: 20px;

padding-top: 20px;

padding-left: 40px;

padding-right: 40px;

overflow: overlay;

.cart-drawer .totals {

justify-content: space-between;

padding-top: 19px;

padding-bottom: 33px;

.cart-drawer .cart-items thead th:nth-child(2) {

padding-bottom: 32px;

.cart-drawer .cart-items th {
padding-bottom: 34px;

.cart-drawer .cart-item:last-child {

margin-block: 10px;

.cart-drawer .cart-items, .cart-drawer tbody {

padding-top: 0px;

padding-bottom: 11px;

.drawer__footer {

padding-bottom: 20px!important;

.drawer__header {

MARGIN-BOTTOM: -23px!important;

#shopify-section-sections--18294483550513__footer .footer__content-top {

border-top: solid 0.1rem rgba(var(--color-foreground),.08)!important;

min-width: 100%;

.product-form__quantity .form__label {

text-align: left!important;

margin-bottom: 20px!important;

margin-block: -9px;
}

.button, .shopify-challenge__button, .customer button, button.shopify-payment-button__button--


unbranded, .shopify-payment-button [role=button], .cart__dynamic-checkout-buttons
[role=button], .cart__dynamic-checkout-buttons iframe {

TEXT-TRANSFORM: UPPERCASE;

.product__info-container .product-form, .product__info-


container .product__description, .product__info-container .icon-with-text {

text-align: justify;

text-indent: 40px;

.product-form__submit {

margin-bottom: 26px!important;

.section-template--18294487515441__main-padding {

padding-right: 45px!important;

padding-left: 45px!important;

.caption-large, .customer .field input, .customer select, .field__input, .form__label, .select__select


{

text-align: center;

padding-bottom: 0px!important;

.price--large {
padding-bottom: 8px!important;

.footer__localization h2 {

margin-bottom: 20px!important;

.localization-form:only-child .button, .localization-form:only-child .localization-form__select {

padding-block: 1px!important;

.disclosure__button {

height: 5rem!important;

padding: 40px!important;

.cart-drawer .tax-note {

display: none;

.product__tax {

display: none;

.menu-drawer__utility-links {

background-color: #f5f5f5!important;

.disclosure__list {
padding-bottom: 16px!important;

padding-top: 6px!important;

.footer .disclosure__link {

padding-left: 30px!important;

padding-right: 30px!important;

.product-form__quantity .form__label {

margin-top: 0px!important;

.product-form__quantity .form__label {

padding-bottom: 0px!important;

fieldset.product-form__input .form__label {

margin-bottom: 13px!important;

text-align: left!important;

.product-form__input {

padding: 0!important;

margin-top: -15px!important;

.cart-drawer .cart-items thead {

display: none!important;
}

.drawer__header {

padding-top: 20px!important;

.drawer__close {

padding-top: 25px!important;

top: 0px!important;

@media only screen and (min-width:1px) and (max-width:767px){

quick-add-modal .product:not(.featured-product) .product__view-details {

margin-bottom: 30px!important;

@media (min-width:768px){

quick-add-modal .product:not(.featured-product) .product__view-details {

margin-bottom: -8px!important;

margin-top: -8px!important;

.disclosure__list {

background-color: #F5F5F5!important;

.predictive-search {
border-bottom-right-radius: 0px!important;

border-bottom-left-radius: 0px!important;

.field__input:focus, .field__input:not(:placeholder-shown), .field__input:-webkit-


autofill, .customer .field input:focus, .customer .field input:not(:placeholder-
shown), .customer .field input:-webkit-autofill {

padding-top: 0px!important;

.title-wrapper--no-top-margin>.title {

TEXT-ALIGN: CENTER!important;

.collection__view-all a:not(.link) {

margin-top: 37PX!important;

margin-bottom: 1PX!important;

@media only screen and (min-width:1px) and (max-width:767px){

.collection__view-all a:not(.link) {

margin-top: 30PX!important;

.card .icon-wrap {

DISPLAY: NONE;

}
.predictive-search__item--term .icon-arrow {

DISPLAY: NONE;

@media only screen and (min-width:1px) and (max-width:749px){

.title-wrapper--no-top-margin>.title {

MARGIN-BOTTOM: -6PX!important;

#shopify-section-template--18294487056689__banner .collection-hero__title {

MARGIN-BOTTOM: 8PX!important;

.customer>h1, .customer__title {

MARGIN-BOTTOM: -17PX!important;

.login p {

MARGIN-TOP: 33PX!important;

margin-bottom: -12PX!important;

.customer h2.form__message {

MARGIN-TOP: -20PX!important;

MARGIN-BOTTOM: 28PX!important;

.customer ul {
MARGIN-BOTTOM: 30PX!important;

#shopify-section-template--18294487417137__main .main-page-title {

MARGIN-BOTTOM: 20PX!important;

#shopify-section-template--18294487417137__form .contact__button {

MARGIN-TOP: 40PX!important;

.template-search__header {

margin-bottom: -5PX!important;

text-align: center!important;

.title, .title-wrapper-with-link {

margin-bottom: 29PX!important;

.multicolumn-card__info {

background: white!important;

border-radius: 20px!important;

@media only screen and (min-width:1px) and (max-width:767px){

#insta-feed h2 {

MARGIN-BOTTOM: 22PX!important;

MARGIN-TOP: -6PX!important;
}

.content-container:after {

box-shadow: none!important;

.footer__content-bottom-wrapper {

min-width: 100%;

border-top: solid 0.1rem rgba(var(--color-foreground),.08)!important;

@media (min-width:768px){

.footer__localization {

margin-bottom: 14px!important;

@media only screen and (min-width:1px) and (max-width:767px){

.list-payment {

padding-bottom: 8px!important;

padding-top: 22px!important;

@media (min-width:768px){

.list-payment__item {

padding-bottom: 23px!important;

}
}

@media only screen and (min-width:1px) and (max-width:767px){

.footer__localization h2 {

margin-bottom: 28px!important;

@media only screen and (min-width:1px) and (max-width:767px){

.localization-form:only-child {

padding-top: 18px!important;

.shopify-policy__container {

text-align: justify!important;

margin-bottom: 30px!important;

@media only screen and (min-width:1px) and (max-width:1024px){

.copyright__content a {

margin-bottom: -7PX!important;

@media only screen and (min-width:1px) and (max-width:767px){

.footer__content-bottom-wrapper:not(.footer__content-bottom-wrapper--
center) .footer__copyright {

margin-top: 20px!important;
}

.footer__content-bottom-wrapper {

min-width: 100%;

border-top: none!important;

#shopify-section-sections--19215358722352__footer .footer__content-top {

min-width: 100%;

border-top: solid 0.1rem rgba(var(--color-foreground),.08)!important;

.footer__copyright {

text-align: center;

margin-top: -6px!important;

@media (min-width:768px){

.section-sections--19215358722352__footer-padding {

padding-bottom: 19px!important;

@media only screen and (min-width:1px) and (max-width:767px){

.section-sections--19215358722352__footer-padding {

padding-bottom: 29px!important;

}
.policies li:before {

display: none!important;

.policies li a {

margin-right: 10px!important;

margin-left: 10px!important;

.field__input:focus~.field__label, .field__input:not(:placeholder-
shown)~.field__label, .field__input:-webkit-autofill~.field__label, .customer .field
input:focus~label, .customer .field input:not(:placeholder-shown)~label, .customer .field input:-
webkit-autofill~label {

display: none!important;

#shopify-section-template--19215358066992__main .main-page-title {

margin-bottom: 22px!important;

.related-products__heading {

TEXT-ALIGN: CENTER!important;

@media only screen and (min-width:1px) and (max-width:767px){

.product__text {

margin-top: 5px!important;

}
@media only screen and (min-width:1px) and (max-width:767px){

.related-products__heading {

margin-top: -27px!important;

margin-bottom: 24px!important;

@media only screen and (min-width:1px) and (max-width:767px){

.product-form__submit {

margin-bottom: -5px!important;

.is-empty .cart__empty-text, .is-empty .cart__warnings {

MARGIN-BOTTOM: 2px!important;

PADDING-TOP: 13PX!important;

PADDING-BOTTOM: 22PX!important;

.cart__login-title {

margin-top: 30px!important;

.cart__login-paragraph {

margin-bottom: 5PX!important;

@media only screen and (min-width:1px) and (max-width:767px){


.is-empty .cart__empty-text, .is-empty .cart__warnings {

MARGIN-TOP: 0PX!important;

@media (min-width:768px){

.is-empty .cart__empty-text, .is-empty .cart__warnings {

MARGIN-TOP: 0PX!important;

@media (min-width:768px){

.drawer__header {

padding-top: 15px!important;

@media (min-width:768px){

.drawer__close {

padding-top: 20px!important;

top: 0px!important;

@media only screen and (min-width:1px) and (max-width:767px){

.drawer__header {

MARGIN-TOP: -19px!important;

}
@media only screen and (min-width:1px) and (max-width:767px){

.drawer__close {

padding-top: 22px!important;

top: 0px!important;

@media only screen and (min-width:1px) and (max-width:767px){

.cart-drawer .cart-item:last-child {

margin-block: 10px!important;

.price--large {

MARGIN-BOTTOM: -15PX!important;

@media only screen and (min-width:1px) and (max-width:767px){

.thumbnail-slider .thumbnail-list.slider {

margin-top: -35px;

margin-bottom: 9px;

@media (min-width:768px){

.product__title>* {

margin-top: -10px!important;

margin-bottom: -11px!important;
}

@media only screen and (min-width:1px) and (max-width:767px){

.product__title>* {

margin-top: -10px!important;

margin-bottom: -7px!important;

@media only screen and (min-width:1px) and (max-width:767px){

.slider.slider--mobile .slider__slide {

padding-top: 0px!important;

.cart-drawer .cart-item__image {

max-width: 100%;

BORDER-RADIUS: 20PX!important;

@media only screen and (min-width:1px) and (max-width:767px){

.cart-drawer .cart-item__image {

max-width: 100%;

BORDER-RADIUS: 10PX!important;

@media only screen and (min-width: 1px) and (max-width: 767px){


.drawer__header {

MARGIN-TOP: -4px!important;

@media (min-width:768px){

.drawer__header {

MARGIN-BOTTOM: -15px!important;

.cart-drawer .cart-item:last-child {

margin-block: 0px;

.footer__content-bottom-wrapper:not(.footer__content-bottom-wrapper--
center) .footer__copyright {

text-align: center!important;

.account h1+a {

MARGIN-TOP: 35PX!important;

@media only screen and (min-width: 1px) and (max-width: 767px){

.customer>h1, .customer__title {

margin-top: 10px!important;

}
@media only screen and (min-width: 1px) and (max-width: 767px){

.section-template--18490091536689__main-padding {

padding-bottom: 35px!important;

@media only screen and (min-width: 1px) and (max-width: 767px){

.section-template--19215357772080__main-padding {

padding-bottom: 35px!important;

@media only screen and (min-width: 1px) and (max-width: 767px){

.section-template--18490091700529__main-padding {

padding-bottom: 24px!important;

.addresses form>div {

text-align: center!important;

.addresses form {

margin-top: -10px!important;

.form__message--large .icon, .customer .form__message svg {

display: none!important;
}

.shopify-challenge__container .shopify-challenge__message, .shopify-


challenge__container .shopify-challenge__errors {

margin-bottom: 15px!important;

.shopify-challenge__container .g-recaptcha div {

margin-bottom: 20px!important;

#shopify-section-template--19215357772080__main .customer button {

margin-top: 35px!important;

.login a {

margin-top: 30px!important;

#shopify-section-template--19215357739312__main li[data-address] > h2 {

margin-bottom: 20px!important;

@media (min-width:768px){

#shopify-section-template--19215357739312__main li[data-address] > h2 {

margin-top: -10px!important;

}
@media only screen and (min-width: 1px) and (max-width: 767px){

.addresses h2 {

text-align: center!important;

margin-top: 50px!important;

margin-bottom: 40px!important;

@media (min-width:768px){

.addresses h2 {

text-align: center!important;

margin-top: 42px!important;

margin-bottom: 40px!important;

@media (min-width:768px){

.pushdaddy-position-right #pushdaddy-box,.pushdaddy-position-right #pushdaddy-


box1,.pushdaddy-position-right #pushdaddy-button,.pushdaddy-position-right #pushdaddy-
button1 {

right: 29px!important;

@media only screen and (min-width: 1px) and (max-width: 767px){

.pushdaddy-position-right #pushdaddy-box,.pushdaddy-position-right #pushdaddy-


box1,.pushdaddy-position-right #pushdaddy-button,.pushdaddy-position-right #pushdaddy-
button1 {

right: 29px!important;

}
}

.pushdaddy-button, .pushdaddy-button1 {

box-shadow: none!important;

.sdd-download-button {

border-radius: 40PX!important;

text-transform: UPPERCASE!important;

background-color: #000000!important;

color: #ffffff!important;

font-weight: unset!important;

border: none!important;

font-size: 17px!important;

line-height: 30px!important;

padding-bottom: 5PX!important;

padding-top: 11PX!important;

padding-left: 30PX!important;

padding-right: 30PX!important;

.sdd-download-product {

font-size: 24px!important;

line-height: 20px!important;

.sdd-download-file {

font-size: 16px!important;

line-height: 10px!important;
}

.sdd-download-image {

margin: 0 0 14px 0!important;

button.sdd-download-button {

font-size: 0px!important;

button.sdd-download-button:after {

font-size: 17px!important;

content:"DESCARGAR | DOWNLOAD"!important;

.template-search__search {

margin-bottom: 0PX!important;

@media (min-width:768px){

.videoBackground .videoBoxInfoTitle,

.videoBackground .imageBoxInfoTitle {

margin-bottom: 12px!important;

@media only screen and (min-width: 1px) and (max-width: 767px){

.videoBackground .videoBoxInfoTitle,

.videoBackground .imageBoxInfoTitle {
margin-bottom: 15px!important;

@media (min-width:768px){

.videoBackground .videoBoxInfoDescription p, .videoBackground .imageBoxInfoDescription p {

margin-bottom: 20px!important;

@media only screen and (min-width: 1px) and (max-width: 767px){

.videoBackground .videoBoxInfoDescription p, .videoBackground .imageBoxInfoDescription p {

margin-bottom: 20px!important;

@media (min-width:768px){

.videoBackground .videoBoxInfoBtn, .videoBackground .imageBoxInfoBtn {

margin-top: 5px!important;

@media only screen and (min-width: 1px) and (max-width: 767px){

.videoBackground .videoBoxInfoBtn, .videoBackground .imageBoxInfoBtn {

margin-top: 6px!important;

}
.menu-drawer__menu-item--active, .menu-drawer__menu-item:focus, .menu-drawer__close-
button:focus, .menu-drawer__menu-item:hover, .menu-drawer__close-button:hover {

background-color: #f5f5f5!important;

.header {

PADDING-LEFT: 33px!important;

padding-right: 33px!important;

You might also like