
/* ------------------------------------------------------------------------------------------------------------------ */

/* GF-Replace 31.12.2022 */
@font-face {
   font-family:'Roboto';
   font-style: normal;
   font-weight: 400;
   src: local('Roboto'), local('Roboto-Regular'), url('https://autohifi-bergedorf.de/css/fonts/roboto-regular.woff2') format('woff2');
}
@font-face {
   font-family:'Roboto';
   font-style: normal;
   font-weight: 700;
   src: local('Roboto Bold'), local('Roboto-Bold'), url('https://autohifi-bergedorf.de/css/fonts/roboto-bold.woff2') format('woff2');
}
@font-face {
   font-family:'Varela Round';
   font-style: normal;
   font-weight: 400;
   src: local('Varela Round'), local('Varela-Round'), url('https://autohifi-bergedorf.de/css/fonts/varelaround-regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url('https://autohifi-bergedorf.de/css/fonts/material-icons.woff2') format('woff2');
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
}
/* /GF-Replace */

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  /* word-wrap: break-word; */
  border: none;
}

html {
  color: #333333;
  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 100.01%;
  line-height: 1.5;
  font-weight: 400;
  overflow-x: scroll;
  overflow-y: scroll;
  /* -webkit-text-size-adjust: auto; */
  -webkit-text-size-adjust: none;

  height: 100%;
}

body {
  /* */
  background-color: #FFF;
  background-color: rgba(255,255,255,1.0);

  /* background-image: ;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -ms-background-size: cover;
  -khtml-background-size: cover; */

  cursor: auto;

  height: 100%;
}

::-moz-selection { background-color: #F3F3F3; background-color: rgba(243,243,243,1.0); color: #333333; }
::selection { background-color: #F3F3F3; background-color: rgba(243,243,243,1.0); color: #333333;  }

p, li, label, input, textarea, select, option {
  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;  /* textarea Xcheck! */
  /* font-size: 0.85rem !important; */
  font-size: 1rem !important;
  /* line-height: 1.7rem !important; */ /* 2 zeilig */
  /* line-height: 1.5rem !important; */ /* 1,75 zeilig */
  line-height: 1.5 !important;
}
@media (max-width: 500px) {
  #ImgVAM p,
  p.textblock,
  #Impressum p,
  #AGB p {
  /* text-align: justify; */
  /* text-align-last: justify;
  -moz-text-align-last: justify; */
  }
}
ul {
  list-style: none;
}
h1, h2, h3, h4, p, li, a.button {
  /* margin: 0 0 1.7rem 0; */ /* unten: wie Standard line-height */
  margin: 0 0 1.5rem 0; /* unten: wie Standard line-height */
}
div.articletext ul li {
  margin: 0; /* 08.11.2023 */
}
fieldset, input[type="submit"] {
  margin: 0 0 1.5rem 0; /* unten: wie Standard line-height */
}
fieldset {
  border: 0.075rem solid transparent;
}
label {
  width: 100%;
  clear: both;
}

h1, h2, h3, h4 {
  /* font-family: 'Roboto', 'Open Sans', Arial, Helvetica, sans-serif;
  font-family: 'Roboto Condensed', 'Open Sans', Arial, Helvetica, sans-serif;
  font-family: 'Days One', 'Open Sans', Arial, Helvetica, sans-serif; */
  font-family: 'Varela Round', 'Open Sans', Arial, Helvetica, sans-serif;

  font-weight: 400;
  line-height: 1.2;
  clear: both;
}
h1 {
  /* margin: 0.25rem 0 2.025rem 0; */ /* unten: p margin x 1,5 */
  /* font-size: 2.55rem; */ /* p x 3 */
  /* font-size: 2.5rem; */ /* p x 2,5 */
  /* letter-spacing: 0.02rem; */
  /* font-weight: 700; */
  font-size: xx-large;
  font-weight: 700;
  /* width: 100%;
  clear: both;
  float: left; */
  word-wrap: break-word;

  /* hyphens */
  -moz-hyphens: manual;
  -o-hyphens: manual;
  -webkit-hyphens: manual;
  -ms-hyphens: manual;
  hyphens: manual;
}
@media (max-width: 640px) {
  h1 {
    /* word-wrap: normal; */
    /* hyphens
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto; */
 }
}
h2, h3, h4 {
  /* font-size: 1.7rem; */ /* p x 2 */
  /* font-size: 1.75rem; */ /* p x 1,75 */
  /* letter-spacing: 0.02rem; */
  font-size: x-large;
}
@media (max-width: 770px) {
  h1 {
    font-size: x-large;
  }
  h2, h4 {
    font-size: large;
  }
}

code {
  font-size: 1.15rem !important;
  line-height: 1.5 !important; /* 1,5 zeilig */
}

label,
input,
select,
textarea  {
  -webkit-appearance: none;
  border-radius: 0;
  float: left;
}
select  {
  -webkit-appearance: menulist;
}

/* input[type="radio"], input.radio, input[type="checkbox"], input.checkbox */
input, textarea {
  border-radius: 0.125rem !important;
  border: 0.075rem solid transparent;
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  margin: 0 0 1.5rem 0;
  vertical-align: middle;
  width: 100%;
}

input[type="text"],
input.text,
input[type="password"],
input.password {
  padding: 0 0.5rem;
}

textarea {
  padding:  0.5rem;
}

input[type="radio"],
input.radio {
  border: 0.075rem solid #F3F3F3;
  width: auto;
  -webkit-appearance: radio;
}
input[type="checkbox"],
input.checkbox {
  border: 0.075rem solid #F3F3F3;
  width: auto;
  -webkit-appearance: checkbox;
}

input[type="text"],
input[type="password"] {
  height: 2.55rem; /* 0,85 x 3 */
}

#IDArticle2Basket fieldset {
  margin: 0;
}
#IDArticle2Basket label {
  margin-right: 0.85rem;
  width: auto;
  clear: none;
}
#IDArticle2Basket input[type="text"] {
  text-align: center;
  width: 3rem;
  height: 2.55rem; /* 0,85 x 3 */
}
#IDArticle2Basket input[type="text"].rejected {
  border: 0.075rem solid #CC0000;
}
#IDArticle2Basket label.ordered::after {
  /* color: #223556; */

  font-family: 'Material Icons';
  font-feature-settings: 'liga'; /* IE */
  content: 'schedule';
  position: relative;
  left: 0.2125rem;
}
#IDArticle2Basket label.rejected::after {
  font-weight: 700;
  content: '?';
  position: relative;
  left: 0.2125rem;
}
#IDArticle2Basket input[type="submit"] {
  width: 100%;
}
#IDArticle2Basket p.ordered::before,
div.myBasketCol2 p.ordered::before {
  /* color: #223556; */

  font-family: 'Material Icons';
  font-feature-settings: 'liga'; /* IE */
  content: 'schedule ';
  position: relative;
  top: 0.1416rem;
}
div.myBasketCol2 p.ordered::before {
  top: 0.10625rem;
}

label.red {
  white-space: nowrap;
}


p.rejected,
label.rejected {
  color: #CC0000;
}

a {
  color: #456fa4;
  /* text-decoration: none; */
  text-decoration: underline;
  /* white-space: nowrap; */
  white-space: normal; /* mobile first */
  cursor: pointer;
}

#HeadRAK2 a,
#FootRAK a {
  color: #1A1A1A;
}

b, strong {
  font-weight: 700;
}

a.button,
input[type="submit"] {
  border-radius: 0.125rem !important;
  border: none !important;
  /*
  background-color: #1A1A1A;
  background-color: rgba(26,26,26,1.0);
  padding: 0.425rem 0.85rem;
  */
  background-color: #223556;
  background-color: rgba(34,53,86,1.0);
  margin-right: 1rem;
  padding: 0.5rem 1rem;
  color: #FFF !important;
  /* font-size: 1.5vm; */
  font-weight: normal;
  /* letter-spacing: 0.1rem; */
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  /* clear: both; */
  float: left;
  /* word-wrap: break-word;
  white-space: normal; */
  white-space: nowrap;
  /* width: 50%; */
  width: auto;
}
@media (max-width: 770px) {
  a.button,
  input[type="submit"] {
    /* width: 75%; */
  }
}
@media (max-width: 500px) {
  a.button,
  input[type="submit"] {
    margin-right: 0;
    width: 100%;
  }
}

/*

  #IDCustomerData label,
  input[type="text"], input.text,

*/

a.button:hover,
input[type="submit"]:hover,
input[type="submit"]:focus {
  /*
  background-color: #8b8f9e;
  background-color: rgba(139,143,158,1.0);
  color: #1A1A1A !important;
  */
  background-color: #456fa4;
  background-color: rgba(69,111,164,1.0);
  color: #FFF !important;
  -webkit-transition: all 0.5s ease 0.25s; /* property (list) duration timing-function delay */
  transition: all 0.5s ease 0.25s; /* property (list) duration timing-function delay */
}

/* White */
a.button.white {
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  color: #1A1A1A !important;
}
a.button.white:hover {
  background-color: #8b8f9e;
  background-color: rgba(139,143,158,1.0);
}
/* Red */
a.button.red {
  background-color: #CC0000;
  background-color: rgba(204,0,0,1.0);
}
a.button.red:hover {
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
}
/* Gray */
a.button.gray {
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
}
a.button.gray:hover {
  background-color: #8b8f9e;
  background-color: rgba(139,143,158,1.0);
}

input.rejected {
  border: 0.075rem solid #CC0000;
}

input[type="submit"].posttext {
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  color: #1A1A1A !important;
}
input[type="submit"].posttext:hover,
input[type="submit"].posttext:focus {
  background-color: #8b8f9e;
  background-color: rgba(139,143,158,1.0);
}

/* ------------------------------------------------------------------------------------------------------------------ */

#Info, #Ticker {
  width: 100%;
  clear: both;
  float: left;
}


#PageRAK {
  width: 100%;
  /* min-width: 480px; */
  min-width: 360px;
  position: relative;
  float: left;
}

#SwitchSocials, #Socials, #PromiBanner, #ContentRAK, #divtext, #T-Tak {
  /*
  margin: 0 10%;
  margin: 0 17.5%;
  width: 65%;
  max-width: 1932px;
  clear: both;
  position: relative;
  float: left;
  */
}
#MainNaviRAK, #PromiBanner, #T-Rak {
  /* width: 75%; */
  width: 100%;
  float: left;
}
/*
@media (max-width: 1280px) {
  #SwitchSocials, #Socials, #MainNaviRAK, #ContentRAK, #divtext  {
    margin: 0 12.5%;
    width: 75%;
  }
  #PromiBanner, #T-Rak {
    width: 100%;
  }
}
@media (max-width: 770px) {
  #SwitchSocials, #Socials, #MainNaviRAK, #ContentRAK, #divtext, #T-Rak  {
    margin: 0 4%;
    width: 92%;
  }
}
*/

/*
#divtext {
  padding-top: 12px;
  overflow: hidden;
}
#divtext p:last-child {
  margin-bottom: 0;
}
*/
#divtext {
  padding: 3% !important;
  clear: both;
  position: relative;
  float: left;
}
#divtext p img {
  border: 0.15rem solid #F3F3F3;
  margin-bottom: 1.5rem;
  margin-left: 5%;
  width: 100%;
  max-width: 140px;
  height: auto;
  position: relative;
  float: right;
}

#ContentRAK  {
  /*
  margin-top: 12%;
  margin-bottom: 3%;
  */
  /* min-height: 800px; */
  /* min-height: 600px; */
}
/*
@media (max-width: 1280px) {
  #ContentRAK  {
    margin-top: 13%;
  }
}
@media (max-width: 960px) {
  #ContentRAK  {
    margin-top: 16%;
  }
  #ContentRAK #NormCont,
  #ContentRAK #NormContC {
    margin-top: 0;
  }
}
@media (max-width: 770px) {
  #ContentRAK  {
    margin-top: 21%;
  }
  #ContentRAK #NormCont,
  #ContentRAK #NormContC {
    margin-top: 3%;
    margin-bottom: 3%;
  }
}
*/

/* ------------------------------------------------------------------------------------------------------------------ */

#Info {
  /* background-color: #F7BA0B;
  background-color: rgba(247,186,11,1.0); */
  background-color: #8bdc5a;
  background-color: rgba(139,220,90,1.0);
  position: relative;
}
#Info p:nth-child(1) {
  /* margin: 0.75rem 0.425rem 0.425rem 0.425rem; */
  margin: 0.75rem 0.425rem;
  color: #FFF;
  line-height: 1.2 !important;
  text-align: center;
  /* text-shadow: 0.05rem 0.075rem 0.125rem #666666; */
}
#Info p:nth-child(2) {
  margin: 0.425rem 0.425rem 0.75rem 0.425rem;
  /* font-weight: bold; */
  text-align: center;
}
/* 12.04.2021 alle: */
#Info p {
  text-align: center !important;
}

#SwitchSocials {

  /* border-bottom: 0.075rem solid #8b8f9e; */

  /* background-color: #eaebed;
  background-color: rgba(234,235,237,1.0); */

  /* padding: 0.5rem !important; */

}
#SwitchSocials form,
#SwitchSocials label,
#SwitchSocials input[type="submit"] {

  /* border: 0.075rem solid transparent !important; */
  background: none;

  margin: 0 !important;
  padding: 0 !important;

  /* color: #141823 !important; */
  color: #666 !important;
  font-family: Arial, sans-serif !important;
  font-size: 0.6375rem !important;
  line-height: 0.765rem  !important;

  width: auto !important;
  height: auto !important;

  position: relative !important;
  clear: none !important;
  float: left !important;

  top: 0 !important;
  left: 0 !important;

}
#SwitchSocials form {

  /* border: 0.075rem solid #8b8f9e !important; */
  border: 0.075rem solid transparent !important;
  background-color: #eaebed;
  background-color: rgba(234,235,237,1.0);

  margin-top: 20px !important;
  padding: 0 0.25rem !important;

  /* text-align: center !important; */
  width: 100% !important;

}
#SwitchSocials label:nth-child(1) {
  /* border-bottom: 0.075rem solid #8b8f9e !important; */
  padding: 1.125% 0.25rem !important;
  text-align: center;
  width: 92% !important;
  /* height: 1.5rem; */
  float: left !important;
}
#SwitchSocials label:nth-child(2) {
  /* border-bottom: 0.075rem solid #8b8f9e !important; */
  margin: 0.625% 1.25% 0.625% 0 !important;
  width: 6.75% !important; /* 8 - margin-right */
  float: right !important;
}
@media (max-width: 770px) {
  #SwitchSocials label:nth-child(1) {
    padding: 1.5% 0.25rem !important;
  }
  #SwitchSocials label:nth-child(2) {
    margin: 1.25% 1.25% 1.25% 0 !important;
  }
}
#SwitchSocials label a {
  font-weight: 700 !important;
}
#SwitchSocials input[type="submit"] {

  /* padding: 0 0.2rem 0.1rem 0 !important; */

  color: #223556 !important;
  font-weight: 700 !important;

  vertical-align: baseline;

  /* text-decoration: underline; */

  float: none !important;
  /* top: -1px !important;
  left: -1px !important; */

}
#SwitchSocials label:nth-child(2) input[type="submit"] {

  /* border: solid 0.075rem #F3F3F3 !important; */ /* 0.15 w/ z.B. iPhone */
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);

  /* padding: 0.25rem !important; */

  color: #1A1A1A !important;
  /* font-size: small !important; */
  font-weight: 700 !important;
  text-align: center !important;

  width: 1.25rem !important;
  height: 1.25rem !important;
  min-width: 20px !important;

  float: right !important;

  /* display: block; */

}
/* #SwitchSocials p:nth-child(3) {
  left: -3px !important;
}
*/

/* Twitter UND Gefällt mir / Teilen */

#Socials {

  padding-top: 20px;

  /* margin: 1rem 0; */
  height: 2.4em;
  /* float: left; */
  /*
  left: 50%;
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	-o-transform: translate(-50%,0);
	transform: translate(-50%,0);
  */

  /* display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-box;
  justify-content: center;
  -ms-justify-content: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  align-items: center;
  -webkit-align-items: center; */
  /* display: -moz-box; */
  /* display: flex;
  justify-content: center; */
  display: flex;
  justify-content: center;

  /* z-index: 777; --> zu hoch w/ fb-Logo */
  z-index: 10;

}
@media (max-width: 1280px) {
  #Socials {
    margin-left: 12.5% !important; /* bei Standard 75% width */
    width: 75%;
  }
}
@media (max-width: 770px) {
  #Socials  {
    margin: 0 4%;
    margin-left: 4% !important; /* bei Standard 92% width */
    width: 92%;
  }
}
#Socials p {
  height: 1.5rem;
  float: left;
  position: relative;
  left: 3px;
}
@media (max-width: 770px) {
	#Socials p {
	  left: 9px;
	}
}
@media (max-width: 480px) and (orientation: portrait ) {
	#Socials p {
	  left: 11px;
	}
}
@media (max-width: 480px) and (orientation: landscape) {
	#Socials p {
	  left: 14px;
	}
}

p.fblike,
p.twitter {
  position: relative;
  float: left;
}
p.fblike {
  padding-right: 4px;
}

/* */

#Ticker {
  background-color: #8bdc5a;
  /* border-top: 0.15rem dashed #FFF;
  border-bottom: 0.15rem dashed #FFF; */
  /* margin-bottom: 1.5rem; */
  position: relative;
}
#Ticker b {
  /* color: #8bdc5a; */
  font-weight: 400;
}
#Ticker i {
  border-radius: 0.15rem;
  border-right: 0.75rem solid #FFF;
  border-left: 0.425rem solid #FFF;
  background-color: #FFF;
  color: #CC0000;
  margin: 0 0.2125rem;
  font-weight: 700;
  /* font-style: normal; */
}

#PayPal {
  margin: 10px 1% 12px 10%; margin: 10px calc(5px + 1%) 12px 10%;
  width: 39%; width: calc(39% - 5px);
  float: left;
}
#Vorkasse {
  margin: 10px 10% 12px 1%; margin: 10px 10% 12px calc(5px + 1%);
  width: 39%; width: calc(39% - 5px);
  float: left;
}
@media (max-width: 770px) {
  #Info.noMobi {
    display: none;
  }
  #PayPal {
    margin: 10px 1% 12px 2%; margin: 10px calc(5px + 1%) 12px 2%;
    width: 47%; width: calc(47% - 5px);
  }
  #Vorkasse {
    margin: 10px 2% 12px 1%; margin: 10px 2% 12px calc(5px + 1%);
    width: 47%; width: calc(47% - 5px);
  }
}
#PayPal p,
#Vorkasse p {
  margin: 0;
  text-align: left;
  width: 75%;
  float: left;
}
#PayPal p:first-child,
#Vorkasse p:first-child {
  margin: 0 2% 0 0;
  text-align: left;
  word-wrap: break-word;
  width: 23%;
}
@media (max-width: 456px) {
  #PayPal,
  #Vorkasse {
    margin: 1.5% !important;
    width: 47% !important;
  }
  #PayPal p,
  #Vorkasse p {
    width: 100% !important;
    text-align: justify;
    /* text-align-last: justify;
    -moz-text-align-last: justify; */
  }
  #PayPal p:first-child,
  #Vorkasse p:first-child {
    display: none;
  }
}
#PayPal p,
#Vorkasse p {
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  margin: 0; /* wichtig! */
  color: #666;
  font-family: Arial, sans-serif;
  font-size: 0.6375rem !important;
  line-height: 0.765rem !important;
  /* float: left; */
}
#PayPal p a,
#PayPal p a:hover {
  /* color: #666;
  text-decoration: underline; */
  color: #223556 !important;
  font-weight: 700 !important;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#HeadRAK, #HeadRAK2 {
  /* background-color: #FFF;
  background-color: rgba(255,255,255,1.0);
  padding: 2% 12%; */
  width: 100%;
  position: relative;
  float: left;
}
#HeadRAK {
  /* -moz-box-shadow: 0 5px 9px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 5px 9px rgba(0, 0, 0, 0.3);
  box-shadow: 0 5px 9px rgba(0, 0, 0, 0.3); */
  /* background: url(../images/white-bricks.jpg) repeat center center fixed; */
  /* padding-top: 40px; */
/* min-width: 360px;
  min-height: 60px; */
  /* position: fixed; */
  /*
  position: relative;
  float: left;
  z-index: 999;
  */
  /* background-color: #223556;
  background-color: rgba(34,53,86,1.0); */
  /* background: url(/images/web/head-autohifi-bergedorf-de.jpg) repeat top center; */
  background: url(https://autohifi-bergedorf.de/images/web/head-autohifi-bergedorf-de.jpg) repeat top center; /* 18.03.2021 */
}
#_HeadPic {

  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: contain;
  -moz-background-size: contain;
  width: 100%;
  height: 270px;

  position: relative;
  float: left;
}
/*
#HeadPic img {
  width: 100%;
  height: auto;
  min-height: 200px;
}
@media (max-width: 770px) {
  #HeadPic img {
    min-height: 120px;
  }
}
*/
#HeadRAK2 {
  /* padding-bottom: 40px; */
}
@media (max-width: 770px) {
  #HeadRAK, #HeadRAK2 {
    /* padding: 2% 5%; */
  }
}

#TopMenu {
  margin: 0.85rem 0 0 5%;
  width: 20%;
  float: left;
}
#TopMenu li {
  border-left: 0.075rem dashed #8b8f9e;
  margin: 0;
  padding-left: 0.3rem;
  line-height: 1.75 !important;
}
#TopMenu a,
#TopMenu a:hover {
  color: #1A1A1A;
}
#TopMenu i {
  color: #CC0000;
  /* background-color: #98ddde;
  padding: 0 0.25rem;
  color: #FFF;
  font-weight: 300;
  font-style: normal;
  letter-spacing: 0.02rem; */
  font-style: italic;
}
#TopMenu i.promo {
  color: #8bdc5a;
  font-weight: 700;
}
@media (max-width: 770px) {
  #TopMenu {
    width: 27.5%;
  }
}

#LogoRAK {

  /* border: 1px solid orange; */

  /* margin-right: 10%; */
  /* text-align: center; */
  /* width: 50%; */
  /* width: 10%; */
  /* height: 8rem; */
  /* height: auto; */
  /* float: left; */
  /* overflow: hidden; */

  /* margin-right: 10%;
  width: 20%;
  float: left; */

  /* margin-left: 2rem;
  padding: 1rem; */
  /* width: 50%; */


  width: 100%;
  /* height: 180px; */

  /* min-width: 320px;
  max-width: 540px; */

  position: relative;
  float: left;

  /* top: 2rem; */
  /* top: 4.5%; */
  /* left: 21%; */
  /* right: 1.25%; */
  /* left: 1.25%; */
  /* left: 21%; */

  /* z-index: 20; */

  display: flex;
  justify-content: center;


}
#LogoRAK img {
  margin: 1rem;
  width: 270px;
  height: auto;
}

@media (max-width: 1280px) {
  #_LogoRAK {
    top: 4%;
  }
}
@media (max-width: 960px) {
  #_LogoRAK {
    top: 3.25%;
  }
}
@media (max-width: 770px) {
  #_LogoRAK {
    /* margin-right: 6%; */

    /* margin-left: 1rem;
    top: 1rem; */

    /* top: 1.25%; --> "bewegt sich" beim MenüPopUp */

    min-width: 100px;

    top: 10px;
  }
  #LogoRAK img {
    width: 180px;
  }
}
@media (max-width: 500px) {
  #_LogoRAK {
  }
}
#_LogoRAK div.logo {

  /* background-color: #FFF;
  background-color: rgba(242,242,242,0.95); */

  /*
  background-color: #456fa4;
  background-color: rgba(69,111,164,1.0);
  background-color: #8b8f9e;
  background-color: rgba(139,143,158,1.0);
  */

  background-color: #223556;
  background-color: rgba(34,53,86,1.0);

  /* width: 25%; */
  /* width: 33%; */
  width: 100%;

  float: left;

}
#_LogoRAK div.logo img {

  /* width: 240px;
  height: 76px; */

  width: 100%;
  max-width: 1000px;
  height: auto;

}

/*
#LogoRAK a:first-child img {
  margin: 0;
  width: 30%;
  height: auto;
}
@media (max-width: 1280px) {
  #LogoRAK a:first-child img {
    width: 35%;
  }
}
@media (max-width: 960px) {
  #LogoRAK a:first-child img {
    width: 60%;
  }
}
@media (max-width: 770px) {
  #LogoRAK a:first-child img {
    width: 70%;
  }
}
*/

#SK {
  width: 70%;
  float: left;
}
#SK p {
  margin: 0;
}
#SK a {
  color: #1A1A1A;
  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
  /* font-size: 3rem; */
  /* font-size: 3vw; */
  /* font-size: 3vmax; */
  font-size: 2.975rem;
  font-weight: 400;
}
@media (max-width: 1280px) {
  #SK a {
    font-size: 2.55rem;
  }
}
@media (max-width: 960px) {
  #SK a {
    font-size: 2.125rem;
  }
}
@media (max-width: 770px) {
  #SK a {
    font-size: 1.9125rem;
  }
}
#SK p a:hover {
  color: #CC0000;
  text-decoration: none;
}

#HeadRAK2 p {
  margin: 0;
  font-size: 0.6375rem !important;
  /* font-weight: 300;
  font-style: italic; */
  font-weight: 400 !important;
  text-align: center;
}
#HeadRAK2 p:nth-child(3) {
  margin-top: 0.85rem;
  color: #8bdc5a;
  font-size: 0.85rem !important;
  font-weight: 700;
  font-style: normal;
}
#HeadRAK2 h3 {
  margin: 0;
  /* font-family: 'Poiret One', sans-serif; */
  font-size: 1.7rem;
  /* font-size: 1hw; invalid */
  font-weight: 400;
  text-align: center;
}
#HeadRAK2 h3 a {
  white-space: normal;
}
@media (max-width: 770px) {
  /*
  #LogoRAK {
    width: 37.5%;
  }
  */
  /*
  #HeadRAK2 {
    margin-top: 0.85rem;
    float: left;
  }
  */
}
#BasketItemsCount {
  /* margin: 0 5% 0 0; 22.04.2016: */
  margin: 0 6.25% 0 0;
  /* padding: 2.04rem 0 0 0; 22.04.2016: */
  padding: 1.04rem 0 0 0;
  text-align: center;
  width: 2.55rem;
  height: 5.1rem;
  float: right;
  position: relative; /* Text in Pic */
}
#BasketItemsCount p {
  color: #FFF;
  /* font-size: 1.275rem !important; */
  font-size: 1.0625rem !important;
  font-weight: 400 !important;
  text-align: center;
  width: 2rem; /* w like img - margin r+l */
  position: absolute;
  /* top: 3.37rem; 22.04.2016: */
  top: 2.37rem;
  left: 0.5rem;
  /* = upper border of shopping bag deg: */
  -o-transform: rotate(-6deg);
  -ms-transform: rotate(-6deg);
  -moz-transform: rotate(-6deg);
  -webkit-transform: rotate(-6deg);
  transform: rotate(-6deg);
}
#BasketItemsCount p a {
  color: #FFF;
  font-weight: 400;
  text-align: center;
  /* width: 2rem; */ /* w like img - margin r+l */
}
#BasketItemsCount img {
  width: 2.55rem;  /* h / 1.2 */
  height: 3.06rem; /* 3/5 */
}

/* MAINNAVI */

#MainNaviRAK {
  background-color: #223556;
  background-color: rgba(34,53,86,1.0);
  /* padding: 1rem 1rem 0 1rem; */
  padding: 1rem 2.5%;
  position: relative;
  z-index: 20;
}
#MainNaviRAK a,
#MainNaviRAK ul li span {
  background-color: #223556;
  background-color: rgba(34,53,86,1.0);
  padding: 0.5rem;
  color: #FFF;
  text-decoration: none;
  cursor: pointer;
}
/* beim Klicken soll wirklich nichts passieren, auch kein Markieren */
#MainNaviRAK ul li span {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#MainNaviRAK li.active a,
#MainNaviRAK li.active span {
  background-color: #223556;
  background-color: rgba(34,53,86,1.0);
  color: #FFF;
}
#MainNaviRAK a:hover,
#MainNaviRAK span:hover,
#MainNaviRAK li.active a:hover,
#MainNaviRAK li.active span:hover {
  background-color: #223556;
  background-color: rgba(34,53,86,1.0);
  color: #FFF !important;
}
#MainNaviRAK li {
  /* margin: 0 1rem 1rem 0; */
  /* margin: 0 1rem 0 0; */
  margin: 0 0.5rem 0 0;
  list-style: none;
  float: left;
}

#MainNaviRAK ul li a:hover {
  background-color: #8bdc5a !important;
  background-color: rgba(139,220,90,1.0) !important;
}

/* Oberste Ebene */
#MainNaviRAK ul {
  background-color: #456fa4;  /* DD BOX Sub1 */
  background-color: rgba(69,111,164,1.0); /* DD BOX Sub1 */
  margin: 0;
}
#MainNaviRAK ul li {
  /* width: auto; */
}
/* 15.08.2018 AURA Eltern beim hovern der oberen und auch beim hovern der sub mit Rand! */
#MainNaviRAK ul li {
  /* +++ border-top: 0.075rem solid #223556;
  border-right: 0.075rem solid #223556;
  border-left: 0.075rem solid #223556;
  border: 0.075rem solid blue; */
}
#MainNaviRAK ul:hover,
#MainNaviRAK ul.hover {
  /* background-color: #456fa4;
  background-color: rgba(69,111,164,1.0); */
}

/*

#MainNaviRAK ul li {
  border-top: 0.075rem solid #223556;
  border-right: 0.075rem solid #223556;
  border-bottom: 0.075rem solid #223556;
  border-left: 0.075rem solid #223556;
}
#MainNaviRAK ul li:hover,
#MainNaviRAK ul li.hover {
  border-top: 0.075rem solid #8ec7e7;
  border-right: 0.075rem solid #8ec7e7;

  border-left: 0.075rem solid #8ec7e7;
}
#MainNaviRAK ul li ul li {
  border-top: 0.075rem solid #456fa4;
  border-right: 0.075rem solid #8ec7e7;
  border-bottom: 0.075rem solid #456fa4;
  border-left: 0.075rem solid #8ec7e7;
}
#MainNaviRAK ul li ul li:last-child {
  border-bottom: 0.075rem solid #8ec7e7;
}
#MainNaviRAK ul li ul li:hover,
#MainNaviRAK ul li ul li.hover {
  border-top: 0.075rem solid #456fa4;
  border-right: 0.075rem solid #8ec7e7;

  border-left: 0.075rem solid #8ec7e7;
}

*/

#MainNaviRAK ul li:hover a,
#MainNaviRAK ul li.hover a {
  /* +++ border-top: 0.075rem solid #456fa4;
  border-right: 0.075rem solid #456fa4;
  border-left: 0.075rem solid #456fa4;
  border: 0.075rem solid green; */
  background-color: #456fa4;
  background-color: rgba(69,111,164,1.0);
}
/* @media (max-width: 770px) { */
@media (max-width: 1024px) {
	#MainNaviRAK ul li {
    width: 100%;
	}
}
#MainNaviRAK ul li a,
#MainNaviRAK ul li span {
  width: 100%;
  position: relative;
  float: left;
}
/* Sub 1 Ebene */
#MainNaviRAK ul li ul {
  margin: 2.5rem 0 0 0;
  /* width: 33.33% !important;
  min-width: 19rem; */
  position: absolute;
  z-index: 20;
}
/*
#MainNaviRAK ul li:nth-child(2) ul {
  width: 13rem; wegen "Freisprecheinrichtung" zu lang in oberster Ebene
}
#MainNaviRAK ul li:nth-child(10) ul li {
  wegen "Kontakt"
}
*/
/* @media (max-width: 770px) { */
@media (max-width: 1024px) {
	/* #MainNaviRAK ul li ul,
  #MainNaviRAK ul li:nth-child(2) ul {
  */
  #MainNaviRAK ul li ul {
    /* +++ border-top: 0.075rem solid #456fa4; */
    margin: 0;
    /* width: 80% !important; */
    width: 100%;
    position: relative;
    /* float: right; */
    float: left;
	}
}
#MainNaviRAK ul li ul li {
  /* +++ border: 0.075rem solid #456fa4;
  border: 0.075rem solid red; */
  background-color: #8b8f9e;
  background-color: rgba(139,143,158,1.0);
  margin: 0;
  width: 100%; /* wichtig für hover Sub-Zeile */
  clear: both;
  display: none;
}
/*
#MainNaviRAK li ul.i li:nth-child(even) {
  width: 50%;
  clear: none;
}
#MainNaviRAK li ul.i li:nth-child(odd) {
  width: 9rem;
}
@media (max-width: 770px) {
	#MainNaviRAK li ul.i li:nth-child(even) {
  	width: 70%;
	}
	#MainNaviRAK li ul.i li:nth-child(odd) {
    width: 6rem;
  }
}
#MainNaviRAK li:hover ul.i,
#MainNaviRAK li.hover ul.i {
  padding: 0.5rem;
  width: 50%;
}
*/
#MainNaviRAK li:hover li,
#MainNaviRAK li.hover li {
  position: relative;
  display: block;
}
#MainNaviRAK ul li ul li a:hover {
  background-color: #8bdc5a !important;
  background-color: rgba(139,220,90,1.0) !important;
}
#MainNaviRAK ul li ul li a,
#MainNaviRAK ul li.active ul li a,
#MainNaviRAK ul li ul li:hover a,
#MainNaviRAK ul li.active ul li.hover a {
  /* +++ border: 0.075rem solid #456fa4;
  border: 0.075rem solid orange; */
  background-color: #456fa4; /* Linktext in DD BOX Sub1 plus hover */
  background-color: rgba(69,111,164,1.0); /* Linktext in DD BOX Sub1 plus hover */
  color: #FFF !important;
  white-space: normal;
}
#MainNaviRAK ul li ul li a img {
  vertical-align: top;
  width: 100%;
  min-width: 60px;
  max-width: 285px;
}

#_MainNaviRAK ul li ul li a:hover {
  background-color: #8ec7e7 !important; /* Sub1 */
  background-color: rgba(142,199,231,1.0) !important; /* Sub1 */
}

/* /MAINNAVI */

#letterhead {
  display: none;
}

#PageContent, #HomePage, #NormCont, #NormContC {
  position: relative;
  float: left;
}
#PageContent {
  background-color: #FFF;
  background-color: rgba(255,255,255,1.0);
  /* padding: 6%; */
  /* padding: 4% 2.5%; */
  padding: 2% 2.5% 1% 2.5%;
  width: 100%;
  /* height: auto; */
  height: 100%;
}
@media (max-width: 770px) {
  #PageContent {
    padding: 4%;
  }
  @media (orientation: landscape) {
    #PageContent {
      padding: 4% 2.5%;
    }
  }
}
/*
#PageContent img {
  margin-left: 1.5rem;
  margin-bottom: 1.5rem;
  width: 100%;
  max-width: 280px;
  height: auto;
  clear: both;
  float: right;
}
#PageContent a.button {
  padding: 0; *** wegen Umbruch, da lang ***
  line-height: 1.2rem;
  clear: none;
  float: none;
}
*/
#HomePage, #NormCont, #NormContC {
  width: 100%;
}
@media (max-width: 960px) {
  #NormContC {
    margin-top: 1.5rem;
  }
}

#Catalogs p {
  clear: both;
}
#Catalogs img {
  margin-right: 1.5rem;
  margin-bottom: 1.5rem;
  width: 50%;
  max-width: 280px;
  height: auto;
  float: left;
}

.cct, .ccb {
  /* border: 1px solid green; */
  margin-bottom: 0;
  margin-left: 10%;
  padding: 0;
  text-align: center;
  width: 33.33%;
  max-width: 560px;
  height: auto;
  position: relative;
  float: right;
}
.cct {
  display: block;
}
.ccb {
  display: none;
}
@media (max-width: 960px) {
  .cct, .ccb {
    margin: 0;
    width: 100%;
    max-width: none;
    float: left;
  }
  .cct {
    display: none;
  }
  .ccb {

    display: block;

    /* w/ alt-Text */

    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

  }
}
.cct p, .ccb p {
  font-size: smaller !important;
  font-weight: 700;
}
.ccb p {
  margin: 0;
}
.cct img, .ccb img {
  /* background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0); */
  margin-bottom: 1.5rem;
  /* padding: 1rem; */
  width: 100%; /* max. 560px */
  height: auto;
  display: inline-block; /* bei nur alt-Text als Text-Block */
}
.cct img {
  max-width: none;
}
.ccb img {
  max-width: 48%;
}
.ccb img:nth-child(1), .ccb img:nth-child(3) {
  margin: 0 1% 0 0;
}
.ccb img:nth-child(2), .ccb img:nth-child(4) {
  margin: 0 0 0 1%;
}
#HomePage .ccb img {
  margin: 0 0 1.5rem 0;
  max-width: 66.67%;
}
@media (max-width: 960px) {
  .ccb img {

    /* max-width: 48.5%; */
    max-width: 560px;

    /* w/ alt-Text */

    min-height: 4rem;

    /* hyphens */
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;

    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;

  }
  .ccb img:nth-child(1) {
    /* margin: 0 1.5% 0 0; */
    /* margin: 0; */
    margin: 3% 0 6% 0;
  }
  .ccb img:nth-child(2) {
    /* margin: 0 0 0 1.5%; */
    margin: 1.5rem 0 0 0;
  }
  .ccb img:nth-child(3) {
    /* margin: 1.5rem 1.5% 0 0; */
    margin: 1.5rem 0 0 0;
  }
  .ccb img:nth-child(4) {
    /* margin: 1.5rem 0 0 1.5%; */
    margin: 1.5rem 0 0 0;
  }
}
@media (max-width: 500px) , (max-width: 480px) and (orientation: landscape) {
  .ccb {
    width: 100% !important;
    display: block;
  }
  .ccb img {
    margin: 0 0 1.5rem 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: auto;
    display: block;
  }
  /*
  .ccb img:last-child {
    margin: 0 !important;
  }
  */
}

#HomePage p, #HomePage h1, #HomePage h2, #HomePage h3,
#NormCont p, #NormCont h1, #NormCont h2, #NormCont h3,
#NormContC p, #NormContC h1, #NormContC h2, #NormContC h3,
#AboutUs p, #AboutUs h2, #AboutUs h3,
#Contact p, #Contact h2, #Contact h3 {
  clear: none;
}

#AboutUs img {
  /* margin-bottom: 1.4875rem;
  margin-left: 1.4875rem;
  width: 33.33%;
  max-width: 280px;
  height: auto;
  float: right; */
  margin-bottom: 1.5rem;
  margin-left: 5%;
  width: 100%;
  max-width: 560px;
  height: auto;
  position: relative;
  float: right;
}
@media (min-width: 640px) {
  #AboutUs img {
    width: 50%;
  }
}
#Contact img {
  margin-bottom: 1.5rem;
  margin-left: 1.5rem;
  width: 50%;
  max-width: 560px;
  height: auto;
  float: right;
}
#HomePage p.Signature,
#NormCont p.Signature,
#NormContC p.Signature,
#AboutUs p.Signature {
  /* font-family: 'Poiret One', sans-serif; */
  font-size: 1.5rem !important;
}

#PromiBanner img {
  margin: 0 0 20px 0;
  max-width: 100%;
}
#PromiBanner p {
  margin: 0 0 20px 0;
  padding: 0 15px 0 0;
  font-size: small !important;
  text-align: justify;
  width: 50%;
  float: left;
}
#PromiBanner p:nth-child(3) {
  padding: 0 0 0 15px;
}
@media (max-width: 770px) {
  #PromiBanner p {
    font-size: small !important;
  }
}
@media (max-width: 500px) {
  #PromiBanner p {
    font-size: x-small !important;
  }
}

/* ------------------------------------------------------------------------------------------------------------------ */

/* 12.04.2018 AURA weg

#HomePage img {
  border: 0.3rem solid #FFF;
  background-color: rgba(0,110,81,0.25);
  background-color: rgba(0,0,0,0.25);
  margin-top: 10%;
  padding: 10%;
  width: 100%;
  height: auto;
}
@media (max-width: 1280px) {
  #HomePage img {
    margin-top: 20%;
  }
}
@media (max-width: 960px) {
  #HomePage img {
    margin-top: 35%;
  }
}
@media (max-width: 770px) {
  #HomePage img {
    margin-top: 40%;
  }
}
@media (max-width: 500px) {
  #HomePage img {
    border: 0.2rem solid #FFF;
    margin-top: 60%;
  }
}
@media (max-width: 480px) and (orientation: landscape) {
  #HomePage img {
    margin-top: 0;
  }
}

*/

/* ------------------------------------------------------------------------------------------------------------------ */

#FootRAK {
  /* background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  background-color: #000;
  background-color: rgba(0,0,0,1.0); */
  background-color: #223556;
  background-color: rgba(34,53,86,1.0);
  padding: 3% 12% 0 12%;  /* check .footbox margin */
  width: 100%;
  position: relative;
  float: left;
  z-index: 3; /* 4 back-to-top */
}
#FootRAK a {
  text-decoration: none;
}
.footbox {
  border-left: 1rem solid #223556;
  /* border-bottom: 0.1125rem solid #FFF; */
  background-color: #456fa4;
  background-color: rgba(69,111,164,1.0);
  margin: 0 0 3% 0; /* check #FootRAK padding */
  padding: 0.85rem !important;
  width: 25%;
  height: 7.4375rem; /* 5x normal line-height */
  height: 8.18125rem; /* 5,5x normal line-height */
  height: 8.925rem; /* 6x normal line-height */
  height: 9.5rem; /* 6x normal line-height */
  height: 10.5rem;
  float: left;
}
.footbox:nth-child(1) {
  border-left: none;
}
.footbox:nth-child(3) ul li  {
  text-align: right;
}
.footbox:nth-child(4) img {
  float: right;
}
@media (max-width: 770px) {
  #FootRAK {
    padding: 5% 5% 0 5%;  /* check .footbox margin */
  }
  .footbox {
    border-bottom: 1rem solid #223556;
    margin: 0 0 5% 0; /* check #FootRAK padding */
    width: 50%;
  }
  .footbox:nth-child(1) {
    border-left: none;
    margin: 0;
  }
  .footbox:nth-child(2) {
    margin: 0;
  }
  .footbox:nth-child(3) {
    border-left: none;
    border-bottom: none;
  }
  .footbox:nth-child(4) {
    border-bottom: none;
  }
  .footbox:nth-child(2) ul li  {
    text-align: right;
  }
  .footbox:nth-child(3) ul li  {

    text-align: left;
  }
  .footbox:nth-child(4) img {
    float: right;
  }
}
.footbox li {
  margin: 0;
  color: #FFF !important;
  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
  width: 100%;
  height: 1.5rem; /* line-height */
  clear: both;
  float: left;
}
.footbox a {
  color: #FFF !important;
  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
}
.footbox img {
  clear: both;
  float: left;
}
.footbox img[src*="valid"],
.footbox img[src*="smiley"],
.footbox img[src*="paypal"] {
  padding: 0.2125rem;
  width: auto;
  height: 2.5rem; /* line-height */
  position: relative;
  left: 0;
}

/* PRODUCTS und INSTALL und HISTORY */

#ColProducts,
#ColInstall,
#ColHistory,
#ColContact {
  /* border: 1px solid red; */
  /* width: 650px !important;
  margin: 1em 0 1em 0 !important;
  padding: 0 !important; */
  /* float: left; */
  width: 100%;
  position: relative;
  float: left;
}
.product,
.example,
.record,
.content {
  /* border: 1px solid green; */
  /* width: 650px !important;
  margin: 1em 0 3em 0 !important;
  padding: 0 !important;
  clear: both; */
  /* margin: 1.5rem 0 !important; */
  margin: 0.5rem 0 !important;
  width: 100%;
  position: relative;
  clear: both;
  float: left;
}
.record {
  border-top: 0.075rem solid #333333;
  /* padding-top: 3rem !important; */
  padding-top: 2.5rem !important;
}
.record:first-child {
  border-top: none;
  padding-top: 0 !important;
}
.record,
.content {
   /* border: 1px solid green; */
  margin: 0 0 1.5rem 0;
}
.product:first-child,
.example:first-child {
  /* margin-top: 3rem; */
  margin-top: 1.5rem;
}
.product h3,
.example h3 {
  /* border-top: 0.15rem solid #F3F3F3; */
  border-top: 0.075rem solid #333333;
  /* padding-top: 4.5rem; */
  padding-top: 1.5rem;
}
.product:first-child h3,
.example:first-child h3 {
  border-top: none;
  padding-top: 0;
}
.product div.articletext p, .product ul, .product li,
.example div.installtext p, .example ul, .example li,
.record div.ahbtext p, .record ul, .record li,
.content div.ahbtext p, .content ul, .content li {
  /* border: 0.15rem solid #F3F3F3; */
  /* margin-bottom: 0 !important; */
}
.product ul,
.example ul,
.record ul,
.content ul {
  margin: 0 0 0 1rem;
  list-style: disc;
  clear: both;
}
.product div.articleimg,
.example div.installimg,
.record div.ahbimg,
.content div.ahbimg,
.content #Thours {
  /* border: 1px solid blue; */
  /* margin-bottom: 0; */
  /* width: 50%; */
  margin-right: 5%;
  /* min-width: 50%; */
  width: 35%;
  position: relative;
  float: left;
}
.content #Thours {
  width: 45%;
}
.example div.installimg {
  /* margin-bottom: 1.5rem; */
}
.record div.ahbimg,
.content div.ahbimg {
  /* border: 1px solid red; */
  /* margin: 3rem 0 0 5%; */
  margin: 0 0 0 5%;
  min-width: 35%;
  float: right;
}
.content div.ahbimg {
  float: left;
}
.product div.articleimg img,
.example div.installimg img,
.record div.ahbimg img,
.content div.ahbimg img {
  margin-bottom: 1.5rem;
  width: 100%;
  max-width: 560px;
  height: auto;
}
.example div.installimg img {
  margin: 0 0 1.5rem 0;
}
.content div.ahbimg img {
  margin-bottom: 2.5rem;
}
#ColHistory img:nth-child(2) {
  margin-top: 1.5rem;
}
.product div.articleimg.tiny img,
.example div.installimg.tiny img {
  border: 0.15rem solid #CC0000;
}
.product div.articleimg p.SKU {
  margin: 1.5rem 0 0.5rem 0;
  font-weight: 700 !important;
}
.product div.articleimg p {
  font-size: small !important;
}
.product div.articleimg.tiny p:nth-child(2),
.example div.installimg.tiny p:nth-child(2) {
  margin: 1.5rem 0 !important;
  color: #CC0000 !important;
  font-size: small !important;
  font-weight: 700 !important;
}
.product div.articletext,
.example div.installtext,
.record div.ahbtext,
.content div.ahbtext {
  /* border: 1px solid grey; */
  /* margin-bottom: 0; */
  width: 50%;
  position: relative;
  float: left;
}
.record div.ahbtext {
  /* border: 1px solid orange; */
  width: 60%;
}
.product div.articletext000 {
  width: 90%;
  float: left;
}
/* Öffnungszeiten und Karte */
#Thours div {
  margin-bottom: 1.5rem;
  width: 100%;
  float: left;
}
#Thours div p {
  margin: 0;
  white-space: nowrap;
}
#Thours div p:nth-child(1) {
  font-weight: 700;
}
.ahbimg iframe {
  margin-bottom: 2.5rem;
  width: 100%;
  min-height: 15rem;
}
/* / Öffnungszeiten und Karte */
@media (max-width: 1280px) {
  .product div.articletext000  {
    width: 100%;
    float: left;
  }
}
@media (max-width: 770px) {
  .product h3,
  .example h3 {
    padding-top: 2.5rem;
  }
  .product p:first-child,
  .example p:first-child {
    margin-bottom: 0;
  }
  .product div.articleimg,
  .product div.articletext,
  .example div.installimg,
  .example div.installtext,
  .record div.ahbimg,
  .record div.ahbtext,
  .content div.ahbimg,
  .content div.ahbtext {
    margin: 0;
    width: 100%;
    float: left;
  }
  .content #Thours {
    width: auto;
  }
  .record div.ahbimg,
  .content div.ahbimg,
  .content #Thours  {
    /* border: 1px solid red; */
    margin-top: 1.5rem;
  }
}
.product div.articletext .price {
  /* border: 1px solid blue; */
  margin: 1.5rem 0 0 0;
  font-size: x-large !important;
  font-weight: 500;
}
.product div.articletext .vat {
  /* border: 1px solid blue; */
  font-size: small !important;
}
@media (max-width: 770px) {
  .product div.articletext .price {
    font-size: large !important;
  }
  /* CSS-Selektoren: .product div.articletext ul + br + br { */
  .product div.articletext ul ~ br {
    display: none;
  }
}

/* ------------------------------------------------------------------------------------------------------------------ */

/* SEO */
a.noup, a.noup:hover {
  color: #1A1A1A !important; /* HauptSchriftFarbe */
  border-bottom: none !important;
  text-decoration: none !important;
  cursor: text !important;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#Team div {
  /* width: 780px; */
  float: left;
}
#Team div div {
  margin: 1.5rem 60px 1.5rem 0;
  padding: 0;
  width: 200px;
  min-height: 18rem;
}
#Team div div img {
  margin: 0 0 1.5rem 0;
  padding: 0;
  /*
  display: inline;
  margin: 0;
  padding: 0;
  position: static;
  */
}
#Team div div p {
  /* font-family: 'Poiret One', sans-serif; */
  font-size: 1.7rem !important;
  line-height: 1 !important;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#logo-instagram {
  /*
  border-radius: 12px 0 0 12px;
  -moz-box-shadow: 0 0 5px #999;
  -webkit-box-shadow: 0 0 5px #999;
  box-shadow: 0 0 5px #999;
  background-color: #FFF;
  border: 0.15rem solid #EDECED;
  */
  border-radius: 0.1px; /* Hack wegen Shadow Problem beim Zoom */
  -moz-box-shadow: -1.5px 1.5px 4px 2px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: -1.5px 1.5px 4px 2px rgba(0, 0, 0, 0.2);
  box-shadow: -1.5px 1.5px 4px 2px rgba(0, 0, 0, 0.2);
  background-color: #FFF;
  background-color: rgba(255, 255, 255, 0.95);

  min-width: 30px;
  min-height: 80px;
  width: 7rem;
  height: 10rem;
  position: fixed;
  /* top: 260px; */
  top: 50%;
  right: 0;
  z-index: 2;
}
/*
@media (max-width: 480px) and (orientation: portrait) {
  #logo-instagram {
    top: 360px;
  }
}
#logo-instagram.menum1 {
  top: 458px;
}
@media (max-width: 480px) and (orientation: portrait) {
  #logo-instagram.menum1 {
    top: 558px;
  }
}
*/
@media (max-width: 480px) and (orientation: portrait) {
  #logo-instagram {
    top: 50%;
  }
}

#logo-instagram.menum1 {
  top: 70%;
}

#logo-instagram p {
  /* color: #9F9CA1; */
  color: #8b8f9e;
  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  float: right;
  position: relative;
  top: 10px;
  right: 2.75rem;
  z-index: 2;
  display: block;
}
#logo-instagram p,
#logo-instagram img,
#RAK-ig {
  background-color: transparent;
  width: 3.5rem;
  height: 3.5rem;
}
#logo-instagram img.pic {
  position: relative;
  top: -0.25rem;
  left: 0.75rem;
}
#logo-instagram img.txt {
  width: 6rem;
  height: 6rem;
  position: relative;
  top: -1.25rem;
  right: 0.2625rem;
}
#RAK-ig {
  /* border-radius: 12px; */
  width: 293px !important;
  height: 200px !important;
  overflow: hidden;

  display: none;

}
#logo-instagram.menum1 #RAK-ig {
  height: 200px !important;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#ContentAT {
  /* border: 0.1rem solid #F3F3F3; */
  /* margin: 0 0 0 2%; */
  /* margin: 0 !important; */
  /* float: right;
  position: relative;
  right: 40px; */
  /* width: 80%; */
  /* width: 80%; */
  /* width: 72%;
  float: left;
  overflow: hidden; */
  width: 80%; /* Xcheck #QueryBoxAT */
  float: right; /* wichtig f?r alte Browser: eine width angeben! */
}

div.PT {
  /* border: 0.1rem solid #EDECED; */
  /* border: 0.1rem solid #F3F3F3; */
  /* height: 26rem; */ /* nun als style bei der class im php --> bei OS nicht! */
  /* margin: 0 0 60px 20px; */
  /* margin: 0 0 2rem 1%; */
  margin: 0 0 0 1%;

  text-align: center;

  width: 32.3333%;
  width: calc(97% / 3);

  position: relative;
  float: left; /* wichtig f?r alte Browser: eine width angeben! */

  /* overflow: hidden; */ /* !!! sonst wegen reflection.js zu hohe DIVs (speziell beim IE 6) !!! */
}
#ContentAT.tallobj div.PT {
  margin: 40px 0 0 1%;
}
@media (max-width: 770px) {
  div.PT {
    width: 48.5%;
    width: calc(97% / 2);
  }
}
@media (max-width: 500px) {
  #QueryBoxAT {
    width: 35% !important;
  }
  #ContentAT {
    width: 65% !important;
  }
  div.PT {
    width: 97%;
    width: calc(97% / 1);
  }
}

div.PTI {

  margin: 0 0 0.425rem 0;

  position: relative;

}
div.PTI.tallobj {
  margin-bottom: 20px;
}
div.PT img {
  /* padding-bottom: 0.2rem; */
  /* Neu @ OS w/ vertical-align bei zu flachen Pics!: */
  /* border: 0 none; */
  vertical-align: middle;
  width: 100%;
  max-width: 200px;
  height: auto;
}
div.PT p {
  padding: 0 0.85rem !important;
  font-size: small !important;
  height: 3.4rem !important;
}
div.PT p b {
  font-weight: 700;
}
div.PT p b.red::before {
  font-family: 'Material Icons';
  font-feature-settings: 'liga'; /* IE */
  content: 'play_arrow';
  position: relative;
  top: 0.17rem;
}

div.PT p.new,
div.PT p.top,
div.PT p.nos  {
  /* border-radius: 50%; */
  /* background-color: #8bdc5a;
  background-color: rgba(15,133,88,0.8); */
  /* margin: 1rem; */
  /* padding: 0.5rem 1.25rem 1rem 0.5rem; */
  /* font-weight: 700; */
  /*
  padding: 0 0.15rem 0 0.125rem !important;
  text-align: center;
  width: 3rem;
  height: 1.5rem;
  position: relative;
  left: 175px;
  top: 25px;
  */

  padding: 0 0.15rem 0 0.125rem !important;
  text-align: center;
  width: 3rem;
  height: 1.75rem;
  float: right;

  display: none;

}
div.PT p.new,
div.PT p.top {
  border: 0.075rem solid #8b8f9e;
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  color: #1A1A1A;
}
div.PT p.nos {
  /* border: 0.15rem solid transparent; */
}

div.PTI p.dis {
  /* border-radius: 50%; */
  border-radius: 0.125rem;
  background-color: #CC0000;
  background-color: rgba(204,0,0,1.0);
  /* padding: 0.63rem 0.6375rem 0.6375rem 0.6375rem !important; */
  padding: 0.425rem !important;
  color: #FFF !important;
  /* font-size: 1.275rem !important; */
  font-size: 0.85rem !important;
  line-height: 0.85 !important;
  font-weight: 400;
  height: auto !important;
  position: absolute;
  top: 77.5%;
  /* left: 77.5%; */
  left: 60%;
}
div.PTI p.dis.ole {
  color: #CC0000;
}

div.PT h2 {
  /*
  font-size: 1.1rem !important;
  font-weight: normal !important;
  line-height: 1.3rem;
  height: 1.3rem; */ /* H?he angeben wegen IE7 Bug (unten beim "h2 a:hover") !!! */
  /* padding: 0 0 0.2rem 0; */
  text-align: center;
  white-space: nowrap;
  overflow: hidden; /* !!! sonst ?berschneidung mit h3 beim Vergr??ern! */
}
div.PT h3 {
  /* font-size: 1.1rem !important;
  font-weight: normal !important;
  line-height: 1.3rem;
  height: 1.3rem; */ /* H?he angeben wegen IE7 Bug (weiter unten beim "h3 a:hover") !!! */
  /* padding: 0 0 0.5rem 0; */
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
}
div.PT h2 a {
  color: #1A1A1A;
}
div.PT h2 a:hover {
  /* background: #1A1A1A; */
  background-color: #8b8f9e;
  background-color: rgba(139,143,158,1.0);
  color: #FFF;
}

/* QueryBoxAT ####################################################################################################### */

#QueryBoxAT {
  /* margin: 0 !important; */
  width: 20%; /* Xcheck #ContentAT */
  float: left;
  /* overflow: hidden; */
  position: relative;
  z-index: 1;
}

#QueryBoxAT p {
  margin: 1.5rem 0 !important;
  color: #1A1A1A;
  font-size: small !important;
  font-weight: 700;
  white-space: nowrap;
  word-wrap: normal;
  width: 100%;
  clear: both;
  float: left;
  position: relative;
  z-index: 1;
}
#QueryBoxAT p:first-child {
  /* margin-bottom: 1.5rem !important; */ /* (4,25 - 1,275) / 2 = 1,4875 */
  margin: 0 0 1.5rem 0 !important;
}

#QueryBoxAT p.onlyNew,
#QueryBoxAT p.onlyTop,
#QueryBoxAT p.onlyOutlet,
#QueryBoxAT p.onlyAll {
  margin: 0 !important;
  padding: 0  !important;
  line-height: 1.5 !important; /* 0,85 x 1,75 */
  font-weight: normal;
}
#QueryBoxAT p.onlyAll {
  text-align: center;
}

#QueryBoxAT p a,
#QueryBoxAT input[type="submit"] {
  border: none;
  color: #1A1A1A !important;
  font-weight: normal;
}
#QueryBoxAT p a:hover,
#QueryBoxAT input[type="submit"]:hover {
  background-color: #1A1A1A;
  background-color: rgba(26,26,26,1.0);
  color: #FFF !important;
  -webkit-transition: all 0.375s ease 0.125s; /* property (list) duration timing-function delay */
  transition: all 0.375s ease 0.125s; /* property (list) duration timing-function delay */
}

.HOS2 {
  /* kein Border wegen IE macht zu hoch */
  /* background-image: url(/images/web/os-farben.png); */
  background-repeat: no-repeat;
  background-position: 0 0; /* rechts oben */
  /* margin: 0 0.5rem 0 0;
  padding: 0 !important; */
  margin: 0.2rem 0.2rem 0 0;
  width: 20px;
  height: 20px;
  display: inline-block;
}
.col0  { background-color: transparent; }
.col1  { /* border: 0.1rem solid #EDECED; */ background-position: 0 0; }
.col2  { background-position: 0 -21px;  }
.col3  { background-position: 0 -41px;  }
.col4  { background-position: 0 -61px;  }
.col5  { background-position: 0 -81px;  }
.col6  { background-position: 0 -101px; }
.col7  { background-position: 0 -121px; }
.col8  { background-position: 0 -141px; }
.col9  { background-position: 0 -161px; }
.col10 { background-position: 0 -181px; }
.col11 { background-position: 0 -201px; }
.col12 { background-position: 0 -221px; }
.col13 { background-position: 0 -241px; }
.col14 { background-position: 0 -261px; }
.col15 { background-position: 0 -281px; }
.col16 { background-position: 0 -301px; }
.col17 { background-position: 0 -321px; }

/* AT Farbwechsel u.a. */
#QueryBoxAT input[type="image"] {
  width: 20px;
  height: 20px;
  clear: both;
}

#QueryBoxAT input[type="submit"] {
  border-radius: 0 !important;
  background-color: #FFF;
  background-color: rgba(255,255,255,1.0);
  margin: 0;
  padding: 0;
  color: #1A1A1A;
  font-size: small !important;
  text-align: left;
  white-space: nowrap;
  word-wrap: normal;
  width: auto;
  clear: both;
  position: relative;
  z-index: 1;
}
@media (max-width: 770px) {
  #QueryBoxAT input[type="submit"] {

  }
}

/*
#QueryBoxAT form.active input[type="submit"] {
  background-color: #1A1A1A;
  background-color: rgba(26,26,26,1.0);
  color: #FFF;
}
*/
#QueryBoxAT form.active input[type="submit"]::before {
  content: '> ' !important;
}

#QueryBoxAT form.active input[type="submit"]:hover {
  background-color: #8b8f9e;
  background-color: rgba(139,143,158,1.0);
  color: #1A1A1A !important;
  -webkit-transition: all 0.375s ease 0.125s; /* property (list) duration timing-function delay */
  transition: all 0.375s ease 0.125s; /* property (list) duration timing-function delay */
}

@media (max-width: 480px)  {
  /* weil padding bei input z.B. beim iPhone nicht funktioniert */
  #QueryBoxAT input[type="submit"] {
    border-left: 0.4rem solid #FFF !important;
    border-right: 0.4rem solid #FFF !important;
  }
  #QueryBoxAT input[type="submit"]:hover,
  #QueryBoxAT form.active input[type="submit"],
  #QueryBoxAT form.active input[type="submit"]:hover {
    /*
    border-left: 0.4rem solid #1A1A1A !important;
    border-right: 0.4rem solid #1A1A1A !important;
    */
    border-left: 0.4rem solid #FFF !important;
    border-right: 0.4rem solid #FFF !important;
  }
}

#QueryBoxAT input[type="submit"].pi {
  /* margin: 0 !important; */
  /* width: 76%; */
  margin: 0.15rem 0 0 0;
  clear: none;
  width: 75% !important;
}

/* / QueryBoxAT ##################################################################################################### */

#ArtThumbs {
  /*
  width: 960px;
  padding: 0 20px;
  text-align: left;
  float: left;
  */
  /* width: 1000px; */
  width: 100%;
  float: left;
}

#ArtImgs, #ArtText {
  padding-top: 20px;
}
@media (max-width: 770px) {
  #ArtImgs, #ArtText {
    padding-top: 0;
  }
}

#ArtImgs, #ArtBott {
  /* width: 460px;
  margin: 0;
  padding: 0;
  float: left;
  text-align: center;
  overflow: hidden; */
  margin-right: 4%;
  width: 48%;

  clear: both;
  float: left;
  /* overflow: hidden; */
}
@media (max-width: 770px) {
  #ArtImgs, #ArtBott {
    margin-right: 0;
    width: 100%;
    max-width: none;
  }
}

#ArtText {
  /* width: 460px; */
  /* margin: 2.5rem 20px 0 0; */
  /* margin: 0 20px 0 0; */
  /* padding: 0; */
  /* clear: both; */
  /* float: right; */
  margin-left: 2%;
  float: left;
  width: 46%;

}
@media (max-width: 770px) {
  #ArtText {
    margin-left: 0;
    width: 100%;
    max-width: none;
  }
}

#ArtThumbs div.CatHead h2 {
  margin: 10px 0 20px 0;
  text-align: center;
}
#ArtThumbs div.CatHeadCut {
  clear: both;
}
#ArtThumbs div.CatHeadCut h3 {
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  padding: 0.425rem;
  text-align: center;
  width: 100%;
}

#ArtImgs p {
  text-align: left;
  /* padding: 0.5rem;
  margin: 0.5rem 40px 1rem 40px; */
}

#ArtText p a.button,
#ArtImgs p a.button {
  width: 100%;
}

#ArtText p span {
  cursor: pointer;
}

#ImgPIC {

 /* background: url(/images/web/produkt-hintergrund.png);
  background-repeat: no-repeat;
  background-position: 0 0; */ /* links oben */
  /* border-radius: 12px;
  border-radius: 0.1px; Hack wegen Shadow Problem beim Zoom
  -moz-box-shadow: 0 0 5px #999;
  -webkit-box-shadow: 0 0 5px #999;
  box-shadow: 0 0 5px #999;
  border: 0.15rem solid #EDECED; */
  background-color: #FFF;
  background-color: rgba(255,255,255,1.0);

  /* margin: 2rem 0 1rem 20px; */
  /* margin: 0 0 0 20px; */
  /* padding: 20px; */
  /* padding: 20px 0; */
  /* padding: 0; */
  /* width: 442px;
  height: 442px; */
  /* min-height: 400px; */

}
#ImgMidLoading {
  border: none;
  width: 100%;
  height: auto;
  position: absolute;
  z-index: 1;
  display: none;
}

#ImgVAM {
  border-radius: 0.125rem !important;
  border: 0.075rem solid #F3F3F3;
  margin-bottom: 1.5rem;
  width: 100%;
  max-width: 400px;
  height: auto;
  position: relative;
  cursor: pointer;

  /* transition: all 0.5s ease 0.25s; */
  /* stört onclick() */
  /* -webkit-transition: all .5s ease-in-out 0.25s; */ /* property (list) duration timing-function delay */
  /* transition: all .5s ease-in-out 0.25s; */ /* property (list) duration timing-function delay */

}
@media (max-width: 770px) {
  #ImgVAM {
    max-width: none;
  }
}
#ImgVAM.JSon {
  border: none;
}
#ImgVAM.JSon::before {
  border-radius: 0.125rem !important;
  /*
  content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
  -webkit-box-shadow: inset 0 0 60px 20px rgba(201, 201, 201, 0.5);
  -moz-box-shadow: inset 0 0 60px 20px rgba(201, 201, 201, 0.5);
  box-shadow: inset 0 0 60px 20px rgba(201, 201, 201, 0.5);
  */
}
@media (max-width: 770px) {
  #ImgVAM.JSon::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-box-shadow: inset 0 0 60px 20px rgba(201, 201, 201, 0.2);
    -moz-box-shadow: inset 0 0 60px 20px rgba(201, 201, 201, 0.2);
    box-shadow: inset 0 0 60px 20px rgba(201, 201, 201, 0.2);
  }
}
#ImgVAM span {
  /* Neu @ OS w/ vertical-align bei zu flachen Pics!: */
  margin-left: -1px;
  vertical-align: middle;
  width: 1px;
  /* height: 100%; */
  min-height: 400px;
  display: inline-block;
}
#ImgVAM img {
  width: 100%;
  max-width: 400px;
  height: auto;
}
@media (max-width: 770px) {
  #ImgVAM img {
    max-width: none;
  }
}

#ImgMid p {
  word-wrap: break-word;
}

#ImgOther, #ImgColors {
  margin-bottom: 1.5rem;
}
#ImgColors {
  max-width: 440px;
}
@media (max-width: 770px) {
  #ImgOther, #ImgColors {
    margin-bottom: 20px;
    text-align: center;
  }
  #ImgColors {
    max-width: none;
  }
}
.detailthumb {
  border-radius: 0.125rem;
  border: 0.075rem solid #F3F3F3;
  margin: 0 5% 5% 0;
  width: 20%;
}
#ImgColors .detailthumb {
  margin: 0 2.5% 2.5% 0;
  width: 15%;
}
@media (max-width: 770px) {
  .detailthumb {
    margin: 0 5% 5% 5%;
  }
  #ImgColors .detailthumb {
    margin: 0 2.5% 2.5% 2.5%;
  }
}

/* KOSTEN Animation ************************************************************************************************* */

p.CostsInfo {
  max-height: 1.5rem;
  overflow: hidden;
  transition: max-height 0.5s ease;
}
p.CostsInfo:hover {
  max-height: 48rem;
  transition: max-height 1s ease;
}

p.CostsInfo a {
  white-space: normal;
}

p.CostsInfo a ins {
  border-radius: 0.125rem !important;
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  margin-top: 1.5rem;
  padding: 1.5rem;
  color: #1A1A1A;
  font-weight: normal;
  text-align: left;
  text-decoration: none;
  width: 100%;
  cursor: text;
  position: relative;
  float: left;
}

p.CostsInfo a ins b {
  font-weight: 700;
}

p.CostsInfo a ins span {
  border-radius: 0.125rem !important;
  border: 0.075rem solid #F3F3F3 !important; /* 0.15 w/ z.B. iPhone */
  background-color: #F3F3F3;
  background-color: rgba(243,243,243,1.0);
  padding: 0.1rem 0.2rem !important;
  color: #1A1A1A;
  font-weight: 700;
  text-align: center !important;
  width: 1.5rem;
  min-width: 20px !important;
  position: relative;
  float: right;
  top: -15px;
  left: 15px;
  cursor: pointer;
  display: none;
}
@media (max-width: 480px)  {
  p.CostsInfo a ins span {
    display: block;
  }
}

/* zum Schließen bei z.B. iPhone */
p.CostsInfo a:active ins {
  display: none;
}

/* /KOSTEN Animation ************************************************************************************************ */

#ArticlePrice p b.red::before {
  font-family: 'Material Icons';
  font-feature-settings: 'liga'; /* IE */
  content: 'play_arrow';
  position: relative;
  top: 0.25rem;
}

#ArticlePrice img {
  vertical-align: baseline;
  width: auto;
  height: 2rem;
  max-height: 2rem;
}

#ArtSocs {
  width: 100%;
  position: relative;
  float: left;
}
#ArtSocs p {
  white-space: nowrap;
  /* width: 50%; */
}
#ArtSocs p.twitter {
  /* text-align: right; */
}
@media (max-width: 770px) {
  #ArtSocs p {
    width: 50%;
  }
  #ArtSocs p.fblike {
    text-align: right;
  }
}

#ArtBott a.button {
  width: 100%;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#myBasket {
  margin: 40px 0;
  width: 100%;
  position: relative;
  float: left;
}

.myBasketItems,
.myBasketSUM {

  border-bottom: 0.075rem solid #8b8f9e;

  margin: 0 0 1.5rem 0;

  width: 100%;
  clear: both;

}

.myBasketItems {

  min-height: 120px;
  min-height: calc(100px + 1.5rem);

  position: relative;
  float: left;

}

#myBasket p {
  width: 100%;
}
#myBasket p.left,
#myBasket p.right {
  margin: 0;
  width: 47.5%;
}
#myBasket p.left {


}

div.OptionsButtons {
  width: 100%;
  clear: both;
  position: relative;
  float: left;
}

div.OptionsButtons p.right a.button {
  float: right;
}
div.OptionsButtons p {
  width: 50%;
}
div.OptionsButtons p a.button,
div.OptionsButtons p input[type="submit"] {
  width: 95%;
}
div.OptionsButtons p.right input[type="submit"] {
    margin: 0;
    float: right;
}
@media (max-width: 500px) {
  div.OptionsButtons p,
  div.OptionsButtons input  {
    font-size: x-small !important;
  }
}

#myBasket input[type="submit"] {

}

div.myBasketCol1 {

  width: 140px;
  width: calc(100px + 2.6444rem);

  min-height: 120px;
  min-height: calc(100px + 1.5rem);

  float: left;

}
div.myBasketCol1 img {

  width: 100%;
  max-width: 120px;
  height: auto;

}
div.myBasketCol2 {
  margin: 0 0 1.5rem 0;
  width: 45%;
  float: left;
}
@media (max-width: 500px) {
  div.myBasketCol2  {
    width: 55% !important;
  }
}
@media (max-width: 1280px) {
  div.myBasketCol2 {
    width: 35%;
  }
}
div.myBasketCol2 div {
  margin: 0;
  float: left;
}
div.myBasketCol2 div:nth-child(1)  {
  margin: 0 2.6444rem 0 0;
}
div.myBasketCol2 div:nth-child(2)  {

}
div.myBasketCol2 div:nth-child(3)  {
  clear: both;
}
div.myBasketCol2 div:nth-child(4)  {
  clear: both;
}

div.myBasketCol3 {
  float: right;
}
div.myBasketCol3 div:first-child {
  margin: 0 2.6444rem 0 0;
  float: left;
}
div.myBasketCol3 div {
  margin: 0;
  float: right;
}
div.myBasketCol3 div p {
  text-align: right;
}

#RemoveFromBasket input[type="submit"] {
  background: none;
  margin: 0;
  padding: 0;
  color: #1A1A1A !important;
  text-align: left;
  letter-spacing: normal;
  width: auto;
}
#RemoveFromBasket input:nth-child(3) {
  margin-right: 0.2975rem;
  font-weight: 700;
}
#RemoveFromBasket input:nth-child(4) {
  clear: none;
}

.myBasketSUM p {
  text-align: right;
}
.myBasketSUM p em {
  font-size: 1.0625rem; /* p x 1,25 */
  font-weight: 700;
  font-style: normal;
}

#Shopping p {
  margin-top: 40px;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#IDCustomerData {
  clear: both;
  float: left;
}
#IDCustomerData b.red {
  float: right;
  font-weight: normal;
}
#IDCustomerData img {
  width: 120px;
  height: 30px;
}
#IDCustomerData img[src*="paypal"] {
  padding: 0.2125rem;
  width: auto;
  height: 1.5rem; /* line-height */
  position: relative;
  top: 8px;
  left: 6px;
}
#IDCustomerData fieldset:nth-child(2) label:nth-child(1) {
  margin-bottom: 0.85rem;
}
#IDCustomerData fieldset:nth-child(2).rejected {
  border: 0.075rem solid #C00;
  padding: 1rem;
}

#CustomerCol3 input {
  margin: 0.25rem 0.85rem 0 0 ;
}
#IDConfirmation label,
#IDConfirmation label a {
  width: 85%;
  clear: none;
}

#Confirmation {
  margin-bottom: 40px;
}

.textblock {
  clear: both;
}

#Login {
  width: 75%;
}
#myCheckOut {
  /* background-image: url(/images/web/shopping-girl.jpg);
  background-repeat: no-repeat;
  background-position: 95% 15%; */ /* rechts oben */
  margin: 0 0 40px 0;
  width: 75%;
  /* height: 75rem; */
  clear: both;
  float: left; /* important!!! */
}
@media (max-width: 770px) {
  #Login,
  #myCheckOut {
    width: 100%;
  }
}
/*
@media (max-width: 1080px) {
  #myCheckOut {
    background-image: none;
  }
}
*/
#myCheckOut div p span.green {
  cursor: pointer;
}

#CustomerCol1 {
  padding-left: 1.5rem;
}
#CustomerCol2, #CustomerCol3 {
  padding-left: 1.5rem;
}
#CustomerCol1, #CustomerCol2, #CustomerCol3 {
  margin-bottom: 1.5rem;
  width: 50%;
  float: left;
  overflow: hidden;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#OrderOK  {
  margin: 20px 0;
}
#OrderOK img.PayPal {
  margin-left: 0;
  margin-bottom: 1.5rem;
  max-width: 158px;
  width: 100%;
  height: auto;
  float: none;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#NoGoRAK {
  margin: 3% 25% 17% 25%;
  max-width: 50%;
}

#NoGoRAK p {
   margin-left: 0;
   text-align: center;
}
#NoGoRAK img {
  /* width: 9rem;
  height: 9rem; */
  margin: 1rem 0 0 0 !important;
  width: 100%;
  height: 9rem;
}

/* ------------------------------------------------------------------------------------------------------------------ */

p.ProductClaim {
  /*
  color: #1A1A1A;
  font-size: 1.2rem !important;
  line-height: 1.4rem;
  padding-top: 0.5rem;
  padding-bottom: 0.4rem;
  */
  font-style: italic;
  clear: both;
}

.textleft {
  text-align: left;
}

.textcenter {
  text-align: center;
}

.textright {
  text-align: right;
}

.textlowcase {
  text-transform: lowercase;
}

.textuppcase {
  text-transform: uppercase;
}

.textsemi {
  font-weight: 600;
}

b, .textbold {
  font-weight: 700;
}

.textnormal {
  font-weight: normal;
}

.textsmall {
  /* font-size: 75%; */
  /* font-size: 0.9rem !important; */
  font-size: 0.6375rem !important;
}

.textmedium {
    font-size: 1.275rem !important;
}

.textlarge {
  font-size: 1.5rem !important;
  line-height: 1.2 !important;
  letter-spacing: 0.05rem;
}

.left {
  float: left;
}

.right {
  float: right;
}

.clear {
  clear: both;
}

.visible {
  display: block;
}
.notvisible {
  display: none;
}

.noborderline {
  border: none !important;
}

.red {
  color: #CC0000 !important;
}
.red1x {
  background-color: #CC0000 !important;
  background-color: rgba(204,0,0,1.0) !important;
  padding: 0.2125rem 0.425rem !important;
  color: #FFF !important;
}

.green {
  color: #8bdc5a !important;
}

.blue {
  color: #223556 !important;
}

.midblue {
  color: #456fa4 !important;
}

.purple {
  color: #B76BA3 !important;
}

.grey {
  color: #8b8f9e !important;
}

.darkgrey {
  color: #666 !important;
}

.yellow {
  color: #F7BA0B !important;
}

hr {
  border: none;
  /*
  background-color: #333333;
  background-color: rgba(51,51,51,1.0);
  color: #333333;
  */
  background-color: #8bdc5a;
  background-color: rgba(139,220,90,1.0);
  color: #8bdc5a;
  margin: 2rem 0;
  /* height: 0.0375rem; */
  /* height: 0.075rem; */
  height: 1px;
  clear: both;
}

pre {
  clear: both;
  display: none;
}

/*  Very Specials */
:focus {
  outline-style: none;
}
button::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner {
  border: 0;
}

#Datenschutz ul,
#Impressum ul,
#Features ul {
  /* margin: 0 0 1.5rem 0; */
  margin: 0 0 1.5rem 1rem;
  list-style: disc;
}
ul.copyright  {
  margin-left: 1rem;
  list-style: none !important;
  list-style-type: '© ' !important;
}
ul.datasolo {
 list-style: none !important;
 position: relative;
 left:-1rem;
}
ul.jobs  {
  margin-left: 1rem;
  list-style: none !important;
  list-style-type: '●  ' !important;
}
#Datenschutz li,
#Impressum li,
#Features li {
  /* margin: 0 0 0 0.85rem !important; */
  margin: 0 !important;
}
#Datenschutz span {
  word-wrap: break-word;
}

.last {
  margin-bottom: 0 !important;
}
.recilastX2 {
  margin-bottom: 1.5rem !important;
}

.filter {
  /* margin-top: 1.5rem !important; */
  margin-top: 40px !important;
}

.trans {
  background-color: transparent !important;
}

/* ------------------------------------------------------------------------------------------------------------------ */

#back-to-top {
  /* position:fixed;
	bottom:20px;
	left:100px;
	cursor:pointer;
	padding:10px;
	background:black;
	border-radius:2px;
	color:white; */
  width: 10rem;
  position: fixed;
  bottom: 25px;
  cursor: pointer;
  left: 50%;
  z-index: 2;
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	-o-transform: translate(-50%,0);
	transform: translate(-50%,0);
}
#back-to-top p {

  border-radius: 0.125rem !important;

  /* background-color: #FFF;
  background-color: rgba(255, 255, 255, 0.9); */
  /* background-color: #F3F3F3;
  background-color: rgba(242, 242, 242, 0.9); */ /* nur 242 wegen 0.9 */
  background-color: #8ec7e7;
  background-color: rgba(142, 199, 231, 0.9); /* 142,199,231 wegen 0.9 */

  margin: 0 auto;
  /* padding: 0.425rem 0; */
  padding: 0.5rem 0;

  /* color: #1A1A1A; */
  color: #333333;

  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
  /* font-size: 0.6375rem !important;
  line-height: 1.5 !important; */
  font-size: smaller !important;

  text-align: center;
  letter-spacing: 0.2rem;
  text-transform: uppercase;
  width: 10rem;

  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

}

/* ------------------------------------------------------------------------------------------------------------------ */

/* Laufschrift (Marquee-Simulation) */
@keyframes marquee {
  0% { text-indent: 100%; }
  100% { text-indent: -100%; }
}
@-webkit-keyframes marquee {
  0% { text-indent: 100%; }
  100% { text-indent: -100%; }
}
.marquee {
  margin: 0;
  /* font-size: 0.75rem !important;
  line-height: 1.125rem !important; */
  line-height: 2.125rem !important;
  text-align: center;
  white-space: nowrap;
  width: 100%;
  overflow: hidden;
  animation: marquee 20s linear infinite;
  -webkit-animation: marquee 20s linear infinite;
}
.marquee.L1 {
  /* border: 0.5rem solid #e6e57f;
  background-color: #e6e57f;
  background-color: rgba(230,229,127,1.0); */
  /* border: 0.5rem solid #d0d56d;
  background-color: #d0d56d;
  color: #1A1A1A; */
  border-top: 0.425rem solid #8bdc5a;
  border-right: 0.6375rem solid #8bdc5a;
  border-bottom: 0.425rem solid #8bdc5a;
  border-left: 0.6375rem solid #8bdc5a;
  background-color: #8bdc5a;
  /* color: #FFF; */
  /* text-shadow: 0.05rem 0.075rem 0.125rem #444444; */
  /* letter-spacing: 0.1rem; */
}
.marquee.L1 a {
  color: #FFF;
  white-space: nowrap;
}
.marquee.L2 {
  border: 0.5rem solid #e6e57f;
  background-color: #e6e57f;
  background-color: rgba(230,229,127,1.0);
  color: #1A1A1A;
}
.marquee:hover {
  animation-play-state: paused;
  -webkit-animation-play-state: paused;
}
.marquee.L2.rejected_m {
  border-top: 0.15rem solid #CC0000;
  border-right: 0.3rem solid #CC0000;
  border-bottom: 0.15rem solid #CC0000;
  border-left: 0.3rem solid #CC0000;
  padding: 0.5rem;
}
.marquee img {
  vertical-align: text-bottom;
  width: auto;
  height: 1.125rem;
  max-height: 1.125rem; /* 0,75rem x 1,5 */
}

@media (max-width: 770px) {
  .marquee {
    white-space: normal;
    animation: none;
    -webkit-animation: none;
  }
}

/* ------------------------------------------------------------------------------------------------------------------ */

#T-Rak { border: 0px solid #1A1A1A; }
#T-Rak td { border: 0px solid #1A1A1A; white-space: nowrap; overflow: hidden; }
#T-Rak td:nth-child(4) { text-align: right; }
#T-Rak tr:nth-last-child(+2) td { font-weight: 700; }
#T-Rak tr:last-child td:nth-child(4) { color: #8bdc5a; font-weight: 700; }
@media (max-width: 770px) {
  #T-Rak td {
    font-size: x-small !important;
  }
}
@media (max-width: 500px) {
  #T-Rak td {
    font-size: xx-small !important;
  }
}

/* ------------------------------------------------------------------------------------------------------------------ */

/* facebook */
#logo-facebook {
  border-radius: 0.1px; /* Hack wegen Shadow Problem beim Zoom */
  -moz-box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, 0.2);
  box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, 0.2);
  /* background-color: #A08755;
  background-color: rgba(160, 135, 85, 0.9); */
  width: auto !important;
  height: auto !important;
  position: fixed;
  top: 12px;
  right: 0;
  z-index: 40;
}
@media (max-width: 770px) {
  #logo-facebook {
    display: none;
  }
}
#logo-facebook p {
  margin: 0 !important;
  padding: 0 !important;
  width: 60px !important;
  height: 60px !important;
  /* position: relative;
  top: 10px;
  right: 10px; */
  float: right;
  z-index: 30;
  display: block;
}
#logo-facebook p img {
  box-sizing: content-box;

  /* border: 10px solid #A08755;
  border: 10px solid rgba(160, 135, 85, 0.4);
  background-color: #A08755;
  background-color: rgba(160, 135, 85, 0.4); */
  border: 10px solid #F3F3F3;
  border: 10px solid rgba(242, 242, 242, 0.9); /* nur 242 wegen 0.9 */
  background-color: #F3F3F3;
  background-color: rgba(242, 242, 242, 0.9); /* nur 242 wegen 0.9 */

  width: 40px !important;
  height: 40px !important;
}
#fbclose {
  border: 0.15em solid #FFF;

  /* background-color: #A08755;
  background-color: rgba(160, 135, 85, 1.0); */

  background-color: #000;

  padding: 0.35rem 0.6rem 0 0;
  width: 2rem;
  height: 2rem;
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 333;
  display: none;
}
#fbclose:hover {
  background-color: #CC0000;
}
#fbclose p {
  display: block !important;
}
#fbclose p span {
  color: #FFF;
  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  -webkit-text-shadow: 0 0 0.1rem #666;
  -moz-text-shadow: 0 0 0.1rem #666;
  text-shadow: 0 0 0.1rem #666;
  position: relative;
  top: -9px;
  right: -2px;
  float: right;
}
#fbclose:hover {
  cursor: pointer;
}
#RAK-fb {
  border-radius: 0.1px; /* Hack wegen Shadow Problem beim Zoom */
  -moz-box-shadow: -7px 7px 7px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: -7px 7px 7px 0 rgba(0, 0, 0, 0.2);
  box-shadow: -7px 7px 7px 0 rgba(0, 0, 0, 0.2);

  /* background-color: #A08755;
  background-color: rgba(160, 135, 85, 0.8); */

  background-color: #F3F3F3;
  background-color: rgba(242, 242, 242, 0.9); /* nur 242 wegen 0.9 */

  padding-bottom: 20px;

  width: 360px !important; /* Xcheck os.js */
  /* height: 520px !important; */  /* Xcheck os.js */
  min-height: 240px !important;
  position: relative;
  float: left;
  display: none;
}
div.fb-page {
  position: relative;
  top: 10px;
  left: 10px;
  /* right: 10px; */
}
#RAK-fb div.fb-xfbml-parse-ignore {
  background-color: #FFF;
  padding: 10px 10px 0 10px;
  width: 340px;
  /* height: 500px; */
  position: relative;
  float: left;
}
#RAK-fb div.fb-xfbml-parse-ignore p {
  margin: 0 0 1.5rem 0 !important;
  width: 100% !important;
  height: auto !important; /* WICHTIG */
  display: block !important; /* WICHTIG */
}
#RAK-fb div.fb-xfbml-parse-ignore img {
  border: none !important;
  width: 100% !important;
  height: auto !important;
}
@media (max-width: 480px) {
  #fbclose {
    width: 2.5rem;
    height: 2.5rem;
  }
  #fbclose p span {
    font-size: 1.8rem;
    top: -11px;
    right: 0;
  }
  #RAK-fb {
    -moz-box-shadow: -7px 7px 7px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: -7px 7px 7px 0 rgba(0, 0, 0, 0.4);
    box-shadow: -7px 7px 7px 0 rgba(0, 0, 0, 0.4);
  }
  div.fb-page {
    top: 10px;
  }
}
@media (max-width: 480px) and (orientation: landscape) {
  #logo-facebook {
    position: absolute;
  }
}

/* ------------------------------------------------------------------------------------------------------------------ */

/*  UNSLIDER */
/* /UNSLIDER */

/* noSelects */
head, #MainNaviRAK, #FootRAK, noscript,
#divtext,
#IDArticle2Basket label.ordered::after,
#IDArticle2Basket p.ordered::before, div.myBasketCol2 p.ordered::before,
div.PT p b.red::before,
#ArticlePrice p b.red::before,
.unslider {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* BURGER CheckBox */
input#burgermenu {
  display: none;
}
label.burgermenu {
  /* border: 1px solid red; */
  /* background-color: #8bdc5a !important;
  background-color: rgba(139,220,90,1.0) !important; */
  background-color: #456fa4 !important;
  background-color: rgba(69,111,164,1.0) !important;
  /* margin-bottom: 1rem; */
  color: #FFF;
  cursor: pointer;
  display: none;
}
label.burgermenu em {
  /* border: 1px solid red; */
  padding: 0 0.5rem 0.5rem 0;
  color: #FFF;
  font-size: large;
  font-style: normal;
  position: relative;
  float: right;
}
label.burgermenu em:first-child {
  /* border: 1px solid red; */
  padding: 0 0 0.5rem 0.5rem;
  float: left;
  top: 9px;
}
label.burgermenu em::after {
  font-family: 'Material Icons';
  font-feature-settings: 'liga'; /* IE */
  content: 'menu';
  /* border: 1px solid red; */
  font-size: x-large;
  position: relative;
  top: 3px;
}
label.burgermenu em:first-child::after {
  font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
  content: ' ';
  /* border: 1px solid red; */
  font-size: large;
}
nav {
  display: block;
}
/* @media (max-width: 770px) { */
@media (max-width: 1024px) {
  input#burgermenu:checked ~ nav {
    display: block;
  }
  label.burgermenu {
    display: block;
  }
  input#burgermenu:checked ~ label.burgermenu em::after {
    content: 'close';
  }
  input#burgermenu:checked ~ label.burgermenu em:first-child::after {
    content: ' ';
  }
  nav {
    display: none;
  }
}

/* BreadCrumb */
p.breadcrumb {
  font-size: smaller !important;
}

/* CMS */
#Info ul {
  text-align: center !important;
}
#Info ul li {
  color: #FFF !important;
}
ul.cms li {
  margin-bottom: 0 !important;
}

#HomePage p.il {
  font-family: 'Varela Round', 'Open Sans', Arial, Helvetica, sans-serif;
  box-sizing: border-box;
  border-radius: 0.5rem;
  /* border: 0.5rem solid #CC0000; */
  border: 0.2rem solid #CC0000;
  background-color: #FFF;
  background-color: rgba(255, 255, 255, 1.0);
  /* margin: 0 0 5% 0 !important; */
  margin: 1% 0 3.5% 0 !important;
  padding: 1rem 10px !important;
  color: #CC0000;
  font-size: x-large !important;
  line-height: 1.5 !important;
  text-align: center;
  text-transform: uppercase;
  width: 100% !important;
  clear: both;
}
@media (max-width: 770px) {
  #HomePage p.il {
    margin: 2% 0 6% 0 !important;
    font-size: large !important;
  }
}
#Jobs {
  border: 0.075rem solid #333333;
  padding: 25px;
  width: 75%;
}
#Jobs .ccb img {
  width: 50% !important;
}
@media (max-width: 1280px) {
  #Jobs {
    width: 100%;
  }
  #Jobs .ccb img {
    margin: 0 1.5% 1.5rem 0;
    width: 100% !important;
    max-width: 100% !important;
  }
}

img.a24 {
  width: 2.4rem;
  height: auto;
  position: relative;
  bottom: -3px;
}

#HomePage {
  background-color: #223556;
  background-color: rgba(34,53,86,1.0);
  margin: 9% 0 9% 9%;
  padding: 3%;
  color: #FFF;
  max-width: 81%;
}
#HomePage a {
  color: #FFF;
  text-decoration: underline;
}
#HomePage a.noup, #HomePage a.noup:hover {
  color: #FFF !important;
}
