/* available tags for easy color changing;
  For the bar background color, search for            BAR COLOR
  For the bar text color                              BAR TEXT COLOR
  For the bar link color and icon                     BAR INFO LINK
  For the background color of the form                FORM COLOR
  For the Checkbox-Label color                        FORM LABEL COLOR
  For the extra information color near a checkbox     FORM INFO COLOR
  For the color of the generic more info link         FORM MORE INFO COLOR
  For the color of the no-permission-required notice  FORM NOTICE COLOR
  <a onclick="document.getElementById(&quot;cookie_opt_in_top_bar_container&quot;).style.display = &quot;block&quot;; document.getElementById(&quot;cookie_opt_in_container&quot;).style.display = &quot;block&quot;" href="#">Texte du lien</a>
*/
body {
  position: relative;
}
#cookie_opt_in {
    padding-bottom: 10px;
}

#cookie_opt_in_top_bar_container {
  background-color: #efefef; /* BAR COLOR */
}
#cookie_opt_in_container h1 {
  color: #404040; /* BAR TEXT COLOR */
}
#cookie_opt_in_container .coia-show-details {
  color: #404040; /* BAR INFO LINK */
}
#cookie_opt_in_container form {
  background: #efefef
; /* FORM COLOR */
  color: #404040; /* FORM TEXT COLOR */
}
#cookie_opt_in_container form label {
  color: #404040; /* FORM LABEL COLOR */
}
#cookie_opt_in_container .checkbox .info {
  color: #404040; /* FORM INFO COLOR */
}
#cookie_opt_in_container .checkbox .info .always-on{
  color: #404040; /* FORM NOTICE COLOR */
}
#cookie_opt_in_container a,
#cookie_opt_in_toggle {
  color: #404040; /* FORM MORE INFO COLOR */
}

#cookie_opt_in_toggle{
  display: none;
}

/* No more colors after this line */

#cookie_opt_in_top_bar_container *,
#cookie_opt_in_anchor * {
  font-family:  Arial;
  color: #efefef;
}

#cookie_opt_in_anchor {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10000;
  height: 30px;
  width: 30px;
}

body.admin-bar #cookie_opt_in_anchor {
  /*top: 28px;*/
}

#cookie_opt_in_toggle {
  text-indent: 55px;
  position: absolute;
  white-space: nowrap;
  overflow: hidden;
  top: 0;
  right: 0;
  z-index: 10001;
  height: 44px;
  width: 44px;
  background: url(cls-anchor.png) no-repeat;
  -webkit-transition: all 350ms ease-in-out;
  -moz-transition: all 350ms ease-in-out;
  -ms-transition: all 350ms ease-in-out;
  -o-transition: all 350ms ease-in-out;
  transition: all 350ms ease-in-out;
  font-size: 12px;
  line-height: 40px;
}

#cookie_opt_in_toggle:hover {
/*  background: #FFE800 url('yellow-button.png') bottom repeat-x;*/
  width: 180px;
  text-decoration: none;
  -webkit-transition: all 350ms ease-in-out;
  -moz-transition: all 350ms ease-in-out;
  -ms-transition: all 350ms ease-in-out;
  -o-transition: all 350ms ease-in-out;
  transition: all 350ms ease-in-out;
}

#cookie_opt_in_top_bar_container {
  text-align: left;
  position: absolute;
  z-index: 10002;
  zoom: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: auto; /* responsive */
  border-bottom: 1px solid #000;
  position : fixed;
}

body.admin-bar #cookie_opt_in_top_bar_container {
  /*top: 28px;*/
}

#cookie_opt_in_container {
  padding: 0 10px 0 40px;
}

#cookie_opt_in_container a {
  text-decoration: none;
}

#cookie_opt_in_container a:hover {
  text-decoration: underline;
}

#cookie_opt_in_container h1 {
  padding: 12px 0 8px;
  font-size: 14px;
  text-shadow: grey;
  float: left;
  text-transform: inherit;
  margin: inherit;
}

#cookie_opt_in_container form h1 {
  float: none;
  clear: none;
  padding-left: 40px;
}

#cookie_opt_in_container .coia-bar-buttons {
  float: right;
  padding-top: 20px;
}

#cookie_opt_in_container .coia-bar-buttons input {
  width: auto;
  border: 0;
  padding: 0;
  margin: 0;
}

#cookie_opt_in_container button.button {
  font-family:  Arial;
  font-size: 14px;
  border: 0;
  min-width: 60px;
  cursor: pointer;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

#cookie_opt_in_container button.coia-accept-all, #cookie_opt_in_container button.coia-ok{
  background-color: #FAE600;
  min-height: 30px;
  font-family: Arial;
  font-style: normal;
  color: #404040;
  text-decoration: none;
  border: none;
  text-transform: inherit;
  margin-bottom: 20px;
}

.lang-nl #cookie_opt_in_container button.coia-accept-all {
  background: transparent url(cls-accept-nl_NL.png) no-repeat left top;
}

#cookie_opt_in_container button.coia-ok{
  background-color: #FAE600;
  min-height: 30px;
  font-family: Arial;
  font-style: normal;
  color: #404040;
  text-decoration: none;
  border: none;
  text-transform: inherit;
}

#coia-ok {display: none}

.lang-nl #cookie_opt_in_container button.coia-ok {
  background: transparent url(cls-save-nl_NL.png) no-repeat left top;
}

#cookie_opt_in_container button.hover,
#cookie_opt_in_container button.button:hover {
  background-color: #D3D3D3;
  background-position: left bottom;
}

#cookie_opt_in_container label {
  font-size: 12px;
  text-shadow: grey;
  text-align: center;
}

#cookie_opt_in_container label .qmark {
  display: none;
}

#cookie_opt_in_container form {
  display: none;
  background: #efefef;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

#cookie_opt_in_container form .coia-bar-buttons {
  margin-right: 10px;
}


#cookie_opt_in_container span.checkbox {
  width: auto;
  height: auto;
  display: block;
  clear: both;
  margin-left: 40px;
  position: relative;
  line-height: 18px;
  margin-bottom: 5px;
}

#cookie_opt_in_container span.checkbox input {
  position: absolute;
  left: 0;
  top: 3px;
  width: auto;
  padding: 0;
  margin: 0;
}

#cookie_opt_in_container span.checkbox label,
#cookie_opt_in_container span.checkbox .info {
  margin-left: 30px;
}

#cookie_opt_in_container span.checkbox label {
  font-weight: bold;
}

#cookie_opt_in_container input.button {
  width: auto;
  font-size: 12px;
  min-width: 50px;
}

#cookie_opt_in_container input#coia-accept-all, #cookie_opt_in_container input#coia-deny-all {
  width: 48%;
  font-size: 12px;
  margin-left: 1%;
}

#cookie_opt_in_container .checkbox .info {
  display: block;
  clear: both;
  padding-right: 300px;
  max-width: 800px;
  _width: 800px;
  font-size: 12px;
}

#cookie_opt_in_container .checkbox .info .always-on{
  clear: both;
  display: block;
}

#cookie_opt_in_container .checkbox .info .more {
  float: right;
}

#cookie_opt_in_container a.generic-more {
  margin-left: 70px;
  padding: 10px 0 40px;
  display: block;
}

#cookie_opt_in_container .coia-show-details {
  background: url(cls-plus-min.png) no-repeat right -23px;
  padding-right: 30px;
  padding-left: 10px;
}

#cookie_opt_in_container .coia-hide-details {
  background: url(cls-plus-min.png) no-repeat right -2px;
  padding-right: 30px;
}

/* RESPONSIVE */
@media only screen and (max-width : 640px) {

  #coia-ok {

      display: inherit;
      background-color: #FAE600;
      min-height: 30px;
      font-family: Arial;
      font-style: normal;
      color: #404040;
      text-decoration: none;
      border: none;
      text-transform: inherit;
      margin-top: 10px;
      margin-right: 10px;
      float: right;
  }

  #coia-ok:hover{
      background-color: #D3D3D3;
  }

  #cookie_opt_in_container button.coia-ok{
      display : none;
  }

  #cookie_opt_in_container .coia-bar-buttons {
    float: none;
    clear: both;
  }
  #cookie_opt_in_container .checkbox .info {
    margin: 0 auto;
    padding: 0;
  }
  #cookie_opt_in_container span.checkbox {
    margin: 10px 0 0;
    padding: 0 40px;
  }
  #cookie_opt_in_container span.checkbox input {
    position: relative;
    margin-right: 10px;
  }
  #cookie_opt_in_container span.checkbox label, #cookie_opt_in_container span.checkbox .info {
    margin: 0;
  }
  #cookie_opt_in_container a.generic-more {
    margin: 0;
  }
  #cookie_opt_in_container form h1 {
    padding-right: 40px;
  }
  #cookie_opt_in_container form .coia-bar-buttons {
    margin: 0;
  }
  #cookie_opt_in_container h1 {
    text-align: center;
  }
  #cookie_opt_in_top_bar_container {
    text-align: center;
  }
  #cookie_opt_in_container {
    padding: 0 20px;
  }

  #cookie_opt_in_container button.coia-accept-all{
      float: right;
      margin-top: 10px;
  }
} /* 640 */