

/***********************************************************************
 * Organization code: sollentunadans
 * Template code name: gron
 * Last generated: 2025-11-03 15:16:07
 ***********************************************************************/


/***********************************************************************
 * Auto generated css-code for shop from settings in selected layout
 ***********************************************************************/

    .cwBody,
    .cwBody A,
    .cwBody A:hover,
    .cwBody A:visited {
        color : black;
    }
    .cwArea .regIcon,
    .cwVisibleForm,
    .cwFormCenter,
    .cwControlAreaTop,
    .cwControlAreaBottom,
    .cwInputArea,
    .cwInfoArea,
    .cwDataArea,
    .cwArea .shopSearchForm,
    .cwArea .shopSearchFormBasic,
    .cwArea .shopSearchFormAdvanced,
    .cwArea DIV.filterOptionFramed:hover,
    .cwTerms,
    .cwArea HR {
        border-color : #DADADA;
    }
    .cwArea .regIcon {
        background-color : #E8E8E8;
    }
    .cwControlAreaTop {
        background-color : #E8E8E8;
        background: -moz-linear-gradient(top, #E8E8E8 0%,#F0F0F0 43%,#F0F0F0 57%,#E8E8E8 100%);
        background: -webkit-linear-gradient(top, #E8E8E8 0%,#F0F0F0 43%,#F0F0F0 57%,#E8E8E8 100%);
        background: -o-linear-gradient(top, #E8E8E8 0%,#F0F0F0 43%,#F0F0F0 57%,#E8E8E8 100%);
        background: -ms-linear-gradient(top, #E8E8E8 0%,#F0F0F0 43%,#F0F0F0 57%,#E8E8E8 100%);
        background: linear-gradient(to bottom, #E8E8E8 0%,#F0F0F0 43%,#F0F0F0 57%,#E8E8E8 100%)
    }
    .cwControlAreaTop,
    .cwArea .shopSearchFormBasic,
    .cwArea .regIcon {
        color : black;
    }
    DIV.filterOptionFramed:hover {
        background-color : #FAFAFA;
    }
    .cwControlAreaBottom,
    .cwVisibleForm,
    .cwInfoArea,
    .cwInputArea {
        background-color : #FAFAFA;
        background: -moz-linear-gradient(left, #F4F4F4 0%,#FAFAFA 250px);
        background: -webkit-linear-gradient(left, #F4F4F4 0%,#FAFAFA 250px);
        background: -o-linear-gradient(left, #F4F4F4 0%,#FAFAFA 250px);
        background: -ms-linear-gradient(left, #F4F4F4 0%,#FAFAFA 250px);
        background: linear-gradient(to right, #F4F4F4 0%,#FAFAFA 250px)
    }
    .cwhc_Question:hover,
    .cwTerms,
    .cwArea .shopSearchFormAdvanced,
    .cwDataArea {
        background-color : #F6F6F6;
        background: -moz-linear-gradient(left, #F3F3F3 0%,#F6F6F6 80%);
        background: -webkit-linear-gradient(left, #F3F3F3 0%,#F6F6F6 80%);
        background: -o-linear-gradient(left, #F3F3F3 0%,#F6F6F6 80%);
        background: -ms-linear-gradient(left, #F3F3F3 0%,#F6F6F6 80%);
        background: linear-gradient(to right, #F3F3F3 0%,#F6F6F6 80%)
    }

/***********************************************************************
 * Manually added css-code in selected layout
 ***********************************************************************/

/***********************************************************************
 * Anpassad stil för Sollentuna Dans & Scenskola – CogWork bokning
 ***********************************************************************/

/* Grundfärger */
:root {
  --primary-bg: #ffffff;
  --accent-light: #CDDCD1;
  --accent-dark: #a3c0b2;
  --text-dark: #000000;
  --border-light: #dadada;
}

/* Bakgrund och text */
.cwBody {
  background-color: var(--primary-bg);
  color: var(--text-dark);
  font-family: 'Agrandir', sans-serif;
}

/* Länkar */
.cwBody a {
  color: var(--text-dark);
  text-decoration: none;
  font-weight: 500;
}
.cwBody a:hover {
  color: var(--text-dark);
  background-color: var(--accent-light);
  border-radius: 4px;
}

/* Knappar */
button,
input[type="submit"],
.cwRegButton,
.cwFormButton,
a.cwButton {
  background-color: var(--accent-light);
  color: var(--text-dark);
  padding: 10px 20px;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  transition: background-color 0.3s ease;
  font-family: 'Agrandir', sans-serif;
}

button:hover,
input[type="submit"]:hover,
.cwRegButton:hover,
.cwFormButton:hover,
a.cwButton:hover {
  background-color: var(--accent-dark);
}

/* Områden */
.cwControlAreaTop,
.cwControlAreaBottom,
.cwInputArea,
.cwInfoArea,
.cwVisibleForm,
.cwDataArea {
  background-color: #f9f9f9;
  border: 1px solid var(--border-light);
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 20px;
}

/* Formulär */
input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
  border: 1px solid var(--border-light);
  border-radius: 6px;
  padding: 10px;
  font-family: 'Agrandir', sans-serif;
  width: 100%;
  box-sizing: border-box;
}

/* Tabellen */
table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
  font-size: 15px;
}
th, td {
  border: 1px solid #eee;
  padding: 12px;
  text-align: left;
}

tr:nth-child(even) {
  background-color: #f6f6f6;
}

tr:hover {
  background-color: #e6f0ec;
}

/* Frågeikoner och filter */
.cwhc_Question:hover,
DIV.filterOptionFramed:hover {
  background-color: var(--accent-light);
  cursor: pointer;
}

/* Avslutande finjusteringar */
.cwTerms,
.cwArea hr {
  border-color: var(--border-light);
}