/**************************************************
 *
 * BASE CSS
 *
 **************************************************/

* {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}


/**************************************************
 *
 * Färger
 *
 **************************************************/

.color-krisgul1-bg { background-color: #ed6f51; }
.color-krisgul2-bg { background-color: #fff5cc; }
.color-kommunbla-bg { background-color: #0069a9; }
.color-morkbla-bg { background-color: #173d49; }
.color-ljusbla-bg { background-color: #4d96c3; }
.color-morkgra-bg { background-color: #3c3c3b; }
.color-ljusgra-bg { background-color: #706f6f; }
.color-sjalvservicegul1-bg { background-color: #f8bd59; }
.color-sjalvservicegul2-bg { background-color: #fdebcc; }
.color-rod-bg { background-color: #ed6f51; }
.color-ljusrod-bg { background-color: #f39a85; }
.color-gra-bg { background-color: #f2f2f2; }

.color-prim-black { color: #333; }
.color-prim-yellow { color: #fc0; }
.color-prim-red { color: #d61828; }
.color-prim-blue { color: #069; }
.color-prim-turquoise { color: #009991; }
.color-sec-gray { color: #dcdcdc; }
.color-sec-gold { color: #e5ce8f; }
.color-sec-red { color: #de4653; }
.color-sec-blue { color: #3385ad; }

.color-prim-black-bg { background-color: #333; }
.color-prim-yellow-bg { background-color: #fc0; }
.color-prim-red-bg { background-color: #d61828; }
.color-prim-blue-bg { background-color: #069; }
.color-prim-turquoise-bg { background-color: #009991; }
.color-sec-gray-bg { background-color: #dcdcdc; }
.color-sec-gold-bg { background-color: #e5ce8f; }
.color-sec-red-bg { background-color: #de4653; }
.color-sec-blue-bg { background-color: #3385ad; }
.color-sec-yellow-bg { background-color: #e6644e; }
.color-gray-bg { background-color: #f2f2f2; }
.color-yellow-bg { background-color: #f5e9e9; }
.color-alarm-pink-bg { background-color: #fae9eb; }
.color-alarm-red { color: #b20e0e; }
.color-info-yellow-bg { background-color: #fffae6; }
.color-info-gold-bg { background-color: #e5c58f; }
.color-sec-turquoise-bg { background-color: #45b1ab; }


/***************************
 * Typsnitt, formatmallar
 ***************************/
body,
.dummybody,
.normal,
body a,
.dummybody a,
.rubrikx2,
.ingress,
.heading,
h1,
h2 {
    font-family: 'Open Sans', sans-serif;
}

p {
    font-size: 1em;
    line-height: 1.5em;
}


/**************************************************
 * MailLänkar och telefonlänkar i allmänhet
 **************************************************/

a[href^="mailto"] {
   text-decoration: underline;
   color: #00659E;
}

a[href^="mailto"]:hover {
   text-decoration: none;
   color: #00659E!important;
   background-color:#fff!important;
}

a[href^="tel"] {
   text-decoration: underline;
   color: #00659E;
}

a[href^="tel"]:hover {
   text-decoration: none;
   color: #00659E!important;
   background-color:#fff!important;
}


/**************************************************
 * Punkter och listor
 **************************************************/

li {
    line-height: 1.5em;
}
.normal li {
    line-height: 1.5em;
    padding-bottom: 1.5em;
}


/**************************************************
 * Centrera bilder etc
 **************************************************/

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}


/**************************************************
 * Luft under bilder
 **************************************************/

.sv-image-portlet {
  margin-bottom: 1.2rem;
}


/**************************************************
 * Desktop-bredd
 **************************************************/

@media (min-width: 769px) and (max-width: 2600px) {
    .width-desktop {
        width: 75%;
    }
}


/**************************************************
 * Tabellrubriker
 **************************************************/

table caption {
   font-size: 1.125rem;
}


/**************************************************
 * RUBRIKER – desktopanpassning
 **************************************************/

h1 {
  font-size: 2.5rem;
  line-height: 3.75rem; /* 2.5 * 1.5 */
  font-weight: 700;
  font-family: 'Open Sans', sans-serif;
  color: #3c3c3b;
}

h2 {
  font-size: 1.5rem;
  line-height: 2.25rem; /* 1.5 * 1.5 */
  font-weight: 700;
  font-family: 'Open Sans', sans-serif;
  color: #3c3c3b;
}


/**************************************************
 * MOBILANPASSNING H1 och H2
 **************************************************/

@media screen and (max-width: 480px) {

  h1 {
    font-size: 1.8rem !important;
    line-height: 2.7rem; /* 1.8 * 1.5 */
    font-weight: 700;
    font-family: 'Open Sans', sans-serif;
    color: #3c3c3b;
  }

  h2.subheading {
    font-size: 1.2rem !important;
    line-height: 1.8rem; /* 1.2 * 1.5 */
    font-weight: 700;
    font-family: 'Open Sans', sans-serif;
    color: #3c3c3b;
  }

}
