:root {
  --agencies-filter: brightness(0);
  --accent-color: #00a3c6;
  --accent-color-light: #4fc3e0;
  --accent-color-dark: #0d8aa8;

  /* DEPRECATED - Light mode disabled, Dark mode forced permanently */
  --bg-primary: #f5f5f5;
  --bg-secondary: #ffffff;
  --text-primary: #333333;
  --text-secondary: #666666;
  --border-color: #e0e0e0;
  --topbar-bg: #000;
  --topbar-text: #333333;
  --menu-bg: #ffffff;
  --menu-hover: #f5f5f5;
  --gradient-start: #0094b5;
  /* Font families */
  --font-family-text: 'Space Grotesk', 'Inter', sans-serif;
  --gradient-end: #00c1aa;
}

/* Dark mode colors */
[data-theme="dark"] {
  --agencies-filter: brightness(0) invert(1);
  /* === PALETA DE COLORS BASE === */
  /* Backgrounds - progressió del més fosc al més clar */
  --bg-base: #000;              /* Footer extra fosc */
  --bg-primary: #121212;           /* Fons principal */
  --bg-secondary: #1f1f1f;         /* Cards, contingut */
  --bg-tertiary: #252525;          /* Elements destacats */
  --bg-elevated: #2a2a2a;          /* Dropdowns, modals */
  --bg-hover: #303030;             /* Hover states */

  /* Text - jerarquia clara */
  --text-primary: #a5b0af;         /* Títols principals (13.5:1) */
  --text-secondary: #c2c2c2;       /* Text cos (9.85:1) */
  --text-tertiary: #9e9e9e;        /* Text subtil (6.2:1) */
  --text-disabled: #707070;        /* Text desactivat */
  --text-placeholder: #888888;     /* Placeholders */
  --text-primary-highlighted: #ffffff;

  /* Borders - separació visual */
  --border-subtle: #242424;        /* Separadors lleugeres */
  --border-default: #3a3a3a;       /* Borders normals */
  --border-strong: #505050;        /* Borders èmfasi */
  --border-focus: #4a4a4a;         /* Focus ring base */

  /* === COLORS D'ACCENT === */
  /* Accent principal - blau turquesa més brillant per dark mode */
  --accent-primary: #00a3c6;       /* Principal */
  --accent-hover: #5dd1ed;         /* Hover */
  --accent-pressed: #26a7c5;       /* Pressed */
  --accent-subtle: rgba(61, 189, 217, 0.15);
  --accent-text: #5dd1ed;          /* Per a enllaços */

  /* === COLORS SEMÀNTICS === */
  /* Success - verd */
  --success: #4ade80;
  --success-hover: #22c55e;
  --success-bg: rgba(74, 222, 128, 0.15);
  --success-border: rgba(74, 222, 128, 0.3);

  /* Error - vermell */
  --error: #f87171;
  --error-hover: #dc2626;
  --error-bg: rgba(248, 113, 113, 0.15);
  --error-border: rgba(248, 113, 113, 0.3);

  /* Warning - groc/taronja */
  --warning: #fbbf24;
  --warning-hover: #f59e0b;
  --warning-bg: rgba(251, 191, 36, 0.15);
  --warning-border: rgba(251, 191, 36, 0.3);

  /* Info - blau */
  --info: #60a5fa;
  --info-hover: #3b82f6;
  --info-bg: rgba(96, 165, 250, 0.15);
  --info-border: rgba(96, 165, 250, 0.3);

  /* === SHADOWS I ELEVACIÓ === */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.6);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.7);
  --shadow-lg: 0 10px 24px rgba(0, 0, 0, 0.8);
  --shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.9);

  /* Shadows amb accent */
  --shadow-accent-sm: 0 2px 8px rgba(61, 189, 217, 0.2);
  --shadow-accent-md: 0 4px 16px rgba(61, 189, 217, 0.25);
  --shadow-accent-lg: 0 8px 32px rgba(61, 189, 217, 0.3);

  /* Glow effects */
  --glow-subtle: 0 0 20px rgba(61, 189, 217, 0.15);
  --glow-medium: 0 0 30px rgba(61, 189, 217, 0.25);
  --glow-strong: 0 0 40px rgba(61, 189, 217, 0.35);

  /* === GRADIENTS === */
  --gradient-primary: linear-gradient(115deg, #0d7a92 0%, #2b8e82 100%);
  --gradient-accent: linear-gradient(135deg, var(--accent-primary) 0%, var(--accent-hover) 100%);
  --gradient-card: linear-gradient(145deg, var(--bg-secondary) 0%, var(--bg-tertiary) 100%);
  --gradient-glass: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);

  /* === LEGACY COMPATIBILITY (mantenir per compatibilitat) === */
  --accent-color: var(--accent-primary);
  --accent-color-light: var(--accent-hover);
  --accent-color-dark: var(--accent-pressed);
  --border-color: var(--border-default);
  --topbar-bg: #000;
  --topbar-text: var(--text-primary);
  --menu-bg: var(--bg-secondary);
  --menu-hover: var(--bg-hover);
  --gradient-start: #0094b5;
  --gradient-end: #00c1aa;

  /* === TRANSICIONS === */
  --transition-fast: 0.15s ease;
  --transition-base: 0.2s ease;
  --transition-slow: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

body,html { background-color:var(--bg-primary); display:table;width:100%;height:100%; overflow-x:hidden; margin:0; padding:0; color:var(--text-primary); transition: background-color 0.3s ease, color 0.3s ease;}
* {
  box-sizing: border-box;
}
/*ul.pureCssMenu .fa-chevron-down::before { 
  content: none !important;
}*/

.btn-primary {
  display: inline-block;
  padding: 15px 40px !important;
  background: linear-gradient(115deg, var(--accent-color) 0%, #3fc0b4 100%);
  color: white;
  text-decoration: none;
  border-radius: 50px;
  font-weight: 600;
  font-size: 1.1rem;
  transition: all 0.3s ease;
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(38, 167, 197, 0.3);
  color: white;
  text-decoration: none;
}
.centered { text-align:center; }
.espaiat { margin:100px auto 60px auto !important; }
.noespaiat { margin:0 !important; }
div#message { color:#fff !important; }
div#message b {font-weight:800 !important;}
div#message i::before { color: var(--accent-color); } 
/* CTA Button - Common styles */
.btn-cta {
  border-radius: 7.5px;
  padding: 0 !important;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  z-index: 0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  display: inline-block;
}

.btn-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  transition: transform 0.2s ease;
  z-index: -1;
}

.btn-cta:hover::before {
  transform: scale(1.1);
}

.btn-cta a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 13px;
  position: relative;
  z-index: 1;
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
  text-decoration: none;
  transition: none;
}

.btn-cta i {
  font-size: 13px;
}

/* Light theme - fons negre, contingut blanc */
[data-theme="light-DISABLED"] .btn-cta {
  background: #000 !important;
}

[data-theme="light-DISABLED"] .btn-cta::before {
  background: #000;
}

[data-theme="light-DISABLED"] .btn-cta a,
[data-theme="light-DISABLED"] .btn-cta i {
  color: #fff !important;
}

/* Dark theme - fons blanc, contingut negre */
[data-theme="dark"] .btn-cta {
  background: #fff !important;
}

[data-theme="dark"] .btn-cta::before {
  background: #fff;
}

[data-theme="dark"] .btn-cta a,
[data-theme="dark"] .btn-cta i {
  color: #000 !important;
}

#customer_login { margin-left:15px}

.half.right {
 display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

.btn-primary-intergrid {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 24px;
  background: #f5f5f5;
  color: #333;
  text-decoration: none;
  border-radius: 6px;
  font-weight: 600;
  transition: all 0.3s;
}

div#menu button { display:none; }
.pureCssMenui i {
  color: #fff;
  font-size: 0.9em;
 padding-top:10px;
}

.maxsize { max-width:100%;width:100%; }
section.page {min-height:500px; }
.opengea_logo { width:100px; padding:20px 0px }
.main_content { background:var(--bg-base); /*linear-gradient(45deg, #d3f3f8 0, #fff 100%) */ transition: background 0.3s ease; }
#rack { height:265px; }
#particles-js, div#site-header { height:266px;}
#rack { width:100%;background-size:cover;background-position-y:center }
/*

#rack,.fonsbg { position: absolute;
  top: 0px;
  opacity: .7;
}
div#site-header {
  position:relative;
background-color:#000;

  display: flex;
  align-items: flex-start;
  justify-content: center;
  top:52px;
 }
*/

#rack,.fonsbg { position: absolute;
  top: 0px;
  mix-blend-mode: soft-light;
  opacity: .6;
}

div#site-header {
  position:relative;
  background: linear-gradient(115deg, rgb(5, 221, 201) 0%, rgb(164, 56, 212) 100%);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  top:56px;
  overflow:visible;
  padding-bottom:2rem;
  transition: top 0.3s ease, background 0.3s ease;
 }

/* Site header cuando topbar está ontop */
div#topbar.ontop ~ div#menu ~ div#site-header,
body:not(.scrolled) div#site-header {
  top: 65px;
}

/* Site header cuando topbar está scrolled */
div#topbar.scrolled ~ div#menu ~ div#site-header {
  top: 56px;
}

/* Header més gran només per a la home */
div#site-header.home-header {
  height: 500px !important;
  align-items: center;
}

div#site-header.home-header #rack {
  height: 500px !important;
}

div#site-header.home-header #title_box {
  top: 9%;
  transform: none;
}

/* Efecte mossegat centrat a la vora inferior */
.minh { min-height:500px; }
body hr {border-top:1px solid #e5e5e5 !important}
.left { text-align:left;}

/*faq */

.faq-question {
  width: 100%;
  text-align: left;
  background: #000 !important;
  border-bottom: 1px solid #333;
  color: #fff;
  padding: 14px 0px;
  font-size: 18px;
  font-weight: normal;
  border-radius:0 !important;
  margin-top: 10px;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.faq-question:hover {
  transform: translateY(-1px);
  background:none !important;
}
.faq-toggle {
  color: #fff;
  margin-left: 10px;
  transition: transform 0.3s ease;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  transform: rotate(0deg);
}
.faq-toggle.open {
  transform: rotate(180deg);
}
.faq-answer {
  display: none;
  padding: 12px 20px;
  background-color: #fff;
  border-left: 4px solid var(--accent-color);
  margin-bottom: 10px;
  border-radius: 0 !important;
  font-size: 15px;
  color: #333;
  text-align:left;
}
.faq-answer p {
  text-align:left;
  line-height: 1.8;
}
/* feature grid */

  .feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.25rem;
    margin-bottom: 2rem;
  }

  .feature-grid li {
    list-style: none;
    background: #fff;
    padding: 1rem;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
  }

  .feature-grid li:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  }

  .feature-grid li i {
    font-size: 1.5rem;
    color: var(--accent-color);
    flex-shrink: 0;
    margin-top: 3px;
  }

  .feature-grid li .text {
    font-size: 15px;
    color: #444;
    line-height: 1.5;
    text-align:left;
    padding-top:5px;
  }

  .feature-grid li .text .destacat, .feature-grid li .text-content b {
    font-weight: bold;
    color: var(--text-primary-highlighted) !important;
  }


/* domain */

.wide { width:100%;}
div#logo .container_logo {
display:inline-block;width:150px;cursor:hand;padding-top:2px
}
/* main */

  .home-section {
    padding: 2rem 1rem;
    font-family: var(--font-family-text);
    max-width: 1200px;
    margin: auto;
  }
  .home-intro {
    text-align: center;
    margin-bottom: 2rem;
  }
  .home-intro h3 {
    font-size: 1.6rem;
    color: #333;
    margin-bottom: 1rem;
  }
  .home-description {
    font-size: 15px;
    color: #444;
    margin-bottom: 2rem;
  }
  .services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 columnes  repeat(auto-fit, minmax(220px, 1fr));*/
    gap: 1.5rem;
    align-items: stretch;
  }
  .service-card {
    background: #fff;
    padding: 1rem;
    padding-top: 3rem;
    border-radius: 8px;
    display: flex;
    border: 1px solid #d0d0d0;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none;
    color: inherit;
    min-height: 100%;
    overflow: hidden;
    position: relative;
}


section#hosting {
  padding-top: 70px;
}

section#hosting span.center {
  display: block;
  font-size: 17px;
  line-height: 1.6;
  margin-bottom: 20px;
  color: #555;
}

section#hosting  .service-card, section#cloudhost .service-card  {
  min-height: 100%;
  padding-top: 3rem;
  }

section#hosting .service-card.featured,
section#hosting .service-card:has(.badge-gray) {
  padding-top: 55px !important;
}

section#hosting .badge-gray {
  background: linear-gradient(135deg, #a5b2be 0%, #87959e 100%) !important;
  background-color: #a5b2be !important;
}





section#hosting .service-icon {
  margin: 1.5rem auto 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

section#hosting .service-icon i {
  font-size: 64px;
  color: var(--accent-color);
}

   .service-card.featured {
    border: 1.5px solid var(--accent-color);
    position: relative;
    overflow: hidden;
    padding-top: 3rem;
    min-height: 100%;
    box-shadow: 0 8px 24px rgba(38, 167, 197, 0.15);
 }

 .service-card.featured::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #26a7c5 0%, #3fc0b4 100%);
    z-index: 1;
 }
  .service-card:hover {
    text-decoration: none;
  }
  .service-card img {
    width: 64px;
    height: auto;
    margin-bottom: 1rem;
  }
  .service-card .text {
    font-size: 14px;
    color: #333;
    margin-bottom: 1rem;
  }
  .service-card .text b {
    font-size: 15px;
    color: #000;
  }
  .service-card .card-cta, .btn-outline {
    background: none;
    color: var(--accent-color);
    border: 1.5px solid var(--accent-color);
    padding: 0.8rem 1rem;
    border-radius: 7px;
    font-size: 1rem;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    width:80%;
  }
   .service-card.featured  .card-cta {
    background: var(--accent-color);
    color: #fff;
}
  .service-card .card-cta:hover, .btn-outline:hover {
    background: linear-gradient(115deg, var(--accent-color) 0%, #3fc0b4 100%);
    border: 1.5px solid transparent;
    text-decoration: none;
    color:#fff;
    box-shadow: 0 8px 20px rgba(38, 167, 197, 0.35);
  }
  .guarantee-box {
    margin-top: 3rem;
    background: #f7f7f7;
    border-radius: 10px;
    padding: 1.5rem;
    font-size: 14px;
    color: #444;
  }
  .guarantee-box strong {
    display: block;
    font-size: 15px;
    margin-bottom: 1rem;
  }
  .guarantee-box p {
    margin: 0.5rem 0;
  }

/* ---- */
.timeline-steps {
 padding-top:33px;
 max-width:800px;margin:auto;
  display: flex;
  flex-direction: row;
 align-items: center;
  justify-content: space-between;
  font-size: 1rem;
  flex-wrap: wrap;
}

.step {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  white-space: nowrap;
}
.white { color:#fff !important;}
.timeline-steps .line {
  flex: 1;
  height: 2px !important;
  background:none;
  margin: 0 0.5rem;
  max-width:100px;
  width:20%;
}
body .timeline-steps .cicle-char, .timeline-steps span.label {
  color: #444 !important;
}
.circle-char { color:#222; }
.highlight .circle-char {
  border: 2.5px solid var(--accent-color) !important;
  background-color: var(--accent-color);
  font-weight: bold !important;
  color: #fff !important;
}
.highlight .label {  color:var(--text-primary-highlighted) !important; }
.line {
  height: 20px;
  border-top: 1px dotted #555;
  margin-top: 0;
}

.circle-char {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1.6em;
  height: 1.6em;
  background:none;
  color: #222;
  border-radius: 50%;
  border:1px solid #666 !important;
  font-size: 0.85em;
  font-weight: normal;
  flex-shrink: 0;
}

 .loading {
            display: none;
            font-size: 20px;
            margin: 5px 5px 0px 0px;
        }
        #resultat {
                 margin-top: 20px;
            font-size: 18px;
        }
  button:disabled {
            background-color: #ccc;
            cursor: not-allowed;
        }

.faq {
  margin-top: 20px;
}

.headline {
  font-size: 32px;
  font-weight: 600;
  color: var(--text-primary-highlighted);
  margin-top: 3rem;
  margin-bottom: 2.5rem;
  line-height: 1.3;
  letter-spacing: -0.3px;
  margin-left: auto;
  margin-right: auto;
}

.datacenter .infrastructure-grid h2 { font-size: 1.5rem !important; }
section h2 { color:#000 !important; font-weight: 100 !important;   font-size: 1.7rem !important;}
section.bg2 h2 { color:#fff !important; }

.faq-answer {
  display: none;
  padding: 12px 20px;
  background-color: #fff;
  border-left: 4px solid var(--accent-color);
  margin-bottom: 10px;
  border-radius: 0 6px 6px 6px;
  font-size: 15px;
  color: #333;
}


/* Domain Check Section */
.domain-check {
    flex: 1;
    text-align: center;
    padding: 50px 0px 0px 30px;
    border-left: 2px solid rgba(255, 255, 255, 0.5);
}

.domain-check h2 {
    font-size: 24px;
    font-weight: normal;
}

.search-box {
    display: flex;
    background: white;
    border-radius: 60px;
    overflow: hidden;
    padding: 5px 5px 5px 20px;
    margin-top:30px;
    align-items: center;
    max-width:700px !important;
    border: 1.5px solid #5ac4b6;
    transition: box-shadow 0.3s ease;
    min-height: 63px;
}

#searchInput { text-transform: lowercase; }


.search-box.color2 {
   background-color: #e7f2ee !important;
}
.search-box.color1 {
   background-color: #fff !important;
}
textarea { border-radius: 8px; min-width:321px }
.search-box input {
    border: none;
    padding: 10px 15px;
    flex: 1;
    font-size: 17px;
    outline: none;
    color: #333;
    width:100px;
}

.search-box:focus-within {
    box-shadow: 0 0px 24px rgba(38, 167, 197, 0.40) !important;
}

div#shopping_cart { float:left; }
.cross { width:100%; padding:10px 20px !important;font-size:16px;margin:0 0px 10px 0px;}
button,.search-box button {
    background-color: var(--accent-color) !important;
    color:#fff;
    border: none;
    padding: 15px 18px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 50px !important;
    transition: 0.3s;
}
button:hover {
  background-color: var(--accent-color-dark);
}
button.alt { 
   background:none !important;
   border:1.5px solid var(--accent-color);
   color:var(--accent-color);
}
button.alt:hover {

}

button.navbar-toggle { background:none !important;}
button.text_w { color:#fff; }
button.pad { padding-left:20px; padding-right:20px }
.search-box button:hover {
 /*   background: linear-gradient(to right,#0a7486 0,#00838a 100%);*/
}

div#topinfo {
position:absolute;z-index:10; top:10px; right:5px;
}


@media (max-width: 1200px) {
div#menu { display:block !important; }
div#menu button.navbar-toggle { display:block !important; }
div#menu button.navbar-toggle:hover { background: none !important; }
div.left_menu_bar { display:none !important; }
button.navbar-toggle { display:block !important; visibility:visible !important; opacity:1 !important; }
div#topinfo { z-index:9999999 !important; }

/* Només mostrar icona del user-menu en mòbil */
.user-menu-block b {
    font-size: 0 !important;
}
.user-menu-block .fa-user-circle {
    font-size: 24px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}
.user-menu-block .fa-chevron-down {
    display: none !important;
}
}

#domain_options, #diagnose { padding-top:20px; }

#diagnose a {
    display: inline-block;
    padding: 10px 12px;
    border: 1.5px solid var(--accent-color);
    border-radius: 70px;
    background: transparent;
    color: var(--accent-color);
    font-size: 16px;
    text-decoration: none;
    transition: all 0.3s ease;
}

#diagnose a:hover {
    background: var(--accent-color);
    color: #fff;
    text-decoration: none;
}

[data-theme="dark"] #diagnose a {
    border-color: var(--accent-primary);
    color: var(--accent-text);
}

[data-theme="dark"] #diagnose a:hover {
    background: var(--accent-primary);
    color: var(--bg-primary);
}

section#shopping-cart {
  margin-top: 0px;
}

.alternative-domain {
  background: #e6f7fb !important;
  border-left: 4px solid var(--accent-color) !important;
}

/* Reemplaçar colors verds (#2e7d32, #28a745) i #3dc1bb per accent-color */
button.opt[style*="#28a745"],
button.opt[style*="#3dc1bb"] {
  background-color: var(--accent-color) !important;
}

#alternatives-list button.opt {
  background-color: var(--accent-color) !important;
}

span[style*="color:#2e7d32"],
span[style*="color:#0d7a92"] {
  color: var(--accent-color) !important;
}

@media (max-width: 900px) {


.responsive-table-container {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  margin-bottom: 2rem;
}

.responsive-table-container table {
  min-width: 1000px; /* o més gran segons el nombre de columnes */
  width: 100%;
  border-collapse: collapse;
}
.resp_container {
overflow-x: auto;  -webkit-overflow-scrolling: touch; 
}


.opengea_logo { width:67px;padding-top:30px;margin:auto }

ul.feature-list { margin: 0 0 1em 0; }
/* oculta 
div#shopping_cart { display:block; position:absolute; top:0px; z-index:999 }*/

section#registre { margin-top: 80px !important; }
section#registre div.maxwidth-shorter { padding-top:50px; }
section h2 {
  font-size: 1.5rem !important;
}

    .domain-check {
        border-left: none;
        padding-left: 0;
        margin-top: 20px;
    }
}

@media screen and (max-width:1170px) {
        #searchbox { height:0px !important;padding-top:83px !important;margin-right: -24px;}
}

/* ****** */
img.auto { width:100%;height:auto;}
#rack {  object-fit: cover; margin-top:0px; border-radius:0px; } 
body ul.plan-features li { list-style:none !important; }
.bg0 { background-color:#000; color:#aaa}
.bg1 { background: linear-gradient(115deg, var(--gradient-start) 0%, var(--gradient-end) 100%); color:#fff; padding:50px 10px; position:relative; overflow:visible; padding-bottom:80px }
.bg1 p, .bg1 h1, .bg1 h2, .bg1 h3 { color:#fff }

/* Efecte mossegat per al footer - només si no és footer_links */
.bg1:not(#footer_links)::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: 80%;
  max-width: 1200px;
  height: 25px;
  background: #fff;
  clip-path: polygon(2.125% 0%, 97.875% 0%, 100% 100%, 0% 100%);
}
.bg2 { background: linear-gradient(115deg, rgb(12, 170, 206) 0%, rgb(63, 192, 180) 100%); }
.bg2 p, .bg2 h1, .bg2 h2, .bg2 h3 { color:#fff }
div#topbar .icon { font-size:1em; padding:3px 10px 5px 10px; border-radius: 5px;  margin: 0px 5px 0px 0px; }
.grey { color:#474747 !important; }
h3 { line-height: 150% !important; }
.center { text-align:center !important;}
section#clients input[type="text"], section#clients input[type="password"]  { padding:13px 25px;}
 #clients {
      padding: 80px 0px 50px 0px;
      font-family: var(--font-family-text);
      color: #333;

      /*  height: 100vh; */
    }
    #clients .container {
      display: flex;
      height: 500px;
    }
    #clients .half {
      flex: 1;
      padding: 60px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
    #clients .left {
      background: linear-gradient(135deg, var(--accent-color), var(--accent-color));
      color: white;
    }
    #clients .left h2, #clients .right h2 {
      display: flex;
      align-items: center;
      font-size: 28px;
      margin-bottom: 20px;
    }
    #clients .left h2::before {
      margin-right: 10px;
      font-size: 28px;
    }
    #clients .right h2::before {
      margin-right: 10px;
      font-size: 28px;
    }
    #clients input[type="text"], #clients input[type="password"] {
      width: 100%;
      padding: 12px 25px;
      border-radius: 30px;
      border: none;
      margin: 10px 0;
      font-size: 16px;
    }

    #clients .button {
      padding: 12px 24px;
      border-radius: 30px;
      background: var(--accent-color) !important;
      border: none;
      color: #000 !important;
      font-size: 16px;
      cursor: pointer;
      margin-top: 20px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
    }
    #clients .button:hover {
        background: var(--accent-color) !important;
        color:#fff !important;
  }
#clients button#cplog { width:100%;border:2px solid #fff !important; background:none !important; color:#fff !important}
#clients button#cplog:hover { background-color:rgba(255,255,255,0.1) !important }

    #clients .left .button {
      background-color: #47c1a0;
    }
    #clients a {
      text-decoration: underline;
    }
a.white { color:#fff; }
.small { font-size:14px;line-height:140%}
    #clients .right {
      background-color: #ffffff;
      border: 1px solid #e0e0e0;
      margin-left: 20px;
}

img.icon { max-width:35px !important; height:35px !important; }
/* hosting */
  .home-section {
    padding: 2rem 1rem;
    font-family: var(--font-family-text);
    max-width: 1200px;
    margin: auto;
  }
  .plans-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
  }
  .plan-card {
    background: #fff;
    border-radius: 12px;
    padding: 2rem 1.5rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    text-align: center;
  }
  .plan-card h3 {
    font-size: 1.4rem;
    color:var(--accent-color);
    margin-bottom: 0.75rem;
  }
  .plan-price {
    text-align:left;width:85%;padding:0px 0px; font-size: 1.2rem;
    margin-bottom: 1.2rem;
    margin-top: auto;
    color: #222;
    font-weight: 500;
  }
[data-theme="dark"] .plan-price {
    color: #fff !important;
}

  span.desde { font-size:13px; line-height:100%}
  span.price { font-size:48px;;line-height:100%;padding-right:5px;font-weight:600;letter-spacing:0px}
 span.currency { font-size:18px; font-weight:normal;line-height:100%}
 span.vat { font-size:13px; font-weight:normal;line-height:120%; display:block; padding-top:5px}
section#apps  span.price { font-size:38px;;line-height:100%;padding-right:5px;font-weight:600;letter-spacing:0px}
section#apps  span.vat{  font-size:12px;}
.badge {
  position: absolute;
  background-color: var(--accent-color);
  top: 0;
  left: 0;
  width: 100%;
  color: white;
  text-align: center;
  font-weight: normal;
  font-size: 12px;
  padding: 10px 0;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  z-index: 10;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.badge.badge-gray {
  background: linear-gradient(135deg, #a5b2be 0%, #87959e 100%) !important;
  background-color: #a5b2be !important;
  color: #fff;
}

.popular-tag {
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.9);
  padding: 3px 10px;
  border-radius: 12px;
  margin-left: 10px;
  font-size: 11px;
  font-weight: 600;
  color: #26a7c5;
}

.popular-tag i {
  color: var(--accent-color);
  position: relative;
  top: -1px;
  font-size: 10px;
} 
 .plan-features {
    text-align: left;
    font-size: 14px;
    color: #333;
    padding-left: 0;
    margin:0 !important;
    margin-bottom: 1rem !important;
    width:100%;
   padding:0px 10px;
    list-style: none;
    flex-grow: 1;
  }
  .plan-features li {
    margin-bottom: 0.75rem;
    position: relative;
    padding-left: 1.8rem;
  }
  .plan-features li::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    color:var(--accent-color);
  }

/*  .plan-features li:nth-child(2)::before { content: "\f3ed"; } /* SSL */ 

  .plan-features.plan1 li:nth-child(1)::before { content: "\f0ac"; } /* dominis */
  .plan-features.plan1 li:nth-child(2)::before { content: "\f233"; } /* space */
  .plan-features.plan1 li:nth-child(3)::before { content: "\f362"; } /* transfer */
  .plan-features.plan1 li:nth-child(4)::before { content: "\f0e0"; } /* correu */
  .plan-features.plan1 li:nth-child(5)::before { content: "\f658"; } /* antispam */
  .plan-features.plan1 li:nth-child(6)::before { content: "\f135"; } /* speed */
  .plan-features.plan1 li:nth-child(7)::before { content: "\f0c7"; } /* backup */
  .plan-features.plan1 li:nth-child(8)::before { content: "\f06e"; } /* monitoring */
  .plan-features.plan1 li:nth-child(9)::before { content: "\f31e"; } /* resize */
  .plan-features.plan1 li:nth-child(10)::before { content: "\f7d9"; } /* control */


  .plan-features.plan2 li:nth-child(1)::before { content: "\f2db"; } /* cpus */
  .plan-features.plan2 li:nth-child(2)::before { content: "\f538"; } /* ram */
  .plan-features.plan2 li:nth-child(3)::before { content: "\f233"; } /* space */
  .plan-features.plan2 li:nth-child(4)::before { content: "\f362"; } /* transfer */
  .plan-features.plan2 li:nth-child(5)::before { content: "\f6ff"; } /* dedicated ip */
  .plan-features.plan2 li:nth-child(6)::before { content: "\f120"; } /* ssh */
  .plan-features.plan2 li:nth-child(7)::before { content: "\f0c7"; } /* backups */
  .plan-features.plan2 li:nth-child(8)::before { content: "\f06e"; } /* resize */
  .plan-features.plan2 li:nth-child(9)::before { content: "\f31e"; } /* monitoring */
  .plan-features.plan2 li:nth-child(10)::before { content: "\f7d9"; } /* control */


  .plan-features.plan3 li:nth-child(1)::before { content: "\f2db"; } /* cpus */
  .plan-features.plan3 li:nth-child(2)::before { content: "\f538"; } /* ram */
  .plan-features.plan3 li:nth-child(3)::before { content: "\f233"; } /* space */
  .plan-features.plan3 li:nth-child(4)::before { content: "\f362"; } /* transfer */
  .plan-features.plan3 li:nth-child(5)::before { content: "\f6ff"; } /* dedicated ip */
  .plan-features.plan3 li:nth-child(6)::before { content: "\f120"; } /* ssh */
  .plan-features.plan3 li:nth-child(7)::before { content: "\f0c7"; } /* backups */
  .plan-features.plan3 li:nth-child(8)::before { content: "\f06e"; } /* monitoring */
  .plan-features.plan3 li:nth-child(9)::before { content: "\f31e"; } /* resize */
  .plan-features.plan3 li:nth-child(10)::before { content: "\f7d9"; } /* control */

.plan-features.plan4 li:nth-child(1)::before {
  content: "\f0e0"; /* fa-envelope — Eina d'e-mail Marketing PRO */
}

.plan-features.plan4 li:nth-child(2)::before {
  content: "\f07a"; /* fa-shopping-cart — Comerç electrònic */
}

.plan-features.plan4 li:nth-child(3)::before {
  content: "\f0ac"; /* fa-globe — Llocs webs KMS Sites */
}

.plan-features.plan4 li:nth-child(4)::before {
  content: "\f145"; /* fa-qrcode — Sistema de tickets/codis QR */
}

.plan-features.plan4 li:nth-child(5)::before {
  content: "\f4c0"; /* fa-hand-holding-usd — Sistema de micromecenatge */
}

.plan-features.plan4 li:nth-child(6)::before {
  content: "\f382"; /* fa-cloud — Espai privat al núvol */
}

.plan-features.plan4 li:nth-child(7)::before {
  content: "\f200"; /* fa-file-invoice-dollar — ERP - Gestió empresarial i facturació */
}

.plan-features.plan4 li:nth-child(8)::before {
  content: "\f2bb"; /* fa-user-friends — CRM - Gestió de relacions amb clients */
}


.home-intro h3 { line-height:150%;}



  .plan-cta {
    margin-top: 1.5rem;
    display: inline-block;
    padding: 0.6rem 1.4rem;
    background-color:var(--accent-color);
    color: white;
    text-decoration: none;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: background 0.3s ease;
  }
  .plan-cta:hover {
    background-color: var(--accent-color);
  }
  .plan-explanation {
    margin-top: 2rem;
    font-size: 15px;
    color: #444;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6;
  }

/* hosti---*/

h1,h2 { font-family: var(--font-family-text); }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  margin-bottom: .5rem;
  font-weight: 500;
  line-height: 1.2;
}
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: .5rem;
}
h2 {
  padding-top: 20px;
  font-size:3rem;
}
h2, h1, h4, h6 {
  font-weight: bolder !important;
}
.roboto-thin {
  font-family: var(--font-family-text);
  font-weight: 100;
  font-style: normal;
}

.roboto-light {
  font-family: var(--font-family-text);
  font-weight: 300;
  font-style: normal;
}

.roboto-regular {
  font-family: var(--font-family-text);
  font-weight: 400;
  font-style: normal;
}

.roboto-medium {
  font-family: var(--font-family-text);
  font-weight: 500;
  font-style: normal;
}

.roboto-bold {
  font-family: var(--font-family-text);
  font-weight: 700;
  font-style: normal;
}

.roboto-black {
  font-family: var(--font-family-text);
  font-weight: 900;
  font-style: normal;
}

.roboto-thin-italic {
  font-family: var(--font-family-text);
  font-weight: 100;
  font-style: italic;
}

.roboto-light-italic {
  font-family: var(--font-family-text);
  font-weight: 300;
  font-style: italic;
}

.roboto-regular-italic {
  font-family: var(--font-family-text);
  font-weight: 400;
  font-style: italic;
}

.roboto-medium-italic {
  font-family: var(--font-family-text);
  font-weight: 500;
  font-style: italic;
}

.roboto-bold-italic {
  font-family: var(--font-family-text);
  font-weight: 700;
  font-style: italic;
}

.roboto-black-italic {
  font-family: var(--font-family-text);
  font-weight: 900;
  font-style: italic;
}

body.legal_notes p, body.legal_notes li { line-height:150%; font-size:14px }
body.legal_notes strong { font-size:16px; }
body.legal_notes  h3 { margin:auto;font-weight:bold !important; padding-bottom:50px; font-size:20px; text-align:center }
#topbar {
 background:none;
position: fixed; /* Make it stick/fixed */
  top: 0; /* Stay on top */
  width: 100%; /* Full width */
 transition: top 0.30s;
}


.messagecover {
        font-size: inherit;
        line-height: inherit;
}

.default_form {
	font-size: 0.8rem;
	padding: 0 0.5rem 2rem 0.5rem;
}

.form-group {
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 0.5rem;
}

.form-row {

	display: flex;
	flex-wrap: wrap;
}

@media (min-width: 960px) {


.form-row .form-group:nth-child(1){
	padding-right: 1rem;
}

.form-row .form-group:nth-child(2){
	padding-left: 1rem;
}

.form-group div:nth-child(1){
	padding-right: 0.5rem;

}

.form-group div:nth-child(2){
	padding-left: 0.5rem;
}

}

#parsley-id-multiple-termsandcond, #parsley-id-multiple-rgpd {
    width: 100%;
    padding-left: 7.5rem;
}

.form-group div:nth-child(1){
        min-width: 100px;
}
section {
    padding: 2rem 0rem;
    font-family: var(--font-family-text);
    max-width: 1175px;
    margin: auto;
}

section.wide {
	max-width:100%;
}

.maxwidth-shorter {
	max-width: 1175px;
}

div.signupbar,div#topinfo { display:block; }
div#containertopbar { margin: auto;
 pointer-events: none;
max-width: 1440px;
width:100%;
left: 0px;
right: 0px;
float: inherit;
}

/* Permetre interacció amb els menús */
div#containertopbar #menu,
div#containertopbar #menu *,
div#containertopbar .left_menu_bar,
div#containertopbar .left_menu_bar *,
.submenu,
.submenu *,
.navbar-toggle,
.navbar-toggle * {
	pointer-events: auto !important;
}
div#containertopbar #menu a.pureCssMenui0 {         text-transform: uppercase; }

/* menu mobil */
.sidebar {

    height: 0;
    width: 100%;
    position: fixed;
    z-index: 1999;
    top: 66px;
    left: 0;
    background-color: #d0d0d0; /* Gris clar per light theme */
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transition: height 0.5s ease;
    padding-top: 0;
    padding-bottom: 0;

}

.sidebar .closebtn {
    display: none;
}

.sidebar div.n0,.sidebar a {
    /* Més espaiat entre opcions del menu */
    padding: 14px 0px;
    text-decoration: none;
    font-size: 16px;
    color: #333; /* Text fosc per light theme */
    display: block;
    transition: 0.3s;
}

.sidebar a:hover {
    color: #000; /* Text negre al fer hover en light theme */
    background-color: rgba(0, 0, 0, 0.15); /* Overlay més subtil */
	text-decoration:none;
}
.sidebar a.closebtn:hover {
	background:none;
}

/*comptadors*/

.counter-section {
  text-align: center;
  padding: 2rem 1rem 5rem 1rem;
  margin:50px auto;
}

.counter-section .counter-title {
  font-size: 2.5rem;
  margin-bottom: 2rem;
  color: var(--accent-color);
}

.counter-section .counters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 2rem;
  max-width: 1000px;
  margin: 0 auto;
}

.counter-section .counter-box {
/*  background: #fff;*/
  padding: 2rem;
  border-radius: 100%;
/*  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);*/
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /*height:160px;*/
  aspect-ratio: 1 / 1;

}

.counter-section .icon {
  font-size: 2.5rem;
  margin-bottom: 0.5rem;
  color: var(--accent-color);
}

.counter-section .counter {
  font-size: 4.5rem;
  font-weight: 800;
  color: var(--accent-color);
}

.counter-section .label {
  font-size: 1rem;
  margin-top: 0.5rem;
  color: var(--accent-color);
}

/* Media query per pantalles petites */
@media (max-width: 600px) {

#customer_login { margin-left:0px}
div#topinfo .info_block.login { display:none !important; }

 .counter-section .counters {
    grid-template-columns: 1fr;
  }

  .counter-section .counter-box {
    max-width: 300px;
    margin: 0 auto;
    height:auto;
    box-shadow:none;
    background:none;
    padding:30px 0px; 
  }

  .counter-section .counter {
    font-size: 4rem;
  }

  .counter-section .label {
    font-size: 1.3rem;
  }

  .counter-section .icon {
    font-size: 2.5rem;
  }
}

/**/

.lang { height:42px; }
li.lang { padding-left:10px;margin-top:-41px;}
.minial { float:left; padding:7px 10px 8px 10px !important; }
.sidebar a.i0 { font-weight:bold; color:#222} /* Text fosc per seccions en light theme */
.sidebar div.n0  { color:#555; } /* Text gris fosc per light theme */
.sidebar a.i0, .sidebar div.n0 { font-size:17px; background-color: transparent; }
.sidebar a.i0:hover {  background-color: rgba(0, 0, 0, 0.2); }
.sidebar ul,.sidebar li { margin:0px; }
.sidebar li a, .sidebar div.n0 { padding-left:20px; }

/* Dropdown del menú de llengües (light theme) */
.dropdown-menu {
    background: #c0c0c0; /* Gris mig clar per light theme */
    border: 1px solid #999;
    position: absolute;
    z-index: 1000;
    list-style: none;
    padding-left: 0;
    margin-top: 5px;
}

ul.dropdown-menu li {
    list-style: none !important;
}

.dropdown-menu li a {
    display: block;
    padding: 6px 12px;
    text-decoration: none;
    color: #333; /* Text fosc per light theme */
}

.dropdown-menu li a:hover {
    background: rgba(0, 0, 0, 0.15);
}

.dropdown-menu li a.lang-option {
    font-size: 15px;
}

.sidebar .submenu-item a {
    padding-left: 30px;
    font-size: 0.95em;
}

.navbar-toggle {
    cursor: pointer;
    position: relative;
    float: right;
    margin-right: 3px;
    padding: 9px 10px;
    margin-top: 0px;
    margin-bottom: 8px;
    background-color: transparent;
	background-image: none;
	border: 1px solid transparent;
    border-radius: 4px;
}

.navbar-toggle {
    cursor: pointer !important;
    position:fixed;
    z-index:99999999999999999;
    top:19px;
    right:20px;
    display:none;
    background-color: transparent;
    border: none;
    padding: 5px 5px 5px 15px;
    border-radius: 0;
    width: 30px;
    height: 25px;
}

.navbar-toggle:hover {
    cursor: pointer !important;
}

.navbar-toggle * {
    cursor: pointer !important;
}
.navbar-toggle .icon-bar {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 1px;
    background-color: #000;
    transition: all 0.3s ease;
}
.icon-bar {
    background-color: #000;
}
.navbar-toggle .icon-bar + .icon-bar {
    margin-top: 4px;
}

/* Transformar hamburger en X quan està obert */
.navbar-toggle.open .icon-bar:nth-of-type(2) {
    transform: translateY(6px) rotate(45deg);
}
.navbar-toggle.open .icon-bar:nth-of-type(3) {
    opacity: 0;
}
.navbar-toggle.open .icon-bar:nth-of-type(4) {
    transform: translateY(-6px) rotate(-45deg);
}

div.group_buttons {
    float: right;
}

/* other */



span { font-size:15px;;line-height:150% }

   li a {display:inline-block;}
   li a {display:block;}


.ontop { position: absolute; top: 0;margin:auto; }

div#solidaritat { display:none;position: relative;left: -327px;margin: auto;z-index: 99999;top:-34px; }

div#block_lateral img.capture { width:230px; max-height:126px;float:left; margin-left:10px;margin-bottom:20px;border:1px dotted #999 }

html, body, div, h1, h2, h3, h4, h5, h6, p, pre, abbr, acronym, blockquote, img, dl, dt, dd, ol, ul, li, caption, tbody, tfoot, thead, tr, th, td, form, fieldset, embed, object, applet {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}

h1, h2 { font-weight:800 !important; }
h3, h4, h5, h6 { font-weight:500 !important; }

h1 {
	letter-spacing:-1px;
}
h1.title_page {
	text-align:center;
font-family: var(--font-family-text);
    margin: 0px;
    font-size: 36px;
	font-weight:normal;
}
h2 {
	letter-spacing:0.5px;
	color:#fff;
}

h1, h2 {
	margin: 0 0 10px 0;
}

h3 {font-family:var(--font-family-text)}
body {
	background-image: -webkit-linear-gradient(top, #fff 90px, #eee 100%);
	background-image: -moz-linear-gradient(top, #fff 90px, #ee 100%);
	background-image: linear-gradient(top, #fff 90px, #eee 100%);
	color: #000;
	padding: 0px;
	margin: 0px;
	width: 100%;
	height:100%;
	font-family: var(--font-family-text),OpenSans,Helvetica, sans-serif;
	font-size:14px;color:#333;
	font-weight:100;
	direction: ltr;
}

#pcm {
	display: none;
}

/* @group Menu Bar
 */

.signupbar {
	height: 35px;
	position: relative;
	width:100%;
	top: 0px;
	z-index: 5;
}

.left_menu_bar {
margin-left: auto;
margin-right: 0;
left: auto;
right: 0px;
float: right;
position: relative;
z-index: 999999999999999;
}

.left_menu_bar table {
	border-collapse:collapse;
	height:35px;
}
.left_menu_bar ul,.left_menu_bar li,.left_menu_bar li a {
/*	height:37px;*/
}


ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
	padding:0px;
}
li.pureCssMenui.last { padding-bottom:15px; }

.left_menu_bar li a {
		padding:0px;
			margin:0px;
	        height:37px;
	}


.right_menu_bar {
	right: 0px;
	top: 284px;
	position: absolute;
	z-index: 5;
	height:37px;
}
div#logo {
position: absolute;
left:0;
padding-left:15px;
top: 50%;
transform: translateY(-50%);
z-index: 99999999999999;
pointer-events: all;
}
div#topbar {
    height:55px;
    z-index:99;
    padding:0;
    position:fixed;
    width:100%;
    transition: all 0.3s ease;
    box-shadow: none;
    overflow: visible;
}

/* Topbar background per defecte en light mode */
div#topbar {
    background-color: rgba(255, 255, 255, 0.98);
}

div#topbar #containertopbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    position: relative;
    overflow: visible;
}

/* Logo a l'esquerra */
div#topbar #containertopbar #logo {
    position: relative;
    left: 0;
    top: auto;
    transform: none;
    padding-left: 15px;
    flex-shrink: 0;
}

/* Menú alineat a la dreta dins dels 1200px */
div#topbar #containertopbar #topbar-right-content #menu {
    position: relative;
    display: flex;
    justify-content: flex-end;
    overflow: visible;
    pointer-events: none;
}

div#topbar #containertopbar #topbar-right-content #menu ul.pureCssMenu {
    float: none; /* Eliminar float per compatibilitat amb flexbox */
    margin-right: 0;
    position: relative;
    z-index: 1000;
    pointer-events: auto; /* Activar clics només al menú */
}

div#topbar #containertopbar #topbar-right-content #menu ul.pureCssMenu ul {
    z-index: 1001 !important;
    display: none;
}

div#topbar #containertopbar #topbar-right-content #menu ul.pureCssMenu li:hover > ul {
    display: block !important;
}

div#topbar #containertopbar #topbar-right-content #menu .left_menu_bar {
    overflow: visible !important;
    float: none !important;
    margin: 0 !important;
    width: auto !important;
    max-width: none !important;
}

div#topbar #containertopbar #topbar-right-content #menu .left_menu_bar table {
    overflow: visible !important;
    width: auto !important;
}

/* Topinfo dins del containertopbar, a la dreta */

/* Contenidor dret: agrupa menu i topinfo */
div#topbar #topbar-right-content {
    display: flex;
    align-items: center;
    gap: 20px;
    flex: 1;
    justify-content: flex-end;
    overflow: visible;
    position: relative;
}
div#topbar #topbar-right-content #topinfo {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 10000;
    flex-shrink: 0;
    pointer-events: auto;
    padding: 0px;
}

/* Topbar cuando está en la parte superior (logo más grande) */
div#topbar.ontop {
    height: 65px;
    box-shadow: none;
}

div#topbar.ontop #logo img {
    width: 166px;
    height: auto;
    max-height: 50px;
    transition: all 0.3s ease;
}

/* Menú y topinfo más grandes en ontop */
/* Font-size changes removed - keeping menu static */
div#topbar.ontop #topbar-right-content #menu {
    /* font-size: 1.05em; REMOVED */
    transition: all 0.3s ease;
}

div#topbar.ontop #topbar-right-content #topinfo {
/*    top: 50% !important;*/
    transition: all 0.3s ease;
}

/* Topbar cuando se hace scroll (logo más pequeño + sombra) */
div#topbar.scrolled {
    height: 55px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

div#topbar.scrolled #logo img {
    width: 157px;
    height: auto;
    max-height: 42px;
    transition: all 0.3s ease;
}

/* Font-size changes removed - keeping menu static */
div#topbar.scrolled #topbar-right-content #menu {
    /* font-size: 1em; REMOVED */
    transition: all 0.3s ease;
}

div#topbar.scrolled #topbar-right-content #topinfo {
    transition: all 0.3s ease;
}

div#logo img { width:170px; height: auto; max-height: 42px; transition: all 0.3s ease; }

/* Ajustar logo para centrado vertical */
div#logo .container_logo {
    display: inline-block;
}

/* Responsive - Tablets i mòbils */
@media (max-width: 1200px) {
    div#topbar #containertopbar {
        max-width: 100%;
        padding: 0 10px;
    }

    div#topbar #containertopbar #topbar-right-content #menu {
        display: none; /* Ocultar menú desktop en tablets/mòbils */
    }

    div#topbar #topbar-right-content #topinfo {
        right: 5px;
    }
}

/* Resolucions entre 769px i 1200px (tablets grans i desktop petit) */
@media (min-width: 769px) and (max-width: 1200px) {
    div#topbar #topbar-right-content #topinfo {
        right: 50px;
    }
}

@media (max-width: 768px) {
    div#topbar.ontop #logo img {
        width: 150px;
        max-height: 45px;
    }

    div#topbar.scrolled #logo img {
        width: 140px;
        max-height: 38px;
    }

    div#topbar #topbar-right-content #topinfo {
        font-size: 0.9em;
    }
}

div#title {
width:100%;
}
div#title h1 { 
text-align:center;margin:30px auto 20px;
font-size:46px; 
/*text-shadow:0 1px 1px rgba(0,0,0,.1);*/
}
div#subtitle {
margin-top:0px;
color:#fff;
font-size:21px;
width:100%;
text-align:center !important;
}
div#subtitle h2 { font-weight:500 !important;}
div#title_box {
max-width:1200px;
position:relative;
margin: 0px auto;
z-index: 10;
width: 100%;
top:60px;
}
.right_menu_bar table {
	border-collapse:collapse;
}
.right_menu_bar table a{
	height:22px;
}
.right_menu_bar ul li {
	height:37px;
}
/* @group Menu CSS */


ul.pureCssMenu ul {
	display: none
}

ul.pureCssMenu li:hover>ul {
	display: block
}

ul.pureCssMenu ul {
	position: absolute;
	left: -1px;
	top: 98%;
}

ul.pureCssMenu ul ul {
	position: absolute;
	left: 98%;
	top: -2px;
}

ul.pureCssMenu,ul.pureCssMenu ul {
	margin: 0px;
	list-style: none;
	padding: 0px 1px 1px 0px;
	background-color: #000000;
	background-repeat: repeat;
	border-color: #A6A6A6;
	border-width: 0px;
	border-style: solid;
}

ul.pureCssMenu table {
	border-collapse: collapse
}

ul.pureCssMenu {
	display: block;
	zoom: 1;
	float: left;
}

ul.pureCssMenu ul {
	width: 179.55px;
}

ul.pureCssMenu li {
	display: block;
	margin: 1px 0px 0px 1px;
	font-size: 0px;
}

ul.pureCssMenu a:active, ul.pureCssMenu a:focus {
	outline-style: none;
}

ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
}

ul.pureCssMenu span {
	overflow: hidden;
}

ul.pureCssMenu li {
	float: left;
}

ul.pureCssMenu ul li {
	float: none;
}

ul.pureCssMenu ul a {
	text-align: left;
	white-space: nowrap;
}

ul.pureCssMenu li.sep {
	text-align: left;
	padding: 0px;
	line-height: 0;
	height: 100%;
}

ul.pureCssMenu li.sep span {
	float: none;
	padding-right: 0;
	width: 3;
	height: 100%;
	display: inline-block;
	background-color: #A6A6A6;
	background-image: none;
}

ul.pureCssMenu ul li.sep span {
	width: 100%;
	height: 3;
}

ul.pureCssMenu li:hover {
	position: relative;
}

ul.pureCssMenu li:hover>a {
	border-style: solid;
	text-decoration: none;
}

ul.pureCssMenu li a:hover {
	position: relative;
	border-style: solid;
	text-decoration: none;
}

ul.pureCssMenu li.dis a {
	color: #AAAAAA !important;
}

ul.pureCssMenu img {
	border: none;
	float: left;
	_float: none;
	margin-right: 5px;
	width: 16px;
	height: 16px;
}

ul.pureCssMenu ul img {
	width: 16px;
	height: 16px;
}

ul.pureCssMenu img.over {
	display: none
}

ul.pureCssMenu li.dis a:hover img.over {
	display: none !important
}

ul.pureCssMenu li.dis a:hover img.def {
	display: inline !important
}

ul.pureCssMenu li:hover > a img.def {
	display: none
}

ul.pureCssMenu li:hover > a img.over {
	display: inline
}

ul.pureCssMenu a:hover img.over,ul.pureCssMenu a:hover ul img.def,ul.pureCssMenu a:hover a:hover img.over {
	display: inline
}

ul.pureCssMenu a:hover img.def,ul.pureCssMenu a:hover ul img.over,ul.pureCssMenu a:hover a:hover img.def {
	display: none
}

ul.pureCssMenu a:hover ul {
	display: block
}

ul.pureCssMenu span {
	display: block;
	background-image: url(../tpl/images/arrv_blue_2.gif);
	background-position: right center;
	background-repeat: no-repeat;
	padding-right: 8px;
}

ul.pureCssMenu li:hover>a>span {
	background-image: url(../tpl/images/arrv_white_2.gif);
}

ul.pureCssMenu a:hover span {
	_background-image: url(../tpl/images/arrv_white_2.gif)
}

ul.pureCssMenu ul span,ul.pureCssMenu a:hover table span {
	background-image: url(../tpl/images/arr_blue_2.gif)
}

ul.pureCssMenu ul li:hover > a span {
	background-image: url(../tpl/images/arr_white_2.gif);
}

ul.pureCssMenu table a:hover span {
	background-image: url(../tpl/images/arr_white_2.gif)
}

.h0 {
	font-size: 3.9em;
	color: #000;
	padding: 0;
	font-weight: normal;
	margin-bottom: 8px;
	margin-top: 10px;
}

h2 {
	font-size: 1.4em;
	padding: 0;
	font-weight: normal;
	color: #fff;
	line-height: 1.4em;
	margin-bottom: 8px;
	margin-top: 0px;
}

h3 {
	font-size: 1.4em;
	font-weight: normal;
	color: #000;
	margin-bottom: 5px;
}

h4 {
	padding-bottom: 3px;
	margin-bottom: 0px;
}

h5 {
	font-size: 1.1em;
	font-weight: normal;
	color: #333;
	padding-top: 15px;
}

.g-doc {
	background: #fff;
	width:100%;
	left:0px;
	right:0px;
	margin:auto;
	text-align: left;
	font-size: 16px;
}
.g-c {
	padding: 0px;
}

#ent-masthead .text-lg {
	font-size: 3em;
	color: #FFF;
	font-weight: normal;
	background-color: #fffeff;
}

#ent-masthead .text-med {
	font-size: 1.5em;
	color: #FFF;
}

#ent-masthead .cta {
	font-size: 1.5em;
	color: #FFF;
}

.ent-shd {
	width: 100%;;
	text-align: center;
/*	padding: 0 13px 0px 13px;
	background: url(https://www.intergrid.cat/css/img_interficie/shadow-sides-long.gif) repeat-y 0 0;*/
	padding: 0px;
}

#ent-3col .g-unit {
	width: 32%;
}

#ent-3col .g-c {
	padding: 10px;
}

#ent-8col .g-unit {
	width: 20%;
}

#ent-8col .g-c {
	padding: 10px 20px;
}

.ent-horz-feature {
	border-top: solid 1px #eee;
	vertical-align: top;
}

.ent-horz-feature .g-c {
	vertical-align: top;
	margin: 5px;
}

.footer {
	background: #f1f1f1;
	margin: 3em 0 0;
        padding:50px 0;
	text-align: center;
	color: #666
}

.footer-shd {
	margin: auto;
	padding: 0 25px 5px 25px;
	width: 1040px;
	text-align: center;
/*	background: url(https://www.intergrid.cat/css/img_interficie/shadow-btm-corners-long.gif) no-repeat -30px -15px;*/
	z-index: 10;
}

.ent-ft {
	color: #eee;
	font-size: 1.1em;
	padding: 20px 30px;
	line-height: 1.5em;
}

.ent-ft a {
	color: #eee;
	line-height: 200%;
	font-size: 13px;
	display: inline-block;
	text-decoration: none;
	/* margin: 0px; */
	margin-bottom: 10px;
}

.ent-logos {
	padding: 10px 0;
}

.ent-sidebar {
	padding-top: 30px;
	padding-left: 30px;
	padding-bottom: 10px;
	border-top: 1px dotted #ccc;
	font-size:14px
}

.ent-sidebar .learnmore {
	font-size: 1.3em;
}

p.learnmore {
	font-size: 1.3em;
}

.ent-news-item {
	padding-bottom: 15px;
}

.ent-date {
	color: #999;
	font-size: .83%;
}

.ent-first {
	padding-top: 5px;
	clear: both;
	display: table;
}

.ent-first-horiz {
	padding-top: 10px;
	height:	75px;
	clear: both;
	display: table;
}

.prodimg {
	float: left;
	margin-right: 10px;
	position: relative;
	top: -4px;
}

/*Start Returning User Sign In*/

#select-login {
	display: none;
	float: right;
}

#select-login a {
	text-decoration: none;
}

#signinlink {
	float: right;
	position: relative;
	top: 4px;
}

#signinlink a {
	text-decoration: none;
}

#select-login form,
#select-login div {
	display: inline;
}

/*End Returning User Sign In*/

.calc-li {
	margin-bottom: 5px;
}

.calc-li td {
	padding-right: 10px;
}

.wage-field {
	float: right;
	padding: 0;
	position: relative;
	top: 0px;
	margin-bottom: 5px;
}

.employee-field {
	float: right;
	padding: 0;
	position: relative;
	top: 3px;
	margin-bottom: 5px;
}

.currency-sign {
	float: right;
	position: relative;
	left: 0px;
	top: 2px
}

#calcuOpenSansr {
	padding: 0 5px;
}

#error {
	color: red;
	display: none;
}

.calc-text {
	color: #373737;
	font-weight: normal;
	font-size: 0.9em;
	width: 100px;
}

.rightnav p {
	padding: 10px 0 0 0;
	line-height: 23px;
}

.rightnav {
	padding-left: 20px;
	border-left: 1px #ccc solid;
	margin-left: 10px;
	margin-top: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

/* Start Flex Button */

div.g-button {
	margin: 0 0 1em 0px;
	border: 1px solid #BFD4F2;
	background-color: #fff;
	padding: 15px 15px 13px 19px;
	text-align: center;
}

div.g-button div {
	background: url("https://www.intergrid.cat/css/img_interficie/g-button-cr1-1_wt.gif") no-repeat 0% 0%;
	font-size: 1.3em;
	background-color: #5679a5;
}

b.fort {
	color: #5679a5;
}

div.wide div.g-button div {
	max-width: 300px;
	margin: 0 auto;
}

div.g-button div span span a {
	display: block;
	color: #fff !important;
	background: url("https://www.intergrid.cat/css/img_interficie/g-button-cr1-2_wt.gif") no-repeat right bottom;
	padding: 8px 18px 13px 13px;
	text-decoration: none;
	font-weight: normal;
}

div.g-button div span {
	display: block;
	background: url("https://www.intergrid.cat/css/img_interficie/g-button-cr1-1_wt.gif") no-repeat right -400px;
	height: 1%;
}

div.g-button div span span {
	background: url("https://www.intergrid.cat/css/img_interficie/g-button-cr1-1_wt.gif") no-repeat left bottom;
}

/*End Flex Button*/

div.subHeaderDiv {
	clear: both;
	display: block;
	padding-left: 0px;
}

img.subHeaderImg {
	margin-right: 10px;
	border: none;
	float: left;
}

p.prodHeader {
	position: relative;
	top: 5px;
}

p.padTop {
	margin-top: 15px
}

p.pPadBtm {
	margin-bottom: 25px;
}

p.rightNav {
	line-height: 23px;
}

p.noPadding {
	padding: 0px;
}

.rndGreyBox {
	padding: 20px 0 0 0;
	clear: both;
	padding: 5px;
}

.emailError {
	position: relative;
	color: #f00;
	font-weight: normal;
	margin: 10px 0px 0px 0px;
	display: none;
}

#large_inquiry {
	margin-top: 10px;
	background: #fff6c3;
	border: 1px solid #fe8;
	display: none;
	padding: 0 1em;
}

#large_inquiry h4 {
	margin-bottom: 1em;
}

.zip {
	float: left;
	margin-right: 5px;
	display: none;
	padding: 2px 0 0 2px;
}

.zip_m {
	float: left;
	margin-right: 5px;
	display: block;
	padding: 2px 0 0 2px;
}

.detailBox {
	padding: 8px 20px 30px 0px;
}

div.entry {
	display: block;
	width: 100%;
	padding: 10px 10px 10px 10px;
	background-color: #fafcff;
	border: 1px solid #c6e0ff;
	font-size: 1em;
}

.entryB {
	font-weight: normal;
	margin-bottom: 5px;
	font-size: 1.1em;
}

.red {
	color: #f00
}

/*Start Editions*/

td#editions_tdHeader {
	border-top: #c6e0ff 1px solid;
	background-color: #fafcff;
}

tr#editions_tdHeader {
	border-bottom: #F8FCFF 1px solid;
}

.editions_table {
	margin: 0;
}

div#select_login {
	display: none;
}

p.editions_tblHeader {
	margin: 0 0 0 5px;
	padding: 0;
	font-weight: normal;
}

p.editions_tblheader2 {
	margin: 0 0 0 5px;
	padding: 0;
	color: #444;
}

p.editions_tblheader3 {
	margin: 0 0 0 15px;
	padding: 0
}

.editions_prodHeader {
	color: #2461AA;
	font-size: 120%;
	font-weight: normal;
}

.editions_freeText {
	color: #E44949;
	font-size: 120%;
	font-weight: normal;
}

.editions_priceText {
	font-size: 100%;
	font-weight: normal;
	display: block;
	margin: 5px 0 5px 0;
	font-weight: normal;
}

td.editions_content {
	font-size: small;
}

.editions_smallFreeText {
	color: #E44949;
}

.emailError {
	position: relative;
	color: #f00;
	font-weight: normal;
	margin: 10px 0px 0px 0px;
	display: none;
}

.custDD {
	margin-bottom: 5px;
	display: inline;
}

.quota {
	display: inline;
	padding-right: 5px
}

.customerDiv {
	border-top: #eaeaea 1px solid;
	width: 325px;
	margin-right: 10px;
	float: left;
	padding: 3px;
}

.customerImg {
	float: right;
	padding: 0 0 2px 20px;
}

.subVideoText {
	line-height: 25px;
}

.smallFont {
	font-size: 0.9em;
	position: relative;
	top: 3px;
}

div.editions_table table tbody tr td {
	padding: 3px;
}

h2.editions_other {
	border-bottom: #fff 1px solid;
	color: #2461AA;
	font-weight: normal;
}

/*Start pre-sales faq*/

.hide {
	display: none;
}

.faqHeader h2 {
	padding: 10px 0 3px 0;
	border-bottom: #efefef 1px solid;
	margin-bottom: 15px;
}

.question {
	font-size: 13px;
	padding: 0 0 10px 0px;
	font-weight: normal
}

.question a {
	text-decoration: none;
}

.answer {
	margin: 0px 0 15px 16px;
	font-weight: normal;
}

.faqbm {
	margin-right: 4px;
}

.faqbp {
	margin-right: 4px;
}

/*End pre-sales faq*/

/*Start inner page video player*/

.vidContainer {
	float: right;
	background: #fff;
	padding: 0 0px 20px 20px;
}

.pageVideo {
	padding: 3px;
	border: #ccc 1px solid;
	background: #fff;
	float: right;
	margin: 15px 0px 10px 20px;
	width: 346px;
	height: 280px;
}

.moreVideos {
	margin: 10px 0px;
}

.breadcrumb {
	font-size: 83%;
	color: #666;
	padding-top: 7px
}

/**/

.playButton {
	position: relative;
	top: 2px;
	margin-right: 5px;
}

.pageQuote {
	width: 550px;
	background: #fafafa;
	padding: 5px;
	color: #333;
}

img.subHeaderImg {
	display: inline;
	margin-right: 8px;
	border: none;
	position: relative;
	top: -5px;
}

.nomargin {
	margin: 0;
	padding: 0
}

div.splitLeft {
	width: 47%;
	float: left;
	margin-top: 20px;
}

div.splitRight {
	width: 47%;
	float: right;
	margin-top: 20px;
}

.langDD {
	float: right;
	margin-top: 15px;
}

/*Start Calendar*/

.calendarDiv {
	width: 400px;
	width: 45%;
	float: right;
	margin: 0 0 10px 10px
}

.tz_picker {
	float: right;
}

/*End Calendar*/

/*Start 'new' page*/

a.new_blog_item_link {
	text-decoration: none;
	color: #000;
	font-weight: normal;
	border-bottom: #ededed 1px solid;
	display: block;
	padding-bottom: 3px;
}

a.new_blog_item_link img {
	border: none
}

a.new_blog_item_link span {
	text-decoration: none;
	font-weight: normal;
	color: #15438f;
	padding: 0 10px
}

.new_blog_content {
	padding: 5px 0 10px 10px;
	background: url(https://www.intergrid.cat/css/img_interficie/tab_grad3.jpg) repeat-x 0 100%;
	border-bottom: #ededed 1px solid;
	border-right: #ededed 1px solid;
	border-left: #ededed 1px solid;
}

.h {
	color:#0084D1;
	font-size:120%;	
	line-height:180%;
}
/*End 'new' page*/

.mobileImg {
	float: right;
	margin: 10px 0px 10px 30px;
}

h2.cust {
	display: inline;
	padding-right: 20px;
	font-size: 1.1em;
	font-weight: normal;
}

h2.cust2 {
	line-height: 1.4em;
}

.custBox {
	padding: 10px 0px;
	border: 0px solid #eaeaea;
}

.cust_entry_title {
	color: #000;
	font-weight: normal;
	padding-bottom: 5px;
	display: block;
	font-size: 1.4em;
	padding-left: 0px;
	margin-left: 0px;
}

.quote_owner {
	font-size: 1.1em;
}

div.top_customerDiv {
	border-top: #eaeaea 1px solid;
	width: 670px;
	margin-right: 10px;
	float: left;
	padding: 3px;
}

.bluebutton {
	margin-bottom: 3px;
}

#breadcrumbs {
	background: #e5f0fa;
	height: 25px;
	position: relative;
	top: -5px;
	text-align: left;
	font-size: 0.9em;
	color: #333;
	padding: 0px 0 0 10px;
	vertical-align: middle;
}

.breadtext {
	float: left;
	position: relative;
	top: 4px;
}

.breadtext a {
	text-decoration: none;
}

img.floatingImg {
	float: left;
	margin-right: 14px;
	margin-bottom: 10px;
}

img.floatingImgDetails {
	float: left;
	margin-right: 13px;
}

img.floatingImgBiz {
	margin-top: 13px;
	float: left;
	margin-right: 14px;
}

div.groupP {
	vertical-align: top;
	display: table;
}

div.titleGroup {
	margin-bottom: 10px;
	font-size: 1.0em;
	padding-right: 3px;
	vertical-align: top;
}

.disclaim {
	font-size: 0.9em;
	color: #666;
}

ul.nobullet {
	margin: 0px;
	padding: 0px;
}

ul.nobullet li {
	list-style-type: none;
	padding-bottom: 8px;
}

div.graybox {
	background-color: #F9F9F9;
	border: 1px solid #EAEAEA;
	padding: 10px;
	margin-bottom: 20px;
}

.rightnav_quote {
	margin-left: 25px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-top: 3px solid #EAEAEA;
	color: #666;
}

.rightnav_apps {
	margin-left: 25px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 10px;
	margin-bottom: 10px;
	border-top: 3px solid #666;
	color: #666;
	position: relative;
	left: -3px;
}

.gogoogle-product-title {
	color: #FAFAFA;
	font-size: 1.7em;
	padding: 5px 0 0 20px;
	background: url("../images/bg-gogoogle.gif") repeat-x;
	height: 60px;
}

.bwtitle {
	margin-top: 15px;
	font-weight: 100;
}

.bwtitle_gg {
	margin-top: 25px;
	font-weight: 100;
}

a.bbutton {
	color: #fff;
	background: transparent url("../images/left-button.gif") no-repeat top left;
	display: block;
	float: left;
	line-height: 16px;
	height: 22px;
	padding-left: 3px;
	font-weight: normal;
	font-size: 1.0em;
	text-decoration: none;
}

a:link.bbutton, a:visited.bbutton, a:active.bbutton, a.bbutton:hover {
	color: #fff;
	text-decoration: none;
}

a.bbutton span {
	background: transparent url("../images/right-button.gif") no-repeat top right;
	display: block;
	padding: 4px 3px 4px 0;
}

.buttonwrapper {
	overflow: hidden;
	width: 100%;
}

.feedburnerFeedBlock ul {
	list-style: none;
	padding: 0;
	margin: 5px 0 0 0;
}

.feedburnerFeedBlock ul li {
	padding: 0;
	margin-bottom: 5px;
}

.date {
	display: inline;
	margin-left: 7px;
	padding: 0;
	color: #666;
}

#creditfooter {
	display: none;
}

div.std-feature {
	margin: 5px 0;
	padding: 5px 0;
	border-bottom: 1px solid #eaeaea;
}

ul.lessspace {
	padding-bottom: 0px;
	margin-bottom: 0px;
	margin-top: 7px;
	display: table;
}

ul.lessspace li {
	padding-bottom: 1px;
	margin-bottom: 1px;
}

a.selected {
	color: #000;
	font-weight: normal;
	text-decoration: none;
}

#navigation {
	font-size: 13px;
	font-weight: normal;
	padding: 0px;
	margin: 0px;
	text-transform: uppercase;
}

#navigation ul {
	list-style: none;
	text-decoration: none;
	padding-right: 10px;
	padding: 0px;
	margin: 0px;
}

#navigation li {
	float: left;
	text-decoration: none;
	list-style: none;
}

#navigation li a {
	height: 25px;
}

#navigation li:hover {
	float: left;
	list-style: none;
	background-color: #333;
}

#navigation a {
	color: #eee;
	text-decoration: none;
	display: block;
	padding-left: 7px;
	padding-right: 7px;
}

#navigation a.current {

	color: #111;
	background-color: #fff;
	text-decoration: none;
	display: block;
}

#navigation a.normal:hover {
	color: #fff;
	text-decoration: none;
	display: block;
}

#navigation a:hover span {
	padding-right: 0px
}

.rounded-grey-border {
	background-color: #E1DFD2;
	clear: both;
	margin-bottom: 5px;
	overflow: hidden;
	padding: 1px;
	position: relative;
}

.rounded-grey-plain {
	background-color: #E1DFD2;
	clear: both;
	margin-bottom: 5px;
	overflow: hidden;
	position: relative;
}

.light-blue {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: #FFFFFF url(https://www.intergrid.cat/css/img_interficie/vert_grad_light_blue.gif) repeat-x scroll 0 0;
}

.inner-block {
	overflow: hidden;
}

.inner-block p {
	line-height: 1.4;
}

.padded {
	padding: 5px 15px;
}

.corner-wrap {
	height: 6px;
	overflow: hidden;
	position: absolute;
	width: 6px;
}

.corner-wrap.t {
	margin-top: -1px;
}

.corner-wrap.t .corner {
	margin-top: -6px;
}

.corner-wrap.l {
	margin-left: -1px;
}

.corner-wrap.l .corner {
	margin-left: -6px;
}

.corner-wrap.r {
	left: -6px;
	margin-left: 100%;
}

.corner-wrap.r .corner {
	margin-left: 0;
}

.corner-wrap.b {
	margin-top: -5px;
	top: auto;
}

.corner {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(/css/img_interficie/border-star.png) repeat scroll 0 0;
	height: 13px;
	position: absolute;
	width: 13px;
}

.transp-corner {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(/css/img_interficie/corner.png) repeat scroll 0 0;
}

.grey-up {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(/css/img_interficie/grey_pointer_up.png) no-repeat scroll 0 0;
	float: left;
	height: 13px;
	left: 50px;
	position: relative;
	width: 16px;
}

.grey-right {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(/css/img_interficie/grey_pointer_right.png) no-repeat scroll 0 0;
	float: right;
	height: 16px;
	position: relative;
	right: -13px;
	width: 13px;
	z-index: 100;
}

.grey-down {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(/css/img_interficie/grey_pointer_down.png) no-repeat scroll 0 0;
	float: left;
	height: 13px;
	left: 50px;
	margin-bottom: 10px;
	margin-top: -5px;
	position: relative;
	top: auto;
	width: 16px;
}

.grey-left {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(/css/img_interficie/grey_pointer_left.png) no-repeat scroll 0 0;
	float: left;
	height: 16px;
	left: -13px;
	position: relative;
	top: 20px;
	width: 13px;
}

/* @group Product Styles */

#product_head {
	color: #FFF;
	font-weight: normal;
	font-size: 13px;
	text-align: left;
}

#product_head_basic {
	background-color: #598ACA;
	padding-top: 25px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
}

#product_head_estandard {
	color: #FFF;
	background-color: #336DAA;
	text-align: left;
	padding-top: 25px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	height: 45px;
}

#product_head_pro {
	color: #FFF;
	background-color: #11538D;
	text-align: left;
	padding-top: 25px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	height: 45px;
}

#product_detail {
	text-align: right;
	padding-top: 10px;
	vertical-align: top;
	padding-right: 10px;
	border-right: thin solid #f7f7f7;
	padding-bottom: 5px;
	padding: 10px;
	font: 11px/19px var(--font-family-text),OpenSans, Helvetica, sans-serif;
}

.product_detail_grey_background {
	background-color: #f5f5f5;
	border-right: 1px solid #CCC;
}

.product_detail_tr {
	height: auto;
	padding-bottom: 20px;
}

#product_detail_blue {
	font-family: var(--font-family-text),OpenSans,OpenSans, Helvetica, sans-serif;
	font-size: 13px;
	text-align: right;
	padding-top: 3px;
	padding-bottom: 1px;
	font-weight: normal;
	vertical-align: bottom;
	padding-right: 10px;
	background-color: #E9FFFC;
}

#product_detail2 {
	font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	text-align: right;
	padding-right: 15px;
	vertical-align: bottom;
	padding-top: 3px;
	padding-bottom: 1px;
}

#product_detail2_blue {
	font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	text-align: right;
	padding-right: 15px;
	vertical-align: bottom;
	padding-top: 3px;
	padding-bottom: 1px;
	background-color: #E9FFFC;
}

#product_tr_price_setup {
	text-align: right;
	height: 53px;
	vertical-align: bottom;
	background-color: #e1feff;
	table-layout: fixed;
}

#product_tr_price_monthly {
	text-align: right;
	height: 53px;
	vertical-align: bottom;
	padding-top: 13px;
	background-color: #598ACA;
	border-top: 3px solid white;
}

#product_tr_price_year {
	text-align: right;
	height: 53px;
	vertical-align: bottom;
	padding-top: 13px;
	background-color: #598ACA;
}

#product_detail ul li td {
	height: auto;
	padding-top: 10px;
	list-style-position: outside;
	list-style-type: disc;
	line-height: 1.25
}

#product_price_1 {
	font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
	font-size: 26px;
	color: #fff;
	text-align: right;
	left: auto;
}

#product_price_2 {
	font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: normal;
	color: #fff;
	text-align: right;
	padding-right: 30px;
}

#product_price_3 {
	font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	color: #fff;
}

#hosting_info {
	text-align: left;
	color: #666;
	padding: 10px 10px 10px 20px;
	background-color: #f1f1f1;
	border-top: thin solid #dbdbdb;
	border-bottom: thin solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.hosting_info_header {
	font: bold 15px var(--font-family-text), OpenSans, Helvetica, Geneva, sans-serif;
	color: black;
}

.hosting_info_details{
	color: #727272;
	font: 13px/22px var(--font-family-text), OpenSans, Helvetica, Geneva, sans-serif;
	padding-left: 5px;
	padding-top: 10px;
}

.generic_product_tbl {
	width: 100%;
	border: 0px;
	font-family: var(--font-family-text), OpenSans, Helvetica, sans-serif;
	font-size: 13px;
	color: #000;
	margin-top: 40px;
	margin-bottom: 10px;
	border-collapse: collapse;
	
}

.generic_product_tbl .product_tr_header {
	height: 40px;
	font-size: 14px;
	padding-top: 0px;
	padding-bottom: 5px;
	font-weight: normal;
	color: #FFFFFF;
}

.generic_product_tbl .product_name_header {
	/*width: 70%;*/
	background-color: var(--accent-color);
	padding-left: 10px;
	text-align: left;
}

.generic_product_tbl .product_price_header {
	/*width: 30%;*/
	background-color: var(--accent-color);
	padding-right: 10px;
	text-align: right;
}

.generic_product_tbl .product_tr_detail {
	height: 25px;
	font-weight: normal;
	color: #000;
}

.product_tr_detail.odd {
	background-color:#b3d4de3b;
}
.generic_product_tbl .product_detail {
	padding: 10px;
	text-align: left;
}

.generic_product_tbl .product_price {
	/*width: 30%;*/
	padding-right: 10px;
	text-align: right;
}

.product_notes {
	font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 11px;
	margin-top: 5px;
	margin-bottom: 15px;
	padding-left: 3px;
	padding-right: 10px;
	border-top-style: solid;
	border-top: thin solid #8acbfb;
}

.prices_header_td {
	color: #5d5d5d;
	font: small-caps bold 14px var(--font-family-text), OpenSans, Helvetica, Geneva, sans-serif;
	text-align: left;
	padding-bottom: 10px;
	padding-left: 10px;
}

.prices_detail_td {
	padding-bottom: 10px;
	text-align:right;
}

.td_33 {
	width: 33%;
	font-family:var(--font-family-text),OpenSans;
	text-transform:uppercase;
	font-size:17px;
	font-weight:normal;	
}

.td_no_spacing {
	padding:0px;
	margin:0px;
}

.tax_text_info {
	text-align: right;
	color: #282828;
	font: small-caps bold 11px var(--font-family-text), OpenSans, Helvetica, Geneva, sans-serif;
	padding-top: 10px;
	padding-right: 3px;
	padding-bottom: 10px;
}

/* @end */

font {
	font-size: 15px;
	line-height: 130%;
}

div.formulari {
	width: 600px;
	text-align: left;
}

div.formulari input {
	margin-right: 10px;
	margin-bottom: 10px;
}

div.formulari ul li {
	list-style-position: outside;
	list-style-type: disc;
	line-height: 1.25
}

div.debug {
	background-color: #ffd;
	border: 1px dotted #ee4;
	font-size: 11px;
	color: #990;
	padding: 5px;
	width: 300px;
	margin: 5px;
}

div.notify {
	background-color: #dfd;
	border: 1px dotted #4e4;
	font-size: 11px;
	color: #090;
	padding: 5px;
	width: 300px;
	margin: 5px;
}

div.error {
	background-color: #fdd;
	border: 1px dotted #e44;
	font-size: 11px;
	color: #900;
	padding: 5px;
	width: 300px;
	margin: 5px;
}

table.survey_rate input {
	margin: 0px;
}

table.survey_rate td {
	text-align: center;
	width: 40px;
	padding: 5px;
}

/* generic products */

.ballon {
	margin-top: 30px;
	padding-top: 15px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 0px;
	border: 1px solid #8acbfb;
	background-color: #bdebff;
	*background-color: #cde9fd;
	border-radius: 4px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;

}
div#lastfoot {
	background-color:#f1f1f1;
	width:100%;
}
div#lastfoot a {
color:var(--accent-color);
}
.footer_legal {
	font-family: var(--font-family-text),OpenSans,Helvetica,sans-serif;
	color: #333;
	font-weight: normal;
	font-size: 11px;
	padding-top: 15px;
	padding-bottom: 15px;
	text-align: center;
	clear: left;
width:1000px;
left:0px;
right:0px;
margin:auto;

}


.footer_legal a {
	color: #333;
}

.footer_legal a:hover {
	color: var(--accent-color);
	text-decoration: underline;
}

.block_text {
	font-size:14px;
	text-align: justify;
	padding-top: 30px;
	padding-left: 0px;
	padding-right: 30px;
	float: left;
	line-height:140%;
}

ul {
	margin: 0 0 1em 2em
}

ol {
	margin: 0 0 1em 2em;
	*margin: 0 0 1em 2.3em
}

p, pre {
	margin: 0 0 1em
}

li {
	margin: 0 0 .5em
}

dd {
	margin: 0 0 1em 2em
}

blockquote {
	margin: 0 2em 1em
}

h2, h3 {
	margin: 0px;
}
h4 { font-size: 1.4em;  margin: 0 !important;padding:0 !important}

h5, h6 {
	font-size: 1em;
	margin: 0 0 1em
}


sup, sub {
	font-size: .7em
}

th, caption {
	text-align: left
}

input, select, textarea, option {
	font-family: inherit;
	font-size: inherit;
    border: 1px solid #A1A1A1;
    background-color: #fff;
}

textarea { min-height:100px;width:282px;margin-left:5px; }

.g-unit .g-section {
	width: 100%;
	overflow: hidden;
	zoom: 1
}

.g-split .g-unit {
	text-align: right
}

.g-split .g-first {
	text-align: left
}

.g-tpl-50 .g-unit, .g-unit .g-tpl-50 .g-unit, .g-unit .g-unit .g-tpl-50 .g-unit, .g-unit .g-unit .g-unit .g-tpl-50 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-50 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50 .g-unit {
	display: block;
	margin: 0 0 0 50px;
	width: auto;
	float: none
}

.g-tpl-50 .g-first, .g-unit .g-tpl-50 .g-first, .g-unit .g-unit .g-tpl-50 .g-first, .g-unit .g-unit .g-unit .g-tpl-50 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-50 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50 .g-first {
	display: block;
	margin: 0;
	width: 50px;
	float: left
}

.g-tpl-50-alt .g-unit, .g-unit .g-tpl-50-alt .g-unit, .g-unit .g-unit .g-tpl-50-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-50-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-alt .g-unit {
	display: block;
	margin: 0 50px 0 0;
	width: auto;
	float: none
}

.g-tpl-50-alt .g-first, .g-unit .g-tpl-50-alt .g-first, .g-unit .g-unit .g-tpl-50-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-50-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-alt .g-first {
	display: block;
	margin: 0;
	width: 50px;
	float: right
}

.g-tpl-75 .g-unit, .g-unit .g-tpl-75 .g-unit, .g-unit .g-unit .g-tpl-75 .g-unit, .g-unit .g-unit .g-unit .g-tpl-75 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-75 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75 .g-unit {
	display: block;
	margin: 0 0 0 75px;
	width: auto;
	float: none
}

.g-tpl-75 .g-first, .g-unit .g-tpl-75 .g-first, .g-unit .g-unit .g-tpl-75 .g-first, .g-unit .g-unit .g-unit .g-tpl-75 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-75 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75 .g-first {
	display: block;
	margin: 0;
	width: 75px;
	float: left
}

.g-tpl-75-alt .g-unit, .g-unit .g-tpl-75-alt .g-unit, .g-unit .g-unit .g-tpl-75-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-75-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-75-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75-alt .g-unit {
	display: block;
	margin: 0 75px 0 0;
	width: auto;
	float: none
}

.g-tpl-75-alt .g-first, .g-unit .g-tpl-75-alt .g-first, .g-unit .g-unit .g-tpl-75-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-75-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-75-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75-alt .g-first {
	display: block;
	margin: 0;
	width: 75px;
	float: right
}

.g-tpl-130 .g-unit, .g-unit .g-tpl-130 .g-unit, .g-unit .g-unit .g-tpl-130 .g-unit, .g-unit .g-unit .g-unit .g-tpl-130 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-130 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-130 .g-unit {
	display: block;
	margin: 0 0 0 130px;
	width: auto;
	float: none
}

.g-tpl-130 .g-first, .g-unit .g-tpl-130 .g-first, .g-unit .g-unit .g-tpl-130 .g-first, .g-unit .g-unit .g-unit .g-tpl-130 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-130 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-130 .g-first {
	display: block;
	margin: 0;
	width: 130px;
	float: left
}

.g-tpl-130-alt .g-unit, .g-unit .g-tpl-130-alt .g-unit, .g-unit .g-unit .g-tpl-130-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-130-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-130-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-130-alt .g-unit {
	display: block;
	margin: 0 130px 0 0;
	width: auto;
	float: none
}

.g-tpl-130-alt .g-first, .g-unit .g-tpl-130-alt .g-first, .g-unit .g-unit .g-tpl-130-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-130-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-130-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-130-alt .g-first {
	display: block;
	margin: 0;
	width: 130px;
	float: right
}

.g-tpl-160 .g-unit, .g-unit .g-tpl-160 .g-unit, .g-unit .g-unit .g-tpl-160 .g-unit, .g-unit .g-unit .g-unit .g-tpl-160 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-160 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-160 .g-unit {
	display: block;
	margin: 0 0 0 160px;
	width: auto;
	float: none
}

.g-tpl-160 .g-first, .g-unit .g-tpl-160 .g-first, .g-unit .g-unit .g-tpl-160 .g-first, .g-unit .g-unit .g-unit .g-tpl-160 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-160 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-160 .g-first {
	display: block;
	margin: 0;
	width: 160px;
	float: left
}

.g-tpl-160-alt .g-unit, .g-unit .g-tpl-160-alt .g-unit, .g-unit .g-unit .g-tpl-160-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-160-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-160-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-160-alt .g-unit {
	display: block;
	margin: 0 160px 0 0;
	width: auto;
	float: none
}

.g-tpl-160-alt .g-first, .g-unit .g-tpl-160-alt .g-first, .g-unit .g-unit .g-tpl-160-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-160-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-160-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-160-alt .g-first {
	display: block;
	margin: 0;
	width: 160px;
	float: right
}

.g-tpl-180 .g-unit, .g-unit .g-tpl-180 .g-unit, .g-unit .g-unit .g-tpl-180 .g-unit, .g-unit .g-unit .g-unit .g-tpl-180 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-180 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-180 .g-unit {
	display: block;
	margin: 0 0 0 180px;
	width: auto;
	float: none
}

.g-tpl-180 .g-first, .g-unit .g-tpl-180 .g-first, .g-unit .g-unit .g-tpl-180 .g-first, .g-unit .g-unit .g-unit .g-tpl-180 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-180 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-180 .g-first {
	display: block;
	margin: 0;
	width: 180px;
	float: left
}

.g-tpl-180-alt .g-unit, .g-unit .g-tpl-180-alt .g-unit, .g-unit .g-unit .g-tpl-180-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-180-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-180-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-180-alt .g-unit {
	display: block;
	margin: 0 180px 0 0;
	width: auto;
	float: none
}

.g-tpl-180-alt .g-first, .g-unit .g-tpl-180-alt .g-first, .g-unit .g-unit .g-tpl-180-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-180-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-180-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-180-alt .g-first {
	display: block;
	margin: 0;
	width: 180px;
	float: right
}

.g-tpl-200 .g-unit, .g-unit .g-tpl-200 .g-unit, .g-unit .g-unit .g-tpl-200 .g-unit, .g-unit .g-unit .g-unit .g-tpl-200 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-200 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-200 .g-unit {
	display: block;
	margin: 0 0 0 200px;
	width: auto;
	float: none
}

.g-tpl-200 .g-first, .g-unit .g-tpl-200 .g-first, .g-unit .g-unit .g-tpl-200 .g-first, .g-unit .g-unit .g-unit .g-tpl-200 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-200 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-200 .g-first {
	display: block;
	margin: 0;
	width: 200px;
	float: left
}

.g-tpl-200-alt .g-unit, .g-unit .g-tpl-200-alt .g-unit, .g-unit .g-unit .g-tpl-200-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-200-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-200-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-200-alt .g-unit {
	display: block;
	margin: 0 200px 0 0;
	width: auto;
	float: none
}

.g-tpl-200-alt .g-first, .g-unit .g-tpl-200-alt .g-first, .g-unit .g-unit .g-tpl-200-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-200-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-200-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-200-alt .g-first {
	display: block;
	margin: 0;
	width: 200px;
	float: right
}

.g-tpl-225 .g-unit, .g-unit .g-tpl-225 .g-unit, .g-unit .g-unit .g-tpl-225 .g-unit, .g-unit .g-unit .g-unit .g-tpl-225 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-225 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-225 .g-unit {
	display: block;
	margin: 0 0 0 225px;
	width: auto;
	float: none
}

.g-tpl-225 .g-first, .g-unit .g-tpl-225 .g-first, .g-unit .g-unit .g-tpl-225 .g-first, .g-unit .g-unit .g-unit .g-tpl-225 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-225 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-225 .g-first {
	display: block;
	margin: 0;
	width: 225px;
	float: left
}

.g-tpl-225-alt .g-unit, .g-unit .g-tpl-225-alt .g-unit, .g-unit .g-unit .g-tpl-225-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-225-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-225-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-225-alt .g-unit {
	display: block;
	margin: 0 225px 0 0;
	width: auto;
	float: none
}

.g-tpl-225-alt .g-first, .g-unit .g-tpl-225-alt .g-first, .g-unit .g-unit .g-tpl-225-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-225-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-225-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-225-alt .g-first {
	display: block;
	margin: 0;
	width: 225px;
	float: right
}

.g-tpl-250 .g-unit, .g-unit .g-tpl-250 .g-unit, .g-unit .g-unit .g-tpl-250 .g-unit, .g-unit .g-unit .g-unit .g-tpl-250 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-250 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-250 .g-unit {
	display: block;
	margin: 0 0 0 250px;
	width: auto;
	float: none
}

.g-tpl-250 .g-first, .g-unit .g-tpl-250 .g-first, .g-unit .g-unit .g-tpl-250 .g-first, .g-unit .g-unit .g-unit .g-tpl-250 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-250 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-250 .g-first {
	display: block;
	margin: 0;
	width: 250px;
	float: left
}

.g-tpl-250-alt .g-unit, .g-unit .g-tpl-250-alt .g-unit, .g-unit .g-unit .g-tpl-250-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-250-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-250-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-250-alt .g-unit {
	display: block;
	margin: 0 250px 0 0;
	width: auto;
	float: none
}

.g-tpl-250-alt .g-first, .g-unit .g-tpl-250-alt .g-first, .g-unit .g-unit .g-tpl-250-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-250-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-250-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-250-alt .g-first {
	display: block;
	margin: 0;
	width: 250px;
	float: right
}

.g-tpl-300 .g-unit, .g-unit .g-tpl-300 .g-unit, .g-unit .g-unit .g-tpl-300 .g-unit, .g-unit .g-unit .g-unit .g-tpl-300 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-300 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-300 .g-unit {
	display: block;
	margin: 0 0 0 300px;
	width: auto;
	float: none
}

.g-tpl-300 .g-first, .g-unit .g-tpl-300 .g-first, .g-unit .g-unit .g-tpl-300 .g-first, .g-unit .g-unit .g-unit .g-tpl-300 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-300 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-300 .g-first {
	display: block;
	margin: 0;
	width: 300px;
	float: left
}

.g-tpl-300-alt .g-unit, .g-unit .g-tpl-300-alt .g-unit, .g-unit .g-unit .g-tpl-300-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-300-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-300-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-300-alt .g-unit {
	display: block;
	margin: 0 300px 0 0;
	width: auto;
	float: none
}

.g-tpl-300-alt .g-first, .g-unit .g-tpl-300-alt .g-first, .g-unit .g-unit .g-tpl-300-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-300-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-300-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-300-alt .g-first {
	display: block;
	margin: 0;
	width: 300px;
	float: right
}

.g-tpl-320 .g-unit, .g-unit .g-tpl-320 .g-unit, .g-unit .g-unit .g-tpl-320 .g-unit, .g-unit .g-unit .g-unit .g-tpl-320 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-320 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-320 .g-unit {
	display: block;
	margin: 0 0 0 320px;
	width: auto;
	float: none
}

.g-tpl-320 .g-first, .g-unit .g-tpl-320 .g-first, .g-unit .g-unit .g-tpl-320 .g-first, .g-unit .g-unit .g-unit .g-tpl-320 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-320 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-320 .g-first {
	display: block;
	margin: 0;
	width: 320px;
	float: left
}

.g-tpl-320-alt .g-unit, .g-unit .g-tpl-320-alt .g-unit, .g-unit .g-unit .g-tpl-320-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-320-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-320-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-320-alt .g-unit {
	display: block;
	margin: 0 320px 0 0;
	width: auto;
	float: none
}

.g-tpl-320-alt .g-first, .g-unit .g-tpl-320-alt .g-first, .g-unit .g-unit .g-tpl-320-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-320-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-320-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-320-alt .g-first {
	display: block;
	margin: 0;
	width: 320px;
	float: right
}

.g-tpl-350 .g-unit, .g-unit .g-tpl-350 .g-unit, .g-unit .g-unit .g-tpl-350 .g-unit, .g-unit .g-unit .g-unit .g-tpl-350 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-350 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-350 .g-unit {
	display: block;
	margin: 0 0 0 350px;
	width: auto;
	float: none
}

.g-tpl-350 .g-first, .g-unit .g-tpl-350 .g-first, .g-unit .g-unit .g-tpl-350 .g-first, .g-unit .g-unit .g-unit .g-tpl-350 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-350 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-350 .g-first {
	display: block;
	margin: 0;
	width: 350px;
	float: left
}

.g-tpl-350-alt .g-unit, .g-unit .g-tpl-350-alt .g-unit, .g-unit .g-unit .g-tpl-350-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-350-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-350-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-350-alt .g-unit {
	display: block;
	margin: 0 350px 0 0;
	width: auto;
	float: none
}

.g-tpl-350-alt .g-first, .g-unit .g-tpl-350-alt .g-first, .g-unit .g-unit .g-tpl-350-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-350-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-350-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-350-alt .g-first {
	display: block;
	margin: 0;
	width: 350px;
	float: right
}

.g-tpl-400 .g-unit, .g-unit .g-tpl-400 .g-unit, .g-unit .g-unit .g-tpl-400 .g-unit, .g-unit .g-unit .g-unit .g-tpl-400 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-400 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-400 .g-unit {
	display: block;
	margin: 0 0 0 400px;
	width: auto;
	float: none
}

.g-tpl-400 .g-first, .g-unit .g-tpl-400 .g-first, .g-unit .g-unit .g-tpl-400 .g-first, .g-unit .g-unit .g-unit .g-tpl-400 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-400 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-400 .g-first {
	display: block;
	margin: 0;
	width: 400px;
	float: left
}

.g-tpl-400-alt .g-unit, .g-unit .g-tpl-400-alt .g-unit, .g-unit .g-unit .g-tpl-400-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-400-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-400-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-400-alt .g-unit {
	display: block;
	margin: 0 400px 0 0;
	width: auto;
	float: none
}

.g-tpl-400-alt .g-first, .g-unit .g-tpl-400-alt .g-first, .g-unit .g-unit .g-tpl-400-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-400-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-400-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-400-alt .g-first {
	display: block;
	margin: 0;
	width: 400px;
	float: right
}

.g-tpl-25-75 .g-unit, .g-unit .g-tpl-25-75 .g-unit, .g-unit .g-unit .g-tpl-25-75 .g-unit, .g-unit .g-unit .g-unit .g-tpl-25-75 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75 .g-unit {
	width: 74.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-25-75 .g-first, .g-unit .g-tpl-25-75 .g-first, .g-unit .g-unit .g-tpl-25-75 .g-first, .g-unit .g-unit .g-unit .g-tpl-25-75 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75 .g-first {
	width: 24.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-25-75-alt .g-unit, .g-unit .g-tpl-25-75-alt .g-unit, .g-unit .g-unit .g-tpl-25-75-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-unit {
	width: 24.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-25-75-alt .g-first, .g-unit .g-tpl-25-75-alt .g-first, .g-unit .g-unit .g-tpl-25-75-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-first {
	width: 74.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-75-25 .g-first, .g-unit .g-tpl-75-25 .g-first, .g-unit .g-unit .g-tpl-75-25 .g-first, .g-unit .g-unit .g-unit .g-tpl-75-25 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-75-25 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75-25 .g-first {
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-33-67 .g-unit, .g-unit .g-tpl-33-67 .g-unit, .g-unit .g-unit .g-tpl-33-67 .g-unit, .g-unit .g-unit .g-unit .g-tpl-33-67 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67 .g-unit {
	width: 66.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-33-67 .g-first, .g-unit .g-tpl-33-67 .g-first, .g-unit .g-unit .g-tpl-33-67 .g-first, .g-unit .g-unit .g-unit .g-tpl-33-67 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67 .g-first {
	width: 32.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-33-67-alt .g-unit, .g-unit .g-tpl-33-67-alt .g-unit, .g-unit .g-unit .g-tpl-33-67-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-unit {
	width: 32.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-33-67-alt .g-first, .g-unit .g-tpl-33-67-alt .g-first, .g-unit .g-unit .g-tpl-33-67-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-first {
	width: 66.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-67-33 .g-unit, .g-unit .g-tpl-67-33 .g-unit, .g-unit .g-unit .g-tpl-67-33 .g-unit, .g-unit .g-unit .g-unit .g-tpl-67-33 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33 .g-unit {
	width: 32.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-67-33 .g-first, .g-unit .g-tpl-67-33 .g-first, .g-unit .g-unit .g-tpl-67-33 .g-first, .g-unit .g-unit .g-unit .g-tpl-67-33 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33 .g-first {
	width: 66.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-67-33-alt .g-unit, .g-unit .g-tpl-67-33-alt .g-unit, .g-unit .g-unit .g-tpl-67-33-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-unit {
	width: 66.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-67-33-alt .g-first, .g-unit .g-tpl-67-33-alt .g-first, .g-unit .g-unit .g-tpl-67-33-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-first {
	width: 32.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-50-50 .g-unit, .g-unit .g-tpl-50-50 .g-unit, .g-unit .g-unit .g-tpl-50-50 .g-unit, .g-unit .g-unit .g-unit .g-tpl-50-50 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50 .g-unit {
	width: 49.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-50-50 .g-first, .g-unit .g-tpl-50-50 .g-first, .g-unit .g-unit .g-tpl-50-50 .g-first, .g-unit .g-unit .g-unit .g-tpl-50-50 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50 .g-first {
	width: 49.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-50-50-alt .g-unit, .g-unit .g-tpl-50-50-alt .g-unit, .g-unit .g-unit .g-tpl-50-50-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-unit {
	width: 49.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-50-50-alt .g-first, .g-unit .g-tpl-50-50-alt .g-first, .g-unit .g-unit .g-tpl-50-50-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-first {
	width: 49.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-nest .g-unit, .g-unit .g-tpl-nest .g-unit, .g-unit .g-unit .g-tpl-nest .g-unit, .g-unit .g-unit .g-unit .g-tpl-nest .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-nest .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-nest .g-unit {
	float: left;
	width: auto;
	display: inline;
	margin: 0
}

.g-tpl-nest-alt .g-unit, .g-unit .g-tpl-nest-alt .g-unit, .g-unit .g-unit .g-tpl-nest-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-nest-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-nest-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-nest-alt .g-unit {
	float: right;
	width: auto;
	display: inline;
	margin: 0
}

.header {
	margin: 0 0 .6em -.2em;
	position: relative
}

.header img {
	float: left
}

.standard .header h1 {
	float: left;
	color: #333;
	font-weight: normal;
	margin: .62em 0 0 .5em;
	font-size: 20px;
}

.header span {
	margin: .4em 0 0;
	float: right
}

.standard .header span {
	margin: 1.2em 0 0
}

.header span ul {
	margin: .4em 0 0;
	list-style: none outside
}

.header span ul li {
	display: inline;
	margin: 0 0 0 .4em
}

.breadcrumbs {
	font-size: .85em
}

.nav ul {
	margin: 0 1em 0 0;
	list-style: none outside
}

.nav ul li {
	margin: 0 0 1em;
	font-weight: bold
}

.nav ul li ul {
	margin: 1em 0 0 1em
}

.nav ul li a {
	font-weight: normal
}

.standard .footer {
	border-top: 1px solid #ccc;
	margin: 1.3em 0 0;
	padding: .5em 0 0
}

.standard .footer.side {
	text-align: left
}

img {
	border: none;
}

#loginbox {
	background-color: #339900;
	color: #ffffff;
	font-size: 13px;
	position: absolute;
	left: 50%;
	width: 400px;
	top: 20%;
	padding: 20px;
	border: 1px solid #fff;
	z-index: 100;
	margin-left: -180px;
	text-align: center;
}

#loginTitle {
	font-size: 17px;
	font-weight: normal;
}

/* ----- interface -------- */

#top {
	position: absolute;
	z-index: 99;
	width: 99%;
	height: 50px;
	padding: 5px;
	background-color: #FBFCFC;
	background-image: url(/kms/tpl/default/styles/aqua/img/interface/head_bg.jpg);*/
    background-repeat: repeat-y;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #8a939d;
	clear: both;
}

#content {
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	float: left;
	clear: left;
}

.content_column {
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 20px;
	padding-bottom: 40px;
	float: left;
}


#leftmenu {
	position: absolute;
	width: 200px;
	height: 100%;
	top: 0px;
}

#itopGal {
	position: relative;
	z-index: 99;
	width: 100%;
	height: 50px;
	padding: 5px;
	background-color: #eee;
	/*        background-image: url(/kms

/tpl/default/styles/aqua/img/interface/head_bg.jpg);*/
        background-repeat: repeat-y;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #8a939d;
}

.galthumb {
	margin: 0px;
	float: left;
	width: 130px;
	height: 170px;
	font-size: 15px;
	text-align: center;
}

.mythumb {
	margin: 10px;
	float: left;
	width: 100px;
	height: 100px;
	background-color: #eee;
	border-width: 1px;
	border-style: solid;
	border-color: #8a939d;
	font-size: 15px;
}

b.destacat {
	color: #06c;
}

p, li {
	line-height: 1.8em;
}

h2 {
	padding-top: 10px;
	font-size: 2em;
}

pre {
	font-size: 1.2em;
	line-height: 1.2em;
	overflow-x: auto;
}

div#page {
	background-color: #000;
	margin: 0 auto;
	text-align: left;


/*	border-color: #ddd;
	border-style: none solid solid;
	border-width: medium 1px 1px;*/
}

div#container {
	width: 850px;
	padding: 0px;
}

div#ads {
	clear: both;
	padding: 13px 0 13px 66px;
}

#footer .g-c b { font-weight:100 !important; font-size:13px; }
#footer .g-c b::after { content: ""; display: block; padding-bottom: 0px; }

div#footer_links,div#footer {
	clear: both;
	color: #eee;
	margin: 0 auto;
	text-align: center;
	border-bottom:1px dotted #ccc;
}
div#footer_links {
	padding: 50px 0 50px 0px;
	position: relative;
	overflow: visible;
	padding-bottom: 80px !important;
}

/* Efecte mossegat per al footer_links */
#footer_links::before {
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	bottom: -13px;
	width: 80%;
	max-width: 1200px;
	height: 25px;
	background: #f1f1f1;
	clip-path: polygon(2.125% 0%, 97.875% 0%, 100% 100%, 0% 100%);
	z-index: 10;
	transform: translateX(-50%);
}

a {
	color: var(--accent-color);
	text-decoration: none;
}

a:focus, a:hover, a:active {
	text-decoration: underline;
}

p, li {
	line-height: 1.3em;
}

h2 {
	padding-top: 10px;
	font-size: 2em;
}

pre {
	font-size: 1.2em;
	line-height: 1.2em;
	overflow-x: auto;
}

div#page {
	background-color: #000;
	margin: 0 auto;
	text-align: left;
	margin-top:55px;
}

body.main div#page div#content { padding-top:30px; }
div#container {
	width: 850px;
	padding: 0px;
}

div#ads {
	clear: both;
	padding: 13px 0 13px 66px;
}

img {
	border: none;
}

#loginbox {
	background-color: #339900;
	color: #ffffff;
	font-size: 13px;
	position: absolute;
	left: 50%;
	width: 400px;
	top: 20%;
	padding: 20px;
	border: 1px solid #fff;
	z-index: 100;
	margin-left: -180px;
	text-align: center;
}

#loginTitle {
	font-size: 17px;
	font-weight: normal;
}

/* ----- interface -------- */

#contents {
	position: absolute;
	left: 200px;
	top: 47px;
	width: 900px;
	height: 100%;
	margin: 20px;
	z-index: 2;
	background-color: #fff;
}

#itopGal {
	position: relative;
	z-index: 99;
	width: 100%;
	height: 50px;
	padding: 5px;
	background-color: #eee;
	/*        background-image: url(/kms

/tpl/default/styles/aqua/img/interface/head_bg.jpg);*/
        background-repeat: repeat-y;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #8a939d;
}

.galthumb {
	margin: 0px;
	float: left;
	width: 130px;
	height: 170px;
	font-size: 15px;
	text-align: center;
}

.mythumb {
	margin: 10px;
	float: left;
	width: 100px;
	height: 100px;
	background-color: #eee;
	border-width: 1px;
	border-style: solid;
	border-color: #8a939d;
	font-size: 15px;
}

b.destacat {
	color: #06c;
}

/*Menu*/

#pcm {
	display: none;
}

ul.pureCssMenu ul {
	display: none
}

ul.pureCssMenu li:hover>ul {
	display: block
}

ul.pureCssMenu ul {
	position: absolute;
	left: 0px;
	top:44px;
        z-index:98;
	padding-top:10px !important;
	background:none !important;
}
.container_menu { background-color:#000;border-radius:10px; }

ul.pureCssMenu ul ul {
	position: absolute;
	left: 98%;
	top: -2px;
}

ul.pureCssMenu,ul.pureCssMenu ul {
	margin: 0px;
	list-style: none;
	padding: 0px 1px 1px 0px;
	background:none;
	border-color: #A6A6A6;
	border-width: 0px;
	border-style: solid;
}

ul.pureCssMenu table {
	border-collapse: collapse
}

ul.pureCssMenu {
	display: block;
	zoom: 1;
	float: left;
}

ul.pureCssMenu ul {
	width: 300px;
        border-radius: 10px;
	background-color:#000;
	left:-100px;
}

ul.pureCssMenu li {
	display: block;
	margin: 1px 0px 0px 1px;
	font-size: 0px;
}

ul.pureCssMenu a:active, ul.pureCssMenu a:focus {
	outline-style: none;
}

ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
	display: block;
	vertical-align: middle;
	background-color:none;
	border-width: 0px;
	border-color: #FCEEB0;
	border-style: solid;
	text-align: left;
	text-decoration: none;
	padding: 5px 0px;
	_padding-left: 0;
	letter-spacing:0.5px;
	text-decoration: none;
	cursor: pointer;
}

ul.pureCssMenu a.pureCssMenui0 { color:#000; }
ul.pureCssMenu a.pureCssMenui { color:#fff; }

ul.pureCssMenu span {
	overflow: hidden;
}

ul.pureCssMenu li {
	float: left;
}

ul.pureCssMenu ul li {
	float: none;
}

ul.pureCssMenu ul a {
	text-align: left;
	white-space: nowrap;
}

ul.pureCssMenu li.sep {
	text-align: left;
	padding: 0px;
	line-height: 0;
	height: 100%;
}

ul.pureCssMenu li.sep span {
	float: none;
	padding-right: 0;
	width: 3;
	height: 100%;
	display: inline-block;
	background-color: #A6A6A6;
	background-image: none;
}

ul.pureCssMenu ul li.sep span {
	width: 100%;
	height: 3;
}

ul.pureCssMenu li.pureCssMenui0:hover {
        position: relative;
        padding: 7px 10px;
        border-radius: 5px;
}

ul.pureCssMenu li:hover {
	position: relative;
 	font-weight:normal;
}

ul.pureCssMenu li:hover a.pureCssMenui0 {
	border-style: solid;
	text-decoration: none;
        border-bottom: 2px solid #000;
}

ul.pureCssMenu li a:hover {
	position: relative;
	border-style: solid;
	text-decoration: none;
}

ul.pureCssMenu li.dis a {
	color: #AAAAAA !important;
}

ul.pureCssMenu img {
	border: none;
	float: left;
	_float: none;
	margin-right: 5px;
	width: 16px;
	height: 16px;
}

ul.pureCssMenu ul img {
	width: 16px;
	height: 16px;
}

ul.pureCssMenu img.over {
	display: none
}

ul.pureCssMenu li.dis a:hover img.over {
	display: none !important
}

ul.pureCssMenu li.dis a:hover img.def {
	display: inline !important
}

ul.pureCssMenu li:hover > a img.def {
	display: none
}

ul.pureCssMenu li:hover > a img.over {
	display: inline
}

ul.pureCssMenu a:hover img.over,ul.pureCssMenu a:hover ul img.def,ul.pureCssMenu a:hover a:hover img.over {
	display: inline
}

ul.pureCssMenu a:hover img.def,ul.pureCssMenu a:hover ul img.over,ul.pureCssMenu a:hover a:hover img.def {
	display: none
}

ul.pureCssMenu a:hover ul {
	display: block
}

ul.pureCssMenu span {
	display: block;
	background-image: url(../tpl/images/arrv_blue_2.gif);
	background-position: right center;
	background-repeat: no-repeat;
	padding-right: 8px;
}

ul.pureCssMenu li:hover>a>span {
	background-image: url(../tpl/images/arrv_white_2.gif);
}

ul.pureCssMenu a:hover span {
	_background-image: url(../tpl/images/arrv_white_2.gif)
}

ul.pureCssMenu ul span,ul.pureCssMenu a:hover table span {
	background-image: url(../tpl/images/arr_blue_2.gif)
}

ul.pureCssMenu ul li:hover > a span {
	background-image: url(../tpl/images/arr_white_2.gif);
}

ul.pureCssMenu table a:hover span {
	background-image: url(../tpl/images/arr_white_2.gif)
}


/* End menu css */

.language_selector {
	position: absolute;
	top: 100%;
	right: 0;
	margin-top: 0;
	min-width: 150px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	padding: 5px 0;
	z-index: 9999;
}

div.info_block.language {
	position: relative;
}

.language_box {
	background-color: transparent;
	margin: 0;
	padding: 0;
	text-align: left;
	border-radius: 0;
	transition: background-color 0.2s ease;
}

.language_box:hover {
	background-color: #f5f5f5;
}
.language_box a {
	font-size: 13px;
	display: block;
	padding: 8px 15px;
	width: 100%;
}

a:link a:visited {
	color: #06c;
	text-decoration: none;
}

a:active, a:hover {
	text-decoration: underline;
}
section#client-area  a{ text-decoration:none; 	}
.h0 {
	font-size: 3.9em;
	color: #000;
	padding: 0;
	font-weight: normal;
	margin-bottom: 8px;
	margin-top: 10px;
}

h2 {
	font-size: 18px;
	padding: 5px 0px 0px 0px;
	font-weight: normal;
	color: #fff;
	line-height: 1.4em;
	margin-bottom: 8px;
	margin-top: 0px;
}

h3 {
	font-size: 1.5em;
	font-weight: normal;
	color: var(--accent-color);
	margin-bottom: 5px;
}

h4 {
	padding-bottom: 3px;
	margin-bottom: 0px;
}

h5 {
	font-size: 1.1em;
	font-weight: normal;
	color: #333;
	padding-top: 15px;
}

#ent-masthead .text-lg {
	font-size: 3em;
	color: #FFF;
	font-weight: normal;
}

p.learnmore {
	font-size: 1.3em;
}

.prodimg {
	float: left;
	margin-right: 10px;
	position: relative;
	top: -4px;
	padding-bottom:20px;
}

/*Start Returning User Sign In*/

#select-login {
	display: none;
	float: right;
}

#select-login a {
	text-decoration: none;
}

#select-login form,
#select-login div {
	display: inline;
}

/*End Returning User Sign In*/

.calc-li {
	margin-bottom: 5px;
}

.calc-li td {
	padding-right: 10px;
}

.wage-field {
	float: right;
	padding: 0;
	position: relative;
	top: 0px;
	margin-bottom: 5px;
}

.employee-field {
	float: right;
	padding: 0;
	position: relative;
	top: 3px;
	margin-bottom: 5px;
}

.currency-sign {
	float: right;
	position: relative;
	left: 0px;
	top: 2px
}

#calcuOpenSansr {
	padding: 0 5px;
}

#error {
	color: red;
	display: none;
}

.calc-text {
	color: #373737;
	font-weight: normal;
	font-size: 0.9em;
	width: 100px;
}

.rightnav p {
	padding: 10px 0 0 0;
	line-height: 23px;
}

.rightnav {
	padding-left: 20px;
	border-left: 1px #ccc solid;
	margin-left: 10px;
	margin-top: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

/* Start Flex Button */

div.g-button {
	margin: 0 0 1em 0px;
	border: 1px solid #BFD4F2;
	background-color: #fff;
	padding: 15px 15px 13px 19px;
	text-align: center;
}

div.g-button div {
	background: url("https://www.intergrid.cat/css/img_interficie/g-button-cr1-1_wt.gif") no-repeat 0% 0%;
	font-size: 1.3em;
	background-color: #5679a5;
}

b.fort {
	color: #5679a5;
}

div.wide div.g-button div {
	max-width: 300px;
	margin: 0 auto;
}

div.g-button div span span a {
	display: block;
	color: #fff !important;
	background: url("https://www.intergrid.cat/css/img_interficie/g-button-cr1-2_wt.gif") no-repeat right bottom;
	padding: 8px 18px 13px 13px;
	text-decoration: none;
	font-weight: normal;
}

div.g-button div span {
	display: block;
	background: url("https://www.intergrid.cat/css/img_interficie/g-button-cr1-1_wt.gif") no-repeat right -400px;
	height: 1%;
}

div.g-button div span span {
	background: url("https://www.intergrid.cat/css/img_interficie/g-button-cr1-1_wt.gif") no-repeat left bottom;
}

/*End Flex Button*/

p.padTop {
	margin-top: 15px
}

p.pPadBtm {
	margin-bottom: 25px;
}

p.rightNav {
	line-height: 23px;
}

p.noPadding {
	padding: 0px;
}

.rndGreyBox {
	padding: 20px 0 0 0;
	clear: both;
	padding: 5px;
}

.emailError {
	position: relative;
	color: #f00;
	font-weight: normal;
	margin: 10px 0px 0px 0px;
	display: none;
}

#large_inquiry {
	margin-top: 10px;
	background: #fff6c3;
	border: 1px solid #fe8;
	display: none;
	padding: 0 1em;
}

#large_inquiry h4 {
	margin-bottom: 1em;
}

.zip {
	float: left;
	margin-right: 5px;
	display: none;
	padding: 2px 0 0 2px;
}

.zip_m {
	float: left;
	margin-right: 5px;
	display: block;
	padding: 2px 0 0 2px;
}

.detailBox {
	padding: 8px 20px 30px 0px;
}

div.entry {
	display: block;
	width: 100%;
	padding: 10px 10px 10px 10px;
	background-color: #fafcff;
	border: 1px solid #c6e0ff;
	font-size: 1em;
}

.entryB {
	font-weight: normal;
	margin-bottom: 5px;
	font-size: 1.1em;
}

.red {
	color: #f00
}

/*Start Editions*/

.editions_table {
	margin: 0;
}

div#select_login {
	display: none;
}

.editions_freeText {
	color: #E44949;
	font-size: 120%;
	font-weight: normal;
}

.editions_priceText {
	font-size: 100%;
	font-weight: normal;
	display: block;
	margin: 5px 0 5px 0;
	font-weight: normal;
}

.editions_smallFreeText {
	color: #E44949;
}

.emailError {
	position: relative;
	color: #f00;
	font-weight: normal;
	margin: 10px 0px 0px 0px;
	display: none;
}

.custDD {
	margin-bottom: 5px;
	display: inline;
}

.quota {
	display: inline;
	padding-right: 5px
}

.customerDiv {
	border-top: #eaeaea 1px solid;
	width: 325px;
	margin-right: 10px;
	float: left;
	padding: 3px;
}

.customerImg {
	float: right;
	padding: 0 0 2px 20px;
}

.subVideoText {
	line-height: 25px;
}

.smallFont {
	font-size: 0.9em;
	position: relative;
	top: 3px;
}

div.editions_table table tbody tr td {
	padding: 3px;
}

h2.editions_other {
	border-bottom: #fff 1px solid;
	color: #2461AA;
	font-weight: normal;
}

/*Start pre-sales faq*/

.hide {
	display: none;
}

.question {
	font-size: 13px;
	padding: 0 0 10px 0px;
	font-weight: normal
}

.question a {
	text-decoration: none;
}

.answer {
	margin: 0px 0 15px 16px;
	font-weight: normal;
}

.faqbm {
	margin-right: 4px;
}

.faqbp {
	margin-right: 4px;
}

/*End pre-sales faq*/

/*Start inner page video player*/

.vidContainer {
	float: right;
	background: #fff;
	padding: 0 0px 20px 20px;
}

.pageVideo {
	padding: 3px;
	border: #ccc 1px solid;
	background: #fff;
	float: right;
	margin: 15px 0px 10px 20px;
	width: 346px;
	height: 280px;
}

.moreVideos {
	margin: 10px 0px;
}

.breadcrumb {
	font-size: 83%;
	color: #666;
	padding-top: 7px
}

/**/

.playButton {
	position: relative;
	top: 2px;
	margin-right: 5px;
}

.pageQuote {
	width: 550px;
	background: #fafafa;
	padding: 5px;
	color: #333;
}

img.subHeaderImg {
	display: inline;
	margin-right: 8px;
	border: none;
	position: relative;
	top: -5px;
}

.nomargin {
	margin: 0;
	padding: 0
}

div.splitRight {
	width: 47%;
	float: right;
	margin-top: 20px;
}

/*Start Calendar*/

.calendarDiv {
	width: 400px;
	width: 45%;
	float: right;
	margin: 0 0 10px 10px
}

.tz_picker {
	float: right;
}

/*End Calendar*/

/*Start 'new' page*/

a.new_blog_item_link {
	text-decoration: none;
	color: #000;
	font-weight: normal;
	border-bottom: #ededed 1px solid;
	display: block;
	padding-bottom: 3px;
}

a.new_blog_item_link img {
	border: none
}

a.new_blog_item_link span {
	text-decoration: none;
	font-weight: normal;
	color: #15438f;
	padding: 0 10px
}

/*End 'new' page*/

.mobileImg {
	float: right;
	margin: 10px 0px 10px 30px;
}

h2.cust {
	display: inline;
	padding-right: 20px;
	font-size: 1.1em;
	font-weight: normal;
}

h2.cust2 {
	line-height: 1.4em;
}

.custBox {
	padding: 10px 0px;
	border: 0px solid #eaeaea;
}

.cust_entry_title {
	color: #000;
	font-weight: normal;
	padding-bottom: 5px;
	display: block;
	font-size: 1.4em;
	padding-left: 0px;
	margin-left: 0px;
}

.quote_owner {
	font-size: 1.1em;
}

div.top_customerDiv {
	border-top: #eaeaea 1px solid;
	width: 670px;
	margin-right: 10px;
	float: left;
	padding: 3px;
}

.bluebutton {
	margin-bottom: 3px;
}

#breadcrumbs {
	background: #e5f0fa;
	height: 25px;
	position: relative;
	top: -5px;
	text-align: left;
	font-size: 0.9em;
	color: #333;
	padding: 0px 0 0 10px;
	vertical-align: middle;
}

.breadtext {
	float: left;
	position: relative;
	top: 4px;
}

.breadtext a {
	text-decoration: none;
}

img.floatingImg {
	float: left;
	margin-right: 14px;
	margin-bottom: 10px;
}

img.floatingImgDetails {
	float: left;
	margin-right: 13px;
}

img.floatingImgBiz {
	margin-top: 13px;
	float: left;
	margin-right: 14px;
}

div.groupP {
	vertical-align: top;
	display: table;
}

div.titleGroup {
	margin-bottom: 10px;
	font-size: 1.0em;
	padding-right: 3px;
	vertical-align: top;
}

.disclaim {
	font-size: 0.9em;
	color: #666;
}

ul.nobullet {
	margin: 0px;
	padding: 0px;
}

ul.nobullet li {
	list-style-type: none;
	padding-bottom: 8px;
}

div.graybox {
	background-color: #F9F9F9;
	border: 1px solid #EAEAEA;
	padding: 10px;
	margin-bottom: 20px;
}

.rightnav_quote {
	margin-left: 25px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-top: 3px solid #EAEAEA;
	color: #666;
}

.rightnav_apps {
	margin-left: 25px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 10px;
	margin-bottom: 10px;
	border-top: 3px solid #666;
	color: #666;
	position: relative;
	left: -3px;
}

.bwtitle {
	margin-top: 15px;
	font-weight: 100;
}

.bwtitle_gg {
	margin-top: 25px;
	font-weight: 100;
}

a.bbutton {
	color: #fff;
	background: transparent url("../images/left-button.gif") no-repeat top left;
	display: block;
	float: left;
	line-height: 16px;
	height: 22px;
	padding-left: 3px;
	font-weight: normal;
	font-size: 1.0em;
	text-decoration: none;
}

a:link.bbutton, a:visited.bbutton, a:active.bbutton, a.bbutton:hover {
	color: #fff;
	text-decoration: none;
}

a.bbutton span {
	background: transparent url("../images/right-button.gif") no-repeat top right;
	display: block;
	padding: 4px 3px 4px 0;
}

.buttonwrapper {
	overflow: hidden;
	width: 100%;
}

.feedburnerFeedBlock ul {
	list-style: none;
	padding: 0;
	margin: 5px 0 0 0;
}

.feedburnerFeedBlock ul li {
	padding: 0;
	margin-bottom: 5px;
}

.date {
	display: inline;
	margin-left: 7px;
	padding: 0;
	color: #666;
}

#creditfooter {
	display: none;
}

div.std-feature {
	margin: 5px 0;
	padding: 5px 0;
	border-bottom: 1px solid #eaeaea;
}

ul.lessspace {
	padding-bottom: 0px;
	margin-bottom: 0px;
	margin-top: 7px;
	display: table;
}

ul.lessspace li {
	padding-bottom: 1px;
	margin-bottom: 1px;
}

a.selected {
	color: #000;
	font-weight: normal;
	text-decoration: none;
}

#navigation {
	font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	padding: 0px;
	margin: 0px;
	text-transform: uppercase;
}

#navigation ul {
	list-style: none;
	text-decoration: none;
	padding-right: 10px;
	padding: 0px;
	margin: 0px;
}

#navigation li {
	float: left;
	text-decoration: none;
	list-style: none;
}

#navigation li a {
	height: 25px;
}

#navigation li:hover {
	float: left;
	list-style: none;
	background-color: var(--accent-color);
}

#navigation a {
	color: #eee;
	text-decoration: none;
	display: block;
	padding-left: 7px;
	padding-right: 7px;
}

#navigation a.current {
	color: #111;
	background-color: #fff;
	text-decoration: none;
	display: block;
}

#navigation a.normal:hover {
	color: #fff;
	text-decoration: none;
	display: block;
}

#navigation a:hover span {
	padding-right: 0px
}

.rounded-grey-border {
	background-color: #E1DFD2;
	clear: both;
	margin-bottom: 5px;
	overflow: hidden;
	padding: 1px;
	position: relative;
}

.rounded-grey-plain {
	background-color: #E1DFD2;
	clear: both;
	margin-bottom: 5px;
	overflow: hidden;
	position: relative;
}

.light-blue {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: #FFFFFF url(https://www.intergrid.cat/css/img_interficie/vert_grad_light_blue.gif) repeat-x scroll 0 0;
}

.inner-block {
	overflow: hidden;
}

.inner-block p {
	line-height: 1.4;
}

.padded {
	padding: 5px 15px;
}

.corner-wrap {
	height: 6px;
	overflow: hidden;
	position: absolute;
	width: 6px;
}

.corner-wrap.t {
	margin-top: -1px;
}

.corner-wrap.t .corner {
	margin-top: -6px;
}

.corner-wrap.l {
	margin-left: -1px;
}

.corner-wrap.l .corner {
	margin-left: -6px;
}

.corner-wrap.r {
	left: -6px;
	margin-left: 100%;
}

.corner-wrap.r .corner {
	margin-left: 0;
}

.corner-wrap.b {
	margin-top: -5px;
	top: auto;
}

.corner {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(https://www.intergrid.cat/css/img_interficie/border-star.png) repeat scroll 0 0;
	height: 13px;
	position: absolute;
	width: 13px;
}

.transp-corner {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(https://www.intergrid.cat/css/img_interficie/corner.png) repeat scroll 0 0;
}

.grey-up {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(https://www.intergrid.cat/css/img_interficie/grey_pointer_up.png) no-repeat scroll 0 0;
	float: left;
	height: 13px;
	left: 50px;
	position: relative;
	width: 16px;
}

.grey-right {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(https://www.intergrid.cat/css/img_interficie/grey_pointer_right.png) no-repeat scroll 0 0;
	float: right;
	height: 16px;
	position: relative;
	right: -13px;
	width: 13px;
	z-index: 100;
}

.grey-down {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(https://www.intergrid.cat/css/img_interficie/grey_pointer_down.png) no-repeat scroll 0 0;
	float: left;
	height: 13px;
	left: 50px;
	margin-bottom: 10px;
	margin-top: -5px;
	position: relative;
	top: auto;
	width: 16px;
}

font {
	font-size: 15px;
	line-height: 130%;
}

div.formulari {
	width: 600px;
	text-align: left;
}

div.formulari input {
	margin-right: 10px;
	margin-bottom: 10px;
}

div.formulari ul li {
	list-style-position: outside;
	list-style-type: disc;
	line-height: 1.25
}

div.debug {
	background-color: #ffd;
	border: 1px dotted #ee4;
	font-size: 11px;
	color: #990;
	padding: 5px;
	width: 300px;
	margin: 5px;
}

div.notify {
	background-color: #dfd;
	border: 1px dotted #4e4;
	font-size: 11px;
	color: #090;
	padding: 5px;
	width: 300px;
	margin: 5px;
}

div.error {
	background-color: #fdd;
	border: 1px dotted #e44;
	font-size: 11px;
	color: #900;
	padding: 5px;
	width: 300px;
	margin: 5px;
}

table.survey_rate input {
	margin: 0px;
}

table.survey_rate td {
	text-align: center;
	width: 40px;
	padding: 5px;
}

/* generic products */

/* Copyright 2010 Google, Inc. All Rights Reserved */

ul {
	margin: 0 0 1em 2em
}

ol {
	margin: 0 0 1em 2em;
	*margin: 0 0 1em 2.3em
}

p, pre {
	margin: 0 0 1em
}

li {
	margin: 0 0 .5em
}

dd {
	margin: 0 0 1em 2em
}

blockquote {
	margin: 0 2em 1em
}

h2, h3 {
	margin: 0 0 .9em 0px
}

h4, h5, h6, {
	font-size: 1em;
	margin: 0 0 1em
}

sup, sub {
	font-size: .7em
}

th, caption {
	text-align: left
}

input, select, textarea, option {
	font-family: inherit;
	font-size: inherit
}

.g-section:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden
}

.g-unit .g-section:after {
	clear: none
}

.g-split .g-unit {
	text-align: right
}

.g-split .g-first {
	text-align: left
}

.g-tpl-50 .g-unit, .g-unit .g-tpl-50 .g-unit, .g-unit .g-unit .g-tpl-50 .g-unit, .g-unit .g-unit .g-unit .g-tpl-50 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-50 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50 .g-unit {
	display: block;
	margin: 0 0 0 50px;
	width: auto;
	float: none
}

.g-tpl-50 .g-first, .g-unit .g-tpl-50 .g-first, .g-unit .g-unit .g-tpl-50 .g-first, .g-unit .g-unit .g-unit .g-tpl-50 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-50 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50 .g-first {
	display: block;
	margin: 0;
	width: 50px;
	float: left
}

.g-tpl-50-alt .g-unit, .g-unit .g-tpl-50-alt .g-unit, .g-unit .g-unit .g-tpl-50-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-50-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-alt .g-unit {
	display: block;
	margin: 0 50px 0 0;
	width: auto;
	float: none
}

.g-tpl-50-alt .g-first, .g-unit .g-tpl-50-alt .g-first, .g-unit .g-unit .g-tpl-50-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-50-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-alt .g-first {
	display: block;
	margin: 0;
	width: 50px;
	float: right
}

.g-tpl-75 .g-unit, .g-unit .g-tpl-75 .g-unit, .g-unit .g-unit .g-tpl-75 .g-unit, .g-unit .g-unit .g-unit .g-tpl-75 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-75 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75 .g-unit {
	display: block;
	margin: 0 0 0 75px;
	width: auto;
	float: none
}

.g-tpl-75 .g-first, .g-unit .g-tpl-75 .g-first, .g-unit .g-unit .g-tpl-75 .g-first, .g-unit .g-unit .g-unit .g-tpl-75 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-75 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75 .g-first {
	display: block;
	margin: 0;
	width: 75px;
	float: left
}

.g-tpl-75-alt .g-unit, .g-unit .g-tpl-75-alt .g-unit, .g-unit .g-unit .g-tpl-75-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-75-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-75-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75-alt .g-unit {
	display: block;
	margin: 0 75px 0 0;
	width: auto;
	float: none
}

.g-tpl-75-alt .g-first, .g-unit .g-tpl-75-alt .g-first, .g-unit .g-unit .g-tpl-75-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-75-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-75-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-75-alt .g-first {
	display: block;
	margin: 0;
	width: 75px;
	float: right
}

.g-tpl-130 .g-unit, .g-unit .g-tpl-130 .g-unit, .g-unit .g-unit .g-tpl-130 .g-unit, .g-unit .g-unit .g-unit .g-tpl-130 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-130 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-130 .g-unit {
	display: block;
	margin: 0 0 0 130px;
	width: auto;
	float: none
}

.g-tpl-130 .g-first, .g-unit .g-tpl-130 .g-first, .g-unit .g-unit .g-tpl-130 .g-first, .g-unit .g-unit .g-unit .g-tpl-130 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-130 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-130 .g-first {
	display: block;
	margin: 0;
	width: 130px;
	float: left
}

.g-tpl-130-alt .g-unit, .g-unit .g-tpl-130-alt .g-unit, .g-unit .g-unit .g-tpl-130-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-130-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-130-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-130-alt .g-unit {
	display: block;
	margin: 0 130px 0 0;
	width: auto;
	float: none
}

.g-tpl-130-alt .g-first, .g-unit .g-tpl-130-alt .g-first, .g-unit .g-unit .g-tpl-130-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-130-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-130-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-130-alt .g-first {
	display: block;
	margin: 0;
	width: 130px;
	float: right
}

.g-tpl-160 .g-unit, .g-unit .g-tpl-160 .g-unit, .g-unit .g-unit .g-tpl-160 .g-unit, .g-unit .g-unit .g-unit .g-tpl-160 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-160 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-160 .g-unit {
	display: block;
	margin: 0 0 0 160px;
	width: auto;
	float: none
}

.g-tpl-160 .g-first, .g-unit .g-tpl-160 .g-first, .g-unit .g-unit .g-tpl-160 .g-first, .g-unit .g-unit .g-unit .g-tpl-160 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-160 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-160 .g-first {
	display: block;
	margin: 0;
	width: 160px;
	float: left
}

.g-tpl-160-alt .g-unit, .g-unit .g-tpl-160-alt .g-unit, .g-unit .g-unit .g-tpl-160-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-160-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-160-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-160-alt .g-unit {
	display: block;
	margin: 0 160px 0 0;
	width: auto;
	float: none
}

.g-tpl-160-alt .g-first, .g-unit .g-tpl-160-alt .g-first, .g-unit .g-unit .g-tpl-160-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-160-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-160-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-160-alt .g-first {
	display: block;
	margin: 0;
	width: 160px;
	float: right
}

.g-tpl-180 .g-unit, .g-unit .g-tpl-180 .g-unit, .g-unit .g-unit .g-tpl-180 .g-unit, .g-unit .g-unit .g-unit .g-tpl-180 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-180 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-180 .g-unit {
	display: block;
	margin: 0 0 0 180px;
	width: auto;
	float: none
}

.g-tpl-180 .g-first, .g-unit .g-tpl-180 .g-first, .g-unit .g-unit .g-tpl-180 .g-first, .g-unit .g-unit .g-unit .g-tpl-180 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-180 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-180 .g-first {
	display: block;
	margin: 0;
	width: 180px;
	float: left
}

.g-tpl-180-alt .g-unit, .g-unit .g-tpl-180-alt .g-unit, .g-unit .g-unit .g-tpl-180-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-180-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-180-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-180-alt .g-unit {
	display: block;
	margin: 0 180px 0 0;
	width: auto;
	float: none
}

.g-tpl-180-alt .g-first, .g-unit .g-tpl-180-alt .g-first, .g-unit .g-unit .g-tpl-180-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-180-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-180-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-180-alt .g-first {
	display: block;
	margin: 0;
	width: 180px;
	float: right
}

.g-tpl-200 .g-unit, .g-unit .g-tpl-200 .g-unit, .g-unit .g-unit .g-tpl-200 .g-unit, .g-unit .g-unit .g-unit .g-tpl-200 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-200 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-200 .g-unit {
	display: block;
	margin: 0 0 0 200px;
	width: auto;
	float: none
}

.g-tpl-200 .g-first, .g-unit .g-tpl-200 .g-first, .g-unit .g-unit .g-tpl-200 .g-first, .g-unit .g-unit .g-unit .g-tpl-200 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-200 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-200 .g-first {
	display: block;
	margin: 0;
	width: 200px;
	float: left
}

.g-tpl-200-alt .g-unit, .g-unit .g-tpl-200-alt .g-unit, .g-unit .g-unit .g-tpl-200-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-200-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-200-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-200-alt .g-unit {
	display: block;
	margin: 0 200px 0 0;
	width: auto;
	float: none
}

.g-tpl-200-alt .g-first, .g-unit .g-tpl-200-alt .g-first, .g-unit .g-unit .g-tpl-200-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-200-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-200-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-200-alt .g-first {
	display: block;
	margin: 0;
	width: 200px;
	float: right
}

.g-tpl-225 .g-unit, .g-unit .g-tpl-225 .g-unit, .g-unit .g-unit .g-tpl-225 .g-unit, .g-unit .g-unit .g-unit .g-tpl-225 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-225 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-225 .g-unit {
	display: block;
	margin: 0 0 0 225px;
	width: auto;
	float: none
}

.g-tpl-225 .g-first, .g-unit .g-tpl-225 .g-first, .g-unit .g-unit .g-tpl-225 .g-first, .g-unit .g-unit .g-unit .g-tpl-225 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-225 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-225 .g-first {
	display: block;
	margin: 0;
	width: 225px;
	float: left
}

.g-tpl-225-alt .g-unit, .g-unit .g-tpl-225-alt .g-unit, .g-unit .g-unit .g-tpl-225-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-225-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-225-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-225-alt .g-unit {
	display: block;
	margin: 0 225px 0 0;
	width: auto;
	float: none
}

.g-tpl-225-alt .g-first, .g-unit .g-tpl-225-alt .g-first, .g-unit .g-unit .g-tpl-225-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-225-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-225-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-225-alt .g-first {
	display: block;
	margin: 0;
	width: 225px;
	float: right
}

.g-tpl-250 .g-unit, .g-unit .g-tpl-250 .g-unit, .g-unit .g-unit .g-tpl-250 .g-unit, .g-unit .g-unit .g-unit .g-tpl-250 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-250 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-250 .g-unit {
	display: block;
	margin: 0 0 0 250px;
	width: auto;
	float: none
}

.g-tpl-250 .g-first, .g-unit .g-tpl-250 .g-first, .g-unit .g-unit .g-tpl-250 .g-first, .g-unit .g-unit .g-unit .g-tpl-250 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-250 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-250 .g-first {
	display: block;
	margin: 0;
	width: 250px;
	float: left
}

.g-tpl-250-alt .g-unit, .g-unit .g-tpl-250-alt .g-unit, .g-unit .g-unit .g-tpl-250-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-250-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-250-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-250-alt .g-unit {
	display: block;
	margin: 0 250px 0 0;
	width: auto;
	float: none
}

.g-tpl-250-alt .g-first, .g-unit .g-tpl-250-alt .g-first, .g-unit .g-unit .g-tpl-250-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-250-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-250-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-250-alt .g-first {
	display: block;
	margin: 0;
	width: 250px;
	float: right
}

.g-tpl-300 .g-unit, .g-unit .g-tpl-300 .g-unit, .g-unit .g-unit .g-tpl-300 .g-unit, .g-unit .g-unit .g-unit .g-tpl-300 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-300 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-300 .g-unit {
	display: block;
	margin: 0 0 0 300px;
	width: auto;
	float: none
}

.g-tpl-300 .g-first, .g-unit .g-tpl-300 .g-first, .g-unit .g-unit .g-tpl-300 .g-first, .g-unit .g-unit .g-unit .g-tpl-300 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-300 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-300 .g-first {
	display: block;
	margin: 0;
	width: 300px;
	float: left
}

.g-tpl-300-alt .g-unit, .g-unit .g-tpl-300-alt .g-unit, .g-unit .g-unit .g-tpl-300-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-300-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-300-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-300-alt .g-unit {
	display: block;
	margin: 0 300px 0 0;
	width: auto;
	float: none
}

.g-tpl-300-alt .g-first, .g-unit .g-tpl-300-alt .g-first, .g-unit .g-unit .g-tpl-300-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-300-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-300-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-300-alt .g-first {
	display: block;
	margin: 0;
	width: 300px;
	float: right
}

.g-tpl-320 .g-unit, .g-unit .g-tpl-320 .g-unit, .g-unit .g-unit .g-tpl-320 .g-unit, .g-unit .g-unit .g-unit .g-tpl-320 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-320 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-320 .g-unit {
	display: block;
	margin: 0 0 0 320px;
	width: auto;
	float: none
}

.g-tpl-320 .g-first, .g-unit .g-tpl-320 .g-first, .g-unit .g-unit .g-tpl-320 .g-first, .g-unit .g-unit .g-unit .g-tpl-320 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-320 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-320 .g-first {
	display: block;
	margin: 0;
	width: 320px;
	float: left
}

.g-tpl-320-alt .g-unit, .g-unit .g-tpl-320-alt .g-unit, .g-unit .g-unit .g-tpl-320-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-320-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-320-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-320-alt .g-unit {
	display: block;
	margin: 0 320px 0 0;
	width: auto;
	float: none
}

.g-tpl-320-alt .g-first, .g-unit .g-tpl-320-alt .g-first, .g-unit .g-unit .g-tpl-320-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-320-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-320-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-320-alt .g-first {
	display: block;
	margin: 0;
	width: 320px;
	float: right
}

.g-tpl-350 .g-unit, .g-unit .g-tpl-350 .g-unit, .g-unit .g-unit .g-tpl-350 .g-unit, .g-unit .g-unit .g-unit .g-tpl-350 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-350 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-350 .g-unit {
	display: block;
	margin: 0 0 0 350px;
	width: auto;
	float: none
}

.g-tpl-350 .g-first, .g-unit .g-tpl-350 .g-first, .g-unit .g-unit .g-tpl-350 .g-first, .g-unit .g-unit .g-unit .g-tpl-350 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-350 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-350 .g-first {
	display: block;
	margin: 0;
	width: 350px;
	float: left
}

.g-tpl-350-alt .g-unit, .g-unit .g-tpl-350-alt .g-unit, .g-unit .g-unit .g-tpl-350-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-350-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-350-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-350-alt .g-unit {
	display: block;
	margin: 0 350px 0 0;
	width: auto;
	float: none
}

.g-tpl-350-alt .g-first, .g-unit .g-tpl-350-alt .g-first, .g-unit .g-unit .g-tpl-350-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-350-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-350-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-350-alt .g-first {
	display: block;
	margin: 0;
	width: 350px;
	float: right
}

.g-tpl-400 .g-unit, .g-unit .g-tpl-400 .g-unit, .g-unit .g-unit .g-tpl-400 .g-unit, .g-unit .g-unit .g-unit .g-tpl-400 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-400 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-400 .g-unit {
	display: block;
	margin: 0 0 0 400px;
	width: auto;
	float: none
}

.g-tpl-400 .g-first, .g-unit .g-tpl-400 .g-first, .g-unit .g-unit .g-tpl-400 .g-first, .g-unit .g-unit .g-unit .g-tpl-400 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-400 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-400 .g-first {
	display: block;
	margin: 0;
	width: 400px;
	float: left
}

.g-tpl-400-alt .g-unit, .g-unit .g-tpl-400-alt .g-unit, .g-unit .g-unit .g-tpl-400-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-400-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-400-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-400-alt .g-unit {
	display: block;
	margin: 0 400px 0 0;
	width: auto;
	float: none
}

.g-tpl-400-alt .g-first, .g-unit .g-tpl-400-alt .g-first, .g-unit .g-unit .g-tpl-400-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-400-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-400-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-400-alt .g-first {
	display: block;
	margin: 0;
	width: 400px;
	float: right
}

.g-tpl-25-75 .g-unit, .g-unit .g-tpl-25-75 .g-unit, .g-unit .g-unit .g-tpl-25-75 .g-unit, .g-unit .g-unit .g-unit .g-tpl-25-75 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75 .g-unit {
	width: 74.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-25-75 .g-first, .g-unit .g-tpl-25-75 .g-first, .g-unit .g-unit .g-tpl-25-75 .g-first, .g-unit .g-unit .g-unit .g-tpl-25-75 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75 .g-first {
	width: 24.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-25-75-alt .g-unit, .g-unit .g-tpl-25-75-alt .g-unit, .g-unit .g-unit .g-tpl-25-75-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-unit {
	width: 24.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-25-75-alt .g-first, .g-unit .g-tpl-25-75-alt .g-first, .g-unit .g-unit .g-tpl-25-75-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-25-75-alt .g-first {
	width: 74.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-33-67 .g-unit, .g-unit .g-tpl-33-67 .g-unit, .g-unit .g-unit .g-tpl-33-67 .g-unit, .g-unit .g-unit .g-unit .g-tpl-33-67 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67 .g-unit {
	width: 66.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-33-67 .g-first, .g-unit .g-tpl-33-67 .g-first, .g-unit .g-unit .g-tpl-33-67 .g-first, .g-unit .g-unit .g-unit .g-tpl-33-67 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67 .g-first {
	width: 32.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-33-67-alt .g-unit, .g-unit .g-tpl-33-67-alt .g-unit, .g-unit .g-unit .g-tpl-33-67-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-unit {
	width: 32.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-33-67-alt .g-first, .g-unit .g-tpl-33-67-alt .g-first, .g-unit .g-unit .g-tpl-33-67-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-33-67-alt .g-first {
	width: 66.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-67-33 .g-unit, .g-unit .g-tpl-67-33 .g-unit, .g-unit .g-unit .g-tpl-67-33 .g-unit, .g-unit .g-unit .g-unit .g-tpl-67-33 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33 .g-unit {
	width: 32.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-67-33 .g-first, .g-unit .g-tpl-67-33 .g-first, .g-unit .g-unit .g-tpl-67-33 .g-first, .g-unit .g-unit .g-unit .g-tpl-67-33 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33 .g-first {
	width: 66.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-67-33-alt .g-unit, .g-unit .g-tpl-67-33-alt .g-unit, .g-unit .g-unit .g-tpl-67-33-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-unit {
	width: 66.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-67-33-alt .g-first, .g-unit .g-tpl-67-33-alt .g-first, .g-unit .g-unit .g-tpl-67-33-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-67-33-alt .g-first {
	width: 32.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-50-50 .g-unit, .g-unit .g-tpl-50-50 .g-unit, .g-unit .g-unit .g-tpl-50-50 .g-unit, .g-unit .g-unit .g-unit .g-tpl-50-50 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50 .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50 .g-unit {
	width: 49.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-50-50 .g-first, .g-unit .g-tpl-50-50 .g-first, .g-unit .g-unit .g-tpl-50-50 .g-first, .g-unit .g-unit .g-unit .g-tpl-50-50 .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50 .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50 .g-first {
	width: 49.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-50-50-alt .g-unit, .g-unit .g-tpl-50-50-alt .g-unit, .g-unit .g-unit .g-tpl-50-50-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-unit {
	width: 49.999%;
	float: left;
	display: inline;
	margin: 0
}

.g-tpl-50-50-alt .g-first, .g-unit .g-tpl-50-50-alt .g-first, .g-unit .g-unit .g-tpl-50-50-alt .g-first, .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-first, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-50-50-alt .g-first {
	width: 49.999%;
	float: right;
	display: inline;
	margin: 0
}

.g-tpl-nest .g-unit, .g-unit .g-tpl-nest .g-unit, .g-unit .g-unit .g-tpl-nest .g-unit, .g-unit .g-unit .g-unit .g-tpl-nest .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-nest .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-nest .g-unit {
	float: left;
	width: auto;
	display: inline;
	margin: 0
}

.g-tpl-nest-alt .g-unit, .g-unit .g-tpl-nest-alt .g-unit, .g-unit .g-unit .g-tpl-nest-alt .g-unit, .g-unit .g-unit .g-unit .g-tpl-nest-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-tpl-nest-alt .g-unit, .g-unit .g-unit .g-unit .g-unit .g-unit .g-tpl-nest-alt .g-unit {
	float: right;
	width: auto;
	display: inline;
	margin: 0
}

.breadcrumbs {
	font-size: .85em
}

.nav ul {
	margin: 0 1em 0 0;
	list-style: none outside
}

.nav ul li {
	margin: 0 0 1em;
	font-weight: bold
}

.nav ul li ul {
	margin: 1em 0 0 1em
}

.nav ul li a {
	font-weight: normal
}

/* @group Footer Style */

.standard .footer {
	border-top: 1px solid #ccc;
	margin: 1.3em 0 0;
	padding: .5em 0 0
}

.standard .footer.side {
	text-align: left
}

/* @end */

#content {
	float: left;
	width: 100%;
	padding: 0px;
}

#main_left_col {
	//padding-left:25px !important;
	float: left;
	width: 730px;
	padding-left:0px;
}

#main_right_col {
	float: right;
	width:  214px;
	border-left: 0px solid #edeeec;
	border-bottom: 0px solid #eaebe9;
}

.content_header {
	padding-top:0px;
	padding-right: 30px;
	padding-bottom: 20px;
	text-align:justify;
	max-width: 800px;
	margin-left: 35px;
}

ul li { line-height:160%;}
body.mailing ul li { list-style:none !important; }
body .content_header ul li { line-height:160%;list-style:disc !important }
body.crowdfunding ul li {  list-style:none !important; }
.content_header_pic {
	float: left;
}

.content_header_intro_text {
	font-size: 34px;
	color:#777;
	padding-top:10px;
	font-weight: normal;
	font-family: var(--font-family-text),OpenSansLight;
	text-align: left;
	height: auto;
	vertical-align: middle;
}

.content_header_subtitle_text {
	font-weight: normal;
	padding-top: 15px;
	padding-bottom: 15px;
}

.content_header_body_text {
	float: left;
	padding-bottom: 20px;
	text-align: justify;
	font-size: 15px;
}

.top_header_title {
	font-family:var(--font-family-text),OpenSans-light;	
	position:absolute;
	left:50%;
	margin-left:-472px;
	top:100px;
	z-index:2;
	letter-spacing:1px;
	width:580px;
	color:#fff;
	font-size: 23px;
}

.top_header_title_shd {
	font-family:var(--font-family-text),OpenSans;
	position:absolute;
	left:50%;
	margin-left:-473px;
	top:102px;
	z-index:1;
	width:580px;
	color:#0761a7;
	font-size: 23px;
}

.config_email_text1 {
        font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
        font-size: 13px;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
}   
.config_email_back {
        font-size: 11px;
        font-family: var(--font-family-text), Verdana, Geneva, sans-serif;
}
.config_email_text2 {
        font-family: var(--font-family-text), Verdana, Geneva, sans-serif;        font-size: 13px;
        font-weight: normal;}
.config_email_text3 {        font-family: var(--font-family-text),OpenSans, Helvetica, sans-serif;
        font-size: 13px;
        color: #000;
        text-align: justify;
        font-weight: normal;
        padding: 7px;
} 

.email_config_client_selector_container {
	text-align: center;
	margin: 20px 0px 20px 0px;
	float: left;
	clear: none;
}

.email_config_client_selector_box {
	margin: 5px;
	height: 90px;
	width:  auto;
	padding-top: 15px;
	padding-left: 12px;
	padding-right: 12px;
	padding-bottom: 15px;
	border: 1px solid #8acbfb;
	border-radius: 4px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	float: left;
}

.email_config_client_selector_box.hover {
	border: 1px solid #84c4f4;
	background-color: #cde9fd;
}

.email_config_ol {
}

.email_config_li {
	list-style-position: outside;
	list-style-type: square;
	color: #4b4b4b;
	font: 13px var(--font-family-text);
	margin-left: 15px;
	text-align: left;
}

.email_config_li_header {
	font-size: 15px;
	color: #0761a7;
}

.email_config_li_img {
	margin-top: 20px;
	margin-bottom: 10px;
}

.email_config_recomendations {
	background-color: #eeeeee;
	padding: 15px;
	margin-top: 20px;
	margin-bottom: 20px;
	width: auto;
	border: thin solid #e4e4e4;
	text-align: justify;
}

.contact_us {
	float: left;
	clear: both;
}

.providers_logos_container {
	width: 100%;
	margin: 0px;
	text-align: center;
	padding-top: 3px;
	padding-bottom:3px;
}

.providers_logos_container ol {
	text-align: center;
	list-style: none;
}
.providers_logos_container li {
	margin: 0 10px 0 0;
	display: inline;
}

.domains_register_table {
	font: 13px var(--font-family-text);
	text-align: left;
	width: 90%;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 10px;
	padding: 5px;
}

.domains_register_table .field_data {
	width: 200px;
	background-color: #daf1fd;
}

ul.pureCssMenu, ul.pureCssMenu ul {
	padding:0px;
}
ul.pureCssMenu ul.pureCssMenum {
	margin:0px;padding:0px;
}
ul.pureCssMenu li {
	margin:0px;
}
ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
	border:0px;
}


ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
		text-align:center;
}

ul.pureCssMenu a.pureCssMenui0 { font-weight:normal; }
ul.pureCssMenu a {
        margin-top:0px;
        margin-bottom:0px;
        height:auto;
	font-weight:normal;
	font-family: var(--font-family-text),OpenSans,Helvetica, OpenSans, sans-serif;
        font-size:14px;
}
ul.pureCssMenu li.pureCssMenui a {
  margin: 0px;
  height: 28px;
  padding: 1rem 1rem 2rem 1rem;
  display: flex;
  align-items: center;
  gap: 8px;
}
ul.pureCssMenu li.pureCssMenui a div {
  margin-top: 0.5rem;
}

div.left_menu_bar ul.pureCssMenu.pureCssMenum {
		        padding-left:22px;
}

.triangle { position:relative;left:-10px;top:0px;display:none; justify-content:center; align-items:center; z-index: 1002;}

div.signupbar {background-color:#000}

div.left_menu_bar ul.pureCssMenu li.pureCssMenui0 {
	padding:7px 10px;
 	margin:0px 10px;
	position: relative;
	cursor: pointer;
        max-height: 38px;
}

div.left_menu_bar ul.pureCssMenu li.pureCssMenui0 a {
	cursor: pointer;
}

/* Regles per als submenús desplegables */
ul.submenu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background-color: #000;
	color: #fff;
	border-radius: 5px;
	padding: 10px 0;
	margin-top: 12px;
	z-index: 1001 !important;
	min-width: 250px;
	pointer-events: auto;
}

div.left_menu_bar ul.pureCssMenu li.pureCssMenui0:hover > ul.submenu {
	display: block !important;
	visibility: visible !important;
}

div.left_menu_bar ul.pureCssMenu li.pureCssMenui0:hover .triangle {
	display: flex !important;
}

ul.submenu .container_menu {
	display: block;
}

/* Assegurar que els enllaços del submenú són clicables */
ul.submenu li.pureCssMenui {
	pointer-events: auto;
	cursor: pointer;
}

ul.submenu li.pureCssMenui a {
	pointer-events: auto;
	cursor: pointer;
	color: #fff;
}

ul.pureCssMenu li.current, ul.pureCssMenu li.current {
        border-radius:5px;
}
ul.pureCssMenu li.current a.pureCssMenui0 { color:#000; border-bottom: 2px solid #000; }

.jfVal {
        position: absolute;
        z-index: 1110;
}
.jValSpacer {
        position: absolute;
        width: 0px;
        float: left;
}
.jValSpacercover {
        background: #eee url(../css/img_interficie/eeGrad2.gif) bottom repeat-x;
        border: 1px solid #ccc;
        border-right: 0px;
}
.jValSpacerpod {
        background: #f0f2f5 url(../css/img_interficie/f0f2f5grad.gif) bottom repeat-x;
        border: 1px solid #ccc;
        border-right: 0px;
}
.jValSpacerblank {
        height: 16px !important;
        opacity: 0.6;
}
.jfVal .icon {
        float: left;
}
.jfVal .iconcover {
        background: #eee url(../css/img_interficie/eeGrad2.gif) bottom repeat-x;
        border: 1px solid #ccc;
        border-width: 1px 0px;
        width: 20px;
        text-align: left;
}
.jfVal .iconpod {
        background: #f0f2f5 url(../css/img_interficie/f0f2f5grad.gif) bottom repeat-x;
        border: 1px solid #ccc;
        border-left: 0px;
        -moz-border-radius-topright: 3px;
        -moz-border-radius-bottomright: 3px;
        -webkit-border-top-right-radius: 3px;
        -webkit-border-bottom-right-radius: 3px;
        width: 20px;
        text-align: left;
}
.jfVal .iconblank {
        background: #fff;
        margin-top: -4px;
        height: 20px !important;
        padding-left: 5px;
}
.jfVal .icon .iconbg {
        background: url(../css/img_interficie/warning.gif) center left no-repeat;
        height: 100%;
        width: 16px;
}
.jfVal .content {
        color: blue;
        vertical-align: middle;
        white-space: nowrap;
        float: left;
        padding-right: 5px;
}
.jfVal .contentcover {
        background: #eee url(../css/img_interficie/eeGrad2.gif) bottom repeat-x;
        border: 1px solid #ccc;
        border-left: 0px;
        -moz-border-radius-topright: 3px;
        -moz-border-radius-bottomright: 3px;
        -webkit-border-top-right-radius: 3px;
        -webkit-border-bottom-right-radius: 3px;
}
.jfVal .messagepod {
        opacity: 0.8;
        background: #fff;
        padding: 2px 5px;
}
.jfVal .messageblank {
        background: #fff;
        padding: 2px 5px;
}
#form_blank input[type=text], #form_blank [jVal] {
        padding-top:3px;
}

.sliding_contact_form {
    height:auto;
    background-color: #e3effc;
    padding:20px;
	margin-left:25px; 
   margin-top:20px;
    padding-top: 20px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	border: 1px solid #8acbfb;
	background-color: #e3effc;
	border-radius: 4px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
 
.show_hide_contact_form {
    display:none;
	text-align: center;
/*	width: auto;
	margin-top: 30px;
	padding-top: 15px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 15px;
	border: 1px solid #8acbfb;
	background-color: #e3effc;
	border-radius: 4px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	font-weight: normal;
	font-size: 14px;
	color: #4f4f4f;*/
}

.show_hide_contact_form .td {
	padding: 5px;
}



input[type=text], input[type=alphanum], input[type=email] {
	background-color:#fff;
	padding:15px 10px;
	border-radius: 4px;
}
input[type=submit] {
	background-color:var(--accent-color);color:#fff;height: 33px;padding-bottom: 4px;cursor:pointer;cursor:hand;
	font-size:14px;
	padding-top: 4px;
}

input[type=submit] , input[type=reset] {
    cursor: pointer;
    cursor: hand;
    text-decoration: none;
    color: #FFFFFF !important;
    display: inline-block;
    padding: 0.5rem 2rem 0.5rem 0.5rem;
    margin: 0.5rem;
    text-align: left;
    text-transform: uppercase;
    width: auto;
    font-size: 12px;
    border-radius: 4px;
    height: 33px;
}

input[type=submit] {
    background: url("/css/img_interficie/bt-arrow.png") no-repeat scroll 95% center #1080c5;
}

input[type=reset] {
    background: url("/css/img_interficie/warning.gif") no-repeat scroll 95% center #68000091;
}



select { border-radius: 4px; }
button.show_hide_contact_form {
	border:0px;
	background:none;
	cursor:pointer;
	cursor:hand;
}

ul.contact-buttons {
	margin:0px;
}

ul.contact-buttons li a:hover {
	text-decoration:none;
}
ul.contact-buttons li a {
	display:block;
	width:258px;
	background-repeat:no-repeat;
}
ul.contact-buttons li.demo a {
height: 64px;
background-position: 0px 0px;
}


ul.contact-buttons li.contact a {
height: 30px;
background-position: 0px -64px;
}

ul.contact-buttons li.phone a {
height: 30px;
background-position: 0px -100px;
}
ul.features li {
	margin-bottom:10px;
}

.intergridbut {
display: block;
float: left;
padding: 0 0 15px 20px;
margin: 0;
background: url(/files/pictures/callto-left-01.png) 0 0 no-repeat;
border: 0;
}
.intergridbut button span {
display: block;
padding: 7px 15px 13px 15px;
margin: 0;
background: url(/files/pictures/callto-med-01.png) 0px 0px repeat-x;
border: 0;
}
.intergridbut button {
padding: 0 20px 0 0;
float: left;
margin: 0;
background: url(/files/pictures/callto-right-01.png) right 0 no-repeat;
border: 0;
cursor: pointer;
font-family: var(--font-family-text),OpenSans,Helvetica,sans-serif;
text-shadow: var(--accent-color) 0px 1px;
font-size: 18px;
color: #fff;
}
.intergridbut button:hover {
text-decoration:none;
}

li.node {
	margin-left:10px;
	height:80px;
	padding-left:60px;
	padding-top:10px;
	background-position:0px 0px;
	background-size:50px;
	background-repeat:no-repeat;
	width:250px;
	float:left;
	color:#444;
}

li.node2 {
        margin-left:10px;
        padding-left:60px;
        padding-top:10px;
        background-position:0px 0px;
        background-size:50px;
        background-repeat:no-repeat;
        float:left;
        color:#444;
}
.node2 b { font-size:19px;line-height:120%; }


li.node_crowfunding {
	margin-left: 20px;
	height: 15px;
	float: left;
	color: #444;
	list-style-type: disc;
	clear: left;
}

li.node b {
	font-size:15px;
	line-height:150%;
}

ul.mailing1 li.node {
        width:100%;
         height:100px;
	margin-left:5px;
}

ul.mailing li.node {
	width:350px;
	 height:100px;
}

#domain { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/domainname.png'); }
#mail { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/mail.png'); }
#plantilles { 	background-image:url('https://www.intergrid.cat/kms/css/aqua/big/styles.png'); }
#templates { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/ico_web_design.png');} 
#seo {         background-image:url('https://www.intergrid.cat/kms/css/aqua/big/search.png');  }
#multilang {        background-image:url('https://www.intergrid.cat/kms/css/aqua/big/success-icon.png'); }
#menus {        background-image:url('https://www.intergrid.cat/kms/css/aqua/big/registry.png'); }
#cloudhosting,#cloud-hosting {	background-image:url('https://www.intergrid.cat/kms/css/aqua/big/cloudspace.png'); }

#cloudcomputing { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/cloudspace.png'); background-position-y: 10px; }
#estandards {        background-image:url('https://www.intergrid.cat/kms/css/aqua/big/multi-browser-support.gif'); }
#mobils {        background-image:url('https://www.intergrid.cat/kms/css/aqua/big/smartphone-support.gif');}
#addons { 	background-image:url('https://www.intergrid.cat/kms/css/aqua/big/addons.png');}
#api	{       background-image:url('https://www.intergrid.cat/kms/css/aqua/img/big/API.png');}
#xarxes {        background-image:url('https://www.intergrid.cat/kms/css/aqua/big/signal.png');}
#analytics { 	background-image:url('https://www.intergrid.cat/kms/css/aqua/big/analytics2.png');}
#cms { 	background-image:url('https://www.intergrid.cat/kms/css/aqua/big/settings4.png');}
#backups { 	 background-image:url('https://www.intergrid.cat/kms/css/aqua/big/backups_big.png');}
#support {	background-image:url('https://www.intergrid.cat/kms/css/aqua/big/support.png');}
#updates { 	background-image:url('https://www.intergrid.cat/kms/css/aqua/big/updates.png'); }
#newsletters { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/mailings.png');}
#links { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/Sites.png');}
#users { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/extranetusers.png');}
#transfer { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/reports.png');}
#blogs {         background-image:url('https://www.intergrid.cat/kms/css/aqua/big/services_icon.png'); }
#galeries {        background-image:url('https://www.intergrid.cat/kms/css/aqua/big/pictures_galleries_big.png');  }
#media {         background-image:url('https://www.intergrid.cat/kms/css/aqua/big/media.png'); }
#forms {      background-image:url('https://www.intergrid.cat/kms/css/aqua/big/web_forms.png');}
#maps {        background-image:url('https://www.intergrid.cat/kms/css/aqua/big/gps.png');}
#calendar {   background-image:url('https://www.intergrid.cat/kms/css/aqua/big/calendar3.png');}
#guestbook {  background-image:url('https://www.intergrid.cat/kms/css/aqua/big/chat.png');}
#shop {      background-image:url('https://www.intergrid.cat/kms/css/aqua/big/ecommerce.png');}
#tpv {        background-image:url('https://www.intergrid.cat/kms/css/aqua/big/payment.png'); }
#downloads {  background-image:url('https://www.intergrid.cat/kms/css/aqua/big/download.png'); }
#catalogs {   background-image:url('https://www.intergrid.cat/kms/css/aqua/big/services.png'); }
#secure {     background-image:url('https://www.intergrid.cat/kms/css/aqua/big/lock.png'); }
#publishing {         background-image:url('https://www.intergrid.cat/kms/css/aqua/big/news.png');}
#sla {	background-image:url('https://www.intergrid.cat/kms/css/aqua/big/sla.png');}
#reservas { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/reservas.png');}
#quests { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/registry.png');}
#fasteasy { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/feature_quick.png');}
#segmentation { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/segmentation.png');}
#analytics2 {  background-image:url('https://www.intergrid.cat/kms/css/aqua/big/Statisticsok.png');}
#management { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/settings4.png');}
#website { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/sites.png');}
#lopd { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/lock.png');}
#importexport { background-image:url('https://www.intergrid.cat/kms/css/aqua/big/import-export.gif');}
#variables {  background-image:url('https://www.intergrid.cat/kms/css/aqua/big/custom.png');}


table.tarifes {
	border-collapse:collapse;
	border:1px solid #ccc;
	border-spacing: 0;
	font-size:13px;
	color:#444;
	background-image: -webkit-linear-gradient(left, #ffffff 0%, #ECF1F6 300px, #f6fDf6 345px, #ECF1F6 348px, #d6dAff 447px, #ECF1F6 448px, #f0f7f6 564px,#ECF1F6 565px,#d6dAff 100%);
	font-family: var(--font-family-text), "Trebuchet MS", Verdana, sans-serif;
}
table.tarifes td {
	border:1px solid #ccc;
	text-align:center;
	padding:5px;
}
table.tarifes td.tarifa_feature {
        background-position:10px 5px;
        background-size:20px;
        background-repeat:no-repeat;
        width:246px;
}

table.tarifes tr.head td {
	height:80px;
	text-align:top;
}

table.tarifes td.tarifa_feature {
	padding-left:40px;
	text-align:left;
	font-weight:bold;
}
ul.features table b.destacat {
	font-size:15px;
	line-height:150%;
}

ul.features table {
	margin-bottom:15px;
}

#plan1 { width:110px; padding:0px; border:0px}
#plan2 { width:110px; padding:0px;  border:0px}
#plan3 { width:127px; padding:0px;  border:0px}
#plan4 { width:126px; padding:0px;  border:0px}

.plan {
	font-size:14px;
	padding-bottom:10px;
}

.price {
	font-size:33px;
	letter-spacing:-2px;
	padding-bottom:5px;
}
.price2 {
	font-size:13px;
}
.category {
	background-image: -webkit-linear-gradient(top, #0066cc 0%, #194270 100%);
	color:#fff;
	font-weight:bold;
	height:20px;
	padding:5px;
	border:1px solid #06c;
        text-align:left;
}

div.htip {
        background-image: url('/kms/css/aqua/img/small/help_on.gif');
        background-repeat:no-repeat;
        width: 17px;
        height: 17px;
        margin: 2px;
        cursor: pointer;
        float: right;
        padding-right:5px;
	padding-top:0px;
	padding-bottom:0px;
}
td.YES div {
        background-image:url('/kms/css/aqua/img/small/check2.gif');
        width:17px;
        height:17px;
	margin:auto;
}
td.NO div {
        background-image:url('/kms/css/aqua/img/small/remove_fav.png');
        width:17px;
        height:17px;
        margin:auto;
}

tr.category td {
	padding:5px;
	border:0px solid #0066cc;
        text-align:left;
	padding-left:15px;
}

.message_box {
   display: none;
   margin: 0 0 13px 0;
   padding: 13px 13px 13px 13px;
   background: url('/css/img_interficie/icon_check.png') left no-repeat #DFF0D8;
   background-position: 13px 13px;
   border: solid 1px #DFF0D8;
}

#form_div {
   font-size:13px;   
}

table#domain_data .domain {
font-weight:bold;
background-color:#faebb0;
}

table#domain_data input.form_input {
height: 20px;
padding: 0px;
margin: 0px;
}
div#bottom_legal { width:100%; }

span.price_legend {
padding-right: 30px;
color: #fff;
font-size: 11px;
}

div.alta_client_form {
margin-top: 20px;
margin-left:0px;
margin-right: 40px;
text-align: justify;
}

a.bestbut,a.bestbut:hover {
    cursor:pointer;
    cursor:hand;
    text-decoration:none;
    background-color: var(--accent-color);
    background: url("/css/img_interficie/bt-arrow.png") no-repeat scroll 95% center var(--accent-color);
    color: #FFFFFF !important;
    display: inline-block;
    margin-right: -10px;
    padding: 10px 33px 10px 10px;
    text-align: left;
    text-transform: uppercase;
    width:auto;
    font-size: 12px;
    border-radius: 4px;
}

a.bestbut:hover {
	background-color: var(--accent-color);
}
a.bestbut.small {
	background-position-x:85%;
}
div#prefoot div, div#footer div#footer_content { margin:auto; width:100%;}
div#prefoot { padding-top:11px;padding-bottom:15px;margin-bottom:0px;background-color:#eee; }
div.providers_logos_container { background-color:#f1f1f1; padding:40px 0px 20px 0px;}

body.customers { background:#fff;}
body.config_email .g-doc { font-size:14px; }
div.ent-first-horiz { font-size:13px;padding-right:20px;max-width:600px}
div.ent-first-horiz img { width:50px; }
/* REMOVED - div#topinfo now inside containertopbar with relative positioning */

div.info_block {
/* background-color: #fff; */
padding:9px 13px;
/* -webkit-border-radius: 5px; */
-moz-border-radius: 5px;
/* border-radius: 5px; */
float:left;
}

/* Override float and background for btn-cta to prevent interference */
div.info_block.btn-cta {
  float: none !important;
  background-color: transparent !important;
}

/* Hide client access button on small screens */
@media (max-width: 849px) {
  div.info_block.btn-cta {
    display: none !important;
  }
}
div.info_block { color:#565656; }

/* Legacy .login styles - REMOVED, now using .btn-cta */


div#topinfo a:hover { text-decoration: none; }
div#topinfo .new_customer {
        background-color: var(--accent-color);
}
div#topinfo .new_customer a, div#info .new_customer a:visited { color:#fff; }

div.info_block.language { cursor:pointer;cursor:hand; min-width:125px; text-align:right}
a.underline { text-decoration:underline; }
table.limits tr.group td { padding-top:8px; padding-bottom:8px; }
div.left_menu_bar ul li ul li  a:hover  {
	font-weight:bold;
}


body.whois div#main_right_col,body.new_customer div#main_right_col,body.domain_reg div#main_right_col,body.legal_notes div#main_right_col,body.status div#main_right_col,body.kms div#main_right_col,body.email-hosting div#main_right_col,body.control_panel div#main_right_col,body.main  div#main_right_col,body.suport div#main_right_col,body.config_email div#main_right_col,body.serv_remot div#main_right_col,body.domains div#main_right_col,body.cloud-hosting div#main_right_col,body.hosting_products div#main_right_col,body.hosting div#main_right_col,body.dedicated-servers div#main_right_col,body.vps div#main_right_col,body.customers div#main_right_col,body.mailing div#main_right_col { display:none;}
body.domain_reg  div#prefoot {  display:none;}

div.inner-block.padded p { font-size:13px; }
div#infotext { font-size:15px; line-height:160%;color:#333;} 
body.sites div#main_left_col { width:760px; }
body.aboutus div#main_left_col { width:700px;font-size:14px }
div#main_left_col { width:100%; }

table#customers td { padding-right:20px;}
td.note { font-size:10px; }
button {  outline: none; }
table.limits { cursor:pointer;cursor:hand; }
ul#models li { list-style-type: circle; }
input.queryinput { width:300px; }
div.g-doc { padding:0px; }
/* ***************** mobile ****************************/
@media (max-width: 998px) {

 .feature .icon-container { padding: 11px 11px 0 11px; }
 .feature .text-container { padding: 11px 0 0 0; }
  .timeline-steps {
    flex-direction: column;
    align-items: flex-start;
    padding:20px 20px 20px 30px;
    width: 90%;
    max-width: 400px;
    margin:auto;
  }

  .line {
    display: none;
  }

  .step {
    width: 100%;
    justify-content: flex-start;
    white-space: normal;
    padding:10px 0px;
  }

  .label {
    font-size: 16px;
    line-height: 1.4;
  }

 .step:not(:last-of-type) .circle-char::after {
    content: "";
    position: inherit;
    width: 2px;
    height: 21px;
    border-left: 2px solid #ccc;
    border-left-color: rgb(204, 204, 204);
    border-left-color: rgb(204, 204, 204);
    margin-top: 41px;
    margin-left: -4px;
  }
 .step:not(:last-of-type) .n {
  padding-right:5px;
}
div#site-header , #rack { height:240px }

/* Header home responsive */
div#site-header.home-header {
  height: 400px !important;
}

div#site-header.home-header #rack {
  height: 400px !important;
}

div#site-header.home-header #title_box {
  top: 0%;
  padding: 0;
}

div#site-header.home-header #title h1 {
    font-size: 31px !important;
    font-weight:1000 !important;
    margin-bottom: 9px !important;
    line-height: 102%;
}

div#site-header.home-header #subtitle h2 {
  font-size: 16px !important;
  margin-bottom: 25px !important;
}

div#site-header.home-header #header-features {
  gap: 5px !important;
  flex-direction: row;
  align-items: flex-start;
  max-width: 100%;
}

div#site-header.home-header #header-features > div,
div#site-header.home-header .header-feature-item {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  text-align: left !important;
  width: 25%;
  gap: 8px;
  align-items: center;
}

div#site-header.home-header #header-features > div > div:first-child {
  width: 50px !important;
  height: 50px !important;
  margin: 0 !important;
  flex-shrink: 0;
}

div#site-header.home-header #header-features > div > div:first-child i {
  font-size: 20px !important;
}

div#site-header.home-header #header-features > div > div:last-child {
  font-size: 9px !important;
  text-align: center;
  margin: 0;
  text-transform: uppercase;
  line-height: 130%;
}

div#topinfo { display:block !important; }
/* 
oculta
div#shopping_cart { display:block !important; width:63px; padding: 3px 0px 5px 10px !important;position:absolute; top:0px; z-index:999; right: 52px } */
#site-header div#menu .left_menu_bar { display:none }
div#title {
padding-top:0px;
}
section div.maxwidth-shorter {
      width: calc(100% - 40px);
    }
.g-unit .g-section { width: calc(100% - 40px); padding:0px 20px 0px 20px; }
input,input.queryinput {    width: auto !important;}
/* div#totop { display:none !important; } */
a.bestbut { clear:left;margin:auto;display:inherit;position:relative;top:20px;}
.generic_product_tbl { font-size:11px; }
div.signupbar { display:none; }
div#solidaritat {display:none;}
table#domains_tbl td.product_name_header { width:auto !important; }
div.g-doc {padding-top:0px;padding-left:0px; }
body .custompad { padding:0px !important; }
.feature, .services-grid { padding:0px !important }
.feature { gap: 4px !important; }
.services-grid { grid-template-columns: 1fr; }
section#hosting .service-card { min-height: auto !important; }
section#apps .plan-price { width:100%;text-align:center }
img.icon {
  max-width: 25px !important;
  height: 25px !important;
}
div#page  .block {
  padding: 20px 10px 0px 10px !important;
}
div#dialog { width:88% !important;}
div#dialog div.inner-block.padded { height:auto !important; }
div#logo  { left:0px !important;top:-5px; }
div#logo img { margin-top:0px;margin-left:0px; }
div#title,div#subtitle { margin-left:20px; }
div#title h1 { font-size:28px;margin-left:10px;}
div#subtitle h2 { font-size:23px;margin-left:10px;}
div.info_block.contact { display:none; }
div#prefoot div, div#footer div#footer_content, .footer_legal,.left_menu_bar, div#title, .g-doc { width:100%; }
div#logo { float:left; padding-left: 5px !important } 
div#logo img { width:140px; }
div#logo .container_logo {padding-top:7px}
div#title_box { clear:left;margin:auto;width:100%; top:15px;}
div#title_box div { width:90%; }
#ent-masthead { background:none; }
div.left_menu_bar ul.pureCssMenu.pureCssMenum li { display:block; }
div#title h1 { margin-left:0px; font-size:38px;letter-spacing:0px }
div#subtitle h2 {    margin-left:0px; font-size:17px}

div.left_menu_bar { background-color:#1a1a1a; }
div.left_menu_bar li { float:none;clear:left; }
div.left_menu_bar table, .left_menu_bar ul, .left_menu_bar li, .left_menu_bar li a {    height: auto;}

div.left_menu_bar ul.pureCssMenu li.pureCssMenui0 {
    padding-left: 8px;
    padding-right: 8px;
    height: 26px;
}
ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
    padding-bottom: 0px;
    padding-top: 7px;
    text-align: left;
}

.content_header { padding:0px; }
div#main_left_col, div#main_right_col { clear:both; width:100%;padding-left:0px !important; }
div.ent-first-horiz { width:100% !important;max-width:100%;clear:both;}
div.g-unit { clear:both;width:100% !important; }
div.right_menu_bar { display:none; top:10px; }
div.ent-first-horiz img {height:20px;width:auto;margin:0px 10px 0px 0px !important;top:0px;left:0px;padding:0px }
div#footer_content div.g-unit div { padding-left:20px; }

form#checkDomain td { border-radius:0px !important; }
#bbtds { margin-bottom:40px; }
/* totop */
#totop a {
width: 50px;
height: 35px;
padding-top:15px;
display: block;
outline: none;
color: #FFF;
background-color: #999;
border: 1px solid #dddddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
text-align: center;
font-size: 18px;
line-height: 46px;
}
#totop {
position: fixed;
width: 50px;
height: 50px;
bottom: 106px;
right: 40px;
}
.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
transform: translate(0, 0);
}
#totop a:hover {
background-color: var(--accent-color);
border: 1px solid var(--accent-color);
}
div#footer_content b { font-size:14px;color:#eee; }
.butt { background-color: var(--accent-color) !important;
color: #fff;
height: 33px;
padding-bottom: 4px;
cursor: pointer;
cursor: hand;
font-size: 14px;
padding-top: 4px;
}

div.ui-dialog { z-index:99999999 !important; }
label.promo { color:#000;background-color:#a1ffc2;font-size:9px;border-radius:5px;padding:4px 10px;margin-left:10px; }
.sites-banner, .crowdfunding-image { width:100%; max-width:100%;}


}

@media (max-width:500px) {
/* div#topinfo .info_block { display:none; } */
body.main #rack.bg-image, body.cloud-hosting #rack.bg-image, body.hosting #rack.bg-image, body.status #rack.bg-image, body.kms-sites #rack.bg-image {
  background-position: -141px 0px !important;
}
div#topinfo div.language { display:none; }
section#clients input[type="text"], section#clients input[type="password"]  { width:100% !important;padding:22px 25px;}
.service-card {
  min-height: auto;
}
body.sign-up input[type="text"], body.sign-up input[type="password"],body.sign-up input[type="email"] { width:100% !important; border:1px solid #999 }
body.main .container { padding:2rem 0 !important;}

section h2 {
  font-size: 1.6rem !important;
}
h3 { font-size:20px; } 
h3 br { display:none; }
div#title_box { clear:left;margin:auto 20px;width:100%; top:20px;}
div#title_box div { width:100%; }
section div.maxwidth-shorter { padding:0px 10px; width:calc(100% - 10px) }
section#registre { margin-top: 0px !important; }
section#registre div.maxwidth-shorter { padding:50px 10px 0px 10px; width:100%; }
#site-header { margin-top:0px;  }
body.main .g-doc  { padding:0px !important; }
button#searchAlt { margin-top:10px; }
.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

section#registre.notch::before {
  top: -30px !important;
  width: 90% !important;
  height: 10px !important;
}
.container {
    flex-direction: column;
    padding: 10px;
  }

.left-column img.main-img {
  margin-bottom: 0 !important;
}

body.kms div.block_text { width: calc(100% - 150px) !important; }
crowdfunding-image { width:100%; max-width:100%;}
.sites-section { padding:30px 0px;}
.sites-banner { width:80%; max-width:80%;margin:auto;padding:30px 20px}
.show_hide_contact_form { display:block !important;margin:auto }
.nopadmob { margin:auto !important;padding:0 !important }
.contact_form_button { margin:auto !important; }
ul.mailing,ul.mailing1 { margin:0 }
table#form { padding:0px !important; }
table#form input { max-width: 60%; }
div.alta_client_form {
  margin: 0;
  margin-left: 20px;
  margin-right: 40px;
  font-size: 14px;
}
div.content_header { margin-left: 20px;
  margin-right: 40px;
  font-size: 14px;
}
body.domains div.content_header { margin:0px; }
.content_header { margin:auto; }
.generic_product_tbl {
  width: calc(100% - 20px);
margin: 40px auto;
}

td { display:table-cell; }
td.nomob { display:none; }

.block_text {
  font-size: 14px;
  text-align: justify;
  padding-top: 30px;
  padding-left: 13px;
  padding-right: 30px;
  float: left;
  line-height: 140%;
}
.footer_legal,.providers_logos_container {
  width: 56%;margin:0;
}
 .block_text { padding-left:25px; }
div#title_box {
margin:50px 15px 0px 15px;
    left: 0;
}
    .footer_legal, .providers_logos_container {
      width: 100% !important;
    line-height:150%;
	padding:30px !important;
      margin: 0;
    }
.g-c .servei { padding-bottom:20px; }
.g-c { padding-top:20px; }
   div#title {
      padding-top: 0px !important;
    }
 div#title h1 {
      font-size: 35px !important;
}
 div#subtitle h2 {
  padding:10px 10px 0px 0px;font-weight:normal !important;   font-size: 17px;
  }
.ent-first-horiz a { font-size:18px !important; line-height:200%; }
div.ent-first-horiz img {
    height: 30px;
}
 div#dialog { width:100% !important;}
.inner-block { width:90% !important; }
   div#title h1 {
    margin-left: 0px;
    font-size: 30px;
    letter-spacing: 0px;
  }
div#title_box div {
    width: 100%;
   margin-left:0px !important;
  }
div#title { padding-top:33px; }
}

body.clients div#page { min-height:600px !important; }

 #clients {
      padding: 0px 0px;
      font-family: var(--font-family-text);
      color: #333;
	
      /*  height: 100vh; */
    }
    #clients .container {
      display: flex;
      height: 500px;
    }
    #clients .half {
      flex: 1;
      padding: 60px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
    #clients .left {
      background: linear-gradient(135deg, var(--accent-color), var(--accent-color));
      color: white;
    }
    #clients .left h2, #clients .right h2 {
      display: flex;
      align-items: center;
      font-size: 28px;
      margin-bottom: 20px;
    }
    #clients .left h2::before {
      margin-right: 10px;
      font-size: 28px;
    }
    #clients .right h2::before {
      margin-right: 10px;
      font-size: 28px;
    }
    #clients input[type="text"], #clients input[type="password"] {
      width: 100%;
      padding: 12px 25px;
      border-radius: 30px;
      border: none;
      margin: 10px 0;
      font-size: 16px;
    }

    #clients .button {
      padding: 12px 24px;
      border-radius: 30px;
      background: var(--accent-color) !important;
      border: none;
      color: #000 !important;
      font-size: 16px;
      cursor: pointer;
      margin-top: 20px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
    }
    #clients .button:hover {
	background: var(--accent-color) !important;
	color:#fff !important;
  }
    #clients .left .button {
      background-color: #47c1a0;
    }
    #clients a {
      color: #fff;
      text-decoration: underline;
      font-size: 14px;
    }
    #clients .right a {
      color: #008060;
    }
    #clients .right {
      background-color: #ffffff;
      border: 1px solid #e0e0e0;
      margin-left: 20px;
}
    }

input::-webkit-input-placeholder {
  color: #999;
}

input::-moz-placeholder {
  color: #999;
  opacity: 1;
}

input:-ms-input-placeholder {
  color: #999;
}

input::placeholder {
  color: #999;
}
.icon_login { width:70px; padding-right:10px; }
.color { color:#15a7c8; }

@media screen and (max-width: 768px) {

.service-card.featured::before { content:none !important; }
  #clients .container {
    flex-direction: column;
    height: auto;
  }

  #clients .half {
    padding: 30px 20px;
  }


  #clients .left, 
  #clients .right {
    margin: 0 0 10px 0;
  }

  #clients h2 {
    font-size: 22px;
  }

  #clients input {
    font-size: 14px;
  }

  #clients .button {
    font-size: 15px;
    padding: 10px 20px;
  }
}

/* Signup CTA - Elegant and minimalist design */
.signup-cta {
    width: 100%;
    padding: 80px 20px 60px 20px;
    background: transparent;
    border-top: 1px solid rgba(12, 167, 205, 0.1);
}

.signup-cta-content {
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding: 40px 50px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(12, 167, 205, 0.08);
    border: 1px solid rgba(12, 167, 205, 0.08);
}

.signup-cta-content:hover {
    box-shadow: 0 8px 32px rgba(12, 167, 205, 0.12);
    transform: translateY(-2px);
}

.signup-text {
    flex: 1;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: #333;
    font-weight: 400;
}

.signup-button {
    flex-shrink: 0;
    display: inline-block;
    padding: 14px 32px;
    background: none !important;
    color: #15a7c8 !important;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 500;
    font-size: 16px;
    border: 2px solid #15a7c8;
}

.signup-button:hover {
    background: rgba(21, 167, 200, 0.05) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(21, 167, 200, 0.15);
    text-decoration: none;
}

@media screen and (max-width: 768px) {
    .signup-cta {
        padding: 40px 15px;
    }

    .signup-cta-content {
        flex-direction: column;
        text-align: center;
        padding: 30px 25px;
        gap: 20px;
    }

    .signup-text {
        font-size: 15px;
    }

    .signup-button {
        width: 100%;
        text-align: center;
        padding: 16px 24px;
    }
}

/* User menu dropdown styles */
.user-menu-block {
    position: relative;
    cursor: pointer;
}

.user-menu-block:hover {
    opacity: 0.85;
}

.user-menu-block b {
    display: inline-flex;
    align-items: center;
    padding: 5px 5px 5px 5px;
    font-size: 11px;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.1);
}

.user-menu-block.info_block {
    padding: 0;
}

.user-menu-block:hover b {
    background: rgba(255, 255, 255, 0.15);
}

.user-menu-block .fa-user-circle {
    font-size: 20px;
    color: #15a7c8;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.user-menu-block .fa-chevron-down {
    /* font-size: 10px; */
    /* position: absolute; */
    font-size: 8px;
    top: -3px;
    position: inherit;
    left: -3px;
}

.user-menu-block:hover .fa-chevron-down {
}
.user-menu-dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    background: #2c3e50;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3), 0 0 1px rgba(255, 255, 255, 0.1);
    z-index: 1000;
    min-width: 240px;
    overflow: hidden;
    animation: slideDown 0.3s ease;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.user-menu-dropdown::before {
    content: '';
    position: absolute;
    top: -8px;
    right: 20px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #2c3e50;
}


/* Fix user menu - remove transitions */
.user-menu-item {
    padding: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.user-menu-item a {
    display: flex;
    align-items: center;
    padding: 14px 18px;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.user-menu-item a i {
    margin-right: 12px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #fff;
}

.user-menu-item:hover {
    background: rgba(21, 167, 200, 0.15);
}

.user-menu-item:hover a {
    color: #15a7c8;
}

.user-menu-item:hover a i {
    color: #15a7c8;
}

/* Special styling for logout button */
.user-menu-item:last-child:hover {
    background: rgba(231, 76, 60, 0.15);
}

.user-menu-item:last-child:hover a {
    color: #e74c3c;
}

.user-menu-item:last-child:hover a i {
    color: #e74c3c;
}

/* Responsive design */
@media (max-width: 768px) {
    .user-menu-dropdown {
        min-width: 200px;
        right: -10px;
    }

    .user-menu-block b {
        font-size: 13px;
    }
}

/* Classes per eliminar estils inline */

/* Header styles */
#rack.bg-image {
  background-size: cover;
  background-position: auto;
}
body.main #rack.bg-image, body.cloud-hosting #rack.bg-image, body.hosting #rack.bg-image {
  background-position: 190px -120px;
}

body.status #rack.bg-image {
  background-position: 0px -120px;
}

body.kms-erp #rack.bg-image {
  background-position: 0px -620px;
}

body.kms-sites #rack.bg-image {
  background-position: 0px -200px;
}

body.mailing #rack.bg-image {
  background-position: 0px -520px;
}

#title.text-center {
    text-align: center;
}

#title h1.header-title {
    color: #fff !important;
    font-size: 48px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    text-align: center;
    margin: 0px auto 20px auto;
}

#title h1.header-title-simple {
    color: #fff;
}

#subtitle.text-left {
    text-align: center;
}

#subtitle h2.header-subtitle {
    font-size: 20px;
    /* font-weight: 300 !important; */
    font-weight: 500 !important;
    opacity: 0.95;
    max-width: 800px;
    margin: 0px auto 50px auto;
}

#header-features {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    flex-wrap: wrap;
    max-width: 800px;
    margin: 0 auto;
}

.header-feature-item {
    color: #fff;
}

.header-feature-icon {
    background: rgba(0, 0, 0, 0.15);
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
    backdrop-filter: blur(10px);
}

.header-feature-icon i {
    font-size: 35px;
}

.header-feature-text {
    /* font-weight: 100; */
    font-weight: 500;
    font-size: 15px;
}


/* Media query per a tablets i pantalles menors de 1000px */
@media (max-width: 999px) {
    #header-features {
        gap: 15px;
        max-width: 100%;
        padding: 0 10px;
        flex-wrap: nowrap !important;
    }
    
    .header-feature-item {
        flex: 1 1 auto;
        min-width: 0;
        text-align: center;
    }
    
    .header-feature-icon {
        width: 50px;
        height: 50px;
        margin: 0 auto 8px;
    }
    
    .header-feature-icon i {
        font-size: 22px;
    }
    
    .header-feature-text {
        font-size: 11px;
        line-height: 1.2;
    }
}

/* Media query per a mòbils menors de 768px */
@media (max-width: 768px) {
    #header-features {
        gap: 8px;
        padding: 0 5px;
        flex-wrap: nowrap !important;
    }
    
    .header-feature-icon {
        width: 40px;
        height: 40px;
        margin: 0 auto 5px;
    }
    
    .header-feature-icon i {
        font-size: 18px;
    }
    
    .header-feature-text {
        font-size: 9px;
        line-height: 1.1;
    }
}

/* Footer styles */
#footer_content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2rem;
    padding: 0 20px;
    max-width: 1000px;
    margin: auto;
}

.footer-col {
    flex: 1 1 180px;
}

.footer-col .g-c {
    text-align: left;
}

/* Menu styles */
.menu-item-uppercase {
    text-transform: uppercase;
}


ul.pureCssMenu li.pureCssMenui:last-child {
    border-bottom: none;
}

ul.pureCssMenu li.pureCssMenui:hover {
    background: rgba(0, 0, 0, 0.03);
}

ul.pureCssMenu li.pureCssMenui:hover a {
    color: #15a7c8 !important;
    font-weight: normal !important;
}

ul.pureCssMenu li.pureCssMenui:hover a i {
    color: #15a7c8 !important;
}

/* Separadors i estils hover per als submenús principals (similar al menú d'usuari) */
ul.pureCssMenu li.pureCssMenui {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

ul.pureCssMenu li.pureCssMenui:last-child {
    border-bottom: none;
}

ul.pureCssMenu li.pureCssMenui:hover {
    background: rgba(0, 0, 0, 0.03);
}

ul.pureCssMenu li.pureCssMenui:hover a {
    color: #15a7c8 !important;
    font-weight: normal !important;
}

ul.pureCssMenu li.pureCssMenui:hover a i {
    color: #15a7c8 !important;
}

/* Border-radius per l'últim element en hover */
ul.pureCssMenu li.pureCssMenui:last-child:hover {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

/* Header feature hover effect */
.header-feature-item:hover {
}

/* ============================================
   What is Hosting Section - Enhanced Design
   ============================================ */

/* Section container */
.what-is-hosting-section {
    padding: 60px 20px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 50%, #ffffff 100%);
}

/* Section title and subtitle */
.what-is-hosting-section .section-title {
    font-size: 2.2em;
    font-weight: 700;
    color: #1a202c;
    margin-bottom: 0.5rem;
    line-height: 1.3;
}

.what-is-hosting-section .section-subtitle {
    font-size: 1.1em;
    color: #64748b;
    margin-bottom: 4rem;
    font-weight: 400;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

/* Main content container */
.what-is-hosting-content {
    max-width: 900px;
    margin: 0 auto;
}

/* Info cards - modern card design */
.info-card {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    background: #ffffff;
    padding: 2rem;
    border-radius: 12px;
    margin-bottom: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    border: 1px solid #e5e7eb;
    transition: all 0.3s ease;
}

.info-card:hover {
    box-shadow: 0 8px 24px rgba(38, 167, 197, 0.12);
    transform: translateY(-2px);
    border-color: var(--accent-color);
}

/* Icon container */
.info-card-icon {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--accent-color) 0%, #3fc0b4 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(38, 167, 197, 0.3);
}

.info-card-icon i {
    font-size: 28px;
    color: #ffffff;
}

/* Info card content */
.info-card-content {
    text-align:left;
    flex: 1;
}

.info-card-content h3 {
    font-size: 1.5em;
    font-weight: 600;
    color: #1a202c;
    margin-bottom: 0.75rem;
    margin-top: 0;
}

.info-card-content p {
    font-size: 16px;
    line-height: 1.7;
    color: #4b5563;
    margin: 0;
}

/* Highlight card - special styling */
.info-card.highlight-card {
    background: linear-gradient(115deg, rgb(12, 170, 206) 0%, rgb(63, 192, 180) 100%);
    border: 2px solid var(--accent-color);
    color: #fff;
}

.info-card.highlight-card h3 {
    color: #fff;
}

.info-card.highlight-card p {
    color: #fff;
}

.info-card.highlight-card .info-card-icon {
    background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.3);
    color: #fff;
}

/* Benefits grid - responsive grid layout */
.hosting-benefits-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin: 2rem 0;
    background: #ffffff;
    border-radius: 12px;
}

.benefit-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
    background: #f9fafb;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.benefit-item:hover {
    background: #f0f9fb;
}

.benefit-item i {
    font-size: 24px;
    color: var(--accent-color);
    flex-shrink: 0;
    margin-top: 2px;
}

.benefit-item span {
    font-size: 15px;
    line-height: 1.6;
    color: #374151;
    font-weight: 400;
}

/* CTA container */
.cta-container {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-top: 3rem;
    padding-top: 2rem;
}

.cta-button {
    display: inline-flex !important;
    align-items: center;
    gap: 0.5rem;
    padding: 16px 40px !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-radius: 70px !important;
    border: 1.5px solid currentColor !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}

div.cta-button.center {
    display: block !important;
    text-align: center !important;
    margin: 3rem auto !important;
    padding: 0 !important;
}

div.cta-button.center button {
    border: none !important;
    display: inline-block !important;
    margin: 0 auto !important;
}

.cta-button:hover {
    transform: translateY(-2px);
    box-shadow: none !important;
}

.cta-button i {
    font-size: 14px;
    transition: transform 0.3s ease;
}

.cta-button:hover i {
    transform: translateY(3px);
}

/* ============================================
   Responsive Design - Mobile Optimization
   ============================================ */

@media (max-width: 768px) {
    .what-is-hosting-section {
        padding: 40px 15px !important;
    }
    
    .what-is-hosting-section .section-title {
        font-size: 1.75em;
    }
    
    .what-is-hosting-section .section-subtitle {
        font-size: 1em;
        margin-bottom: 2rem;
    }
    
    .info-card {
        flex-direction: column;
        gap: 1rem;
        padding: 1.5rem;
    }
    
    .info-card-icon {
        width: 50px;
        height: 50px;
    }
    
    .info-card-icon i {
        font-size: 24px;
    }
    
    .info-card-content h3 {
        font-size: 1.3em;
    }
    
    .hosting-benefits-grid {
        grid-template-columns: 1fr;
        gap: 0.75rem;
        padding: 1rem;
    }
    
    .benefit-item {
        padding: 0.75rem;
    }
    
    .benefit-item i {
        font-size: 20px;
    }
    
    .benefit-item span {
        font-size: 14px;
    }
    
    .cta-button {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {

div#title_box { margin:15px 15px 0px 15px !important; }
    .what-is-hosting-section .section-title {
        font-size: 1.5em;
    }
    
    .info-card {
        padding: 1.25rem;
    }
    
    .info-card-content h3 {
        font-size: 1.2em;
    }
    
    .info-card-content p {
        font-size: 15px;
    }
}

/* ============================================
   Accessibility Enhancements
   ============================================ */

/* Focus visible states for keyboard navigation */
.info-card:focus-within {
    outline: 3px solid var(--accent-color);
    outline-offset: 2px;
}

.benefit-item:focus-within {
    outline: 2px solid var(--accent-color);
    outline-offset: 1px;
}

.cta-button:focus {
    outline: 3px solid var(--accent-color);
    outline-offset: 3px;
}

/* Reduced motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
    .info-card,
    .benefit-item,
    .cta-button,
    .cta-button i {
        transition: none !important;
    }
    
    .info-card:hover,
    .benefit-item:hover,
    .cta-button:hover {
        transform: none !important;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .info-card {
        border: 2px solid #000;
    }
    
    .benefit-item {
        border: 1px solid #000;
    }
}

/* Print styles */
@media print {
    .what-is-hosting-section {
        background: white !important;
        padding: 20px !important;
    }
    
    .info-card,
    .benefit-item {
        box-shadow: none !important;
        border: 1px solid #000 !important;
    }
    
    .cta-button {
        display: none !important;
    }
}

/* Footer branding - Override providers_logos_container styles */
li.footer-branding {
    display: flex !important;
    align-items: center;
    gap: 20px;
    justify-content: center;
}

@media (max-width: 768px) {
    li.footer-branding {
        flex-direction: column !important;
        gap: 15px !important;
        align-items: center !important;
    }

    .footer-copyright {
        font-size: 11px !important;
        line-height: 1.5 !important;
        max-width: 90% !important;
        display: block !important;
    }

    .footer-logo {
        width: 110px !important;
    }
}

/* Print styles */
@media print {
    .what-is-hosting-section {
        background: white !important;
        padding: 20px !important;
    }
    
    .info-card,
    .benefit-item {
        box-shadow: none !important;
        border: 1px solid #000 !important;
    }
    
    .cta-button {
        display: none !important;
    }
}

/* Footer branding - Desktop and Mobile styles */
.footer-branding {
    display: flex !important;
    align-items: center;
    gap: 20px;
    justify-content: center;
}

.footer-logo {
    flex-shrink: 0;
}

.footer-copyright {
    color: #666;
    font-size: 14px;
}

@media (max-width: 768px) {
    .footer-branding {
        flex-direction: column !important;
        gap: 15px !important;
        align-items: center !important;
        text-align: center !important;
    }

    .footer-copyright {
        font-size: 11px !important;
        line-height: 1.5 !important;
        max-width: 90% !important;
        display: block !important;
    }

    .footer-logo {
        width: 110px !important;
    }
}

/* ============================================
   DARK/LIGHT MODE THEME TOGGLE & LANGUAGE PANEL
   ============================================ */

/* Theme & Language Panel Container */
.info_block.theme-language-panel {
    display: flex;
    align-items: center;
    gap: 0;
    background: var(--topbar-bg);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 5px 12px;
    cursor: pointer;
    position: relative;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.info_block.theme-language-panel:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Theme Toggle Button */
.theme-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.3s ease;
    padding: 4px 8px;
    border-radius: 6px;
}

[data-theme="dark"] .theme-toggle:hover i {
    color:#fff;
}

[data-theme="light-DISABLED"] .theme-toggle:hover i {
    color:#000;
}

.theme-toggle i {
    font-size: 16px;
    transition: all 0.3s ease;
}

/* Sun icon - visible in light mode */
.sun-icon {
    color: var(--text-primary);
    display: block !important;
}

.moon-icon {
    color: var(--text-primary);
    display: none !important;
}

/* Dark mode - show moon, hide sun */
[data-theme="dark"] .sun-icon {
    display: none !important;
}

[data-theme="dark"] .moon-icon {
    display: block !important;
    color: var(--text-primary);
}

/* Light mode explicit - ensure only sun shows */
[data-theme="light-DISABLED"] .sun-icon,
:root:not([data-theme="dark"]) .sun-icon {
    display: block !important;
}

[data-theme="light-DISABLED"] .moon-icon,
:root:not([data-theme="dark"]) .moon-icon {
    display: none !important;
}

/* Divider between theme toggle and language */
.panel-divider {
    width: 1px;
    height: 20px;
    background: var(--border-color);
    margin: 0 8px;
}

/* Language Trigger */
.language-trigger {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    border-radius: 6px;
    transition: background 0.2s ease;
    min-width: 70px;
    justify-content: center;
}

[data-theme="dark"] .language-trigger:hover b, [data-theme="dark"] .language-trigger:hover i {
    color:#fff;
}

.language-trigger b {
    font-size: 13px;
    color: var(--text-primary);
    font-weight: 600;
}

.language-trigger i {
    font-size: 11px;
    color: var(--text-secondary);
    transition: transform 0.3s ease;
}

/* Rotate chevron when dropdown is open */
.language-trigger.active i {
    transform: rotate(180deg);
}

/* Language Selector Dropdown */
.language_selector {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background: var(--menu-bg);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    min-width: 140px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    padding: 5px 0;
    z-index: 9999;
}

.language_box {
    background-color: transparent;
    margin: 0;
    padding: 0;
    text-align: left;
    border-radius: 0;
    transition: background-color 0.2s ease;
}

.language_box:hover {
    background-color: var(--menu-hover);
}

.language_box a {
    font-size: 13px;
    display: block;
    padding: 8px 15px;
    width: 100%;
    color: var(--text-primary) !important;
    text-decoration: none;
}

/* Apply dark mode to body and main content */
[data-theme="dark"] body,
[data-theme="dark"] html {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

[data-theme="dark"] .main_content {
    background: var(--bg-base);
    color: var(--text-primary);
}

[data-theme="dark"] #topbar {
    background: var(--topbar-bg) !important;
    border-bottom: 1px solid var(--border-color);
}

[data-theme="dark"] div#site-header {
      background: linear-gradient(115deg, #00d8b2 0%, #9d00c9 100%);
}

[data-theme="dark"] .info_block {
    color: var(--topbar-text, #fff);
}

[data-theme="dark"] .info_block a,
[data-theme="dark"] .info_block b {
    color: var(--topbar-text);
}

/* Dark mode user menu block */
[data-theme="dark"] .user-menu-block {
    /* background: var(--bg-secondary, #1a1a1a); */
}

[data-theme="dark"] .user-menu-block b {
    background: rgba(0, 0, 0, 0.2);
    /* font-size: 10px !important; */
    font-size: 11px !important;
    font-weight: 100;
    text-transform: capitalize;
}

[data-theme="dark"] .user-menu-block:hover b {
    background: rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .user-menu-dropdown {
    background: #000 !important;
    border: 1px solid #333 !important;

/* Dark mode - user menu icon colors */
[data-theme="dark"] .user-menu-block .fa-user-circle {
    color: var(--accent-color, #15a7c8) !important;
}

[data-theme="dark"] .user-menu-block .fa-chevron-down {
    color: var(--text-primary, #fff) !important;
}

/* Dark mode - info_block.user-menu-block specific */
[data-theme="dark"] .info_block.user-menu-block {
    background: rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .info_block.user-menu-block:hover {
    background: rgba(0, 0, 0, 0.4) !important;
}
    background: var(--menu-bg, #000);
    border: 1px solid var(--border-strong, #333);
}

/* Menu styling for dark mode */
[data-theme="dark"] .container_menu {
    background-color: var(--menu-bg) !important;
}

[data-theme="dark"] .pureCssMenum,
[data-theme="dark"] ul.submenu {
    background: var(--menu-bg) !important;
    color: #fff !important;
}

[data-theme="dark"] .pureCssMenui a {
    color: var(--text-primary) !important;
}

[data-theme="dark"] ul.pureCssMenu li.pureCssMenui:hover {
    background: var(--bg-hover) !important;
}

[data-theme="dark"] ul.pureCssMenu li.pureCssMenui:hover a {
    color: var(--accent-text) !important;
}

[data-theme="dark"] ul.pureCssMenu li.pureCssMenui:hover a i {
    color: var(--accent-text) !important;
}

[data-theme="dark"] ul.pureCssMenu li.pureCssMenui:last-child:hover {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

[data-theme="dark"] ul.pureCssMenu li.pureCssMenui0 a {
    color: var(--text-primary) !important;
}

[data-theme="dark"] ul.pureCssMenu li.pureCssMenui0 a:hover {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] ul.pureCssMenu li:hover a.pureCssMenui0 {
    border-bottom: 2px solid #fff;
}

[data-theme="dark"] ul.pureCssMenu li.current a.pureCssMenui0 {
    color: #000;
    border-bottom: 2px solid #fff;
}

[data-theme="dark"] .pureCssMenui i {
    color: var(--text-primary) !important;
}

[data-theme="dark"] ul.submenu li.pureCssMenui a {
    color: #fff !important;
}

[data-theme="dark"] ul.pureCssMenu ul {
    top: 44px;
}

[data-theme="dark"] .triangle {
    z-index: 1002 !important;
}

[data-theme="dark"] .triangle svg polygon {
    fill: var(--menu-bg) !important;
}

/* Light mode submenu - fons blanc i lletres negres */
[data-theme="light-DISABLED"] ul.submenu {
    background-color: #fff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

[data-theme="light-DISABLED"] ul.submenu li.pureCssMenui a {
    color: #000 !important;
}


/* Icona agencies.svg en mode light (negre) */
[data-theme="light-DISABLED"] ul.submenu li.pureCssMenui a img[src*="agencies.svg"] {
    filter: brightness(0) saturate(100%);
}

/* Icona agencies.svg en mode dark (blanc) - per defecte ja és blanc amb currentColor */
[data-theme="dark"] ul.submenu li.pureCssMenui a img[src*="agencies.svg"] {
    filter: none;
}

/* Hover: icona agencies.svg canvia a blau cian (#15a7c8) igual que el text */
[data-theme="light-DISABLED"] ul.submenu li.pureCssMenui:hover a img[src*="agencies.svg"] {
    filter: brightness(0) saturate(100%) invert(58%) sepia(84%) saturate(1346%) hue-rotate(151deg) brightness(91%) contrast(91%) !important;
}

[data-theme="dark"] ul.submenu li.pureCssMenui:hover a img[src*="agencies.svg"] {
    filter: invert(58%) sepia(84%) saturate(1346%) hue-rotate(151deg) brightness(91%) contrast(91%) !important;
}
[data-theme="light-DISABLED"] ul.submenu li.pureCssMenui:hover {
    background: rgba(0, 0, 0, 0.05) !important;
}

[data-theme="light-DISABLED"] ul.submenu li.pureCssMenui:hover a {
    color: #15a7c8 !important;
}

[data-theme="light-DISABLED"] .container_menu {
    background-color: #fff !important;
}

[data-theme="light-DISABLED"] .pureCssMenum {
    background-color: #fff !important;
}

[data-theme="light-DISABLED"] .triangle svg polygon {
    fill: #fff !important;
}


/* Light mode menu icons */
[data-theme="light-DISABLED"] .pureCssMenui i {
    color: #000 !important;
}

[data-theme="light-DISABLED"] ul.submenu li.pureCssMenui i {
    color: #000 !important;
}

[data-theme="light-DISABLED"] ul.submenu li.pureCssMenui:hover i {
    color: #15a7c8 !important;
}
/* Ensure triangle is visible in dark mode */
[data-theme="dark"] .triangle svg {
    filter: none !important;
    opacity: 1 !important;
}

/* Headings color in dark mode */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] section h2 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] h3 {
    /* color: var(--text-primary-highlighted) !important; */
    /* color: #21A8C0 !important; */
    color: #FFF !important;
    font-weight: 100 !important;
}

[data-theme="dark"] p {
    color: var(--text-secondary) !important;
}

/* Search box in dark mode */
[data-theme="dark"] .search-box,
[data-theme="dark"] .search-box.color1,
[data-theme="dark"] .search-box.color2 {
    background: #000 !important;
    border: 2px solid var(--border-strong);
}

[data-theme="dark"] .search-box input {
    background: transparent;
    color: var(--text-primary);
}

[data-theme="dark"] .search-box input::placeholder {
    color: var(--text-secondary);
    opacity: 0.7;
}

/* Timeline steps in dark mode */
[data-theme="dark"] .timeline-steps .circle-char {
    color: var(--text-primary) !important;
    border-color: var(--border-color);
}

[data-theme="dark"] .timeline-steps .label {
    color: var(--text-primary);
}

[data-theme="dark"] .timeline-steps .line {
    background: var(--border-color);
}

[data-theme="dark"] .highlight .circle-char {
    border-color: var(--accent-color) !important;
    background-color: var(--accent-color) !important;
    color: #fff !important;
}

[data-theme="dark"] .step:not(:last-of-type) .circle-char::after {
    border-left-color: rgb(60, 60, 60);
}

/* Spans and general text elements in dark mode */
[data-theme="dark"] .step span {
    color: var(--text-primary) !important;
}
[data-theme="dark"] .step.highlight  span {
    color: var(--text-primary-highlighted) !important;
}


/* Service cards in dark mode */
[data-theme="dark"] .service-card {
    background: var(--bg-secondary) !important;
    border: none;
}

[data-theme="dark"] .service-card.featured {
    box-shadow: 0 8px 24px rgba(38, 167, 197, 0.15) !important;
}

[data-theme="dark"] .service-card .text {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .service-card .text b {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .service-card .card-cta {
    color: var(--accent-color);
    border-color: var(--accent-color);
    background: transparent;
}

[data-theme="dark"] .service-card.featured .card-cta {
    background: var(--accent-color) !important;
    color: #fff !important;
}

/* Plan features in dark mode */
[data-theme="dark"] .plan-features {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .plan-features li {
    color: var(--text-primary) !important;
}

/* Footer in dark mode */
[data-theme="dark"] div#footer {
    background: var(--bg-secondary) !important;
    border-color: var(--border-color);
    color: var(--text-primary);
}

[data-theme="dark"] div#footer_links {
    background: var(--bg-base) !important;
    border-color: var(--border-color);
    color: var(--text-primary);
}

[data-theme="dark"] #footer_links::before {
    background: var(--bg-base) !important;
}

[data-theme="dark"] .footer_legal,
[data-theme="dark"] .footer_legal a {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] div#footer_content b {
    color: var(--text-primary) !important;
}

[data-theme="dark"] div#footer_content div {
    color: var(--text-secondary);
}

/* FAQ in dark mode */
[data-theme="dark"] .faq-answer {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary);
}

[data-theme="dark"] .faq-answer p {
    color: #f5f5f5 !important;
}

[data-theme="dark"] .faq-answer a {
    color: var(--accent-color);
}

[data-theme="dark"] .faq-answer b {
    color: var(--text-primary);
}

/* Providers logos container in dark mode */
[data-theme="dark"] div.providers_logos_container {
    background-color: var(--bg-base) !important;
}

[data-theme="dark"] div#lastfoot {
    background-color: var(--bg-base) !important;
}

[data-theme="dark"] div#lastfoot a {
    color: var(--accent-color);
}


/*  primary and secondary buttons */

.primary-button {
  margin-top: 30px;
}

/* Efecte subratllat dinàmic d'esquerra a dreta */
.primary-button a {
  display: inline-block;
  background: #26a7c5;
  color: #fff !important;
  padding: 14px 32px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  font-size: 1.05rem;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
[data-theme="light"] .primary-button a {
   background: #fff;
   color:#000 !important;
}

.primary-button a:hover {
  background: #26a7c5;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(46, 185, 189, 0.3);
}

[data-theme="light"] .primary-button a:hover {
   background: #fff;
   color:#000 !important;
}


.secondary-button {
  display: inline-block;
  background: #ff9800;
  color: #fff !important;
  padding: 14px 32px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  font-size: 1.05rem;
  transition: all 0.3s ease;
}

.secondary-button:hover {
  background: #f57c00;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(255, 152, 0, 0.4);
}

/* Feature grid in dark mode */
[data-theme="dark"] .feature-grid li {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-default);
}

[data-theme="dark"] .feature-grid li:hover {
    box-shadow: 0 4px 12px rgba(12, 167, 205, 0.2);
}

[data-theme="dark"] .feature-grid li .text {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feature-grid li .text .destacat {
    color: var(--text-primary-highlighted) !important;
}

/* Home section in dark mode */
[data-theme="dark"] .home-intro h3 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .home-description {
    color: var(--text-secondary) !important;
}

/* Footer element in dark mode */
[data-theme="dark"] .footer {
    background: var(--bg-secondary) !important;
    color: var(--text-secondary);
}

/* Alternatives domain search in dark mode */
[data-theme="dark"] #alternatives {
    color: var(--text-primary);
}

[data-theme="dark"] #alt-title {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .alternative-domain {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-default);
}

[data-theme="dark"] .alternative-domain b {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .alternative-domain span {
    color: var(--text-secondary) !important;
}

/* Available domains in dark mode - use accent color */
[data-theme="dark"] .alternative-domain span[style*="color:#2e7d32"],
[data-theme="dark"] .alternative-domain span[style*="color: #2e7d32"],
[data-theme="dark"] .alternative-domain span[style*="color:#0d7a92"],
[data-theme="dark"] .alternative-domain span[style*="color: #0d7a92"] {
    color: #3dc1bb !important;
}

/* Not available domains in dark mode - keep the red color */
[data-theme="dark"] .alternative-domain span[style*="color:#d32f2f"],
[data-theme="dark"] .alternative-domain span[style*="color: #d32f2f"] {
    color: #ef5350 !important;
}

/* Price text in dark mode */
[data-theme="dark"] .alternative-domain span[style*="color:#2e7d32"][style*="font-weight:700"],
[data-theme="dark"] .alternative-domain span[style*="color: #2e7d32"][style*="font-weight:700"],
[data-theme="dark"] .alternative-domain span[style*="color:#0d7a92"][style*="font-weight:700"],
[data-theme="dark"] .alternative-domain span[style*="color: #0d7a92"][style*="font-weight:700"] {
    color: #3dc1bb !important;
}

/* Available domain row background in dark mode */
[data-theme="dark"] .alternative-domain[style*="linear-gradient"] {
    background: linear-gradient(135deg, rgba(61, 193, 187, 0.1) 0%, rgba(61, 193, 187, 0.05) 100%) !important;
    border-left: 4px solid #3dc1bb !important;
}

/* Other white background elements in dark mode */
[data-theme="dark"] .bg1 {
    background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end)) !important;
}

/* Utility classes for replacing inline styles */
.white-section {
    background: #fff;
    padding: 50px 20px 100px;
    text-align: center;
}

.info-card {
    background: #ffffff;
    padding: 1.5rem;
    border-radius: 8px;
    border-left: 4px solid var(--accent-color);
}

.content-box {
    background: #fff;
    border-radius: 16px;
    padding: 2rem;
    margin-bottom: 3rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.step-number {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background: var(--accent-color);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.2rem;
}

.download-card {
    text-decoration: none;
    display: block;
    background: #fff;
    border-radius: 12px;
    padding: 2rem 1rem;
    text-align: center;
    transition: all 0.3s ease;
    border: 2px solid #e5e7eb;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.download-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.15);
    border-color: var(--accent-color);
}

.cta-button-link {
    display: inline-block;
    background: var(--accent-color);
    color: white;
    padding: 12px 32px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.cta-button-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.2);
    color: white;
}

/* Dark mode versions of utility classes */
[data-theme="dark"] .white-section {
    background: var(--bg-secondary) !important;
}

[data-theme="dark"] .info-card {
    background: var(--bg-secondary) !important;
    border-left-color: var(--accent-color);
}

/* Dark mode for What is Hosting section */
[data-theme="dark"] .what-is-hosting-section {
    background: linear-gradient(180deg, #000 0%, #1a1a1a 30%, #1d1d1d 70%, rgba(45, 45, 45, 0.3) 100%) !important;
}

[data-theme="dark"] .what-is-hosting-section .section-title {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .what-is-hosting-section .section-subtitle {
    color: #fff !important;
}

[data-theme="dark"] .what-is-hosting-section .info-card {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .what-is-hosting-section .info-card-icon {
    background: linear-gradient(135deg, var(--accent-color-dark) 0%, var(--accent-color) 100%);
}

[data-theme="dark"] .what-is-hosting-section .info-card-content h3 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .what-is-hosting-section .info-card-content p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .hosting-benefits-grid .benefit-item {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .hosting-benefits-grid .benefit-item i {
    color: var(--accent-color) !important;
}

[data-theme="dark"] .hosting-benefits-grid .benefit-item span {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .what-is-hosting-section .highlight-card {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.15) 0%, rgba(38, 167, 197, 0.05) 100%) !important;
    border-color: var(--accent-color);
}

[data-theme="dark"] .what-is-hosting-section .highlight-card .info-card-icon {
    background: linear-gradient(135deg, var(--accent-color) 0%, var(--accent-color-light) 100%);
}

[data-theme="dark"] .content-box {
    background: var(--bg-secondary) !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .download-card {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .download-card:hover {
    border-color: var(--accent-color);
    box-shadow: 0 12px 24px rgba(12, 167, 205, 0.3);
}

/* Feature card with gradient backgrounds */
.feature-card-blue {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
}

.feature-card-green {
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
}

.feature-card-yellow {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
}

.step-container {
    display: flex;
    gap: 1rem;
}

.step-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
    margin-top: 2rem;
}

/* Dark mode for feature cards */
[data-theme="dark"] .feature-card-blue {
    background: linear-gradient(135deg, #1e3a5f 0%, #2d5a8a 100%);
}

[data-theme="dark"] .feature-card-green {
    background: linear-gradient(135deg, #1e4d2b 0%, #2d7a3f 100%);
}

[data-theme="dark"] .feature-card-yellow {
    background: linear-gradient(135deg, #5a4a1e 0%, #8a7a2d 100%);
}

/* Generic dark mode rules for inline styled elements */
[data-theme="dark"] section[style*="background: #fff"],
[data-theme="dark"] section[style*="background:#fff"],
[data-theme="dark"] div[style*="background: #fff"],
[data-theme="dark"] div[style*="background:#fff"],
[data-theme="dark"] div[style*="background: #ffffff"],
[data-theme="dark"] div[style*="background:#ffffff"],
[data-theme="dark"] div[style*="background: #f9feff"],
[data-theme="dark"] div[style*="background:#f9feff"],
[data-theme="dark"] div[style*="background: #f0f9ff"],
[data-theme="dark"] div[style*="background:#f0f9ff"],
[data-theme="dark"] div[style*="background: #fafafa"],
[data-theme="dark"] div[style*="background:#fafafa"],
[data-theme="dark"] div[style*="background: #f5f5f5"],
[data-theme="dark"] div[style*="background:#f5f5f5"],
[data-theme="dark"] div[style*="background: #e8f7fb"],
[data-theme="dark"] div[style*="background:#e8f7fb"] {
    background: var(--bg-secondary) !important;
}

[data-theme="dark"] h1[style*="color: #1f2937"],
[data-theme="dark"] h1[style*="color:#1f2937"],
[data-theme="dark"] h2[style*="color: #1f2937"],
[data-theme="dark"] h2[style*="color:#1f2937"],
[data-theme="dark"] h3[style*="color: #1f2937"],
[data-theme="dark"] h3[style*="color:#1f2937"],
[data-theme="dark"] h4[style*="color: #1f2937"],
[data-theme="dark"] h4[style*="color:#1f2937"] {
    color: var(--text-primary) !important;
}

[data-theme="dark"] p[style*="color: #6b7280"],
[data-theme="dark"] p[style*="color:#6b7280"],
[data-theme="dark"] p[style*="color: #4b5563"],
[data-theme="dark"] p[style*="color:#4b5563"],
[data-theme="dark"] div[style*="color: #4a4a4a"],
[data-theme="dark"] div[style*="color:#4a4a4a"],
[data-theme="dark"] span[style*="color: #4a4a4a"],
[data-theme="dark"] span[style*="color:#4a4a4a"] {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] div[style*="border: 1px solid #e1f3f7"],
[data-theme="dark"] div[style*="border:1px solid #e1f3f7"] {
    border-color: var(--border-default) !important;
}

/* Hamburger menu in dark mode */
[data-theme="dark"] .navbar-toggle .icon-bar,
[data-theme="dark"] .icon-bar {
    background-color: #ffffff !important;
}

/* Mobile menu (sidebar) in dark mode */
[data-theme="dark"] .sidebar {
    /* Fons més fosc per dark mode */
    background-color: #0a0a0a; /* Fons extra fosc per dark theme */
}

[data-theme="dark"] .sidebar div.n0,
[data-theme="dark"] .sidebar a {
    color: #eee; /* Text clar per dark theme */
}

[data-theme="dark"] .sidebar a:hover {
    color: #fff; /* Text blanc al fer hover en dark theme */
    background-color: rgba(255, 255, 255, 0.1); /* Overlay clar */
}

[data-theme="dark"] .sidebar a.i0 {
    color: #fff; /* Text blanc per seccions en dark theme */
}

[data-theme="dark"] .sidebar div.n0 {
    color: #ccc; /* Text gris clar per dark theme */
}

/* Dropdown del menú de llengües in dark mode */
[data-theme="dark"] .dropdown-menu {
    background: #3a3a3a; /* Gris fosc per dark theme */
    border: 1px solid #555;
}

[data-theme="dark"] .dropdown-menu li a {
    color: #eee; /* Text clar per dark theme */
}

[data-theme="dark"] .dropdown-menu li a:hover {
    background: rgba(255, 255, 255, 0.15);
}

/* Clients page in dark mode */
[data-theme="dark"] #clients {
    color: var(--text-primary);
}

[data-theme="dark"] .signup-cta {
    background: transparent;
    border-top-color: rgba(12, 167, 205, 0.2);
}

[data-theme="dark"] .signup-cta-content {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .signup-text {
    color: var(--text-primary);
}
section#cloudhost { margin-top:40px;}
[data-theme="dark"] section#clients input[type="text"],
[data-theme="dark"] section#clients input[type="password"] {
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-default);
}

[data-theme="dark"] section#clients input[type="text"]::placeholder,
[data-theme="dark"] section#clients input[type="password"]::placeholder {
    color: var(--text-secondary);
}

/* Login error message */
.login-error-message {
    color: #fff;
    margin: 20px;
    padding: 15px;
    background: rgba(255, 0, 0, 0.3);
    border-radius: 4px;
    text-align: center;
}

/* Webmail button */
.webmail-button {
    border: 2px solid #15a7c8;
    background: none !important;
    color: #15a7c8 !important;
}

[data-theme="dark"] .login-error-message {
    background: rgba(255, 50, 50, 0.4);
}

[data-theme="dark"] .webmail-button {
    border-color: var(--accent-color);
    color: var(--accent-color) !important;
}

[data-theme="dark"] .webmail-button:hover {
    background: rgba(38, 167, 197, 0.1) !important;
}

/* Half right section in clients page */
[data-theme="dark"] #clients .half.right .color {
    color: var(--text-primary) !important;
}

[data-theme="dark"] #clients .half.right h2.color {
    color: var(--text-primary) !important;
}

[data-theme="dark"] #clients .half.right p.color {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] #clients .half.right a {
    color: var(--accent-color);
}

[data-theme="dark"] #clients .half.right a:hover {
    color: var(--accent-color);
    text-decoration: underline;
}

[data-theme="dark"] #clients .right {
    background-color: var(--bg-secondary) !important;
    border: 0;
}

[data-theme="dark"] #clients .left {
    background: #000 !important;
}

/* Dark mode for hosting benefits grid */
[data-theme="dark"] .hosting-benefits-grid {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] section#hosting span.center {
    color: var(--text-primary) !important;
}

/* Dark mode for Status page */
[data-theme="dark"] .status-hero {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .status-hero h1 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .status-hero .status-tagline {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .status-badge {
    background: var(--bg-secondary) !important;
    border-color: var(--accent-color);
    color: var(--accent-color) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .status-badge i {
    color: var(--accent-color) !important;
}

[data-theme="dark"] .status-section {
    background: var(--bg-secondary) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .status-section h2 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .service-item {
    background: var(--bg-tertiary) !important;
    border-left-color: var(--accent-color);
}

[data-theme="dark"] .service-item:hover {
    background: #2d2d2d !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .service-details h3 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .service-status {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .service-badge.operational {
    background: rgba(58, 190, 183, 0.15) !important;
    color: #5dd1ed !important;
}

[data-theme="dark"] .uptime-card {
    background: linear-gradient(135deg, #252525 0%, #2d2d2d 100%) !important;
    border-top-color: var(--accent-color);
}

[data-theme="dark"] .uptime-percentage {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .uptime-label {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .uptime-period {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .no-incidents h3 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .no-incidents p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .no-incidents-icon {
    color: var(--accent-color) !important;
}

[data-theme="dark"] .subscribe-section {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.1) 0%, rgba(38, 167, 197, 0.05) 100%) !important;
    border-color: var(--accent-color);
}

[data-theme="dark"] .subscribe-section h2 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .subscribe-section p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .subscribe-input {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .subscribe-input:focus {
    border-color: var(--accent-color) !important;
}

[data-theme="dark"] .last-updated {
    color: var(--text-secondary) !important;
}

/* Dark mode for Email Hosting page */
[data-theme="dark"] .email-intro h2 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .email-intro p {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .email-benefits {
    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%) !important;
    border-left-color: var(--accent-color);
    box-shadow: 0 4px 16px rgba(0,0,0,0.3);
}

[data-theme="dark"] .email-benefits h3 {
    color: var(--accent-color-light) !important;
	 text-align:left;
}

[data-theme="dark"] .benefit-item {
    background: var(--bg-tertiary) !important;
    border-color: var(--border-default);
 text-align:left;
}

[data-theme="dark"] .benefit-item i {
    color: var(--accent-color) !important;
 text-align:left;
}

[data-theme="dark"] .benefit-text strong {
    color: var(--text-primary-highlighted) !important;
	text-align:left;
}

[data-theme="dark"] .benefit-text span {
    color: var(--text-secondary) !important;
}

/* Dark mode for WordPress Hosting page */
[data-theme="dark"] .wordpress-hosting-section {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .wordpress-hosting-section h2 {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .wordpress-hosting-section .intro {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .price-highlight {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.15) 0%, rgba(38, 167, 197, 0.1) 100%) !important;
}

[data-theme="dark"] .price-value {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .price-value span {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .price-text {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .benefit {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feature {
/*    background: #10424b !important;
    border-left-color: var(--accent-color);
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);*/
    border: 0.5px solid #1d617c;
}
[data-theme="light-DISABLED"] .feature {
    border: 0.5px solid #fff;
}

[data-theme="dark"] .feature i {
    color: var(--accent-color) !important;
}

[data-theme="dark"] .feature h3 {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .feature p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .cta-button {
    background: var(--accent-color) !important;
}

[data-theme="dark"] .cta-button:hover {
    background: var(--accent-color-light) !important;
}

[data-theme="dark"] .cta-note {
    color: var(--text-secondary) !important;
}

/* Dark mode for features-datacenter and features-table */
[data-theme="dark"] .features-table {
    background: var(--bg-secondary) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

[data-theme="dark"] .features-table td {
    border-bottom-color: var(--border-default);
}

[data-theme="dark"] .features-table td:first-child {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .features-table td {
    color: var(--text-secondary);
}

[data-theme="dark"] .features-table i.fa-check {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .features-table tr:hover {
    background: rgba(38, 167, 197, 0.05);
}

/* Dark mode for Datacenter page */
[data-theme="dark"] .datacenter-intro {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.1) 0%, rgba(38, 167, 197, 0.05) 100%) !important;
    border-left-color: var(--accent-color);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .datacenter-intro .intro-icon {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .datacenter-intro p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .section-title {
    color: var(--text-primary) !important;
}

[data-theme="dark"] #datacenter .card {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}

[data-theme="dark"] #datacenter .card:hover {
    border-color: var(--accent-color);
    box-shadow: 0 6px 20px rgba(38, 167, 197, 0.25);
}

[data-theme="dark"] .card-title {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card-subtitle {
    color: var(--text-primary) !important;
}

[data-theme="dark"] #datacenter .card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .card-clickable:hover {
    border-color: var(--accent-color-light);
    box-shadow: 0 8px 24px rgba(38, 167, 197, 0.3);
}

/* Dark mode for Contact Us page */
[data-theme="dark"] .contact-container {
    background: var(--bg-secondary) !important;
}

[data-theme="dark"] .contact-container h2 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .contact-intro {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .info-note {
    background: rgba(38, 167, 197, 0.1) !important;
    border-left-color: var(--accent-color);
}

[data-theme="dark"] .info-note p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .info-note a {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .alert-success {
    background: rgba(46, 185, 189, 0.15) !important;
    color: var(--accent-color-light) !important;
    border-color: var(--accent-color) !important;
}

[data-theme="dark"] .alert-error {
    background: rgba(231, 76, 60, 0.15) !important;
    color: #ff6b6b !important;
    border-color: #e74c3c !important;
}

[data-theme="dark"] .form-group label {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .form-group input[type="text"],
[data-theme="dark"] .form-group input[type="email"],
[data-theme="dark"] .form-group input[type="tel"],
[data-theme="dark"] .form-group select,
[data-theme="dark"] .form-group textarea {
    background-color: var(--bg-primary) !important;
    border-color: #555555 !important;
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .form-group input:focus,
[data-theme="dark"] .form-group select:focus,
[data-theme="dark"] .form-group textarea:focus {
    border-color: var(--accent-color) !important;
    box-shadow: 0 0 0 3px rgba(38, 167, 197, 0.2) !important;
}

[data-theme="dark"] .char-counter {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .btn-cancel {
    color: var(--text-secondary) !important;
    border-color: var(--text-secondary) !important;
}

[data-theme="dark"] .btn-cancel:hover {
    background: var(--text-secondary) !important;
    color: var(--bg-primary) !important;
}

/* Dark mode for Support Center page */
[data-theme="dark"] .support-header h1 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .support-subtitle {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .support-card {
    background: var(--bg-secondary) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

[data-theme="dark"] .support-card.featured {
    border-color: var(--accent-color);
}

[data-theme="dark"] .support-icon {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .support-card h3 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .support-card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .support-btn {
    background: var(--bg-primary) !important;
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .support-btn:hover {
    background: #333333 !important;
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .support-btn.primary {
    background: var(--accent-color) !important;
    color: white !important;
}

[data-theme="dark"] .support-btn.primary:hover {
    background: var(--accent-color-light) !important;
    color: white !important;
}

[data-theme="dark"] .support-resources {
    border-top-color: var(--border-default);
}

[data-theme="dark"] .resource-item i {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .resource-item h4 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .resource-item p {
    color: var(--text-secondary) !important;
}

/* Dark mode for Shopping Cart page */
[data-theme="dark"] .cart-header {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .cart-item {
    border-top-color: var(--border-default);
}

[data-theme="dark"] .item-details {
    color: var(--text-primary);
}

[data-theme="dark"] .tax-note {
    color: var(--text-secondary) !important;
}

/* Dark mode for Mailing page */
[data-theme="dark"] .intro-section h2 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .intro-section h3 {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feature-list li {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .feature-list li:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.3);
}

[data-theme="dark"] .feature-list .fa-icon {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .feature-list .text-content {
    color: var(--text-secondary);
}

[data-theme="dark"] .feature-list .text-content b {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .price-section {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .price-table thead {
    background: var(--bg-primary) !important;
    color: var(--text-primary);
}

[data-theme="dark"] .price-table td,
[data-theme="dark"] .price-table th {
    border-bottom-color: var(--border-default);
    color: var(--text-secondary);
}

[data-theme="dark"] .price-table td:first-child {
    color: var(--text-primary);
}

[data-theme="dark"] .note {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .reseller-info {
    color: var(--text-secondary);
}

/* Dark mode for KMS Sites page */
[data-theme="dark"] .sites-section h2 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .sites-section .subtitle {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feature-grid li {
    background: var(--bg-secondary) !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}

[data-theme="dark"] .feature-grid li:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

[data-theme="dark"] .feature-grid li i {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .feature-grid li .text {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feature-grid li .text .destacat {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .web-custom-section {
    background-color: #0a0a0a !important;
}

[data-theme="dark"] .web-custom-text a {
    background-color: var(--accent-color) !important;
    color: white !important;
}

[data-theme="dark"] .web-custom-text a:hover {
    background-color: var(--accent-color-light) !important;
}

/* Dark mode for migration-offer */
[data-theme="dark"] .migration-offer {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.15) 0%, rgba(38, 167, 197, 0.08) 100%) !important;
    border-color: var(--accent-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .migration-offer h3 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .migration-offer span {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .migration-offer a {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .plan-includes {
    color: var(--text-primary) !important;
}

/* Dark mode for Ecommerce, Ticketing and Crowdfunding pages */
[data-theme="dark"] .ecommerce-section h3,
[data-theme="dark"] .ticketing-section h3,
[data-theme="dark"] .crowdfunding-section h2,
[data-theme="dark"] .crowdfunding-section h3 {
    padding:30px 0px;color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .crowdfunding-section .subtitle {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .ecommerce-section .feature-list li,
[data-theme="dark"] .ticketing-section .feature-list li,
[data-theme="dark"] .crowdfunding-section .feature-list li {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

[data-theme="dark"] .ecommerce-section .feature-list li:hover,
[data-theme="dark"] .ticketing-section .feature-list li:hover,
[data-theme="dark"] .crowdfunding-section .feature-list li:hover {
    border-color: var(--accent-color) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

[data-theme="dark"] .ecommerce-section .feature-list li i,
[data-theme="dark"] .ticketing-section .feature-list li i,
[data-theme="dark"] .crowdfunding-section .feature-list li i {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .ecommerce-section .feature-list li .text,
[data-theme="dark"] .ticketing-section .feature-list li .text,
[data-theme="dark"] .crowdfunding-section .feature-list li .text {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .ecommerce-section .feature-list li .text .destacat,
[data-theme="dark"] .ticketing-section .feature-list li .text .destacat,
[data-theme="dark"] .crowdfunding-section .feature-list li .text .destacat {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .ecommerce-section .cta-button button,
[data-theme="dark"] .ticketing-section .cta-button button,
[data-theme="dark"] .crowdfunding-section .cta-button button {
    background-color: var(--accent-color) !important;
}

[data-theme="dark"] .ecommerce-section .cta-button button:hover,
[data-theme="dark"] .ticketing-section .cta-button button:hover,
[data-theme="dark"] .crowdfunding-section .cta-button button:hover {
    background-color: var(--accent-color-light) !important;
}

/* Additional dark mode for Crowdfunding page */
[data-theme="dark"] .section-intro {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .info-box {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .info-box ul li {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .info-box strong {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .info-box p[style*="linear-gradient"] {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.15), rgba(38, 167, 197, 0.08)) !important;
    border-color: var(--accent-color) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .exemple-card {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
}

[data-theme="dark"] .exemple-card:hover {
    border-color: var(--accent-color) !important;
}

[data-theme="dark"] .exemple-card h4 {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .exemple-card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .exemple-card strong {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .exemple-card a {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .percentatge {
    color: var(--accent-color-light) !important;
}

/* Dark mode for Config Email page */
[data-theme="dark"] #email-config-page {
    background: linear-gradient(135deg, rgba(12, 167, 205, 0.05) 0%, #1a1a1a 100%) !important;
}

[data-theme="dark"] .email-config-header h1 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .header-subtitle {
    color: #fff !important;
}

[data-theme="dark"] .config-section {
    background: var(--bg-secondary) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

[data-theme="dark"] .config-section.highlight {
    border-color: var(--accent-color);
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.1) 0%, var(--bg-secondary) 100%) !important;
}


[data-theme="dark"] .section-content h2 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .section-content p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .features-list li {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .features-list li i {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .config-btn {
    border-color: var(--accent-color) !important;
    color: var(--accent-color-light) !important;
    background: none !important;
}

[data-theme="dark"] .config-btn:hover {
    background: rgba(38, 167, 197, 0.15) !important;
    border-color: var(--accent-color-light) !important;
}

[data-theme="dark"] .config-btn.primary {
    background: linear-gradient(135deg, var(--accent-color), var(--accent-color-dark)) !important;
    color: white !important;
    border: none !important;
}

[data-theme="dark"] .config-btn.primary:hover {
    background: linear-gradient(135deg, var(--accent-color-light), var(--accent-color)) !important;
}

[data-theme="dark"] .webmail-box {
    background: var(--bg-primary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .webmail-url {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .webmail-note {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .client-card {
    background: var(--bg-primary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .client-card h3 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .client-card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .client-features li {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .client-features li i {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .other-clients-note {
    background: rgba(38, 167, 197, 0.1) !important;
    border-color: var(--accent-color);
}

[data-theme="dark"] .other-clients-note i {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .other-clients-note p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .help-section {
    background: var(--bg-secondary) !important;
    border-color: var(--accent-color);
}

[data-theme="dark"] .help-section h3 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .help-section p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .help-section i {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .help-link {
    color: var(--accent-color-light) !important;
}

/* Dark mode - Servei Remot page */
[data-theme="dark"] #servei-remot h1[style*="color: #1f2937"],
[data-theme="dark"] #servei-remot h2[style*="color: #1f2937"],
[data-theme="dark"] #servei-remot h3[style*="color: #1f2937"],
[data-theme="dark"] #servei-remot h4[style*="color: #1f2937"] {
    color: var(--text-primary) !important;
}

[data-theme="dark"] #servei-remot p[style*="color: #6b7280"],
[data-theme="dark"] #servei-remot p[style*="color: #4b5563"] {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] #servei-remot div[style*="background: linear-gradient(135deg, #f0f9ff"] {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.15) 0%, rgba(38, 167, 197, 0.08) 100%) !important;
}

[data-theme="dark"] #servei-remot div[style*="background: linear-gradient(135deg, #f0fdf4"] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(16, 185, 129, 0.08) 100%) !important;
}

[data-theme="dark"] #servei-remot div[style*="background: linear-gradient(135deg, #fef3c7"] {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.15) 0%, rgba(245, 158, 11, 0.08) 100%) !important;
}

[data-theme="dark"] #servei-remot div[style*="background: #fff"][style*="border-radius: 16px"] {
    background: var(--bg-secondary) !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] #servei-remot a[style*="background: #fff"][style*="border-radius: 12px"] {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] #servei-remot a[style*="background: #fff"]:hover {
    background: var(--bg-primary) !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] #servei-remot div[style*="background: linear-gradient(135deg, #eff6ff"] {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.12) 0%, rgba(38, 167, 197, 0.06) 100%) !important;
    border-left-color: var(--accent-color) !important;
}

[data-theme="dark"] #servei-remot i[style*="color: #10b981"] {
    color: #10b981 !important;
}

[data-theme="dark"] #servei-remot i[style*="color: #f59e0b"] {
    color: #f59e0b !important;
}

[data-theme="dark"] #servei-remot i[style*="color: #333"] {
    color: #e0e0e0 !important;
}

/* Dark mode - Domains page */
[data-theme="dark"] .domain-intro-section h2[style*="color: #1a1a1a"],
[data-theme="dark"] .domain-intro-section h3[style*="color: #1a1a1a"] {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .domain-intro-section p[style*="color: #4a4a4a"] {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .domain-intro-section div[style*="background: #ffffff"] {
    background: var(--bg-secondary) !important;
}

[data-theme="dark"] .domain-intro-section div[style*="background: #e8f7fb"] {
    background: rgba(38, 167, 197, 0.15) !important;
}

[data-theme="dark"] .domain-intro-section div[style*="background: #f9feff"] {
    background: rgba(38, 167, 197, 0.08) !important;
    border-color: rgba(38, 167, 197, 0.2) !important;
}

[data-theme="dark"] .domain-intro-section div[style*="color: #4a4a4a"] {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .domain-intro-section span {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .generic_product_tbl .product_tr_detail {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .product_tr_detail.odd {
    background-color: rgba(38, 167, 197, 0.08) !important;
}

[data-theme="dark"] .product_notes {
    color: var(--text-secondary) !important;
    border-top-color: rgba(38, 167, 197, 0.3) !important;
}

[data-theme="dark"] .generic_product_tbl .product_price a,
[data-theme="dark"] .generic_product_tbl .product_detail a {
    color: var(--accent-color-light) !important;
}

/* Dark mode - About Us page */

[data-theme="dark"] .opengea-section p,
[data-theme="dark"] .intergrid-content p,
[data-theme="dark"] .mission-content p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .intergrid-box {
    background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-primary) 100%) !important;
    border-left-color: var(--text-primary) !important;
}

[data-theme="dark"] .intergrid-content h3 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .mission-box {
    background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-primary) 100%) !important;
}

[data-theme="dark"] .features-container h2,
[data-theme="dark"] .more-info-section h2,
[data-theme="dark"] .kms-cloud-content h2 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feature-card {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
}

[data-theme="dark"] .feature-card:hover {
    border-color: var(--accent-color) !important;
    box-shadow: 0 8px 20px rgba(38, 167, 197, 0.25) !important;
}

[data-theme="dark"] .feature-card h3 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .feature-card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .kms-cloud-info {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
}

[data-theme="dark"] .kms-cloud-content p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .info-link {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .info-link:hover {
    background: var(--bg-primary) !important;
    border-color: var(--accent-color) !important;
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .info-link i {
    color: var(--accent-color-light) !important;
}

[data-theme="dark"] .intergrid-icon {
    content: url('https://www.intergrid.cat/img/favicon/favicon-w.svg?v=2');
}

/* Responsive adjustments */
@media screen and (max-width: 1200px) {
    .info_block.theme-language-panel {
        padding: 5px 10px;
        gap: 6px;
    }

    .theme-toggle {
        padding: 3px 6px;
    }

    .theme-toggle i {
        font-size: 14px;
    }

    .language-trigger {
        padding: 3px 6px;
        min-width: 65px;
    }

    .language-trigger b {
        font-size: 12px;
    }

    .panel-divider {
        margin: 0 6px;
        height: 18px;
    }
}

@media screen and (max-width: 768px) {
    .info_block.theme-language-panel {
        padding: 3px 6px;
        gap: 4px;
        border-radius: 6px;
    }

    .theme-toggle {
        padding: 2px 4px;
    }

    .theme-toggle i {
        font-size: 13px;
    }

    .language-trigger {
        padding: 2px 4px;
        min-width: 55px;
    }

    .language-trigger b {
        font-size: 11px;
    }

    .language-trigger i {
        font-size: 10px;
    }

    .panel-divider {
        margin: 0 4px;
        height: 16px;
    }

    .language_selector {
        min-width: 120px;
        right: -10px;
    }

    .language_box a {
        font-size: 12px;
        padding: 6px 12px;
    }
}

@media screen and (max-width: 500px) {
    .info_block.theme-language-panel {
        padding: 2px 4px;
        gap: 2px;
        border-radius: 4px;
    }

    .theme-toggle {
        padding: 1px 3px;
    }

    .theme-toggle i {
        font-size: 12px;
    }

    .language-trigger {
        padding: 1px 3px;
        min-width: 50px;
    }

    .language-trigger b {
        font-size: 10px;
    }

    .language-trigger i {
        font-size: 9px;
    }

    .panel-divider {
        margin: 0 3px;
        height: 14px;
    }

    .language_selector {
        min-width: 110px;
        right: -15px;
    }

    .language_box a {
        font-size: 11px;
        padding: 5px 10px;
    }
}

/* Ensure topinfo doesn't overflow */
div#topinfo {
    display: flex !important;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    justify-content: flex-end;
    overflow: visible;
    position: absolute;
    top: 50%;
}

div#topinfo .info_block {
    flex-shrink: 0;
}

div#topinfo #shopping_cart {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}

div#topinfo #shopping_cart a {
    color: var(--text-primary);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Change color when cart has items */
div#topinfo #shopping_cart a.has-items {
    color: #26a7c5 !important;
}

/* Cart badge circle style */
.cart-badge {
    background-color: #26a7c5;
    color: #fff;
    border-radius: 50%;
    padding: 2px 6px;
    font-size: 11px;
    font-weight: normal;
    display: inline-block;
    min-width: 18px;
    height: 18px;
    line-height: 14px;
    text-align: center;
    margin-left: 4px;
}

[data-theme="dark"] div#topinfo #shopping_cart a:hover {
    color:#fff;
}

[data-theme="light-DISABLED"] div#topinfo #shopping_cart a:hover {
    color:#000;
}

div#topinfo .info_block.login,
div#topinfo .info_block.user-menu-block {
    /* margin: 0 10px 0 5px; */
}

@media screen and (max-width: 768px) {
    div#topinfo {
        gap: 6px;
        right: 5px;
    }
}

@media screen and (max-width: 500px) {
    div#topinfo {
        gap: 4px;
        right: 3px;
    }

    div#topinfo .info_block.login {
        font-size: 0.85em;
    }
}

/* Scrollbar personalitzat amb color corporatiu */
/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #26a7c5 #f0f0f0;
}

/* Chrome, Edge, Safari */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: #f0f0f0;
}

::-webkit-scrollbar-thumb {
  background: #26a7c5;
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
  background: #1e8ca3;
}

/* Dark mode amb data-theme */
[data-theme="dark"] * {
  scrollbar-color: #26a7c5 #000000;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
  background: #000000;
}

/* Dark mode del sistema operatiu */
@media (prefers-color-scheme: dark) {
  * {
    scrollbar-color: #26a7c5 #000000;
  }

  ::-webkit-scrollbar-track {
    background: #000000;
  }
}

/* Overscroll background negre només en dark mode */
[data-theme="dark"] html {
  background-color: #000 !important;
}

[data-theme="dark"] body {
  background-color: #000 !important;
  background:none;
}

/* TLD Guide Section */
.tld-guide-section {
    max-width: 900px;
    margin: 3rem auto;
    padding: 0 1.5rem;
}

.tld-guide-header {
    text-align: center;
    margin-bottom: 2rem;
}

.tld-guide-title {
    font-size: 1.5rem;
    color: #1a1a1a;
    margin: 0 0 0.5rem 0;
    font-weight: 600;
}

.tld-guide-subtitle {
    font-size: 0.95rem;
    color: #666;
    margin: 0;
}

.tld-section {
    margin-bottom: 2.5rem;
}

.tld-section:last-child {
    margin-bottom: 0;
}

.tld-section-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.tld-section-icon {
    color: #26a7c5;
    font-size: 1.3rem;
}

.tld-section-title {
    font-size: 1.2rem;
    color: #1a1a1a;
    margin: 0;
    font-weight: 600;
}

.tld-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.tld-card {
    background: #fff;
    padding: 1.25rem;
    border-radius: 8px;
    border: 1px solid #e5e5e5;
    transition: all 0.3s ease;
}

.tld-card:hover {
    border-color: #26a7c5 !important;
    box-shadow: 0 4px 12px rgba(38, 167, 197, 0.15);
    transform: translateY(-2px);
}

.tld-badge-container {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.tld-badge {
    font-weight: 700;
    font-size: 1.1rem;
    padding: 0.4rem 0.75rem;
    border-radius: 6px;
}

.tld-badge-popular {
    background: #e8f7fb;
    color: #26a7c5;
}

.tld-badge-trending {
    background: #fff3e0;
    color: #f57c00;
}

.tld-description {
    font-size: 0.85rem;
    color: #666;
    margin: 0;
    line-height: 1.5;
}

/* Dark theme support for TLD cards */
[data-theme="dark"] .tld-guide-title {
    color: var(--text-primary);
}

[data-theme="dark"] .tld-guide-subtitle {
    color: var(--text-secondary);
}

[data-theme="dark"] .tld-section-icon {
    color: var(--accent-primary);
}

[data-theme="dark"] .tld-section-title {
    color: var(--text-primary);
}

[data-theme="dark"] .tld-card {
    background: var(--bg-secondary);
    border-color: var(--border-default);
}

[data-theme="dark"] .tld-card:hover {
    border-color: var(--accent-primary) !important;
    box-shadow: 0 4px 12px rgba(61, 189, 217, 0.2);
}

[data-theme="dark"] .tld-badge-popular {
    background: rgba(61, 189, 217, 0.15);
    color: var(--accent-text);
}

[data-theme="dark"] .tld-badge-trending {
    background: rgba(255, 152, 0, 0.15);
    color: #ffb74d;
}

[data-theme="dark"] .tld-description {
    color: var(--text-secondary);
}

/* Responsive */
@media (max-width: 768px) {
    .tld-grid {
        grid-template-columns: 1fr !important;
        gap: 0.75rem !important;
    }

    .tld-guide-title {
        font-size: 1.3rem !important;
    }

    .tld-section-title {
        font-size: 1.1rem !important;
    }

    [data-theme="dark"] #rack {
        opacity: 0.3;
    }
}

/* Dark theme support for Domain Diagnostic page */
[data-theme="dark"] .diagnostic-header h1 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .diagnostic-header p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .diagnostic-input-section {
    background: var(--bg-secondary);
}

[data-theme="dark"] .diagnostic-input-group input {
    background: var(--bg-primary);
    border-color: var(--border-default);
    color: var(--text-primary);
}

[data-theme="dark"] .diagnostic-input-group input:focus {
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px rgba(61, 189, 217, 0.1);
}

[data-theme="dark"] .diagnostic-results-section {
    background: var(--bg-secondary);
}

[data-theme="dark"] .diagnostic-results-section h2 {
    color: #fff !important;
}

[data-theme="dark"] .diagnostic-test-item {
    background: var(--bg-primary);
    border-left-color: var(--border-strong);
}

[data-theme="dark"] .diagnostic-test-item.testing {
    background: linear-gradient(90deg, rgba(61, 189, 217, 0.1) 0%, var(--bg-primary) 100%);
}

[data-theme="dark"] .diagnostic-test-item.success {
    background: linear-gradient(90deg, rgba(40, 167, 69, 0.1) 0%, var(--bg-primary) 100%);
}

[data-theme="dark"] .diagnostic-test-item.warning {
    background: linear-gradient(90deg, rgba(255, 193, 7, 0.1) 0%, var(--bg-primary) 100%);
}

[data-theme="dark"] .diagnostic-test-item.error {
    background: linear-gradient(90deg, rgba(220, 53, 69, 0.1) 0%, var(--bg-primary) 100%);
}

[data-theme="dark"] .diagnostic-test-title {
    color: var(--text-primary);
}

[data-theme="dark"] .diagnostic-test-message {
    color: var(--text-secondary);
}

[data-theme="dark"] .diagnostic-test-time {
    color: var(--text-tertiary);
}

[data-theme="dark"] .diagnostic-progress-bar {
    background: var(--bg-primary);
}

[data-theme="dark"] .diagnostic-contact-section {
    background: var(--bg-secondary);
}

[data-theme="dark"] .diagnostic-contact-section h3 {
    color: var(--text-primary);
}

[data-theme="dark"] .diagnostic-contact-section p {
    color: var(--text-secondary);
}

[data-theme="dark"] .diagnostic-details-content {
    background: var(--bg-primary);
    color: var(--text-secondary);
}

[data-theme="dark"] .diagnostic-details-content strong {
    color: var(--text-primary);
}

[data-theme="dark"] .diagnostic-details-content code {
    background: var(--bg-base);
    border-left-color: var(--accent-primary);
}

[data-theme="dark"] .diagnostic-details-item {
    border-bottom-color: var(--border-subtle);
}

[data-theme="dark"] .diagnostic-details-toggle {
    color: var(--accent-text);
}

[data-theme="dark"] .diagnostic-details-toggle:hover {
    color: var(--accent-primary);
}

[data-theme="dark"] .diagnostic-info-box {
    background: linear-gradient(135deg, rgba(61, 189, 217, 0.15) 0%, rgba(93, 209, 237, 0.1) 100%);
    border-left-color: var(--accent-primary);
}

[data-theme="dark"] .diagnostic-info-box span {
    color: var(--text-secondary);
}

/* Dark theme support for Transfer Process Section */
[data-theme="dark"] .transfer-process-section h2 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .transfer-process-section p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .transfer-step-card {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
}

[data-theme="dark"] .transfer-step-card:hover {
    border-color: var(--accent-primary) !important;
    box-shadow: 0 8px 24px rgba(61, 189, 217, 0.2) !important;
}

[data-theme="dark"] .transfer-step-card h3 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .transfer-step-card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .transfer-process-section > div:nth-child(3) {
    background: linear-gradient(135deg, rgba(61, 189, 217, 0.15) 0%, rgba(93, 209, 237, 0.1) 100%) !important;
    border-left-color: var(--accent-primary) !important;
}

[data-theme="dark"] .transfer-process-section > div:nth-child(3) h3 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .transfer-process-section > div:nth-child(3) p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .transfer-process-section h4 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .transfer-process-section .transfer-steps-grid + div + div > div {
    border-color: var(--border-default) !important;
}

/* Dark theme support for Valors page */
[data-theme="dark"] body.valors .feature {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
}

[data-theme="dark"] body.valors .feature h3 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] body.valors .grid p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] body.valors section.bg2 h2 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] body.valors section.bg2 h3 {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] body.valors img.icon {
    filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(278%) hue-rotate(202deg) brightness(103%) contrast(92%);
}

[data-theme="dark"] section.bg2 {
    background: linear-gradient(115deg, #141f21 0%, #08282e 50%, #1f1f1f 100%) !important;
}

[data-theme="dark"] section#agencies {
background: linear-gradient(115deg, #0d0d0d 0%, #1a1a1a 50%, #2a2a2a 100%) !important;
}

[data-theme="dark"] section.bg2::before {
    background: var(--bg-primary) !important;
}

[data-theme="dark"] .aboutus section.bg2::before {
  background: #000 !important;
}

[data-theme="dark"] section h2 {
    /* color: var(--accent-color) !important; */
    color: #fff !important;
}

/* Agencies section h2 should be white in dark theme */
[data-theme="dark"] #agencies h2,
[data-theme="dark"] .agencies-hero h2,
[data-theme="dark"] .features-section h2 {
    color: #ffffff !important;
}

[data-theme="dark"] .feature h3 {
    /* color: var(--accent-primary) !important; */
    color: #fff !important;
}

[data-theme="dark"] .grid p {
    color: var(--text-secondary) !important;
    line-height: 135%;
}

/* Dark theme support for Values Section */
[data-theme="dark"] .values-header h1 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .values-header p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .value-card {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default) !important;
}

[data-theme="dark"] .value-card:hover {
    border-color: var(--accent-primary) !important;
    box-shadow: 0 12px 24px rgba(61, 189, 217, 0.2) !important;
}

[data-theme="dark"] .value-icon {
    background: linear-gradient(135deg, rgba(61, 189, 217, 0.15) 0%, rgba(93, 209, 237, 0.1) 100%) !important;
}

[data-theme="dark"] .value-card:hover .value-icon {
    background: linear-gradient(135deg, var(--accent-primary) 0%, #5dd1ed 100%) !important;
}

[data-theme="dark"] .value-icon i {
    color: var(--accent-text) !important;
}

[data-theme="dark"] .value-card:hover .value-icon i {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .value-card h3 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .value-card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .values-commitment {
    background: linear-gradient(135deg, rgba(61, 189, 217, 0.1) 0%, rgba(93, 209, 237, 0.08) 100%) !important;
    border-left-color: var(--accent-primary) !important;
}

[data-theme="dark"] .values-commitment h3 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .values-commitment p {
    color: var(--text-secondary) !important;
}

/* Dark mode for Control Panel page */

[data-theme="dark"] .cp-hero::before {
    background: #000 !important;
}

[data-theme="dark"] .cp-hero h1,
[data-theme="dark"] .cp-hero .subtitle,
[data-theme="dark"] .cp-hero p {
    color: #fff !important;
}

[data-theme="dark"] .cp-hero .cta-button {
    background: #fff !important;
    color: var(--accent-color) !important;
}

[data-theme="dark"] .cp-hero .cta-button:hover {
    background: #f0f0f0 !important;
    color: var(--accent-color-dark) !important;
}

[data-theme="dark"] #rack{
    opacity: 0.3;
}

[data-theme="dark"] body.main #rack {
    opacity: 1;
}

[data-theme="dark"] body.domains #rack{
    opacity: 0.3;
}
 body.hosting #rack {
    opacity: 0.6;
}

[data-theme="dark"] .cp-feature-card {
    background: var(--bg-secondary) !important;
    border-color: var(--border-default);
}

[data-theme="dark"] .cp-feature-card h3 {
    color: var(--accent-color) !important;
}

[data-theme="dark"] .cp-feature-card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .cp-highlight-section {
    background: var(--bg-secondary) !important;
}

[data-theme="dark"] .cp-highlight-section h2 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .cp-highlight-section p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .cp-service-item {
    background: var(--bg-primary) !important;
    border-left-color: var(--accent-color);
}

[data-theme="dark"] .cp-service-item h4 {
    color: var(--text-primary-highlighted) !important;
margin-bottom:30px;
}

[data-theme="dark"] .cp-service-item p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .cp-section h2 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .cp-text-content h3 {
    color: var(--accent-color) !important;
}

[data-theme="dark"] .cp-text-content p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .cp-final-section {
    background: var(--bg-primary) !important;
}

[data-theme="dark"] .cp-final-section h2 {
    color: var(--text-primary-highlighted) !important;
}

[data-theme="dark"] .cp-final-section p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .cp-final-section h4 {
    color: var(--text-primary-highlighted) !important;
    padding-bottom:5px !important;
}

/* SSL CTA Button */
.ssl-cta .btn-primary {
  display: inline-block;
  padding: 15px 40px !important;
  background: linear-gradient(115deg, var(--accent-color) 0%, #3fc0b4 100%);
  color: white;
  text-decoration: none;
  border-radius: 50px;
  font-weight: 600;
  font-size: 1.1rem;
  transition: all 0.3s ease;
}

/* Underline effect for pureCssMenui0 links */
a.pureCssMenui0:not(:has(img)):not(.no-underline):not([class*="button"]):not([class*="btn"]) {
  position: relative;
}

a.pureCssMenui0:not(:has(img)):not(.no-underline):not([class*="button"]):not([class*="btn"])::before {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background-color: var(--accent-color);
  transition: width 0.3s ease;
}

a.pureCssMenui0:not(:has(img)):not(.no-underline):not([class*="button"]):not([class*="btn"]):hover::before {
  width: 100%;
}

/* Animated underline effect class */
.underline-effect {
  position: relative;
  display: inline-block;
  text-decoration: none;
}

.underline-effect::after {
  content: '';
  position: absolute;
  width: 0;
  height: 2px;
  bottom: -2px;
  left: 0;
  background-color: #ffffff;
  transition: width 0.3s ease;
}

.underline-effect:hover::after {
  width: 100%;
}

.underline-effect:hover {
  text-decoration: none;
}

/* Hosting Suggestion Styles */
.hosting-suggestion {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
  /* border: 2px solid var(--accent-color); */
  border-radius: 12px;
  padding: 20px;
  margin: 0px 0 12px 0;
  position: relative;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.hosting-suggestion:hover {
  /* box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12); */
  transform: translateY(-2px);
}

.hosting-suggestion-close {
  position: absolute;
  top: 10px;
  right: 10px;
  background: none;
  border: none;
  font-size: 24px;
  color: #6c757d;
  cursor: pointer;
  line-height: 1;
  padding: 1px 0 0 1px;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: top;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.2s ease;
}

.hosting-suggestion-close:hover {
  background: #e9ecef;
  color: #343a40;
}

.hosting-suggestion-content {
  display: flex;
  align-items: flex-start;
  gap: 15px;
}

.hosting-suggestion-icon {
  font-size: 19px;
  color: var(--accent-color);
  flex-shrink: 0;
  margin-top: 0px;
}

.hosting-suggestion-text {
  flex: 1;
}

.hosting-suggestion-title {
  font-size: 14px;
  color: #212529;
  display: block;
  margin-bottom: 8px;
  line-height: 1.4;
}

.hosting-suggestion-domain {
  color: var(--accent-color);
  font-weight: 700;
}

.hosting-suggestion-description {
  font-size: 12px;
  color: #6c757d;
  margin-bottom: 15px;
  line-height: 1.5;
}

.hosting-suggestion-buttons {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.hosting-suggestion-btn-primary {
  background: linear-gradient(115deg, var(--accent-color) 0%, #3fc0b4 100%);
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 25px;
  font-weight: 600;
  font-size: 11px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(38, 167, 197, 0.2);
}

.hosting-suggestion-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(38, 167, 197, 0.3);
}

.hosting-suggestion-btn-secondary {
  color: var(--accent-color);
  border: 2px solid var(--accent-color);
  background: white;
  padding: 8px 18px;
  border-radius: 25px;
  font-weight: 600;
  font-size: 11px;
  text-decoration: none;
  display: inline-block;
  transition: all 0.3s ease;
}

.hosting-suggestion-btn-secondary:hover {
  background: var(--accent-color);
  color: white;
  text-decoration: none;
}

/* Dark theme support */
[data-theme="dark"] .hosting-suggestion {
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  /* border-color: var(--accent-color); */
}

[data-theme="dark"] .hosting-suggestion-title {
  color: #e9ecef;
}

[data-theme="dark"] .hosting-suggestion-description {
  color: #adb5bd;
}

[data-theme="dark"] .hosting-suggestion-close {
  color: #fff;
}

[data-theme="dark"] .hosting-suggestion-close:hover {
  background: #343a40;
  color: #f8f9fa;
}

[data-theme="dark"] .hosting-suggestion-btn-secondary {
  background: transparent;
  color: var(--accent-color);
}

[data-theme="dark"] .hosting-suggestion-btn-secondary:hover {
  background: var(--accent-color);
  color: white;
}

/* Light theme support - ensures proper styling */
[data-theme="light-DISABLED"] .hosting-suggestion {
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
  border: 2px solid var(--accent-color);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

[data-theme="light-DISABLED"] .hosting-suggestion:hover {
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

[data-theme="light-DISABLED"] .hosting-suggestion-title {
  color: #212529;
}

[data-theme="light-DISABLED"] .hosting-suggestion-description {
  color: #6c757d;
}

[data-theme="light-DISABLED"] .hosting-suggestion-close {
  color: #6c757d;
}

[data-theme="light-DISABLED"] .hosting-suggestion-close:hover {
  background: #e9ecef;
  color: #343a40;
}

[data-theme="light-DISABLED"] .hosting-suggestion-btn-secondary {
  background: white;
  color: var(--accent-color);
  border: 2px solid var(--accent-color);
}

[data-theme="light-DISABLED"] .hosting-suggestion-btn-secondary:hover {
  background: var(--accent-color);
  color: white;
}

[data-theme="light-DISABLED"] .cart-item {
  border-bottom: 1px solid #dee2e6;
}

[data-theme="light-DISABLED"] .item-details {
  color: #212529;
}

[data-theme="light-DISABLED"] .tax-note {
  color: #6c757d;
}

[data-theme="light-DISABLED"] .cart-container {
  background: #ffffff;
  color: #212529;
}

/* Responsive */
@media (max-width: 576px) {
  .hosting-suggestion-content {
    flex-direction: column;
  }
  
  .hosting-suggestion-buttons {
    flex-direction: column;
    width: 100%;
  }
  
  .hosting-suggestion-btn-primary,
  .hosting-suggestion-btn-secondary {
    width: 100%;
    text-align: center;
  }
}


/* ===== MOBILE TOPINFO IMPROVEMENTS ===== */
/* Prevent topinfo from overlapping with hamburger menu on mobile */

@media screen and (max-width: 768px) {
  div#topbar #topbar-right-content #topinfo {
    /* right: 37px !important; */
    /* top: 15px; */
    right: 45px !important;
    top: 0px;
  }
    
    /* Center hamburger menu vertically within topbar (55px height) */
    .navbar-toggle {
        top: 15px !important;
    }
    
    /* Make shopping cart icon smaller */
    div#topinfo #shopping_cart {
        font-size: 0.85em !important;
    }
    
    div#topinfo #shopping_cart i {
        font-size: 14px !important;
    }
    
    div#topinfo #shopping_cart span {
        font-size: 11px !important;
    }
    
    /* Reduce theme-language-panel padding */
    .info_block.theme-language-panel {
        padding: 2px 4px !important;
        gap: 2px !important;
    }
    
    /* Smaller icons in theme-language-panel */
    .theme-language-panel i {
        font-size: 12px !important;
    }
    
    .language-trigger b {
        font-size: 11px !important;
    }
    
    /* User menu icon smaller */
    .user-menu-block .fa-user-circle {
        font-size: 18px !important;
    }
    
    /* Login button smaller */
    div#topinfo .info_block.login {
        font-size: 0.75em !important;
        padding: 4px 8px !important;
    }
    
    /* Reduce section padding on mobile */
    section div.maxwidth-shorter {
        padding: 0px 10px !important;
        width: calc(100% - 20px) !important;
    }
}

@media screen and (max-width: 480px) {
  div#topbar #topbar-right-content #topinfo {
    top: 3px; /*14px;*/
  }
   section {
  padding: 70px 20px 0px 20px;
} 
.tld-guide-section { padding:0; }
div#title h1 {
 margin-top:0px;
}
    .navbar-toggle {
        top: 13px !important;
    }
    div#topinfo .info_block.user-menu-block {
	/* padding: 6px 10px 0px 0px; */
    } 
    div#topinfo #shopping_cart i {
        font-size: 12px !important;
    }
    
    div#topinfo #shopping_cart span {
        font-size: 10px !important;
    }
    
    .info_block.theme-language-panel {
        padding: 1px 3px !important;
        gap: 1px !important;
    }
    
    .theme-language-panel i {
        font-size: 11px !important;
    }
    
    .language-trigger b {
        font-size: 10px !important;
    }
    
    .user-menu-block .fa-user-circle {
        font-size: 16px !important;
    }
    
    div#topinfo .info_block.login {
        font-size: 0.7em !important;
        padding: 3px 6px !important;
    }
    
    /* More compact section padding */
    section div.maxwidth-shorter {
        padding: 0px 5px !important;
        width: calc(100% - 10px) !important;
    }
}

@media screen and (max-width: 375px) {
    /* iPhone SE and similar small screens */
    div#topbar #topbar-right-content #topinfo {
        transform: translateY(-50%) !important;
        right: 40px !important;
    }
    
    .navbar-toggle {
        top: 15px !important;
        right: 8px !important;
    }
    
    div#topinfo #shopping_cart i {
        font-size: 11px !important;
    }
    
    .theme-language-panel i {
        font-size: 10px !important;
    }
    
    .language-trigger b {
        display: none !important; /* Hide language code on very small screens */
    }
}

}

}



/* Agencies icon hover */
ul.pureCssMenu li.pureCssMenui:hover a .agencies-icon {
  filter: brightness(0) saturate(100%) invert(60%) sepia(50%) saturate(1000%) hue-rotate(150deg) !important;
}

/* =========================================
   Inline styles converted to CSS classes
   Generated automatically on $(date +%Y-%m-%d)
   ========================================= */


.inline-style-1 {
    border-collapse: collapse;
    font-size: 15px;
    line-height: 1.6;
    width: 100%;
}

.inline-style-2 {
    background: #f2f2f2;
}

.inline-style-3 {
    text-align: left;
}

.inline-style-4 {
    text-align: center;
}

.inline-style-5 {
    border: 1px solid #ccc;
}

.inline-style-6 {
    border-collapse: collapse;
    width: 100%;
}

.inline-style-7 {
    background: #eee;
}

.inline-style-8 {
    margin-bottom: 3rem;
    margin-top: 2rem;
    text-align: center;
}

.inline-style-9 {
    color: #444;
    font-size: 15px;
    margin: 0 auto 2rem auto;
    max-width: 800px;
    text-align: center;
}

.inline-style-10 {
    color: #444;
    font-size: 15px;
    margin: 0 auto 1rem auto;
    max-width: 800px;
    text-align: center;
}

.inline-style-11 {
    color: #0ca7cd;
    font-size: 16px;
    font-weight: 600;
    margin: 0 auto 2rem auto;
    max-width: 800px;
    text-align: center;
}

.inline-style-12 {
    background: linear-gradient(135deg, #2a2a2a 0%, #5a5a5a 100%);
    border-radius: 8px;
    color: white;
    margin: 40px auto;
    max-width: 1000px;
    padding: 30px;
    text-align: center;
}

.inline-style-13 {
    font-size: 18px;
    margin: 0 0 18px 0 !important;
}

.inline-style-14 {
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

.inline-style-15 {
    margin-bottom: 20px;
    margin-top: 40px;
    text-align: center;
}

.inline-style-16 {
    display: none;
}

.inline-style-17 {
    left: -9999px;
    position: absolute;
}

.inline-style-18 {
    background-image: url('/img/p4.jpg');
}

.inline-style-19 {
    color: #555;
    font-size: 15px;
    margin: 0 auto 30px;
    max-width: 700px;
    text-align: center;
}

.inline-style-20 {
    margin-top: 30px;
    text-align: center;
}

.inline-style-21 {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    max-width: 600px;
    width: 100%;
}

.inline-style-22 {
    color: #555;
    font-size: 15px;
    margin: 0 auto 30px;
    max-width: 800px;
    text-align: center;
}

.inline-style-23 {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    max-width: 800px;
    width: 100%;
}

.inline-style-24 {
    margin-bottom: 80px;
    max-width: 100% !important;
    padding: 0;
}

.inline-style-25 {
    margin-bottom: 0;
}

.inline-style-26 {
    color: #fff !important;
    margin-bottom: 15px;
}

.inline-style-27 {
    font-size: 1rem;
    margin-bottom: 25px;
    opacity: 0.9;
}

.inline-style-28 {
    margin-top: 30px;
}

.inline-style-29 {
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
    max-width: 700px;
    width: 100%;
}

.inline-style-30 {
    margin-top: 50px;
}

.inline-style-31 {
    background: #fff;
    padding: 50px 20px 100px;
    text-align: center;
}

.inline-style-32 {
    color: #333;
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 20px;
}

.inline-style-33 {
    color: #666;
    font-size: 1.1rem;
    line-height: 1.8;
    margin: 0 auto 40px;
    max-width: 900px;
}

.inline-style-34 {
    display: grid;
    gap: 30px;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    margin: 0 auto;
    max-width: 900px;
}

.inline-style-35 {
    align-items: center;
    background: linear-gradient(135deg, #0ababa 0%, #24a5c3 100%);
    border-radius: 50%;
    display: flex;
    height: 80px;
    justify-content: center;
    margin: 0 auto 15px;
    width: 80px;
}

.inline-style-36 {
    color: #fff;
    font-size: 2rem;
}

.inline-style-37 {
    color: #0ababa;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.inline-style-38 {
    color: #777;
    font-size: 14px;
}

.inline-style-39 {
    list-style: none;
    margin: 0;
    padding: 0;
}

.inline-style-40 {
    margin: 0.75rem 0;
}

.inline-style-41 {
    color: #0ca7cd;
    margin-right: 0.5rem;
}

.inline-style-42 {
    margin-bottom: 1rem;
}

.inline-style-43 {
    background: linear-gradient(135deg, #e5f7fb, #f0fcfd);
    border-radius: 6px;
    border: 1px solid #0ca7cd;
    margin: 0;
    padding: 1rem;
}

[data-theme="dark"] .inline-style-41 {
    color: #4dd4f5;
}

[data-theme="dark"] .inline-style-43 {
    background: linear-gradient(135deg, #0d2a30, #123a42);
    border: 1px solid #4dd4f5;
    color: var(--text-primary, #fff);
}

.inline-style-44 {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    margin-top: 1.5rem;
}

.inline-style-45 {
    color: #0ca7cd;
    margin-top: 0;
}

.inline-style-46 {
    margin: 0.5rem 0;
}

.inline-style-47 {
    color: #0ca7cd;
    text-decoration: none;
    word-break: break-all;
}

.inline-style-48 {
    padding-left: 0px;
    text-align: left;
}

.inline-style-49 {
    height: 100px;
}

.inline-style-50 {
    color: #495057;
    font-size: 1em;
}

.inline-style-51 {
    color: #2c3e50;
    font-size: 2em;
    margin-bottom: 25px;
}

.inline-style-52 {
    color: #39bdb7;
    margin-left: 10px;
}

.inline-style-53 {
    color: #dc3545;
}

.inline-style-54 {
    color: #dc3545;
    margin-left: 10px;
}

.inline-style-55 {
    font-family: monospace;
}

.inline-style-56 {
    background: rgba(255, 193, 7, 0.05);
    border-left: 3px solid #ffc107;
    padding-left: 12px;
}

.inline-style-57 {
    color: #ffc107;
}

.inline-style-58 {
    color: #dc3545;
    margin-left: 10px;
    margin-top: 5px;
}

.inline-style-59 {
    border-radius: 12px;
    margin: 0 auto 0 auto;
    max-width: 900px;
    padding: 2rem 1.5rem 1rem 1.5rem;
}

.inline-style-60 {
    margin-bottom: 0;
    text-align: center;
}

.inline-style-61 {
    color: #1a1a1a;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 0.8rem 0;
}

.inline-style-62 {
    color: #4a4a4a;
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
}

.inline-style-63 {
    max-width: 100%;
    padding-bottom: 0px;
    text-align: center;
}

.inline-style-64 {
    padding-top: 0px;
}

.inline-style-65 {
    margin-top: 0px;
    padding-top: 0px;
}

.inline-style-66 {
    margin-top: 0.5rem;
}

.inline-style-67 {
    text-align: right;
}

.inline-style-68 {
    margin-top: 0px;
}

.inline-style-69 {
    border-radius: 12px;
    margin: 0 auto;
    max-width: 900px;
    padding: 2rem 1.5rem;
}

.inline-style-70 {
    margin-bottom: 2rem;
    text-align: center;
}

.inline-style-71 {
    color: #1a1a1a;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 1rem 0;
}

.inline-style-72 {
    display: grid;
    gap: 2rem;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 1.5rem;
}

.inline-style-73 {
    background: #ffffff;
    border-left: 4px solid #26a7c5;
    border-radius: 8px;
    padding: 1.5rem;
}

.inline-style-74 {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
}

.inline-style-75 {
    background: #e8f7fb;
    border-radius: 8px;
    flex-shrink: 0;
    padding: 0.75rem;
}

.inline-style-76 {
    color: #26a7c5;
    font-size: 1.5rem;
}

.inline-style-77 {
    color: #1a1a1a;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 0.75rem 0;
}

.inline-style-78 {
    color: #4a4a4a;
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

.inline-style-79 {
    background: #f9feff;
    border-radius: 8px;
    border: 1px solid #e1f3f7;
    padding: 1.25rem 1.5rem;
}

.inline-style-80 {
    color: #4a4a4a;
    display: grid;
    font-size: 0.9rem;
    gap: 1.5rem;
    grid-template-columns: repeat(3, 1fr);
}

.inline-style-81 {
    align-items: center;
    display: flex;
    gap: 0.5rem;
}

.inline-style-82 {
    color: #26a7c5;
    font-size: 1.1rem;
}

/* Dark mode support for domain intro section */
[data-theme="dark"] .inline-style-71 {
    color: #e0e0e0;
}

[data-theme="dark"] .inline-style-73 {
    background: #2a2a2a;
    border-left: 4px solid #26a7c5;
}

[data-theme="dark"] .inline-style-75 {
    background: #1e3a4a;
}

[data-theme="dark"] .inline-style-77 {
    color: #e0e0e0;
}

[data-theme="dark"] .inline-style-78 {
    color: #b0b0b0;
}

[data-theme="dark"] .inline-style-79 {
    background: #2a2a2a;
    border: 1px solid #3a3a3a;
}

[data-theme="dark"] .inline-style-80 {
    color: #b0b0b0;
}

.inline-style-83 {
    font-size: 14px;
}

.inline-style-84 {
    font-size: 0.85rem;
    line-height: 1.3;
    padding-top: 14px;
    position: absolute;
    right: 1rem;
    text-align: right;
    top: 1rem;
}

.inline-style-85 {
    position: relative;
}

.inline-style-86 {
    margin: 2rem auto;
    max-width: 1000px;
    padding: 0 1.5rem;
}

.inline-style-87 {
    margin-bottom: 3rem;
    text-align: center;
}

.inline-style-88 {
    color: #1a1a1a;
    font-size: 2rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
}

.inline-style-89 {
    color: #666;
    font-size: 1.05rem;
    line-height: 1.6;
    margin: 0;
}

.inline-style-90 {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    margin-bottom: 3rem;
}

.inline-style-91 {
    background: #fff;
    border-radius: 12px;
    border: 2px solid #e5e5e5;
    padding: 2rem;
    position: relative;
    transition: all 0.3s ease;
}

.inline-style-92 {
    align-items: center;
    background: linear-gradient(135deg, #26a7c5 0%, #3fc0b4 100%);
    border-radius: 50%;
    box-shadow: 0 4px 12px rgba(38, 167, 197, 0.3);
    color: white;
    display: flex;
    font-size: 1.3rem;
    font-weight: 700;
    height: 45px;
    justify-content: center;
    left: 2rem;
    position: absolute;
    top: -20px;
    width: 45px;
}

.inline-style-93 {
    margin-top: 1.5rem;
}

.inline-style-94 {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.inline-style-95 {
    color: #26a7c5;
    font-size: 1.8rem;
}

.inline-style-96 {
    color: #1a1a1a;
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0;
}

.inline-style-97 {
    color: #666;
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

.inline-style-98 {
    background: linear-gradient(135deg, rgba(38, 167, 197, 0.08) 0%, rgba(63, 192, 180, 0.08) 100%);
    border-left: 4px solid #26a7c5;
    border-radius: 10px;
    margin-bottom: 2rem;
    padding: 2rem;
}

.inline-style-99 {
    align-items: start;
    display: flex;
    gap: 1.5rem;
}

.inline-style-100 {
    align-items: center;
    background: #26a7c5;
    border-radius: 50%;
    color: white;
    display: flex;
    flex-shrink: 0;
    height: 50px;
    justify-content: center;
    width: 50px;
}

.inline-style-101 {
    font-size: 1.5rem;
}

.inline-style-102 {
    color: #1a1a1a;
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0 0 0.75rem 0;
}

.inline-style-103 {
    color: #4a4a4a;
    font-size: 1rem;
    line-height: 1.6;
    margin: 0 0 0.5rem 0;
}

.inline-style-104 {
    margin-top: 3rem;
}

.inline-style-105 {
    color: #1a1a1a;
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0 0 1.5rem 0;
    text-align: center;
}

.inline-style-106 {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.inline-style-107 {
    border-radius: 10px;
    border: 1px solid #e5e5e5;
    padding: 1.5rem;
}

.inline-style-108 {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.inline-style-109 {
    color: #26a7c5;
    font-size: 1.3rem;
}

.inline-style-110 {
    color: #1a1a1a;
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

.inline-style-111 {
    color: #666;
    font-size: 0.9rem;
    line-height: 1.5;
    margin: 0;
}

.inline-style-112 {
    margin: 2rem auto 1rem;
    max-width: 900px;
    padding: 1rem;
    text-align: center;
}

.inline-style-113 {
    color: #666;
    font-size: 0.9rem;
    margin: 0 0 0.75rem 0;
}

.inline-style-114 {
    border-radius: 6px;
    border: 1.5px solid #26a7c5;
    color: #26a7c5;
    display: inline-block;
    font-size: 0.95rem;
    padding: 0.6rem 1.5rem;
    text-decoration: none;
    transition: all 0.3s ease;
}

.inline-style-115 {
    color: #333;
    font-size: 1.8rem;
    margin: 3rem 0 2rem 0;
    text-align: center;
}

.inline-style-116 {
    border: none;
    cursor: pointer;
}

.inline-style-117 {
    stop-color: #667eea;
    stop-opacity: 1;
}

.inline-style-118 {
    stop-color: #764ba2;
    stop-opacity: 1;
}

.inline-style-119 {
    margin-bottom: 1.5rem;
    margin-top: 0;
}

.inline-style-120 {
    margin-bottom: 20px;
}

.inline-style-121 {
    margin-top: 3rem;
    padding: 3rem 2rem;
    text-align: center;
}

.inline-style-122 {
    list-style: none;
    padding: 0;
}

.inline-style-123 {
    margin-top: 4rem;
}

.inline-style-124 {
    padding: 80px 0px;
}

.inline-style-125 {
    padding: 2rem 1rem !important;
}

.inline-style-126 {
    margin-bottom: 2rem;
}

.inline-style-127 {
    color: #e5e7eb;
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.inline-style-128 {
    color: #9ca3af;
    font-size: 1.1rem;
    line-height: 1.6;
    margin: 0 auto;
    max-width: 800px;
}

.inline-style-129 {
    margin-bottom: 3rem;
}

.inline-style-130 {
    background: linear-gradient(135deg, #1e3a5f 0%, #1a3353 100%);
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
}

.inline-style-131 {
    color: #60a5fa;
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
}

.inline-style-132 {
    color: #e5e7eb;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.inline-style-133 {
    color: #9ca3af;
    font-size: 0.9rem;
    line-height: 1.5;
}

.inline-style-134 {
    background: linear-gradient(135deg, #1e4d2b 0%, #164e28 100%);
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
}

.inline-style-135 {
    color: #34d399;
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
}

.inline-style-136 {
    background: linear-gradient(135deg, #78350f 0%, #92400e 100%);
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
}

.inline-style-137 {
    color: #fbbf24;
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
}

.inline-style-138 {
    background: #1a1a1a;
    border-radius: 16px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    margin-bottom: 3rem;
    padding: 2rem;
    border: 1px solid #374151;
}

.inline-style-139 {
    color: #e5e7eb;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    text-align: center;
}

.inline-style-140 {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    margin-top: 2rem;
}

.inline-style-141 {
    display: flex;
    gap: 1rem;
}

.inline-style-142 {
    align-items: center;
    background: #60a5fa;
    border-radius: 50%;
    color: #0f0f0f;
    display: flex;
    flex-shrink: 0;
    font-size: 1.2rem;
    font-weight: 700;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.inline-style-143 {
    color: #9ca3af;
    font-size: 0.9rem;
    line-height: 1.5;
}

.inline-style-144 {
    color: #e5e7eb;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.inline-style-145 {
    color: #9ca3af;
    font-size: 1rem;
    margin-bottom: 2rem;
}

.inline-style-146 {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    margin: 0 auto 3rem;
    max-width: 900px;
}

.inline-style-147 {
    background: #1a1a1a;
    border-radius: 12px;
    border: 2px solid #374151;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
    display: block;
    padding: 2rem 1rem;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
}

.inline-style-148 {
    align-items: center;
    background: linear-gradient(135deg, #0078d4 0%, #00bcf2 100%);
    border-radius: 16px;
    display: flex;
    height: 80px;
    justify-content: center;
    margin: 0 auto 1rem;
    width: 80px;
}

.inline-style-149 {
    color: white;
    font-size: 3rem;
}

.inline-style-150 {
    color: #e5e7eb;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.3rem;
}

.inline-style-151 {
    color: #9ca3af;
    font-size: 0.85rem;
}

.inline-style-152 {
    align-items: center;
    background: linear-gradient(135deg, #000000 0%, #333333 100%);
    border-radius: 16px;
    display: flex;
    height: 80px;
    justify-content: center;
    margin: 0 auto 1rem;
    width: 80px;
}

.inline-style-153 {
    align-items: center;
    background: linear-gradient(135deg, #FCC624 0%, #F89820 100%);
    border-radius: 16px;
    display: flex;
    height: 80px;
    justify-content: center;
    margin: 0 auto 1rem;
    width: 80px;
}

.inline-style-154 {
    color: #0f0f0f;
    font-size: 3rem;
}

.inline-style-155 {
    align-items: center;
    background: linear-gradient(135deg, #3DDC84 0%, #07C160 100%);
    border-radius: 16px;
    display: flex;
    height: 80px;
    justify-content: center;
    margin: 0 auto 1rem;
    width: 80px;
}

.inline-style-156 {
    align-items: center;
    background: linear-gradient(135deg, #147efb 0%, #53a0fd 100%);
    border-radius: 16px;
    display: flex;
    height: 80px;
    justify-content: center;
    margin: 0 auto 1rem;
    width: 80px;
}

.inline-style-157 {
    background: linear-gradient(135deg, #1e3a5f 0%, #1a3353 100%);
    border-left: 4px solid #60a5fa;
    border-radius: 8px;
    margin-bottom: 2rem;
    padding: 1.5rem;
}

.inline-style-158 {
    align-items: start;
    display: flex;
    gap: 1rem;
}

.inline-style-159 {
    color: #60a5fa;
    flex-shrink: 0;
    font-size: 1.5rem;
    margin-top: 0.2rem;
}

.inline-style-160 {
    color: #9ca3af;
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 0;
}

.inline-style-161 {
    padding: 2rem 0;
    text-align: center;
}

.inline-style-162 {
    color: #e5e7eb;
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.inline-style-163 {
    color: #9ca3af;
    font-size: 1rem;
    margin-bottom: 1.5rem;
}

.inline-style-164 {
    background: #60a5fa;
    border-radius: 8px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
    color: #0f0f0f;
    display: inline-block;
    font-weight: 600;
    padding: 12px 32px;
    text-decoration: none;
    transition: all 0.3s ease;
}
.inline-style-165 {
    margin-top: 40px;
}

.inline-style-166 {
    background: none !important;
    border: 2px solid #15a7c8;
    color: #15a7c8 !important;
}

.inline-style-167 {
    color: #fff;
    margin-top: 10px;
}

.inline-style-168 {
    padding-left: 35px;
    text-align: center;
    width: 100%;
}

.inline-style-169 {
    color: #39bdb7;
}

.inline-style-170 {
    color: var(--accent-color);
    text-decoration: underline;
}

.inline-style-171 {
    color: #26a7c5;
}

.inline-style-172 {
    color: #64748b;
    font-size: 0.85rem;
    margin-top: 15px;
}

.inline-style-173 {
    padding-bottom: 10px;
}

.inline-style-174 {
    display: none;
    margin-left: 0px;
}

.inline-style-175 {
    padding-left: 10px;
}

.inline-style-176 {
    float: left;
}

.inline-style-177 {
    margin-left: -55px;
    margin-top: -35px;
    position: absolute;
}

.inline-style-178 {
    margin-left: -35px;
    margin-top: -35px;
    position: absolute;
}

.inline-style-179 {
    padding-top: 15px;
    vertical-align: top;
}

.inline-style-180 {
    cursor: hand;
}

.inline-style-181 {
    background-color: #fee;
    border: 1px dotted #d00;
    display: none;
    margin-bottom: 10px;
    padding: 5px;
    width: 550px;
}

.inline-style-182 {
    clear: left;
}

.inline-style-183 {
    padding-bottom: 5px;
}

.inline-style-184 {
    padding: 0px;
    text-align: center;
}

.inline-style-185 {
    color: #555;
}

.inline-style-186 {
    padding: 0px;
}

.inline-style-187 {
    font-size: 12px;
    padding-bottom: 4px;
    padding-left: 35px;
}

.inline-style-188 {
    margin: 0px;
    padding: 0px;
    width: auto;
}

.inline-style-189 {
    padding-left: 25px;
    padding-top: 3px;
}

.inline-style-190 {
    background-color: #fee;
}

.inline-style-191 {
    font-size: 12px;
}

.inline-style-192 {
    background-color: <?php echo $freemin_color?>;
    float: left;
    height: 10px;
    margin-top: 3px;
    width: 10px;
}

.inline-style-193 {
    float: left;
    margin-left: 5px;
}

.inline-style-194 {
    background-color: <?php echo $freemax_color?>;
    float: left;
    height: 10px;
    margin-top: 3px;
    width: 10px;
}

.inline-style-195 {
    background-color: <?php echo $used_color?>;
    float: left;
    height: 10px;
    margin-top: 3px;
    width: 10px;
}

.inline-style-196 {
    background-color: <?php echo $extra_color?>;
    float: left;
    height: 10px;
    margin-top: 3px;
    width: 10px;
}

.inline-style-197 {
    padding-bottom: 4px;
    padding-left: 35px;
}

.inline-style-198 {
    float: left;
    padding-left: 5px;
    padding-top: 3px;
}

.inline-style-199 {
    cursor: hand;
    cursor: pointer;
    text-align: center;
    width: 80px;
}

.inline-style-200 {
    cursor: hand;
    cursor: pointer;
    text-align: center;
    width: 100px;
}

.inline-style-201 {
    padding: 0px 10px 30px 10px;
}

.inline-style-202 {
    color: #444;
    font-size: 12px;
    line-height: 150%;
}

.inline-style-203 {
    height: 40px;
    padding-bottom: 0px;
    width: 60px;
}

.inline-style-204 {
    <?php echo $css_add?>;
    background-color: <?php echo $colors[$n]?>;
    padding-bottom: 0px;
    padding-left: 20px;
    width: 90px;
}

.inline-style-205 {
    margin-left: -10px;
    margin-top: -35px;
    position: absolute;
}

.inline-style-206 {
    padding-top: 40px;
}

.inline-style-207 {
    margin: 0 auto;
    max-width: 900px;
    padding-top: 30px;
}

.inline-style-208 {
    font-size: 17px;
    line-height: 150%;
}

.inline-style-209 {
    background-color: #fff;
}

.inline-style-210 {
    padding-left: 20px;
}

.inline-style-211 {
    color: #fff;
    font-weight: normal;
}

.inline-style-212 {
    border: 0px;
    width: 200px;
}

.inline-style-213 {
    background-color: #83caff;
}

.inline-style-214 {
    background-color: #25aaaa;
}

.inline-style-215 {
    background-color: #004586;
}

.inline-style-216 {
    background-color: #002180;
}

.inline-style-217 {
    width: 200px;
}

.inline-style-218 {
    line-height: 0.42cm;
    margin-bottom: 0cm;
    orphans: 2;
    widows: 2;
}

.inline-style-219 {
    font-variant: normal;
}

.inline-style-220 {
    font-size: 9pt;
}

.inline-style-221 {
    letter-spacing: normal;
}

.inline-style-222 {
    font-style: normal;
}

.inline-style-223 {
    font-weight: normal;
}

.inline-style-224 {
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    letter-spacing: normal;
    line-height: 0.42cm;
    margin-bottom: 0cm;
    orphans: 2;
    widows: 2;
}

.inline-style-225 {
    text-decoration: none;
}

.inline-style-226 {
    font-size: 14px;
    padding-top: 30px;
    text-align: justify;
}

.inline-style-227 {
    opacity: 1;
    transform-style: preserve-3d;
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg);
}

.inline-style-228 {
    padding-top: 300px;
}

.inline-style-229 {
    font-weight: 600;
}

.inline-style-230 {
    text-align: center;
    width: 100%;
}

.inline-style-231 {
    display: inline-block;
}

.inline-style-232 {
    padding: 0px !important;
}

.inline-style-233 {
    margin: auto;
    width: 100%;
}

.inline-style-234 {
    max-width: calc(100% - 40px);
}

.inline-style-235 {
    font-size: 16px;
}

.inline-style-236 {
    font-size: 22px;
}

.inline-style-237 {
    margin-top: 20px;
}

.inline-style-238 {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
    color: #1f2937;
}

[data-theme="dark"] .inline-style-238 {
    color: #f9fafb;
}

.inline-style-239 {
    border-radius: 6px;
    border: 1px solid #ddd;
    font-size: 15px;
    padding: 18px;
    width: 100%;
    max-width: 400px;
    transition: all 0.2s;
    background: white;
    color: #1f2937;
}

.inline-style-239:focus {
    outline: none;
    border-color: #3dc1bb;
    box-shadow: 0 0 0 3px rgba(61, 193, 187, 0.1);
}

[data-theme="dark"] .inline-style-239 {
    background: #374151;
    border-color: #4b5563;
    color: #f9fafb;
}

[data-theme="dark"] .inline-style-239:focus {
    border-color: #3dc1bb;
    box-shadow: 0 0 0 3px rgba(61, 193, 187, 0.2);
}

[data-theme="dark"] .inline-style-239::placeholder {
    color: #9ca3af;
}

.inline-style-240 {
    font-size: 36px;
    margin-bottom: 10px;
    max-width: 100% !important;
}

.inline-style-241 {
    color: #777;
    font-size: 17px;
}

.inline-style-242 {
    padding-left: 20px;
    width: 700px;
}

.inline-style-243 {
    margin-right: 0px;
    padding-left: 10px;
    padding-left: 20px;
    position: relative;
    top: -20px;
}

.inline-style-244 {
    padding-left: 30px;
}

.inline-style-245 {
    font-size: 13px;
}

.inline-style-246 {
    animation-delay: 0.5s;
}

.inline-style-247 {
    animation-delay: 1s;
}

.inline-style-248 {
    animation-delay: 1.5s;
}

.inline-style-249 {
    animation-delay: 2s;
}

.inline-style-250 {
    animation-delay: 2.5s;
}

.inline-style-251 {
    animation-delay: 3s;
}

.inline-style-252 {
    animation-delay: 3.5s;
}

.inline-style-253 {
    animation-delay: 4s;
}

.inline-style-254 {
    animation-delay: 4.2s;
}

.inline-style-255 {
    animation-delay: 4.4s;
}

.inline-style-256 {
    padding-left: 15px;
    padding-top: 30px;
    width: 600px;
}

.inline-style-257 {
    padding: 180px 0px;
}



/* Remove outline from inputs on focus */
input:focus,
input[type=text]:focus,
input[type=email]:focus,
input[type=password]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=url]:focus,
textarea:focus,
select:focus {
    outline: none !important;
    -moz-outline-style: none;
}

/* Hide theme-language-panel on devices smaller than 425px */
@media screen and (max-width: 425px) {
    .info_block.theme-language-panel {
        display: none !important;
    }
}

/* Més espaiat entre icona i text al menu hamburguesa */
.sidebar a i, .sidebar div.n0 i {
    margin-right: 12px;
}

/* ================================================
   EFECTE FADE-IN SLIDE-DOWN (estil Claude.com)
   ================================================ */

/* Estat inicial - elements ocults */
.fade-slide-element {
  opacity: 0;
  transform: translateY(-30px);
  transition: opacity 1.8s cubic-bezier(0.16, 1, 0.3, 1), 
              transform 1.8s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

/* Estat visible - quan l'element entra al viewport */
.fade-slide-element.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Variants amb diferents delays per crear efecte cascada */
.fade-slide-element.delay-100 {
  transition-delay: 0.1s;
}

.fade-slide-element.delay-200 {
  transition-delay: 0.2s;
}

.fade-slide-element.delay-300 {
  transition-delay: 0.3s;
}

.fade-slide-element.delay-400 {
  transition-delay: 0.4s;
}

.fade-slide-element.delay-500 {
  transition-delay: 0.5s;
}

/* Variant més suau per elements menys importants */
.fade-slide-subtle {
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1), 
              transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

.fade-slide-subtle.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Variant més dramàtica per títols principals */
.fade-slide-dramatic {
  opacity: 0;
  transform: translateY(-50px);
  transition: opacity 2.0s cubic-bezier(0.16, 1, 0.3, 1), 
              transform 2.0s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

.fade-slide-dramatic.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Delays també per fade-slide-subtle */
.fade-slide-subtle.delay-100 {
  transition-delay: 0.1s;
}

.fade-slide-subtle.delay-200 {
  transition-delay: 0.2s;
}

.fade-slide-subtle.delay-300 {
  transition-delay: 0.3s;
}

.fade-slide-subtle.delay-400 {
  transition-delay: 0.4s;
}

.fade-slide-subtle.delay-500 {
  transition-delay: 0.5s;
}

/* Delays per fade-slide-dramatic */
.fade-slide-dramatic.delay-100 {
  transition-delay: 0.1s;
}

.fade-slide-dramatic.delay-200 {
  transition-delay: 0.2s;
}

[data-theme="dark"] .client-area section h2 {
  color: var(--text-primary-highlighted) !important;
  font-size: 2.3em !important;
  font-weight: 100;
  padding-bottom: 50px;
  margin-top: 10px;
}
/* Media queries responsive per a la pàgina de servei remot */

/* Tablets i pantalles mitjanes (max 992px) */
@media (max-width: 992px) {
    .inline-style-127 {
        font-size: 1.8rem !important;
    }

    .inline-style-128 {
        font-size: 1rem !important;
    }

    .inline-style-144 {
        font-size: 1.5rem !important;
    }

    .inline-style-146 {
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
        gap: 1.2rem !important;
    }

    .inline-style-147 {
        padding: 1.5rem 0.8rem !important;
    }

    .inline-style-148, .inline-style-152, .inline-style-153,
    .inline-style-155, .inline-style-156 {
        height: 70px !important;
        width: 70px !important;
    }

    .inline-style-149, .inline-style-154 {
        font-size: 2.5rem !important;
    }
}

/* Mòbils i pantalles petites (max 768px) */
@media (max-width: 768px) {
    .inline-style-125 {
        padding: 1.5rem 1rem !important;
    }

    .inline-style-127 {
        font-size: 1.6rem !important;
        line-height: 1.3 !important;
    }

    .inline-style-128 {
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
        max-width: 100% !important;
    }

    .inline-style-129 {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
        margin-bottom: 2rem !important;
    }

    .inline-style-130, .inline-style-134, .inline-style-136 {
        padding: 1.2rem !important;
    }

    .inline-style-131, .inline-style-135, .inline-style-137 {
        font-size: 2rem !important;
    }

    .inline-style-138 {
        padding: 1.5rem !important;
        margin-bottom: 2rem !important;
    }

    .inline-style-139 {
        font-size: 1.3rem !important;
    }

    .inline-style-140 {
        grid-template-columns: 1fr !important;
        gap: 1.2rem !important;
    }

    .inline-style-141 {
        gap: 0.8rem !important;
    }

    .inline-style-142 {
        height: 36px !important;
        width: 36px !important;
        font-size: 1.1rem !important;
    }

    .inline-style-144 {
        font-size: 1.4rem !important;
    }

    .inline-style-145 {
        font-size: 0.9rem !important;
        margin-bottom: 1.5rem !important;
    }

    .inline-style-146 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1rem !important;
        margin-bottom: 2rem !important;
    }

    .inline-style-147 {
        padding: 1.2rem 0.6rem !important;
    }

    .inline-style-148, .inline-style-152, .inline-style-153,
    .inline-style-155, .inline-style-156 {
        height: 60px !important;
        width: 60px !important;
        margin-bottom: 0.8rem !important;
    }

    .inline-style-149, .inline-style-154 {
        font-size: 2rem !important;
    }

    .inline-style-150 {
        font-size: 0.9rem !important;
    }

    .inline-style-151 {
        font-size: 0.75rem !important;
    }

    .inline-style-157 {
        padding: 1.2rem !important;
        margin-bottom: 1.5rem !important;
    }

    .inline-style-158 {
        flex-direction: column !important;
        gap: 0.8rem !important;
    }

    .inline-style-159 {
        font-size: 1.3rem !important;
        margin-top: 0 !important;
    }

    .inline-style-160 {
        font-size: 0.85rem !important;
    }

    .inline-style-161 {
        padding: 1.5rem 0 !important;
    }

    .inline-style-162 {
        font-size: 1.2rem !important;
    }

    .inline-style-163 {
        font-size: 0.9rem !important;
    }

    .inline-style-164 {
        padding: 10px 24px !important;
        font-size: 0.95rem !important;
    }
}

/* Mòbils molt petits (max 480px) */
@media (max-width: 480px) {
    .inline-style-125 {
        padding: 1rem 0.8rem !important;
    }

    .inline-style-127 {
        font-size: 1.4rem !important;
    }

    .inline-style-128 {
        font-size: 0.9rem !important;
    }

    .inline-style-130, .inline-style-134, .inline-style-136 {
        padding: 1rem !important;
    }

    .inline-style-131, .inline-style-135, .inline-style-137 {
        font-size: 1.8rem !important;
        margin-bottom: 0.4rem !important;
    }

    .inline-style-132 {
        font-size: 0.9rem !important;
    }

    .inline-style-133 {
        font-size: 0.85rem !important;
    }

    .inline-style-138 {
        padding: 1.2rem !important;
    }

    .inline-style-139 {
        font-size: 1.2rem !important;
    }

    .inline-style-144 {
        font-size: 1.3rem !important;
    }

    .inline-style-146 {
        grid-template-columns: 1fr !important;
        gap: 0.8rem !important;
    }

    .inline-style-147 {
        padding: 1rem 0.5rem !important;
        display: flex !important;
        align-items: center !important;
        gap: 1rem !important;
        text-align: left !important;
    }

    .inline-style-148, .inline-style-152, .inline-style-153,
    .inline-style-155, .inline-style-156 {
        height: 50px !important;
        width: 50px !important;
        margin: 0 !important;
        flex-shrink: 0 !important;
    }

    .inline-style-149, .inline-style-154 {
        font-size: 1.6rem !important;
    }

    .inline-style-150 {
        font-size: 0.85rem !important;
        margin-bottom: 0.2rem !important;
        text-align: left !important;
    }

    .inline-style-151 {
        font-size: 0.7rem !important;
        text-align: left !important;
    }

    .inline-style-157 {
        padding: 1rem !important;
    }

    .inline-style-162 {
        font-size: 1.1rem !important;
    }

    .inline-style-164 {
        padding: 10px 20px !important;
        font-size: 0.9rem !important;
        width: 100% !important;
        max-width: 280px !important;
    }
}

/* Ajustaments addicionals per millor experiència mòbil */
@media (max-width: 768px) {
    #servei-remot h1, #servei-remot h2, #servei-remot h3, #servei-remot h4 {
        word-wrap: break-word !important;
        hyphens: auto !important;
    }

    #servei-remot .maxsize {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

/* ============================================================================
   UTILITY CLASSES - Display
   ============================================================================ */

.u-d-none { display: none !important; }
.u-d-block { display: block !important; }
.u-d-inline { display: inline !important; }
.u-d-inline-block { display: inline-block !important; }