/* CARLOS KLEIN SAILING COACH */

/* RESETS */
html, body { height: 100%; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
 margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
body { line-height:1; }
ol, ul { list-style:none; }
table { border-collapse:collapse; border-spacing:0; }

/* COMMONS */
::-moz-selection { background:#333; color:white; }
::selection { background:#333; color:white; }

body { background:white; font:13px 'Open Sans', sans-serif; color:#000; -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%; }
.embed-container { position:relative; padding-bottom:56.25%; /* 16/9 ratio */ padding-top:30px; /* IE6 workaround*/ height:0; overflow:hidden; }
.embed-container iframe, .embed-container object, .embed-container embed { position:absolute; top:0; left:0; width:100%; height:100%; }

/* HOMEPAGE */
#homepage { position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; width:100%; height:400px; margin-bottom:0px; top:0; z-index:1; }
#homepage .container { height:100%; z-index:1; }

/* NAVIGATION */
.nav_box { width:100%; height:60px; }
nav { position:absolute; display:flex; align-content:center; justify-content:center; padding:0px auto 0px auto; width:100%; height:60px; left:0; right:0; background-color:#333; z-index:9900; }
.sticky { position:fixed; top:0; }

navheader { position:relative; display:block; align-items:center; justify-content:center; vertical-align:middle; background-color:#fff; width:100%; height:60px; z-index:9900; }
subnav { position:relative; display:flex; align-content:center; justify-content:center; margin-top:30px; padding:0 auto 0 auto; width:100%; height:auto; z-index:8000; }

.selectnav { display:none; }
a.selected.active { color:#FFFFFF; }

.arrow-container { position:fixed; display:flex; align-content:center; justify-content:center; right:12px; bottom:11px; width:30px; height:30px; background-color:#333; z-index:9990; }
.arrow-container img { width:50%; height:auto; }
.arrow { padding:12px 0; }

/* Social Icons Navi */
.social-icons { vertical-align:middle; text-align:right; height:60px; display:table-cell; }
.social-icons li { display:inline-block; margin:0 0 0 8px; } /* Abstand zueinander */
.social-icons li a { font-size:13px; line-height:1.8; text-align:center; text-decoration:none; display:block; width:24px; height:24px; background:#333333; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; }
.social-icons a:hover { background-color:#999999; }

/* Social Icons Navi */
.social-icons { vertical-align:middle; text-align:right; height:60px; display:table-cell; }

/* SLIDER */
#slidecaption { overflow:hidden; float:left; color:white; font:130px/0.9 "CarkleTrash", sans-serif; font-weight:500; letter-spacing:-2px; }
.slider-text { position:relative; overflow:hidden; top:20px; left:0px; text-align:center; text-transform:uppercase; z-index:7000; }
.slidedescription { font:400 24px "Carkle", sans-serif; letter-spacing:1px; margin:6px 0px 0px 0px; }

/* LOGO */
.logo { display:table-cell; vertical-align:middle; float:left; max-width:140px; height:auto; padding:13px 0 0px 35px; }
.logohead { display:table-cell; vertical-align:middle; max-width:280px; height:auto; border:none; padding:60px 0px 0px 60px; }

/* CONTENT */
.page { position:relative; padding:50px 0px; background:#ebdede; }
.page-black { position:relative; padding:50px 0px; background:#000000; }

.one-text { font-size:20px; text-transform:uppercase; line-height:1.5; text-align:center; }
.columns .img-wrp { position:relative; }
.spacer { margin-bottom:40px; }

/* TYPOGRAPHY */
h1, h2, h3, h4 { font-family:'Carkle', sans-serif; text-transform:uppercase; font-weight:700; text-align:center; padding-bottom:10px; -ms-hyphens:none; -webkit-hyphens:none; hyphens:none; z-index:20; }
h1 { font-size:70px; color:#00383E; margin-bottom:40px; line-height:1; }
h1.back { display:inline-flex; text-align:center; font-size:64px; font-weight:600; color:#fff; background-color:#000; padding:15px 25px 23px 25px; }
h1.white { font-size:70px; font-weight:500; color:white; letter-spacing:1px; line-height:1; }
h1.legal { text-align:left; -ms-hyphens:auto; -webkit-hyphens:auto; hyphens:auto; }

h1.box-head { font-family:'Carkle', sans-serif; text-transform:uppercase; position:absolute; bottom:0px; left:15px; width:50px; -webkit-transform: rotate(-90deg); transform:rotate(-90deg); font-weight:600; font-size:40px; line-height:0; color:#003237; z-index:8; }

h1.feat { font-size:70px; color:#00383E; margin-bottom:30px; line-height:1; text-align:left; }
h1.semi { font-size:30px; text-align:left; color:#00383E; margin-bottom:0px; line-height:1; }

h2 { font-family:'Carkle', sans-serif; font-size:30px; font-weight:600; color:#004C53; line-height:1.3; text-align:left; padding:6px 20px 10px 16px; }
h2.white { color:white; }

h3 { font-family:'Carkle', sans-serif; font-size:25px; font-weight:600; color:#004C53; line-height:1.3; text-align:left; padding:6px 20px 10px 16px; }
h3.white { color:white; }
h3.skipper { font-size:32px; text-align:center; padding:0 0 10px 0; }
h3.slide { font-weight:300; font-family:'Open Sans', sans-serif; font-size:26px; }

h4 { font-family:'Carkle', sans-serif; font-size:22px; line-height:1.2; }
h4.white { font-family:'Carkle', sans-serif; font-size:32px; font-weight:400; }

h5 { font-family:'Carkle', sans-serif; text-transform:uppercase; position:absolute; bottom:100px; right:0; width:150px; -webkit-transform: rotate(-90deg); transform:rotate(-90deg); font-weight:600; font-size:150px; line-height:0; color:#EDE6E5; z-index:0; }

p { display:inline; font-family:'Open Sans', sans-serif; margin-top:0px; -webkit-hyphens:auto; -ms-hyphens:auto; hyphens:auto; overflow-wrap:break-word; }
p.white { display:block; margin-bottom:8px; font-size:16px; color:#fff; text-transform:uppercase; line-height:1.4; }
p.cyan { display:block; font-size:13px; color:#40ACB6; text-transform:uppercase; line-height:1.4; }
p.green { display:block; font-size:13px; color:#004C53; text-transform:uppercase; line-height:1.4; }
p.white-bold { font-size:18px; font-weight:700; color:#fff; text-transform:uppercase; }
p.green-bold { font-size:18px; font-weight:700; color:#004C53; text-transform:uppercase; }
p.lead { font-size:20px; color:#868991; line-height:1.4; }
p.heavy { font-weight:700; color:#004C53; }
p.price { display:block; margin-bottom:0px; font-size:26px; font-weight:700; color:#fff; /*text-shadow: 2px 2px 8px #000;*/}
p.price-orange { display:block; margin-bottom:0px; font-size:26px; font-weight:700; color:#CE7701; /*text-shadow: 2px 2px 8px #000;*/}
p.description { font-size:15px; color:#000; text-transform:uppercase; text-align:left; float:left; line-height:25px; padding:0 0 0 17px;}
p.description-light { font-size:14px; color:#848484; text-transform:uppercase; line-height:18px; }
p.description-white { color:white; font-size:14px; text-transform:uppercase; line-height:10px; }
p.lexikon-alphabet { color:#666; font-size:44px; text-transform:uppercase; font-weight:700; padding-left:8px; }
p.lexikon-flagge { color:#DDCFCF; font-size:44px; text-transform:uppercase; font-weight:700; padding-left:0px; }

a { color:#999; text-decoration:none; text-align:center; transition:all 0.3s linear; -moz-transition:all 0.3s linear; -webkit-transition:all 0.3s linear; -o-transition:all 0.3s linear; }
a:hover { color:#FFF; }
a.links { color:#000; text-decoration:none; text-align:center; transition:all 0.3s linear; -moz-transition:all 0.3s linear; -webkit-transition:all 0.3s linear; -o-transition:all 0.3s linear; }
a.links:hover { color:#004C53; }

.text-vertical { font-family:'Carkle', sans-serif; text-transform:uppercase; text-align:center; width:100%; position:absolute; display:flex; align-items:center; justify-content:center; bottom:-40px; /*-webkit-transform: rotate(90deg); transform:rotate(90deg);*/ font-weight:600; font-size:100px; color:#EDE9E9; z-index:0; }

.left { text-align:left; display:inline-block; align-items:center; justify-content:center; }

/* PARALLAX */
.parallax { position:relative; width:100%; height:400px; overflow:hidden; z-index:250; }

.prlx1 { position:absolute; display:flex; align-items:center; justify-content:center; background: url(../images/parallax/carlosklein-sailing-parallax-01.jpg) 50% 50% fixed repeat-y; width:100%; height:100%; margin:0 auto; background-size:110%; }
.prlx2 { position:absolute; display:flex; align-items:center; justify-content:center; background: url(../images/parallax/carlosklein-sailing-parallax-02.jpg) 50% 50% fixed repeat-y; width:100%; height:100%; margin:0 auto; background-size:110%; }
.prlx3 { position:absolute; display:flex; align-items:center; justify-content:center; background: url(../images/parallax/carlosklein-sailing-parallax-03.jpg) 50% 50% fixed repeat-y; width:100%; height:100%; margin:0 auto; background-size:110%; }
.prlx4 { position:absolute; display:flex; align-items:center; justify-content:center; background: url(../images/parallax/carlosklein-sailing-parallax-04.jpg) 50% 50% fixed repeat-y; width:100%; height:100%; margin:0 auto; background-size:110%; }
.prlx5 { position:absolute; display:flex; align-items:center; justify-content:center; background: url(../images/parallax/carlosklein-sailing-parallax-05.jpg) 50% 50% fixed repeat-y; width:100%; height:100%; margin:0 auto; background-size:110%; }

.prlx-text { font-family:'Carkle', sans-serif; font-size:44px; line-height:1.3; font-weight:500; color:white; text-transform:uppercase; display:table-cell; vertical-align:middle; width:600px; text-align:center; }

/* HELPERS */
.hidden { display:none; }
.anker { visibility:hidden; height:0px !important; position:absolute; margin:-60px; }
.anker_search { visibility:hidden; height:0px !important; position:absolute; margin-top:-95px; }
.umbruch::after { content:'\A'; white-space:pre; }

/* LINIEN */
hr { border:0; border-bottom:1px solid #BBB; width:90%; margin-left:auto; margin-right:auto; }
hr-column { border:0; border-bottom:1px solid #000; width:100%; float:left; opacity:0.2; }
hr-skipper { border:0; border-bottom:1px solid #000; width:60%; display:inline-block; opacity:0.2; }
.hr-vertical { padding:8px; border-left:1px solid #51B8C2; margin-left: 18px; }
hr.menu { border:0; border-bottom:1px solid #666; opacity:0.8; width:auto; margin:0 35% 0 35%; }
hr.feature { border:0; border-bottom:1px solid #BBB; width:100%; margin-left:auto; margin-right:auto; }

/* BOX */
/*.box-container { position:relative; width:100%; height:auto; z-index:100; }*/
.box { position:relative; width:100%; height:auto; background:#004248; margin:10px 0px 0 0px;/*background-image:linear-gradient(-40deg, #177780 0%, #004C53 50%);*/ opacity:1; border-radius:0px; border:4px solid rgb(255, 255, 255, 0.2); z-index:100; }
.box-back { position:relative; display:flex; align-items:center; justify-content:center; width:100%; z-index:10; }
.box-text { position:relative; width:auto; text-align:center; padding:20px 15px; z-index:20; }
.box-artikel { width:95%; }

.features-container { position:relative; width:100%; display:flex; justify-content:center; align-content:center; }
.features { text-align:left !important; line-height:1.1; }

/* BRUSHSTROKE */
#brushstroke { position:absolute; width:95%; height:auto; margin:35px 0 0 70px; display:flex; justify-content:center; align-items:center; overflow:hidden; }
.brushstroke { width:500px; height:60px; background-image:url('../images/brushstroke/brushstroke-01.png'); background-repeat:no-repeat; background-size:cover; }

/* TORN PAPER */
#tornpaper { position:absolute; top:0px; width:100%; height:auto; margin:0px; overflow:hidden; }
.tornpaper { width:auto; height:400px; background-image:url('../images/brushstroke/tornpaper-03.png'); background-repeat:no-repeat; background-size:cover; }

/* CLIENTS */
.clients { font-size:18px; color:#000; -webkit-text-align-last:left; -moz-text-align-last:left; text-align:justify; line-height:1.4; text-transform:uppercase; }
.clients .center { text-align:center; }
.clients a { color:#000; }
.clients a:hover { color:#999; }
.links a:visited { color:#999; }
.links a:hover { color:black; }
	
/* CONTACT */
#contact { position:relative; width:100%; height:auto; background-color:#002227; }
.card { position:relative; width:100%; text-align:center; padding:60px 0 40px 0; }

/* Contact Buttons */
.contact-tabs { margin:35px 0px; }
.contact-tabs li { display:inline; margin:0 9px; }
.contact-tabs li a { padding:5px 15px 5px 15px; /*background:#333333;*/ border-radius:0px; border-color:#888; border-width:1px; border-style:solid; font-size:11px; color:#888; font-weight:600; text-transform:uppercase; }

/* Social Icons Contact */
.contact-social-icons { padding:20px 0 0px 0; text-align:center; left:0; width:100%; }
.contact-social-icons li { display:inline; margin:0; }
.contact-social-icons li a { display:inline-block; color:#888; font-size:20px; /*background-color:#666666;*/ width:52px; height:52px; margin-bottom:7px; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; }
.contact-social-icons li a:hover { color:white; /*background-color:#333333;*/ }

/* Social Icons Skipper */
.contact-skipper { text-align:center; position:relative; left:0; display:block; margin:8px 0px; }
.contact-skipper li { display:inline; margin:0px 10px; }
.contact-skipper li a { display:inline-block; color:#888; font-size:20px; }
.contact-skipper li a:hover { color:#000; }

/* E-Mail, Phone (.lines) & Adress */
.lines { width:70%; border-top:#666 1px solid; border-bottom:#666 1px solid; text-transform:uppercase; color:white; font-family: 'Carkle', sans-serif; font-size:30px; padding:20px 0 20px 0; margin:12px auto 0px auto; line-height:1.45; }
.adress { color:#999; font-size:18px; font-weight:400; margin-top:8px; }

/* Hinweis Datenschutz */
.hinweis-text { font:14px 'Open Sans', sans-serif; color:white; text-transform:uppercase; text-align:center; padding:30px 0 0 0; }
.edge { height:110px; }

/* Copyright */
#copyright { text-align:center; min-height:100px; background-color:#002227;  }
.copyright-text p { text-transform:uppercase; font-weight:400; font-size:14px; color:#888;  }


/* SHORTCODES */

/* Buttons */
.button { width:auto; border-color:#888888; border-width:1px; border-style:solid; background-color:transparent; color:#888888; cursor:pointer; display:inline-block; font-size:12px; font-weight:600; text-transform:uppercase; margin:0; padding:11px 20px 11px; position:relative; text-align:center; text-decoration:none; -webkit-border-radius:0px; -moz-border-radius:0px; border-radius:0px; -webkit-transition:all 0.2s linear; -moz-transition:all 0.2s linear; -o-transition:all 0.2s linear; transition:all 0.2s linear; }
.button:hover { color:white; border-color:white; border-width:1px; border-style:solid; }
.button:active { /*background-color: #666666;*/ }
.button:focus { /*background-color: #999999;*/ }
.button.large { font-size:16px; padding:14px 30px 14px; }
.button.small { font-size:10px; padding:6px 10px 6px; }

/* Forms */
form { margin-bottom:0px; }
fieldset { margin-bottom:20px; }
input, textarea { border:1px solid #ccc; padding:10px 10px; outline:none; color:#868991; margin:5px 0 0 0; width:100%; display:block; margin-bottom:20px; background:#fafafa; font-size:13px; text-transform:none; font-family:'Open Sans', sans-serif; font-weight:400; box-sizing:border-box; border-radius:0px; }
textarea { min-height:100px; }
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus { border:1px solid #868991; color:#1c1f26; background: white; -moz-box-shadow:0 0 4px rgba(0,0,0,.2); -webkit-box-shadow:0 0 4px rgba(0,0,0,.2); box-shadow:0 0 4px rgba(0,0,0,.2); }
input.error { border:1px solid #c60f13; background:#f9e7e8; }
input.error[type="text"]:focus,
input.error[type="password"]:focus,
input.error[type="email"]:focus { border:1px solid #c60f13; }
legend { display:block; font-weight:600; font-size:14px; }
.card input, .card textarea, .card input:focus, .card textarea:focus { border:none; }

/* Tabs */
.tabs { margin:20px 0; overflow:hidden; }
.tabs ul { width:100%; margin:0; overflow:hidden; border-bottom:1px solid #666666; }
.tabs ul li { display:inline-block; padding:11px 20px; margin-right:5px; background:#f0f2f5; font-family:'Carkle', sans-serif; text-transform:uppercase; cursor:pointer; -webkit-transition:all 0.1s linear; -moz-transition:all 0.1s linear; -o-transition:all 0.1s linear; transition:all 0.1s linear; }
.tabs ul li:last-child { margin-right:0; }
.tabs ul li:hover { /*background:#666666;*/ color:white; }
.tabs ul li.current { background:#666666; color:white; }
.tabs .tab-content { border:1px solid #666666; padding:16px 20px 25px 20px; display:none; }
.tabs .tab-content:first-child { border:1px solid #666666; padding:16px 20px 25px 20px; display:block; }

.js-tabs .tab-content { display:none; }
.js-tabs .tab-content.active { display:block; position:relative; }
.js-tabs .tab-content-wrp { position:relative; }
.js-tabs li a:hover, .js-tabs li a.current { color:#FFFFFF; border-color:#FFFFFF; /*background:#666666;*/ }

/* ORDER */

/* Order Buttons */
.order-tabs { margin:35px 0px; }
.order-tabs li { display:inline; margin:0 9px; }
.order-tabs li a { padding:5px 15px 5px 15px; /*background:#333333;*/ border-radius:0px; border-color:#888; border-width:1px; border-style:solid; font-size:11px; color:#888; font-weight:600; text-transform:uppercase; }

.js-order .order-content { display:none; }
.js-order .order-content.active { display:block; position:relative; }
.js-order .order-content-wrp { position:relative; }
.js-order li a:hover, .js-order li a.current { color:#FFFFFF; border-color:#FFFFFF; /*background:#666666;*/ }
	
/* Alerts */
.alert { padding:10px 35px 10px 14px; margin:10px 0; font:13px 'Open Sans', sans-serif; background-color:#faf2cb; color:#c09853; text-transform:none; text-align:left; -webkit-border-radius:4px; -moz-border-radius:4px; -o-border-radius:4px; border-radius:4px; }
.alert h5 { margin:0; }
.alert .close { position:relative; top:-2px; right:-21px; line-height:20px; }
.alert-success { background-color:#c3e4b8; color:#468847; }
.alert-danger, .alert-error { background-color:#e7c1c0; color:#b94a48; }
.alert-info { background-color:#b9dbee; color:#3a87ad; }
.alert-block { padding-top:14px; padding-bottom:14px; }
.alert-block > p, .alert-block > ul { margin-bottom:0; }
.alert-block p + p { margin-top:5px; }
	
/* Close */
.close { float:right; font-size:18px; margin-top:-1px; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight:bold; color:#000000; opacity:0.2; filter:alpha(opacity=20); }
.close:hover { color:#000000; text-decoration:none; cursor:pointer; opacity:0.4; filter:alpha(opacity=40); }
button.close { padding:0; cursor:pointer; background:transparent; border:0; -webkit-appearance:none; }

/* Impressum & Datenschutz */
.legals-text { font-weight:100; text-transform:uppercase; text-align:left; }
.legals-text-heavy { font-weight:600; text-transform:uppercase; text-align:left; }
.legals-text-head { font-size:20px; font-weight:600; text-transform:uppercase; text-align:left; }
.legals-title { margin-bottom:50px; text-transform:uppercase; text-align:left; }


/* ACCORDION */

.accordion { width:100%; margin:30px auto 20px auto; }

.accordion .link {
  position:relative;
  cursor:pointer;
  display:block;
  padding:7px 40px 6px 10px;
  color:#666;
  font-size:15px;
  font-weight:700;
  line-height:17px;
  /*word-wrap:break-word;*/
  border-bottom:1px solid #CCC;

  -moz-hyphens:auto;
  -webkit-hyphens:auto;
  -o-hyphens:auto;
  -ms-hyphens:auto;
  hyphens:auto;

  -moz-transition:all 0.7s ease;
  -webkit-transition:all 0.7s ease;
  -o-transition:all 0.7s ease;
  -ms-transition:all 0.7s ease;
  transition:all 0.7s ease;

  -moz-user-select:none;
  -webkit-user-select:none;
  -o-user-select:none;
  -ms-user-select:none;
  user-select:none;
}

.accordion .link:hover { color:#000; }

.accordion li:last-child .link { border-bottom:0; }

.accordion li i {
  position:absolute;
  top:9px;
  left:12px;
  font-size:18px;
  color:#595959;
  -webkit-transition:all 0.4s ease;
  -o-transition:all 0.4s ease;
  transition:all 0.4s ease;
}

.accordion li i.fa-chevron-down { right:12px; left:auto; font-size:16px; }

.accordion li.open { color:#000; border-bottom:0; }

.accordion li.open .link { color:#000; border-bottom:0; }

.accordion li.open i { color:#000; }

.accordion li.open i.fa-chevron-down {
  -webkit-transform:rotate(180deg);
  -ms-transform:rotate(180deg);
  -o-transform:rotate(180deg);
  transform:rotate(180deg);
}

/* Accordion Submenu */

.submenu { display:none; background:none; font-size:13px; border-bottom:1px solid #CCC; }

/*.submenu li { border-bottom:1px solid #4b4a5e; }*/

.submenu a {
  display:inline-block;
  text-align:left;
  font-weight:700;
  color:#333 !important;
  background-color:none;
  -webkit-transition:all 0.25s ease;
  -o-transition:all 0.25s ease;
  transition:all 0.25s ease;
}

.submenu a:hover { background:none; color:#000; }

.submenu p {
  display:block;
  text-decoration:none;
  text-align:left;
  color:#000;
  padding:1px 30px 12px 20px;
  -webkit-transition:all 0.25s ease;
  -o-transition:all 0.25s ease;
  transition:all 0.25s ease;
}

/* DETAIL BUTTONS */

/* Button Column*/
.detail-button-service { position:relative; float:left; margin:45px 0px 18px 17px; white-space:nowrap; }
.detail-button-service li { display:inline; }
.detail-button-service li a { padding:10px 14px 10px 14px; background:none; border:2px solid rgb(136, 136, 136, 1); border-radius:0px; font-size:12px; color:#888888; font-weight:800; text-transform:uppercase; letter-spacing:1.2px; }
.detail-button-service li a:hover { background:none; color:#000; border:2px solid rgb(0, 0, 0, 1); }

/* Button Center */
.detail-button { position:relative; display:flex; justify-content:center; align-items:center; width:100%; padding:0 auto 0 auto; margin:-10px 0 0px 0; }
.detail-button-page { margin:50px 12px 16px 0px; }
.detail-button-page li { display:inline; }
.detail-button-page li a { padding:10px 14px 10px 14px; background:none; border:2px solid rgb(136, 136, 136, 1); border-radius:0px; font-size:14px; font-weight:700; color:#888888; text-transform:uppercase; letter-spacing:1.2px; }
.detail-button-page li a:hover { background:none; color:#000; border:2px solid rgb(0, 0, 0, 1); }

/* Button Bestellen */
.detail-button-order { margin:40px 12px 16px 0px; }
.detail-button-order li { display:inline; }
.detail-button-order li a { padding:10px 14px 10px 14px; background:none; border:2px solid rgb(136, 136, 136, 1); border-radius:0px; font-size:14px; font-weight:700; color:#888888; text-transform:uppercase; letter-spacing:1.2px; }
.detail-button-order li a:hover { background:none; color:#000; border:2px solid rgb(0, 0, 0, 1); }

/* Image Swap Hover Effect */
.image-swap { position:relative; width:95%; height:auto; margin:0px 0px 12px 0px; z-index:100; }
.image { position:absolute; width:100%; height:auto; border:9px solid rgb(255, 255, 255, 1); -webkit-background-clip:padding-box;/* for Safari */ background-clip:padding-box;/* for IE9+, Firefox 4+, Opera, Chrome */ -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; }
.image-hover { width:100%; height:auto; opacity:0; transition:opacity 0.3s ease-in-out; /*transform: rotate(-2deg) scale(1.4);*/ border:9px solid rgb(255, 255, 255, 1); -webkit-background-clip:padding-box;/* for Safari */ background-clip:padding-box;/* for IE9+, Firefox 4+, Opera, Chrome */ -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.image-hover:hover { position:relative; opacity:1; }

.basic { display:flex; padding:50px 0px 0px 0px; text-align:center; justify-content:center; align-items:center; z-index:100; }
.basic-img { position:relative; max-width:230px; margin:0px 20px 0px 20px; vertical-align:middle; border:9px solid rgb(255, 255, 255, 1); transition:0.4s ease-in-out; }
.basic-img:hover { transform:scale(1.3); }

/* Shadows Flip Corners at Bottom */
.shadows:before, .shadows:after {
      z-index: -1;
      position: absolute;
      content: "";
      bottom: 16px;
      left: 10px;
      width: 50%;
      top: 80%;
      max-width: 300px;
      background: #777;
      -webkit-box-shadow: 0 15px 10px #777;
      -moz-box-shadow: 0 15px 10px #777;
      box-shadow: 0 15px 10px #777;
      -webkit-transform: rotate(-3deg);
      -moz-transform: rotate(-3deg);
      -o-transform: rotate(-3deg);
      -ms-transform: rotate(-3deg);
      transform: rotate(-3deg);
      }

.shadows:after {
      -webkit-transform: rotate(3deg);
      -moz-transform: rotate(3deg);
      -o-transform: rotate(3deg);
      -ms-transform: rotate(3deg);
      transform: rotate(3deg);
      right: 10px;
      left: auto;
      }

/* Shadows Bow at Top and Bottom 
.shadows:before, .shadows:after {
  content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 16px rgba(0,0,0,0.6);
    -moz-box-shadow:0 0 16px rgba(0,0,0,0.6);
    box-shadow:0 0 16px rgba(0,0,0,0.6);
    top:0;
    bottom:4px;
    left:9px;
    right:9px;
    -moz-border-radius:100px / 20px;
    border-radius:100px / 20px;
}

.shadows:after {
    right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
} */


/* Images */
.beneteau { display:flex; padding:20px 0px 0px 0px; text-align:center; justify-content:center; align-items:center; }
.beneteau-img { position:relative; max-height:250px; padding:0px 20px 0px 20px; width:auto; vertical-align:middle; transition:0.4s ease-in-out; }
.beneteau-img:hover { transform:scale(1.2); }

.orca { display:flex; padding:20px 0px 0px 0px; text-align:center; justify-content:center; align-items:center; }
.orca-img { position:relative; max-height:150px; padding:0px 20px 0px 20px; width:auto; vertical-align:middle; transition:0.4s ease-in-out; }
.orca-img:hover { transform:scale(1.2); }

.knots { display:flex; padding:50px 0px 0px 0px; text-align:center; justify-content:center; align-items:center; }
.knots-img { position:relative; max-height:70px; padding:0px 20px 0px 20px; width:auto; vertical-align:middle; transition:0.4s ease-in-out; }
.knots-img:hover { transform:scale(1.3); }

.spleiss { display:flex; padding:50px 0px 0px 0px; text-align:center; justify-content:center; align-items:center; }
.spleiss-img { position:relative; max-height:150px; padding:0px 15px 0px 15px; width:auto; vertical-align:middle; transition:0.4s ease-in-out; }
.spleiss-img:hover { transform:scale(2); }

/* Signatur */
#signatur { width:100%; height:auto; margin:20px 0 0 0; display:flex; justify-content:center; align-items:center; overflow:hidden; }
.signatur { width:200px; height:88px; background-image:url('../images/carlosklein-sailing-signatur.png'); background-repeat:no-repeat; background-size:cover; }