@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;900&display=swap");
.path-contact #block-muzzyshop-content {
  max-width: 1340px;
  width: 100%;
  margin: 40px auto;
  padding: 0 15px;
  background-color: #efefef;
  border-radius: 30px;
  padding: 50px;
  margin: 50px auto;
}
@media screen and (max-width: 1400px) {
  .path-contact #block-muzzyshop-content {
    max-width: 1140px;
  }
}
@media screen and (max-width: 1200px) {
  .path-contact #block-muzzyshop-content {
    max-width: 910px;
  }
}
@media screen and (max-width: 992px) {
  .path-contact #block-muzzyshop-content {
    max-width: 710px;
  }
}
@media screen and (max-width: 768px) {
  .path-contact #block-muzzyshop-content {
    max-width: calc(100% - 30px);
    padding: 50px 20px;
  }
}
.path-contact #block-muzzyshop-content form {
  max-width: 500px;
  width: 100%;
  margin: 0px auto;
}
.path-contact #block-muzzyshop-content form .form-item {
  margin: 0 0 20px;
  padding-bottom: 25px;
  padding: 0;
}
.path-contact #block-muzzyshop-content form .form-item label {
  font-weight: bold;
  color: #000;
  font-size: 18px;
  margin: 0 0 10px 0;
}
.path-contact #block-muzzyshop-content form .form-item input, .path-contact #block-muzzyshop-content form .form-item textarea {
  background: #fff;
  border: 1px solid #4acdd5;
  border-radius: 10px;
  padding: 15px;
}
.path-contact #block-muzzyshop-content form .form-item .description {
  font-size: 12px;
  line-height: 18px;
  margin-top: 5px;
}
.path-contact #block-muzzyshop-content form .form-actions {
  margin-top: 20px;
}
.path-contact #block-muzzyshop-content form .form-actions input {
  background: #4acdd5;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
}
.path-contact #block-muzzyshop-content form .form-actions input:hover {
  background-color: #083c61;
  cursor: pointer;
}

#header {
  padding: 20px 0;
}
#header .container {
  display: flex;
  justify-content: space-between;
}
#header .container .logo img {
  width: 150px;
  height: auto;
}
#header .container .wrapper-navigation .user-menu {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
#header .container .wrapper-navigation .user-menu ul:not(.contextual-links, .links) {
  display: flex;
  justify-content: flex-end;
}
#header .container .wrapper-navigation .user-menu ul:not(.contextual-links, .links) li {
  margin-left: 10px;
}
#header .container .wrapper-navigation .user-menu ul:not(.contextual-links, .links) li a {
  display: inline-block;
  background: #083c61;
  padding: 3px 15px;
  border-radius: 15px;
  font-size: 14px;
  line-height: 20px;
  color: white;
  border: 1px solid #083c61;
}
#header .container .wrapper-navigation .user-menu ul:not(.contextual-links, .links) li a:hover {
  background: #4acdd5;
  border-color: #4acdd5;
}
#header .container .wrapper-navigation .user-menu ul:not(.contextual-links, .links) li:first-child a {
  color: #083c61;
  background: transparent;
}
#header .container .wrapper-navigation .user-menu ul:not(.contextual-links, .links) li:first-child a:hover {
  color: #4acdd5;
}
@media screen and (max-width: 992px) {
  #header .container .wrapper-navigation .user-menu ul:not(.contextual-links, .links) {
    flex-direction: column;
  }
  #header .container .wrapper-navigation .user-menu ul:not(.contextual-links, .links) li {
    margin: 0 0 10px 0;
  }
}
@media screen and (max-width: 992px) {
  #header .container .wrapper-navigation {
    position: fixed;
    top: 0;
    right: -300px;
    height: 100%;
    background: white;
    box-shadow: 0 0 87px 0 rgba(0, 0, 0, 0.09);
    z-index: 999999;
    padding: 30px 30px;
    transition: 0.3s;
    width: 300px;
    max-width: 100%;
    flex-direction: column;
  }
  #header .container .wrapper-navigation .ico-close {
    position: relative;
    width: 30px;
    height: 30px;
    margin-bottom: 50px;
  }
  #header .container .wrapper-navigation .ico-close:before {
    content: "";
    display: inline-block;
    width: 30px;
    height: 3px;
    transform: rotate(45deg);
    background-color: #083c61;
    position: absolute;
    top: 10px;
    right: 0;
  }
  #header .container .wrapper-navigation .ico-close:after {
    content: "";
    display: inline-block;
    width: 30px;
    height: 3px;
    transform: rotate(-45deg);
    background-color: #083c61;
    position: absolute;
    top: 10px;
    right: 0;
  }
  #header .container .wrapper-navigation .user-menu {
    order: 2;
    display: block;
  }
  #header .container .wrapper-navigation .main-menu {
    order: 1;
    border-bottom: 1px solid #ddd;
    padding-bottom: 20px;
    margin-bottom: 30px;
  }
  #header .container .wrapper-navigation.active {
    display: flex;
    right: 0;
  }
}
#header .container .menu-mobile {
  display: none;
}
@media screen and (max-width: 992px) {
  #header .container .menu-mobile {
    display: block;
  }
}

.user-login-form,
.user-pass {
  background-color: #efefef;
  border-radius: 30px;
  border: none;
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
}
.user-login-form .form-item,
.user-pass .form-item {
  margin: 0 0 20px;
  padding-bottom: 25px;
  padding: 0;
}
.user-login-form .form-item label,
.user-pass .form-item label {
  font-weight: bold;
  color: #000;
  font-size: 18px;
  margin: 0 0 10px 0;
}
.user-login-form .form-item input,
.user-pass .form-item input {
  background: #fff;
  border: 1px solid #4acdd5;
  border-radius: 10px;
  padding: 15px;
}
.user-login-form .form-item .description,
.user-pass .form-item .description {
  font-size: 12px;
  line-height: 18px;
  margin-top: 5px;
}
.user-login-form .form-actions,
.user-pass .form-actions {
  margin-top: 20px;
}
.user-login-form .form-actions input,
.user-pass .form-actions input {
  background: #4acdd5;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
}
.user-login-form .form-actions input:hover,
.user-pass .form-actions input:hover {
  background-color: #083c61;
  cursor: pointer;
}

#footer {
  background: #f3f3f3;
  padding: 50px 0 0;
}
@media screen and (max-width: 768px) {
  #footer {
    padding: 30px 0 0;
  }
}
#footer > .container {
  display: flex;
  padding-bottom: 50px;
}
#footer > .container .column {
  width: 45%;
}
#footer > .container .column h2 {
  font-style: normal;
  font-weight: 700;
  font-size: 20px;
  color: #5a5a5a;
  text-transform: uppercase;
}
@media screen and (max-width: 768px) {
  #footer > .container {
    flex-wrap: wrap;
    padding-bottom: 30px;
  }
  #footer > .container .column {
    width: 100%;
    margin-bottom: 20px;
  }
  #footer > .container .column:last-child {
    margin-bottom: 0;
  }
}
#footer .wrapper-copy {
  background-color: #4acdd5;
  color: white;
  padding: 30px 0;
}
#footer .wrapper-copy .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#footer .wrapper-copy .container p {
  margin: 0;
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  #footer .wrapper-copy {
    padding: 20px 0;
  }
  #footer .wrapper-copy .container {
    flex-direction: column;
    justify-content: center;
  }
}

/***************** GENÈRICS *******************/
html {
  margin: 0;
  padding: 0;
}

body {
  background: none;
  padding: 0;
  margin: 0;
  color: #5a5a5a;
  font-family: Nunito, sans-serif;
  overflow-x: hidden;
}
body.menu-active:before {
  content: "";
  display: inline-block;
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 999;
  transition: 0.3s;
  transition-delay: 0.1s;
}
body p {
  margin: 0 0 25px 0;
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;
}
body p a {
  color: #1f95d2;
}
body p a:focus {
  outline: none;
}
body a {
  text-decoration: none;
  color: inherit;
  transition: 0.3s;
}
body a:focus {
  outline: none;
}
body a:hover {
  text-decoration: none;
  cursor: pointer;
}
body ul {
  margin: 0;
  padding: 0;
}
body ul li {
  list-style: none;
}
body ol li {
  line-height: 22px;
}
body b, body strong {
  font-weight: 900;
}
body * {
  box-sizing: border-box;
}
body img {
  max-width: 100%;
  height: auto;
}

h1 {
  font-family: Nunito, sans-serif;
  font-size: 40px;
  line-height: 50px;
  font-weight: 700;
  text-align: center;
  color: #0072b0;
}
@media screen and (max-width: 768px) {
  h1 {
    font-size: 30px;
    line-height: 35px;
  }
}

h2 {
  font-family: Nunito, sans-serif;
  font-size: 30px;
  line-height: 38px;
  font-weight: 700;
  margin: 20px 0;
  color: #0072b0;
}
@media screen and (max-width: 768px) {
  h2 {
    font-size: 25px;
    line-height: 30px;
  }
}

h3 {
  font-family: Nunito, sans-serif;
}

h4 {
  font-family: Nunito, sans-serif;
}

.padding {
  padding: 80px 0;
}
@media screen and (max-width: 992px) {
  .padding {
    padding: 50px 0;
  }
}
@media screen and (max-width: 768px) {
  .padding {
    padding: 30px 0;
  }
}

.margin {
  margin: 80px 0;
}
@media screen and (max-width: 992px) {
  .margin {
    margin: 50px 0;
  }
}
@media screen and (max-width: 768px) {
  .margin {
    margin: 30px 0;
  }
}

.generic-link a {
  background: #0072b0;
  border-radius: 50px;
  padding: 15px 40px;
  color: white;
  font-weight: 600;
  font-size: 16px;
  display: inline-block;
}
.generic-link a:hover {
  background: #083c61;
}

#block-muzzyshop-primary-local-tasks ul:not(.contextual-links) {
  margin: 10px 0;
}
#block-muzzyshop-primary-local-tasks ul:not(.contextual-links) li a {
  margin-right: 5px;
}

.container {
  max-width: 1370px;
  width: 100%;
  margin: 0 auto;
  padding: 0 15px;
}
@media screen and (max-width: 1400px) {
  .container {
    max-width: 1170px;
  }
}
@media screen and (max-width: 1200px) {
  .container {
    max-width: 950px;
  }
}
@media screen and (max-width: 992px) {
  .container {
    max-width: 750px;
  }
}
@media screen and (max-width: 768px) {
  .container {
    max-width: 100%;
  }
}
.container .container-sm,
.container .container-md,
.container .container {
  padding: 0;
}

.container-md {
  max-width: 1170px;
  width: 100%;
  margin: 0 auto;
  padding: 0 15px;
  /*@media screen and (max-width:1200px){width: 850px;}*/
}
@media screen and (max-width: 1400px) {
  .container-md {
    max-width: 950px;
  }
}
@media screen and (max-width: 992px) {
  .container-md {
    max-width: 750px;
  }
}
@media screen and (max-width: 768px) {
  .container-md {
    max-width: 100%;
  }
}
.container-md .container-sm {
  padding: 0;
}
.container-md .container,
.container-md .container-md {
  max-width: 100%;
  padding: 0;
}

.container-sm {
  max-width: 950px;
  margin: 0 auto;
  padding: 0 15px;
  width: 100%;
}
@media screen and (max-width: 992px) {
  .container-sm {
    max-width: 750px;
  }
}
@media screen and (max-width: 768px) {
  .container-sm {
    max-width: 100%;
  }
}
.container-sm .container-sm {
  padding: 0;
}
.container-sm .container,
.container-sm .container-md {
  max-width: 100%;
  padding: 0;
}

.user-page #block-muzzyshop-content {
  max-width: 1340px;
  width: 100%;
  margin: 40px auto;
  padding: 0 15px;
  background-color: #efefef;
  border-radius: 30px;
  padding: 50px;
  margin: 50px auto;
}
@media screen and (max-width: 1400px) {
  .user-page #block-muzzyshop-content {
    max-width: 1140px;
  }
}
@media screen and (max-width: 1200px) {
  .user-page #block-muzzyshop-content {
    max-width: 910px;
  }
}
@media screen and (max-width: 992px) {
  .user-page #block-muzzyshop-content {
    max-width: 710px;
  }
}
@media screen and (max-width: 768px) {
  .user-page #block-muzzyshop-content {
    max-width: calc(100% - 30px);
    padding: 50px 20px;
  }
}
.user-page .address-book__container .address-book__add-link {
  background: #4acdd5;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
  display: inline-block;
  margin: 0 0 30px 0;
}
.user-page .address-book__container .address-book__add-link:hover {
  background-color: #083c61;
}
.user-page .address-book__container .address-book__operations a {
  border-radius: 30px;
  border: 1px solid #4acdd5;
  padding: 10px 20px;
  color: #4acdd5;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
  display: inline-block;
  margin: 0 15px 0 0;
}
.user-page .address-book__container .address-book__operations a:hover {
  border-color: #083c61;
  color: #083c61;
}
.user-page table {
  width: 100%;
}
.user-page table th {
  border-bottom: 1px solid black;
  text-align: left;
  padding: 10px 0;
  font-size: 16px;
}
.user-page table td {
  padding: 10px 0;
}
.user-page table td .links a {
  border-radius: 30px;
  border: 1px solid #4acdd5;
  padding: 5px 15px;
  color: #4acdd5;
  font-size: 16px;
  line-height: 22px;
  height: auto;
  display: inline-block;
  margin: 0 0 10px 0;
}
.user-page table td .links a:hover {
  border-color: #083c61;
  color: #083c61;
}
.user-page .action-links-item a {
  background: #4acdd5;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
  display: inline-block;
  margin: 30px 0 0 0;
}
.user-page .action-links-item a:hover {
  background-color: #083c61;
}

.commerce-subscription-product-variation-cancel-form {
  max-width: 1340px;
  width: 100%;
  background-color: #efefef;
  border-radius: 30px;
  padding: 50px;
  margin: 50px auto;
}

.node--type-home .header-home {
  background: #1f95d2;
}
.node--type-home .header-home .container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.node--type-home .header-home .container .wrapper-left {
  width: 55%;
}
.node--type-home .header-home .container .wrapper-left h1 {
  color: white;
  font-size: 60px;
  line-height: 70px;
  font-weight: 900;
  margin-bottom: 50px;
  text-align: left;
  margin-top: 0;
}
.node--type-home .header-home .container .wrapper-left .generic-link a {
  background: #4acdd5;
  border-radius: 50px;
  padding: 15px 40px;
  color: white;
  font-weight: 600;
  font-size: 16px;
  display: inline-block;
}
.node--type-home .header-home .container .wrapper-left .generic-link a:hover {
  background: #083c61;
}
.node--type-home .header-home .container .wrapper-right {
  width: 45%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 992px) {
  .node--type-home .header-home .container .wrapper-left {
    width: 60%;
  }
  .node--type-home .header-home .container .wrapper-left h1 {
    font-size: 40px;
    line-height: 50px;
  }
  .node--type-home .header-home .container .wrapper-right {
    width: 40%;
  }
}
@media screen and (max-width: 768px) {
  .node--type-home .header-home .container .wrapper-left {
    width: 100%;
    margin-bottom: 30px;
    text-align: center;
  }
  .node--type-home .header-home .container .wrapper-left h1 {
    text-align: center;
  }
  .node--type-home .header-home .container .wrapper-right {
    width: 100%;
  }
  .node--type-home .header-home .container .wrapper-right img {
    max-width: 300px;
  }
}

.block-language {
  margin-left: 40px;
  position: relative;
}
@media screen and (max-width: 992px) {
  .block-language {
    margin-left: 0;
    border-top: 1px solid #ddd;
    padding-top: 30px;
    margin-top: 30px;
  }
}
.block-language .active-lang {
  font-weight: bold;
  color: #5a5a5a;
}
.block-language .active-lang:after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  background: url(../img/arrow.svg) no-repeat center right;
  margin-left: 5px;
}
@media screen and (max-width: 992px) {
  .block-language .active-lang {
    display: none;
  }
}
.block-language .active-lang span:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 25px;
  height: 20px;
  margin-right: 7px;
  background-size: cover !important;
  margin-bottom: 4px;
}
.block-language .active-lang span.en:before {
  background: url(../img/flags/en.png) no-repeat center right;
}
.block-language .active-lang span.en-gb:before {
  background: url("../img/flags/en.png") no-repeat right center;
}
.block-language .active-lang span.fr:before {
  background: url("../img/flags/fr.png") no-repeat right center;
}
.block-language .active-lang span.de:before {
  background: url("../img/flags/de.png") no-repeat right center;
}
.block-language .active-lang span.ko:before {
  background: url("../img/flags/ko.png") no-repeat right center;
}
.block-language .active-lang span.it:before {
  background: url("../img/flags/it.png") no-repeat right center;
}
.block-language .active-lang span.ru:before {
  background: url("../img/flags/ru.png") no-repeat right center;
}
.block-language .active-lang span.es:before {
  background: url("../img/flags/es.png") no-repeat right center;
}
.block-language .active-lang span.zh-hant:before {
  background: url("../img/flags/zh-hant.png") no-repeat right center;
}
.block-language .active-lang span.zh-hans:before {
  background: url("../img/flags/zh-hans.png") no-repeat right center;
}
.block-language .active-lang span.tr:before {
  background: url("../img/flags/tr.png") no-repeat right center;
}
.block-language .links {
  display: none;
  position: absolute;
  background-color: #eee;
  font-weight: normal;
  z-index: 9;
  border-radius: 5px;
  padding: 5px 10px;
  right: 0;
  top: 30px;
}
.block-language .links li a {
  font-size: 14px;
  display: flex;
  align-items: center;
}
.block-language .links li a:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 20px;
  height: 15px;
  margin-right: 7px;
  background-size: cover !important;
}
.block-language .links li a[hreflang=en]:before {
  background: url(../img/flags/en.png) no-repeat center right;
}
.block-language .links li a[hreflang=en-gb]:before {
  background: url("../img/flags/en.png") no-repeat right center;
}
.block-language .links li a[hreflang=fr]:before {
  background: url("../img/flags/fr.png") no-repeat right center;
}
.block-language .links li a[hreflang=de]:before {
  background: url("../img/flags/de.png") no-repeat right center;
}
.block-language .links li a[hreflang=ko]:before {
  background: url("../img/flags/ko.png") no-repeat right center;
}
.block-language .links li a[hreflang=it]:before {
  background: url("../img/flags/it.png") no-repeat right center;
}
.block-language .links li a[hreflang=ru]:before {
  background: url("../img/flags/ru.png") no-repeat right center;
}
.block-language .links li a[hreflang=es]:before {
  background: url("../img/flags/es.png") no-repeat right center;
}
.block-language .links li a[hreflang=zh-hant]:before {
  background: url("../img/flags/zh-hant.png") no-repeat right center;
}
.block-language .links li a[hreflang=zh-hans]:before {
  background: url("../img/flags/zh-hans.png") no-repeat right center;
}
.block-language .links li a[hreflang=tr]:before {
  background: url("../img/flags/tr.png") no-repeat right center;
}
@media screen and (max-width: 992px) {
  .block-language .links {
    display: block;
    position: inherit;
    right: inherit;
    background: none;
    display: flex;
    gap: 10px;
    text-transform: uppercase;
  }
}
.block-language.open .active-lang::after {
  transform: rotate(180deg);
}
.block-language.open .links {
  display: block;
}

.breadcrumb {
  padding: 30px 0;
  background: #f6f6f6;
}
.breadcrumb ol {
  padding: 0;
  margin: 0;
}
.breadcrumb ol li {
  color: #ff6799;
}
.breadcrumb ol li a {
  color: #4acdd5;
}
.breadcrumb ol li:nth-child(n+2):before {
  content: "/";
  transform: none;
  border: none;
  width: auto;
  height: auto;
  margin: 0 10px;
  color: #4acdd5;
}
@media screen and (max-width: 768px) {
  .breadcrumb {
    padding: 10px 0;
  }
}

.ico-menu {
  width: 30px;
  display: inline-block;
  vertical-align: middle;
  z-index: 9;
}
.ico-menu .bar {
  display: block;
  height: 3px;
  width: 30px;
  background-color: black;
  margin: 0 0 6px 0;
  transition: all 0.5s ease;
  border-radius: 5px;
}
.ico-menu .bar.bottom {
  margin: 0;
}
.ico-menu:hover {
  cursor: pointer;
}
.ico-menu.active .bar {
  width: 30px;
}
.ico-menu.active .bar.top, .ico-menu.active .bar.middle {
  -webkit-transform: translateY(6px) rotateZ(45deg);
  -moz-transform: translateY(6px) rotateZ(45deg);
  -ms-transform: translateY(6px) rotateZ(45deg);
  -o-transform: translateY(6px) rotateZ(45deg);
  transform: translateY(6px) rotateZ(45deg);
}
.ico-menu.active .bar.middle {
  display: none;
}
.ico-menu.active .bar.bottom {
  -webkit-transform: translateY(-3px) rotateZ(-40deg);
  -moz-transform: translateY(-3px) rotateZ(-45deg);
  -ms-transform: translateY(-3px) rotateZ(-45deg);
  -o-transform: translateY(-3px) rotateZ(-45deg);
  transform: translateY(-3px) rotateZ(-45deg);
}

.main-menu ul:not(.contextual-links) {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.main-menu ul:not(.contextual-links) li a {
  font-size: 16px;
  padding: 15px;
  display: inline-block;
  font-weight: 600;
}
.main-menu ul:not(.contextual-links) li a:hover {
  color: #4acdd5;
}
.main-menu ul:not(.contextual-links) li:last-child a {
  padding-right: 0;
}
@media screen and (max-width: 992px) {
  .main-menu ul:not(.contextual-links) {
    flex-direction: column;
    align-items: flex-start;
  }
  .main-menu ul:not(.contextual-links) li {
    display: inline-block;
    width: 100%;
  }
  .main-menu ul:not(.contextual-links) li a {
    padding: 5px 0;
    width: 100%;
  }
}

.paragraph-featured-links-with-images h2 {
  text-align: center;
  margin-bottom: 30px;
}
.paragraph-featured-links-with-images .wrapper {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
@media screen and (max-width: 992px) {
  .paragraph-featured-links-with-images .wrapper {
    flex-wrap: wrap;
  }
}
.paragraph-featured-links-with-images .wrapper .item {
  max-width: calc(20% - 20px);
  margin: 0 10px 20px;
  position: relative;
  background-color: #eee;
  border-radius: 10px;
}
.paragraph-featured-links-with-images .wrapper .item .wrapper-image {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.paragraph-featured-links-with-images .wrapper .item .wrapper-image img {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  width: 100%;
}
.paragraph-featured-links-with-images .wrapper .item .wrapper-text {
  width: 100%;
  padding: 20px 10px;
  background-color: #eee;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.paragraph-featured-links-with-images .wrapper .item .wrapper-text .icon img {
  max-height: 40px;
  width: auto;
}
.paragraph-featured-links-with-images .wrapper .item .wrapper-text .icon + .title {
  padding-left: 15px;
}
.paragraph-featured-links-with-images .wrapper .item .wrapper-text .title {
  font-size: 20px;
  line-height: 26px;
  font-weight: 700;
}
@media screen and (max-width: 992px) {
  .paragraph-featured-links-with-images .wrapper .item .wrapper-text .title {
    font-size: 16px;
    line-height: 22px;
  }
}
@media screen and (max-width: 992px) {
  .paragraph-featured-links-with-images .wrapper .item {
    width: calc(33% - 20px);
    margin: 0 10px 20px;
    max-width: 100%;
  }
}
@media screen and (max-width: 600px) {
  .paragraph-featured-links-with-images .wrapper .item {
    width: calc(50% - 20px);
  }
}
.paragraph-featured-links-with-images .wrapper.col-4 .item {
  width: calc(25% - 20px);
  max-width: 100%;
}
@media screen and (max-width: 992px) {
  .paragraph-featured-links-with-images .wrapper.col-4 .item {
    width: calc(50% - 20px);
    margin: 0 10px 20px;
  }
}
.paragraph-featured-links-with-images .wrapper.col-4 .item .wrapper-text {
  color: white;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item .wrapper-text .icon + .title {
  padding-left: 0;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item:nth-child(1) {
  background-color: blue;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item:nth-child(1) .wrapper-text {
  background-color: blue;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item:nth-child(2) {
  background-color: red;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item:nth-child(2) .wrapper-text {
  background-color: red;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item:nth-child(3) {
  background-color: green;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item:nth-child(3) .wrapper-text {
  background-color: green;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item:nth-child(4) {
  background-color: purple;
}
.paragraph-featured-links-with-images .wrapper.col-4 .item:nth-child(4) .wrapper-text {
  background-color: purple;
}
.paragraph-featured-links-with-images .wrapper.col-2 .item {
  width: 35%;
  max-width: 100%;
}
@media screen and (max-width: 992px) {
  .paragraph-featured-links-with-images .wrapper.col-2 .item {
    width: calc(50% - 20px);
    margin: 0 10px 20px;
  }
}
.paragraph-featured-links-with-images .wrapper.col-2 .item .wrapper-text {
  color: white;
}
.paragraph-featured-links-with-images .wrapper.col-2 .item .wrapper-text .icon + .title {
  padding-left: 0;
}
.paragraph-featured-links-with-images .wrapper.col-2 .item:nth-child(1) {
  background-color: #feda2f;
}
.paragraph-featured-links-with-images .wrapper.col-2 .item:nth-child(1) .wrapper-text {
  background-color: #feda2f;
}
.paragraph-featured-links-with-images .wrapper.col-2 .item:nth-child(2) {
  background-color: blue;
}
.paragraph-featured-links-with-images .wrapper.col-2 .item:nth-child(2) .wrapper-text {
  background-color: blue;
}

.paragraph-featured-text p {
  font-size: 30px;
  line-height: 45px;
  color: #0072b0;
  text-align: center;
  font-weight: 900;
}
@media screen and (max-width: 768px) {
  .paragraph-featured-text p {
    font-size: 25px;
    line-height: 35px;
  }
}

.paragraph-logos .wrapper {
  max-width: 1400px;
  padding: 0 15px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.paragraph-logos .wrapper img {
  max-width: 100px;
  margin: 10px 5px;
}

.paragraph-title-text h2 {
  text-align: center;
  margin-bottom: 30px;
}
.paragraph-title-text.background {
  background-color: #083c61;
  padding: 40px 0;
  color: white;
  text-align: center;
}
.paragraph-title-text.background h2 {
  color: white;
}
.paragraph-title-text.background p {
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  color: #4acdd5;
}
@media screen and (max-width: 768px) {
  .paragraph-title-text.background {
    padding: 20px 0;
  }
}

.paragraph-image-text-columns .container {
  display: flex;
}
.paragraph-image-text-columns .container .wrapper-image {
  width: 45%;
}
.paragraph-image-text-columns .container .wrapper-text {
  width: 55%;
  padding-left: 40px;
}
.paragraph-image-text-columns .container .wrapper-text .generic-link {
  margin-top: 40px;
}
@media screen and (max-width: 992px) {
  .paragraph-image-text-columns .container .wrapper-text {
    padding-left: 20px;
  }
}
@media screen and (max-width: 768px) {
  .paragraph-image-text-columns .container {
    flex-wrap: wrap;
  }
  .paragraph-image-text-columns .container .wrapper-image {
    width: 100%;
    margin-bottom: 10px;
  }
  .paragraph-image-text-columns .container .wrapper-text {
    width: 100%;
    padding-left: 0;
  }
}

.paragraph-list-two-columns .wrapper-list {
  columns: 2;
  column-gap: 50px;
}
.paragraph-list-two-columns .wrapper-list .item {
  position: relative;
  padding-left: 30px;
  margin: 10px 0;
}
.paragraph-list-two-columns .wrapper-list .item:before {
  content: "✔";
  display: inline-block;
  position: absolute;
  top: 5px;
  left: 0;
  color: #4acdd5;
  font-size: 25px;
}
@media screen and (max-width: 768px) {
  .paragraph-list-two-columns .wrapper-list {
    columns: auto;
    column-gap: 0;
  }
}

.paragraph-subscription h2 {
  text-align: center;
}
.paragraph-subscription .wrapper-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 -10px;
  overflow: hidden;
}
.paragraph-subscription .wrapper-items .item {
  width: calc(25% - 20px);
  margin: 10px;
  border-radius: 10px;
  background-color: #ffae00;
  padding: 30px 20px;
  text-align: center;
  color: #333;
}
.paragraph-subscription .wrapper-items .item .type {
  font-weight: 700;
  font-size: 35px;
  margin-bottom: 10px;
}
.paragraph-subscription .wrapper-items .item .price {
  font-weight: 700;
  font-size: 22px;
}
.paragraph-subscription .wrapper-items .item .text {
  margin-top: 15px;
}
.paragraph-subscription .wrapper-items .item .text p {
  font-size: 16px;
}
.paragraph-subscription .wrapper-items .item .generic-link {
  margin-top: 10px;
}
@media screen and (max-width: 992px) {
  .paragraph-subscription .wrapper-items .item {
    width: calc(50% - 20px);
  }
}
@media screen and (max-width: 768px) {
  .paragraph-subscription .wrapper-items {
    margin: 0;
    flex-direction: column;
  }
  .paragraph-subscription .wrapper-items .item {
    width: 100%;
    margin: 10px 0;
  }
}

.paragraph-title-text-items {
  overflow: hidden;
}
.paragraph-title-text-items .wrapper {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -20px;
}
@media screen and (max-width: 768px) {
  .paragraph-title-text-items .wrapper {
    margin: 0;
  }
}
.paragraph-title-text-items .wrapper .item {
  margin: 20px;
  width: calc(33.33% - 40px);
}
.paragraph-title-text-items .wrapper .item .title {
  font-weight: 900;
  font-size: 20px;
  margin-bottom: 10px;
}
@media screen and (max-width: 992px) {
  .paragraph-title-text-items .wrapper .item {
    width: calc(50% - 40px);
  }
}
@media screen and (max-width: 768px) {
  .paragraph-title-text-items .wrapper .item {
    width: 100%;
    margin: 0 0 10px 0;
  }
}

.scroll-to-top {
  position: relative;
}

.btn-position {
  position: fixed;
  bottom: 40px;
  right: 25px;
  z-index: 20;
}

.btn-style {
  background-color: #4acdd5;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  color: #fff;
  cursor: pointer;
  font-size: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  visibility: hidden;
  transition: 0.3s;
  box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);
}

.wrapper-gray {
  background-color: #efefef;
  border-radius: 30px;
  padding: 50px;
  margin: 50px 0;
}
@media screen and (max-width: 780px) {
  .wrapper-gray {
    padding: 20px;
    margin: 20px 0;
  }
}
.wrapper-gray .form-item {
  border-bottom: 1px solid #1d6a99;
  margin: 25px 0;
  padding-bottom: 25px;
}
.wrapper-gray .form-item label {
  font-weight: bold;
  color: #000;
  font-size: 18px;
  margin: 0 0 20px 0;
}
.wrapper-gray .form-item select {
  appearance: none;
  background: url(../img/ico-select.svg) no-repeat calc(100% - 15px) center #fff;
  background-size: 15px;
  border: 1px solid #4acdd5;
  border-radius: 10px;
  padding: 15px 50px 15px 15px;
  height: auto;
}
.wrapper-gray .form-item select:focus {
  outline: none;
}
.wrapper-gray .form-item input {
  background: #fff;
  border: 1px solid #4acdd5;
  border-radius: 10px;
  padding: 15px;
}
.wrapper-gray .form-item input[type=checkbox], .wrapper-gray .form-item input[type=radio] {
  width: 20px;
  height: 20px;
  background: #fff;
  appearance: none;
  padding: 0;
  margin: 0 5px 10px 0;
  border-radius: 3px;
  position: relative;
}
.wrapper-gray .form-item input[type=checkbox]:checked:after, .wrapper-gray .form-item input[type=radio]:checked:after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  background: #4acdd5;
  position: absolute;
  top: 3px;
  left: 3px;
}
.wrapper-gray .form-item input[type=checkbox]:focus, .wrapper-gray .form-item input[type=radio]:focus {
  outline: none;
}
.wrapper-gray .form-item input[type=radio] {
  border-radius: 50%;
}
.wrapper-gray .form-item input[type=radio]:checked:after {
  border-radius: 50%;
}
.wrapper-gray .form-item .form-item__description,
.wrapper-gray .form-item .fieldset__description {
  width: 100%;
  max-width: 100%;
  font-size: 16px;
  line-height: 22px;
  margin-top: 15px;
}
.wrapper-gray .form-item.fieldset {
  background: none;
  border: none;
  margin: 25px 0;
}
.wrapper-gray .form-item.fieldset legend {
  background: none;
  margin: 0;
  padding: 0;
}
.wrapper-gray .form-item.fieldset legend .fieldset__label {
  font-weight: bold;
  color: #000;
  font-size: 18px;
  padding: 0;
  margin: 0 0 20px 0;
}
.wrapper-gray .form-item.fieldset .fieldset__wrapper {
  border: none;
  padding: 0;
  margin: 0;
}
.wrapper-gray .form-item.fieldset .fieldset__wrapper .form-checkboxes,
.wrapper-gray .form-item.fieldset .fieldset__wrapper .form-boolean-group {
  display: flex;
}
@media screen and (max-width: 992px) {
  .wrapper-gray .form-item.fieldset .fieldset__wrapper .form-checkboxes,
  .wrapper-gray .form-item.fieldset .fieldset__wrapper .form-boolean-group {
    flex-wrap: wrap;
  }
}
.wrapper-gray .form-item.fieldset .fieldset__wrapper .form-checkboxes .form-item,
.wrapper-gray .form-item.fieldset .fieldset__wrapper .form-boolean-group .form-item {
  border: none;
  margin: 0 30px 0 0;
  padding: 0;
  line-height: initial;
}
.wrapper-gray .form-item.fieldset .fieldset__wrapper .form-checkboxes .form-item.fieldset,
.wrapper-gray .form-item.fieldset .fieldset__wrapper .form-boolean-group .form-item.fieldset {
  margin: 25px 0;
}
@media screen and (max-width: 768px) {
  .wrapper-gray .form-item.fieldset .fieldset__wrapper .form-checkboxes .form-item,
  .wrapper-gray .form-item.fieldset .fieldset__wrapper .form-boolean-group .form-item {
    margin: 0 20px 5px 0;
    width: calc(50% - 20px);
    display: flex;
  }
  .wrapper-gray .form-item.fieldset .fieldset__wrapper .form-checkboxes .form-item label,
  .wrapper-gray .form-item.fieldset .fieldset__wrapper .form-boolean-group .form-item label {
    max-width: calc(100% - 30px);
  }
}
.wrapper-gray .form-item.fieldset .fieldset__wrapper .form-checkboxes label,
.wrapper-gray .form-item.fieldset .fieldset__wrapper .form-boolean-group label {
  font-size: 16px;
  line-height: 20px;
  font-weight: normal;
  padding: 0;
  margin: 0;
}
.wrapper-gray .form-actions {
  display: flex;
  align-items: center;
}
.wrapper-gray .form-actions input {
  background: #4acdd5;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
}
.wrapper-gray .form-actions input:hover {
  background-color: #083c61;
}
.wrapper-gray .form-actions .link--previous {
  background-color: #083c61;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
}
.wrapper-gray .form-actions .link--previous:hover {
  background-color: #4acdd5;
}
.wrapper-gray table {
  width: 100%;
  margin: 0 0 30px;
}
.wrapper-gray table th {
  border-bottom: 1px solid black;
  font-size: 16px;
  padding: 10px;
  text-align: center;
}
.wrapper-gray table td {
  padding: 10px;
  text-align: center;
}
@media screen and (max-width: 780px) {
  .wrapper-gray table thead {
    display: none;
  }
  .wrapper-gray table tr {
    display: block;
    margin-bottom: 10px;
  }
  .wrapper-gray table tr td {
    display: block;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    padding: 10px 0;
    text-align: right;
    line-height: 20px;
  }
  .wrapper-gray table tr td:before {
    text-transform: uppercase;
    font-weight: bold;
    text-align: left;
    float: left;
    max-width: 50%;
    font-size: 14px;
    line-height: 16px;
    margin-right: 20px;
  }
  .wrapper-gray table tr td:nth-child(1):before {
    content: "Product";
  }
  .wrapper-gray table tr td:nth-child(2):before {
    content: "Course languages";
  }
  .wrapper-gray table tr td:nth-child(3):before {
    content: "Tutor languages";
  }
  .wrapper-gray table tr td:nth-child(4):before {
    content: "Users";
  }
  .wrapper-gray table tr td:nth-child(5):before {
    content: "Next renewal";
  }
  .wrapper-gray table tr td:nth-child(6):before {
    content: "Price";
  }
}
.wrapper-gray .button-action {
  background: #4acdd5;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
  margin: 10px 30px 5px 0;
}
.wrapper-gray .button-action:hover {
  background-color: #083c61;
  color: #fff;
}

.layout-checkout-form .wrapper-summary {
  background-color: #083c61;
  color: #fff;
  padding: 30px;
  border-radius: 20px;
  text-align: left;
}
@media screen and (max-width: 780px) {
  .layout-checkout-form .wrapper-summary {
    padding: 15px;
  }
}
.layout-checkout-form .wrapper-summary h3 {
  color: #fff;
  margin: 0 0 20px 0;
  font-size: 20px;
}
.layout-checkout-form .wrapper-summary .checkout-pane-order-summary {
  background: rgba(255, 255, 255, 0.2);
  padding: 15px;
}
.layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content {
  margin-bottom: 20px;
}
@media screen and (max-width: 780px) {
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table thead {
    display: none;
  }
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table tr {
    display: block;
    margin-bottom: 10px;
  }
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table tr td {
    display: block;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    padding: 10px 0;
    text-align: right;
    line-height: 20px;
  }
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table tr td:before {
    text-transform: uppercase;
    font-weight: bold;
    text-align: left;
    float: left;
    max-width: 50%;
    font-size: 14px;
    line-height: 16px;
    margin-right: 20px;
  }
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table tr td.views-field-title:before {
    content: "Months";
  }
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table tr td.views-field-field-nusers:before {
    content: "Users";
  }
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table tr td.views-field-field-course-languages:before {
    content: "Course Languages";
  }
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table tr td.views-field-field-tutor-language:before {
    content: "Tutor Language";
  }
  .layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-content table tr td.views-field-field-ndays:before {
    content: "Next renewal";
  }
}
.layout-checkout-form .wrapper-summary .checkout-pane-order-summary .view-commerce-checkout-order-summary .view-footer .order-total-line__total {
  font-size: 18px;
}
.layout-checkout-form .wrapper-summary .checkout-pane-order-summary table {
  width: 100%;
  color: white;
  margin: 0;
}
.layout-checkout-form .wrapper-summary .checkout-pane-order-summary table th {
  color: white;
  border-bottom-color: white;
  font-size: 16px;
}
.layout-checkout-form .wrapper-summary .form-item {
  border: none;
  padding-bottom: 0;
}
.layout-checkout-form .wrapper-summary .form-item label {
  color: white;
}
.layout-checkout-form .wrapper-summary input[type=submit] {
  background: #4acdd5;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
  margin-top: 0;
}
.layout-checkout-form .wrapper-summary input[type=submit]:hover {
  color: #083c61;
  background: #fff;
}
.layout-checkout-form .wrapper-payment {
  margin-top: 50px;
  text-align: left;
}
.layout-checkout-form .wrapper-payment .checkout-pane-payment-information > legend {
  display: none;
}
.layout-checkout-form .wrapper-payment .checkout-pane-payment-information .fieldset {
  padding-bottom: 0;
}
.layout-checkout-form .wrapper-payment .checkout-pane-payment-information .form-item {
  border: none;
  padding-bottom: 0;
  display: inline-block;
  margin: 15px 15px 15px 0;
}
.layout-checkout-form .wrapper-payment .checkout-pane-payment-information .form-text {
  background: #fff;
  border: 1px solid #4acdd5;
  border-radius: 10px;
  padding: 15px;
}
.layout-checkout-form .wrapper-payment .checkout-pane-payment-information .credit-card-form__expiration .form-item {
  margin: 0;
}
.layout-checkout-form .wrapper-payment .checkout-pane-payment-information .stripe-form #card-number-element {
  width: 250px;
  max-width: 100%;
}
.layout-checkout-form .wrapper-payment .checkout-pane-payment-information .stripe-form #expiration-element {
  width: 100%;
}
.layout-checkout-form .wrapper-payment .checkout-pane-payment-information .stripe-form #security-code-element {
  width: 6em;
}
.layout-checkout-form .checkout-pane-login {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 780px) {
  .layout-checkout-form .checkout-pane-login {
    flex-direction: column;
  }
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option {
  border-radius: 30px;
  padding: 50px 30px;
  border: none;
}
@media screen and (max-width: 780px) {
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option {
    border: 1px solid #083c61;
  }
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__legend {
  background: none;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__legend .fieldset__label {
  color: #a5a5a5;
  font-size: 22px;
  font-weight: bold;
  padding: 0;
  margin-bottom: 30px;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper {
  padding: 0;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper .form-item {
  margin: 25px 0;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper .form-item label {
  font-weight: bold;
  color: #fff;
  font-size: 18px;
  margin: 0 0 10px 0;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper .form-item input {
  background: #fff;
  background-size: 15px;
  border: 1px solid #4acdd5;
  border-radius: 10px;
  padding: 15px 50px 15px 15px;
  height: auto;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper .form-item input:focus {
  outline: none;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper .form-item .description,
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper .form-item .password-strength {
  font-size: 12px;
  line-height: 16px;
  margin-top: 5px;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper .form-submit {
  background: #4acdd5;
  border-radius: 30px;
  border: 1px solid #fff;
  padding: 15px 30px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 22px;
  height: auto;
  margin-right: 10px;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper .form-submit:hover {
  color: #083c61;
  background: #fff;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper #edit-login-returning-customer-forgot-password {
  color: #4acdd5;
  display: inline-block;
  margin-top: 10px;
  margin-left: 10px;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper #edit-login-returning-customer-forgot-password:hover {
  color: #fff;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option#edit-login-returning-customer {
  background-color: #083c61;
  color: #fff;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option#edit-login-register {
  background-color: #efefef;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option#edit-login-register .fieldset__wrapper .form-item label {
  color: black;
}
.layout-checkout-form .checkout-pane-login .form-wrapper__login-option#edit-login-register .form-submit:hover {
  background-color: #083c61;
  color: #fff;
}
@media screen and (max-width: 780px) {
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option#edit-login-register .fieldset__legend .fieldset__label {
    color: #4acdd5;
  }
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option#edit-login-register .fieldset__legend .fieldset__label:after {
    background: url(../img/ico-select.svg) no-repeat center;
  }
}
@media screen and (max-width: 780px) {
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option {
    padding: 0px;
    margin: 10px 0;
  }
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__legend .fieldset__label {
    margin: 0;
    padding: 20px 55px 20px 20px;
    position: relative;
    color: white;
    font-size: 20px;
  }
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__legend .fieldset__label:after {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url(../img/ico-select-w.svg) no-repeat center;
    position: absolute;
    right: 30px;
  }
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option .fieldset__wrapper {
    display: none;
    padding: 5px 20px 20px;
  }
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option.open .fieldset__wrapper {
    display: block;
  }
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option.open .fieldset__label:after {
    rotate: 180deg;
  }
  .layout-checkout-form .checkout-pane-login .form-wrapper__login-option#edit-login-guest .fieldset__legend .fieldset__label:after {
    filter: invert(100);
  }
}

.commerce-checkout-flow .wrapper-gray {
  text-align: center;
}
.commerce-checkout-flow a[data-drupal-selector=edit-link-setup-users] {
  border-radius: 8px;
  border: 4px solid white;
  padding: 5px 20px;
  color: black;
  display: inline-block;
  text-decoration: none;
  font-size: 16px;
  background: rgb(254, 218, 47);
}
.commerce-checkout-flow a[data-drupal-selector=edit-link-setup-users]:hover {
  background: #ffcd04;
  cursor: pointer;
}

.chosen-container {
  max-width: 100% !important;
}
.chosen-container .chosen-single {
  background: #fff;
  background-size: 15px;
  border: 1px solid #4acdd5;
  border-radius: 10px;
  padding: 15px 50px 15px 15px;
  height: auto;
  font-size: 16px;
}
.chosen-container .chosen-single div {
  width: 40px;
}
.chosen-container .chosen-single div b {
  background: url(../img/ico-select.svg) no-repeat calc(100% - 15px) center #fff;
  background-size: 15px;
}
.chosen-container-active .chosen-single,
.chosen-container-active .chosen-drop {
  border-color: #4acdd5 !important;
}
.chosen-container .chosen-drop .chosen-search {
  margin: 10px 0 !important;
}
.chosen-container .chosen-drop .chosen-search input {
  border-radius: 25px;
  min-height: 40px;
  padding: 10px 20px;
}
.chosen-container .chosen-drop .chosen-results li:hover, .chosen-container .chosen-drop .chosen-results li.result-selected {
  background-color: #4acdd5;
}

#block-muzzyshop-mzprogress {
  background: #f6f6f6;
  padding: 50px 15px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #block-muzzyshop-mzprogress {
    padding: 30px 15px;
  }
}
#block-muzzyshop-mzprogress h2 {
  display: none;
}
#block-muzzyshop-mzprogress .checkout-progress {
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 0;
  position: relative;
  list-style: none;
  counter-reset: checkout-progress;
}
#block-muzzyshop-mzprogress .checkout-progress:before {
  content: "";
  display: inline-block;
  height: 1px;
  width: 590px;
  background-color: #083c61;
  background-color: #083c61;
  position: absolute;
  top: 20px;
}
@media screen and (max-width: 768px) {
  #block-muzzyshop-mzprogress .checkout-progress:before {
    top: 15px;
    width: 270px;
  }
}
#block-muzzyshop-mzprogress .checkout-progress .checkout-progress--step {
  text-align: center;
  font-size: 11px;
  line-height: 15px;
  margin: 0 15px;
  padding: 0;
  counter-increment: checkout-progress;
  width: 85px;
}
@media screen and (max-width: 768px) {
  #block-muzzyshop-mzprogress .checkout-progress .checkout-progress--step {
    width: 30px;
    height: 30px;
    overflow: hidden;
    margin: 0 10px;
  }
}
#block-muzzyshop-mzprogress .checkout-progress .checkout-progress--step::before {
  content: counter(checkout-progress);
  display: block;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  font-size: 20px;
  font-weight: bold;
  background-color: #4acdd5;
  color: #fff;
  margin: 0 auto 10px;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  #block-muzzyshop-mzprogress .checkout-progress .checkout-progress--step::before {
    width: 30px;
    height: 30px;
    font-size: 16px;
    font-weight: normal;
    line-height: 20px;
  }
}
#block-muzzyshop-mzprogress .checkout-progress .checkout-progress--step.checkout-progress--step__current:before {
  background-color: #083c61;
}

.view-commerce-cart-form {
  background-color: #083c61;
  color: #fff;
  padding: 30px;
  border-radius: 20px;
}
.view-commerce-cart-form .views-table {
  background: rgba(255, 255, 255, 0.2);
  padding: 30px;
  color: #fff;
  width: 100%;
  display: inline-block;
  overflow-x: scroll;
}
@media screen and (max-width: 780px) {
  .view-commerce-cart-form .views-table {
    padding: 10px;
  }
}
.view-commerce-cart-form .views-table thead th {
  color: #fff;
  padding: 15px;
  border-bottom: 2px solid #fff;
}
.view-commerce-cart-form .views-table tbody td {
  padding: 15px;
  text-align: center;
  border: none;
}
.view-commerce-cart-form .views-table tbody td .button {
  margin: 0;
  border: 1px solid #fff;
  background: none;
  font-size: 12px;
  color: #fff;
  height: auto;
  padding: 7px 30px;
  border-radius: 15px;
}
.view-commerce-cart-form .views-table tbody td .button:hover {
  background: #fff;
  color: #083c61;
}