@charset "UTF-8";

/*************************************************************************************************************************************/
/* profilalsace.com */
/* Style-CSS / custom.css */
/* AUTOR: ms - profilalsace.com */
/*************************************************************************************************************************************/

*:focus,
*:active,
*:link,
*:any-link {border: none; background: none;}


/*************************************************************************************************************************************/
/* BODY */
/*************************************************************************************************************************************/

body {font-size: 16px; line-height: 150%; color: #4a4a4a; font-family: 'Titillium Web', sans-serif; width: 100%; height: 100%;}

@media only screen and (max-width: 800px) {
 body {font-size: 0.95em;}
}

.float_left {margin-right: 20px;}
.float_right {margin-left: 20px;}


/*************************************************************************************************************************************/
/* LAYOUT-AUFBAU */
/*************************************************************************************************************************************/

#header {margin: 0 0 40px 0;}
div#container {margin: 0 0 0 20px;}
main#main {max-width: 800px; margin: 0 50px 50px 0;}
aside#right {width: 300px;border-left: 1px dotted #7bb743; padding-left: 20px;}

/*************************************************************************************************************************************/
/* HEADER */
/*************************************************************************************************************************************/

div.logo {position: absolute; top: 0; left: 20px; z-index: 2; background: #fff; height: 70px;}
#header .image_container {max-height: 400px;}
#header .image_container img {width: 100%;}

@media only screen and (max-width: 1170px) {
 div.logo {left: 20px;}
 div.logo img {max-width: 300px;}
}
@media only screen and (max-width: 700px) {
 div.logo img {max-width: 250px;}
}
@media only screen and (max-width: 500px) {
 div.logo img {max-width: 200px;}
}

/** META-MENÜ **/
#meta-menu {position: absolute; top:0; right: 270px; z-index: 1; width: 240px; opacity: 0.5;}
#meta-menu:hover {opacity: 1;}
#meta-menu .ilanguage a {float: right; background: #fff; width: 65px; height: 50px; padding: 20px 0 0 15px; font-size: 1.2em;}
#meta-menu .ikontakt a {float: right; background: #fff; width: 45px; height: 50px; padding: 20px 0 0 25px;margin-right: 2px;}
#meta-menu .isuche a {float: right; background: #fff; width: 45px; height: 50px; padding: 20px 0 0 25px;margin-right: 2px;}

#meta-menu .ilanguage a::before {font-family: 'FontAwesome'; content: '\f0ac'; font-size: 25px;}
#meta-menu .ikontakt a::before {font-family: 'FontAwesome'; content: '\f007'; font-size: 25px;}
#meta-menu .isuche a::before {font-family: 'FontAwesome'; content: '\f002'; font-size: 25px;}

#changelanguage {display: none; width:80px; position: absolute; right:0; top:72px; background: #fff;}
#changelanguage a {padding: 3px 10px 5px!important; height: 20px !important; width: 60px !important; margin-bottom: 2px; font-weight: bold; display: block;}
#changelanguage a::before {content: none !important;}

@media only screen and (max-width: 700px) {
 #meta-menu {display: none;}
}

#show_search {display: none; position: absolute; z-index: 10; width: 100%; height: 400px;  background-color: rgba(255, 255, 255, 0.8);}
#show_search .ce_form {margin: 100px auto; text-align: center; width: 60%;}
#show_search input {width: 98%; font-size: 24px; padding: 0 1%; height: 50px;}
#show_search button {width: 95%; padding: 1%; font-size: 14px; font-weight: normal; vertical-align: middle; height: 50px;}
#show_search .ce_form input:active,
#show_search .ce_form input:focus {border: 1px solid #7bb743; background: #fff;}
#show_search .widget-text {float: left; width: 85%;}
#show_search .widget-submit {float: right; width: 15%;}
#show_search .close_search {font-size: 30px; font-weight: bold; float: right; margin: 15px 350px 0 0; border: 1px solid #7bb743; padding: 10px;}


/*************************************************************************************************************************************/
/* CONTENT */
/*************************************************************************************************************************************/

h1 {font-size: 2.6em; color:#7bb743; margin: 0 0 30px 0; line-height: 120%;}
h2 {font-size: 2.1em; margin: 0 0 20px 0; line-height: 120%;}
h3 {font-size: 1.6em;}
h4 {font-size: 1.4em; margin: 0 0 20px 0;}
h5 {}
h6 {margin: 0 0 10px 0;}

p {margin: 0 0 20px 0;}

@media only screen and (max-width: 400px) {
 h2 {font-size: 1.75em;}
}

.italic {font-style: italic;}
.font-green {color:#7bb743;}

#main .ce_text {margin: 0 0 60px 0;}
#main .ce_image {margin: 0 0 60px 0;}
#main .ce_downloads {margin: 0 0 60px 0;}

/*** downloads ***/
.ce_downloads ul {list-style: none; margin-left: 5px;}
.ce_downloads ul li {margin: 5px 0;}
.ext-pdf:before {font-family: 'FontAwesome'; content: "\f1c1"; margin: 0 10px 0 0;}


/*** produkte - übersicht ***/
.product-overview .ce_image { float: left; width: 158px; height: 270px; text-align: center; margin: 0 30px 20px 0 !important; position: relative; border: 1px solid #c7c7c7;}

/*** produkte - detailseite ***/
.ce_rsce_produkte h2 {border-bottom: 1px dotted #4a4a4a;}
.ce_rsce_produkte .image_container {margin: 0 0 20px 0;}
.ce_rsce_produkte .pallets_text {margin: 0 0 50px 0;}
.ce_rsce_produkte .pallets_text p {margin: 0 0 20px 0;}
.ce_rsce_produkte .technical_description_info {display: none;}
.ce_rsce_produkte .hakensystem_info {display: none;}
.ce_rsce_produkte h2.show_technical_description:hover,
.ce_rsce_produkte h2.show_hakensystem:hover {cursor: pointer; }
.ce_rsce_produkte h2 i {width: 35px; text-align: center;font-size: 0.8em;}
.ce_rsce_produkte .hakensystem_infobereich {width: 150px; display: inline-block; vertical-align: top; padding: 20px 0 0 10px;}
.ce_rsce_produkte .image_hakensystem_festdrahtbereich:hover {background-color: #f6f6f6;}
.ce_rsce_produkte .hakensysteme_zeige_haken {border-top: 1px dotted #78b947; padding: 10px 0 0 0; margin: 10px 0 0 0;}
.ce_rsce_produkte img.hakensysteme {border: 1px solid #c7c7c7; margin: 0 20px 0 0; vertical-align: middle; }
.ce_rsce_produkte .hakensysteme_liste {vertical-align: middle; margin: 0 0 10px 0;}
.ce_rsce_produkte .hakensysteme_liste a {color: #4a4a4a;}
.ce_rsce_produkte .teasertext { color: #7bb743; }
.ce_rsce_produkte table {margin: 0 0 20px 0;}
.ce_rsce_produkte table td {padding: 3px 10px;}

/*** suche ***/
.widget-text  {float: left;}
.widget-submit {float: left;}
.widget-text input {width: 400px; padding: 5px; height: 35px;}
.widget-submit {}
.mod_search button {width: 200px; padding: 5px; height: 35px; background: #7bb743; color: #fff; border: 1px solid #7bb743; margin: 0 0 0 5px;}
.mod_search .header {clear: both;}
.mod_search input:active,.mod_search input:focus {border: 1px solid #7bb743; background: #fff;}
.mod_search button:active,.mod_search button:focus {border: 1px solid #7bb743; background: #fff;}

/*** ansprechpartner ***/
#main .ansprechpartner .ce_text {border: 1px solid #ccc; padding: 10px; margin: 0 0 20px 0;}
.contactdata {display: table;margin: 10px 0 20px 0;}
.contactdata .data {display: table-row; margin: 5px 0;}
.contactdata .data span { display: table-cell; font-size: 0.813em; float: none; clear: both; color: #7bb743; height: 20px; line-height: 20px; vertical-align: top;
  padding: 0; margin: 0; font-weight: 500;}
.contactdata .data span:first-child {padding-right: 5px;}
.contactdata .data span a {display: inline-block;margin: 0;color: inherit;font-weight: inherit;}


/*** anfrage ***/
.anfrage .widget-text input {border: 1px solid #7bb743; padding:0;}
.anfrage .widget-text,
.anfrage .widget-textarea {float:none; display: grid; width: 400px; margin-bottom: 15px;}
.anfrage .widget-submit button {width: 400px; text-align: center; border: 1px solid #7bb743; padding: 10px 0; margin-top: 30px;}


/*************************************************************************************************************************************/
/* RIGHT */
/*************************************************************************************************************************************/

#right h3 {margin-bottom: 20px;}
#right .ce_sliderStart {margin: 0 0 40px 0;}
#right .ce_image {margin: 0 0 40px 0;}

#right figcaption {/*position: absolute; bottom: 0; background-img: url(/grafik/bg_testemonials.gif); background-repeat: repeat-y;*/}
#right figcaption strong {margin:0 0 5px 0; display: block;}
#right figcaption .italic {margin:5px 0 0 0; display: block; color: #c3c3c3;}
#right .slider-control {background: #eee; margin: 15px 0 0 0;}
#right .slider-wrapper .ce_image {margin:0;}
#right .slider-control .slider-prev {padding-left: 5px;}
#right .slider-control .slider-next {padding-right: 5px;}
.slider-control a { top: 7px; }

#right .mod_navigation {padding: 20px 5px 5px 0; border-top: 5px solid #7bb743;}
#right .mod_navigation strong:before {content: "» "; margin: 0 10px 0 0;}
#right .mod_navigation a:before {content: "» "; margin: 0 10px 0 0;}

/*** produkte ***/
.widget_produkt {margin: 0 0 40px 0;}
.widget_produkt a {background: #78b947; padding: 10px 10px; margin: 0 0 5px 0;color: #fff; display: block;}
.widget_produkt a:hover {background-color: #5b5d60;}

/*************************************************************************************************************************************/
/* FOOTER */
/*************************************************************************************************************************************/

#footer { color: #c6c6c6; background-color: #5b5d60; border-top: 15px solid #78b947; padding: 50px 0 30px 20px; margin: 50px 0 0 0; font-size: 0.9em; min-height: 200px;}
.footerbox {float: left;}
.footer-one { width: 250px;}
.footer-two { width: 250px;}
.footer-three { width: 250px;}
.footer-four { width: 250px;}

#footer a { color: #c6c6c6; margin: 0 0 5px 0; display: block;}

/*************************************************************************************************************************************/
/* WIDGETS */
/*************************************************************************************************************************************/

/***** SLIDER *****/
.bx-wrapper { border: none !important; box-shadow: none !important; /*height: 500px;*/ overflow: hidden; position: relative;}
.bx-wrapper img {width: 100%;}
.bx-wrapper .bx-controls {display: none;}
.slidebox {position: absolute; top:100px; left: 20px; background-image: url(/grafik/bg-slider.png); background-repeat: repeat; min-height:100px; width:450px; padding:20px;}
.slider-headline {}
.slidebox-inner {}
.slidebox-textbox {}
@media only screen and (max-width: 700px) {
  .bx-wrapper {box-shadow: 0 0 5px #ccc !important; }
  .bx-viewport {overflow: visible !important;}
  .slidebox {position: relative; top: auto; left: auto;}
}
@media only screen and (max-width: 500px) {
  .slidebox {width: 350px;}
}

/***** BREADCRUMB *****/
.mod_breadcrumb {margin: 0 0 20px 0;}
.mod_breadcrumb ul {list-style: none; padding:0; margin:0; color: #c2c2c2; font-size: 0.9em;}
.mod_breadcrumb ul li {float: left;}
.mod_breadcrumb ul li:after { content: " > "; padding: 0 10px;}
.mod_breadcrumb ul li.active:after { content:""; }
.mod_breadcrumb ul a { color: #c2c2c2;}


/*************************************************************************************************************************************/
/* MENU */
/*************************************************************************************************************************************/

.mod_mobile_menu {}
.mobile_menu_trigger { display: block !important; position: fixed; top:0; right: 0; z-index: 99; background-color: #7bb743; padding: 20px; width:220px; height:30px;}
@media only screen and (max-width: 700px) { .mobile_menu_trigger {width: 140px;} }
.mobile_menu_trigger span {color: #ffffff; font-size: 20px; cursor: pointer;}
.mobile_menu {min-width: 350px !important; width: auto !important;}
@media only screen and (max-width: 700px) { .mobile_menu {min-width: 320px !important;} }
.mobile_menu .inner { height: 100%;background: #7bb843; overflow-y: auto; padding: 0; color: #ffffff; font-size: 18px;}
.mobile_menu .inner a {color: #ffffff;}
.mobile_menu .close-button {float: right; margin: 10px 10px 0 0;}
.mobile_menu .mod_navigation {margin: 40px 0 0 0;}
.mobile_menu .mod_customnav {/*margin: 40px 0 0 0;*/}
.mobile_menu nav.produkte {margin: 60px 0 0 0;}
.mobile_menu nav.produkte h5 {padding: 10px 0 10px 20px;}
.mobile_menu .mod_navigation li {margin:0; padding: 10px 0 10px 20px;}
.mobile_menu .mod_customnav li {margin:0; padding: 10px 0 10px 20px;}
.mobile_menu .mod_navigation li:hover {background:#6b9d3c;}
.mobile_menu .mod_navigation .level_3 li:hover {background:#7bb743;}
.mobile_menu .mod_navigation li.submenu_hide::after {content: "\f0d7"; font-family: "FontAwesome";}
.mobile_menu .level_1 li {border-top: 1px solid #b0e281;}
.mobile_menu .level_1 li:last-child {/*border: none;*/}
.mobile_menu .level_2 li {border: none;}
.mobile_menu .level_3 li {border: none;}
/*.level_2 {margin-left: 30px;}
.level_3 {margin-left: 30px;}*/

.social_box {margin: 30px 0 0 0; font-size: 20px; border-top: 1px solid #ffffff; padding: 20px 0 0 0;}
.social-box-inner {padding: 0 0 0 20px;}
.social-box-inner a {margin: 0 10px 15px 0; display: block;}