@charset "utf-8";
/* CSS
Customer Services EU
v1.1
https://www.clarks.eu/assets/servicepages/customer-care/customer-services-ss17-wk-05-eu.css


*/
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,100,700);

/* Fix for odd text resive behaviour in iphones in landscape orientation */
  @media only screen and (min-width : 320px) and (max-width : 736px) {
    body {-webkit-text-size-adjust: none;}
  }


/* Main static */
#the-static {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto 0;
  padding: 0;
  background: #fff;
  float: none;
  text-align: center;
}
   
#the-static div {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

img {
  border: none;
  margin: 0 auto;
}

.clear {
  clear: both;
}
  .clear-min-height {
    height: 0.1em;
  }

:focus {
  -moz-outline-style:none;
}

.pageLabel--customer-service h1 {
  color: #666666;
  text-transform: uppercase;
  font-size: 28px;
  letter-spacing: 2px;
  font-weight: 300;
  font-family: Lato-Light,Lato;  
  border-bottom: 1px solid #ccc;
  max-width: 1300px;
  line-height: 4em;
  padding-left: 1em;
  margin: 0 auto;
}

  @media all and (max-width: 380px ) {
    .pageLabel--customer-service h1 {
      font-size: 24px;
      line-height: 3.5em;
      padding: 0;
      margin: 0 auto;
      text-align: center;
    }  
  }

/* Articles using flex*/

.cs-flex-items {
  width: 100%;
  padding: 0;
  margin: 0 auto;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
   flex-flow: row wrap;
/*  align-content: center;*/
  -webkit-justify-content: space-between;
  justify-content:         space-between;  
/*  flex-wrap: wrap;*/
  text-align: center;
}
  .cs-flex-items .cs-item {
    width: 100%;
    max-width: 340px;
/*    background: #efe8e8;*/
    margin: 1em auto;
    padding: 0 1em 3em;
  }
    /* flex item overides for safari */
    @supports (display: -webkit-flex) {
      .cs-flex-items .cs-item {
        width: 32%;
        margin-left: 1%;
      }
    }
      @supports (display: -webkit-flex) {
        @media all and (max-width: 766px) {      
          .cs-flex-items .cs-item {
            width: 100%;
            max-width: 320px;
            display: inline-block;
            vertical-align: top;
            margin: 1em auto;
          }
        }
      }

.cs-flex-items .cs-item h2,
.cs-flex-items .cs-item li,
.cs-flex-items .cs-item p {
  color: #333;
  letter-spacing: 2px;
  font-family: Lato-light, Lato, Arial;
}
  .cs-flex-items .cs-item li,
  .cs-flex-items .cs-item p {
    line-height: 1.6em;
  }
    .cs-flex-items .cs-item-6 p span {
      display: block;
      font-weight: 600;
      font-family: Lato, Lato-light, Arial;
    }

    .cs-flex-items .cs-item ul,
    .cs-flex-items .cs-item li {
      list-style: none;
      text-align: center;
      margin: 0;
      padding: 0;
    }

.cs-flex-items .cs-item h2 {
  font-size: 1.25em;
  text-transform: uppercase;
  margin-bottom: 1.5em;
}
  .cs-flex-items .cs-item h2 span {
    text-transform: lowercase;
  }
    .cs-flex-items .cs-item a {
      color: #046bb9;
      display: inline-block;
      text-decoration: none;
      font-weight: 300;
      letter-spacing: 2px;
      font-family: Lato-light, Lato, Arial;      
    }

/* Sap messaging */
#sap-wkd-banner {
  width: 100%;
  max-width: 1300px;
  margin: auto;
  padding: 1em;
}
  #sap-wkd-banner p {
     color: red;
  }
     #sap-wkd-banner p.sap-skd-banner-line1 {
        font-weight: bold;
     }


#the-static a {
    text-decoration: underline;
}

#the-static a:hover {
    text-decoration: none;
}
