/*!
 * @author:		OneByte GmbH
 * @copyright:	http://www.onebyte.ch
 */
.visible-mobile {
	display: none !important
}

.hidden-mobile {
	display: block !important
}

.visible-desktop {
	display: block !important
}

.hidden-desktop {
	display: none !important
}

#header-mobile, #nav_main_mobile, #footer_mobile {
	display: none !important
}

body {
	font-size: 14px
}

.col {
	display: inline;
	float:   left
}

.c-content {
	position: relative;
	width:    940px;
	margin:   0 auto
}

#page {
	position:  relative;
	min-width: 960px
}

.inp_normal input {
	width: 200px
}

.inp_normal textarea {
	width:  300px;
	height: 70px
}

.form.vertical label, .form.vertical legend {
	float: left;
	width: 150px
}

.form.vertical .inp_radio label, .form.vertical .inp_checkbox label {
	width: auto
}

.form.vertical .inp_checkbox legend {
	position: absolute;
	left:     0;
	top:      0
}

.form.vertical .inp_checkbox label {
	clear:       both;
	float:       none;
	margin-left: 150px
}

.form.vertical li.error span.error, .form.vertical .inp_captcha img {
	margin-left: 150px
}

.form.vertical p.inp_submit input.inp_submit {
	margin-left: 150px
}

.plugin_cms-slider .dsp > li:first-child {
	z-index: 2
}

.plugin_cms-slider .dsp > li {
	position: absolute;
	left:     0;
	top:      0;
	margin:   0;
	z-index:  1
}

#section3 .news {
	position: absolute;
	width:    100%;
	top:      0;
	left:     0;
	z-index:  2
}

#section3 .news .line1 {
	background: #333;
	color:      #fff;
	height:     75px
}

#section3 .news .line1 h2 {
	color:       #fff;
	float:       left;
	line-height: 75px;
	margin:      0
}

#section3 .news .line2 {
	color:            #fff;
	text-align:       center;
	padding:          10px 0;
	background-color: #333;
	background-color: rgba(51, 51, 51, 0.7);
	-pie-background:  rgba(51, 51, 51, 0.7);
	behavior:         url(/media/js/pie/PIE.htc)
}

#section3 .news .line2 .btn_grey {
	border: 2px solid #fff
}

#section3 .plugin_cms-slider {
	float: right;
	width: 750px;
	clear: none
}

#section3 .plugin_cms-slider .dsp {
	margin-right: 100px
}

#section3 .plugin_cms-slider a {
	color:           #fff;
	text-decoration: none;
	line-height:     75px
}

#section3 .plugin_cms-slider a span {
	font-size:    16px;
	display:      inline-block;
	margin-right: 10px;
	font-weight:  700
}

#section3 .plugin_cms-slider .ctrl.cycle-prev {
	top:   30px;
	right: 74px
}

#section3 .plugin_cms-slider .ctrl.cycle-next {
	top:   30px;
	right: 0
}

#section6 h2 {
	line-height: 70px
}

#section6 .plugin_cms-slider {
	padding-bottom: 35px
}

#section6 .ctrls {
	position: absolute;
	right:    0;
	top:      -45px
}

#section6 .item {
	float:       left;
	margin-left: 34px
}

#section6 .item:first-child {
	margin-left: 0
}

#section7 .plugin_cms-slider .ctrl.cycle-prev {
	top:   17px;
	right: 74px
}

#section7 .plugin_cms-slider .ctrl.cycle-next {
	top:   17px;
	right: 0
}

#section7 .plugin_cms-slider .dsp li {
	padding-bottom: 20px
}

#section7 .col1 {
	float:        left;
	margin-right: 50px
}

#section7 .col2 {
	float: left;
	clear: none;
	width: 400px
}

#sectioncp .col1 {
	float:        left;
	margin-right: 50px
}

#sectioncp .col2 {
	clear: none;
	float: left;
	width: 400px
}

.detail .col2 {
	padding-top: 20px
}

.detail .col2-1 .btnholder a {
	display: block
}

.detail .col2-1 .imgholder {
	margin-bottom: 30px;
	text-align:    center
}

.detail .col2-1 .imgholder img {
	max-width: 300px
}

.view-checkout-address .col-1, .view-checkout-order .col-1 {
	float:        left;
	margin-right: 80px
}

.view-checkout-address .col-2, .view-checkout-order .col-2 {
	float: left
}

#tpl_mod_shop .form.vertical label, #tpl_mod_shop .form.vertical legend {
	width: 100px
}

#tpl_mod_shop .form.vertical p.inp_submit input.inp_submit, #tpl_mod_shop .form.vertical li.error span.error {
	margin-left: 100px
}

#tpl_mod_shop .form.vertical select {
	width: 210px
}

#tpl_news #headercontent {
	*zoom:         1;
	text-align:    center;
	margin-bottom: 30px
}

#tpl_news #headercontent:before, #tpl_news #headercontent:after {
	content: " ";
	display: table
}

#tpl_news #headercontent:after {
	clear: both
}

#tpl_news .col2-1 {
	width: 690px
}

#tpl_news .col2-2 {
	width: 170px
}

.tippslist li {
	clear:         both;
	box-shadow:    0px 0px 5px 0px rgba(1, 1, 1, 0.35);
	margin-bottom: 30px;
	padding:       10px;
	font-size:     12px
}

.tippslist h4 {
	font-weight:   bold;
	font-size:     12px;
	margin-bottom: 10px
}

.tippslist p {
	margin: 0
}

.mod_news_overview_list li {
	box-shadow: 0px 0px 5px 0px rgba(1, 1, 1, 0.35);
	padding:    10px
}

.mod_news_overview_list .col1 {
	float:        left;
	margin-right: 15px
}

.mod_news_overview_list .col1 img {
	max-width: 300px
}

.mod_news_overview_list .col2 {
	position:   relative;
	clear:      none;
	float:      left;
	width:      355px;
	min-height: 170px
}

.mod_news_overview_list .col2 p {
	margin-bottom: 50px
}

.mod_news_overview_list .col2 .btn_green {
	position: absolute;
	left:     0;
	bottom:   0
}

#tpl_news .date {
	display:    block;
	text-align: right
}

#tpl_news .firstimage {
	float:        left;
	margin-right: 20px
}

#tpl_news .content {
	*zoom:         1;
	margin-bottom: 20px
}

#tpl_news .content:before, #tpl_news .content:after {
	content: " ";
	display: table
}

#tpl_news .content:after {
	clear: both
}

.home-teaser .c-content {
	background: rgba(0, 0, 0, 0.5);
	padding:    20px
}

#tpl_home #content {
	padding: 0
}

.home-teaser {
	min-height: 440px
}

#section1 .home-teaser {
	color:     #fff;
	font-size: 30px;
	padding:   160px 0 140px
}

#section1 .home-teaser p {
	text-align: right
}

#section2 > .c-content > h2 {
	text-align: center;
	font-size:  24px
}

.productitems {
	margin-left: 10px
}

.productitems .item {
	float:      left;
	width:      300px;
	margin:     15px 10px 30px 0px;
	min-height: 350px
}

/*.productitems .item + .item {margin-left: 20px}*/

#tpl_main .productitems .item {
	margin-bottom: 30px
}

#tpl_main .productitems .item:nth-child(3n+1) {
	clear:       left;
	margin-left: 0
}

#section3 .home-teaser {
	text-align: center;
	font-size:  28px;
	padding:    240px 0 0px
}

#section4 .plugin_cms-text {
	float:        left;
	width:        230px;
	margin-right: 30px
}

.projectitems {
	float: left;
	width: 650px
}

.projectitems .item {
	float:       left;
	margin-left: 30px;
	text-align:  center
}

.projectitems .item img {
	margin-bottom: 30px
}

#tpl_col2 .projectitems {
	width: 400px
}

#tpl_col2 .projectitems .item {
	margin-left:   0;
	margin-bottom: 20px;
	width:         200px
}

#tpl_col2 .projectitems .item img {
	width: 140px
}

#section5 .home-teaser {
	text-align: center;
	padding:    130px 0 0
}

#section5 .home-teaser h2 {
	display:       block;
	font-size:     24px;
	margin-bottom: 10px
}

#section5 .home-teaser p {
	font-size: 18px;
	width:     600px;
	margin:    0 auto
}

#section5 .home-teaser .btn_green {
	clear:      both;
	font-size:  14px;
	margin-top: 10px
}

#section5 .home-teaser .c-content {
	background: rgba(255, 255, 255, 0.6)
}

#section7:after {
	content:    "";
	height:     1px;
	position:   absolute;
	left:       0;
	top:        50px;
	background: #535353;
	width:      100%
}

#tpl_hof #content {
	padding-bottom: 0
}

#tpl_hof .headerimg {
	height:   100px;
	position: absolute;
	left:     0;
	top:      -25px;
	width:    100%;
	height:   370px;
	z-index:  1
}

#tpl_hof #col_main .plugin_cms-text {
	position:           relative;
	z-index:            3;
	*zoom:              1;
	background:         #fff;
	padding:            30px 0 30px 0;
	text-align:         center;
	-webkit-box-shadow: rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	-moz-box-shadow:    rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	box-shadow:         rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	behavior:           url(/media/js/pie/PIE.htc)
}

#tpl_hof #col_main .plugin_cms-text:before, #tpl_hof #col_main .plugin_cms-text:after {
	content: " ";
	display: table
}

#tpl_hof #col_main .plugin_cms-text:after {
	clear: both
}

#tpl_hof #col_main .plugin_cms-text p {
	max-width: 300px;
	margin:    0 auto 1em auto
}

.list-hof li {
	position:         relative;
	float:            left;
	width:            25%;
	background-color: #eee;
	min-width:        240px;
	overflow:         hidden
}

.list-hof li, .list-hof li > a, .list-hof li > a > div {
	height: 260px
}

.list-hof .front {
	position:            relative;
	background-position: center center;
	background-repeat:   no-repeat;
	z-index:             1
}

.list-hof .back {
	opacity:            0;
	position:           absolute;
	z-index:            2;
	top:                0;
	left:               -100%;
	background:         #333;
	width:              100%;
	padding:            40px 35px 0 35px;
	-webkit-box-shadow: rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	-moz-box-shadow:    rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	box-shadow:         rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	behavior:           url(/media/js/pie/PIE.htc);
	-webkit-transition: all 500ms ease-in-out;
	-moz-transition:    all 500ms ease-in-out;
	-ms-transition:     all 500ms ease-in-out;
	-o-transition:      all 500ms ease-in-out;
	transition:         all 500ms ease-in-out
}

.list-hof .back:after {
	content:    "";
	position:   absolute;
	right:      35px;
	bottom:     35px;
	width:      27px;
	height:     19px;
	background: url(/media/img/design/sprite.svg) no-repeat -200px -40px
}

.list-hof .back * {
	color: #fff
}

.list-hof h3 {
	font-size: 25px
}

.list-hof p {
	font-size: 18px
}

.list-hof li:hover .back {
	opacity: 1;
	left:    0
}

.list-hof li.sealitem .back {
	text-align: center
}

.list-hof li.sealitem .back:after {
	right:  130px;
	bottom: 20px
}

.certificate-header {
	height: 100px
}

.certificate-header li {
	display: inline-block
}

.certificate-header li a {
	color:           #333;
	text-decoration: none
}

.certificate-header li a:hover {
	text-decoration: underline
}

.certificate-header li + li:before {
	content: "\00a0\00a0-\00a0\00a0"
}

.certificate-infobar .left {
	width:      140px;
	text-align: center
}

.certificate-infobar .right {
	padding: 0 25px
}

.certificate-info {
	display:       table;
	width:         100%;
	margin-bottom: 10px
}

.certificate-info .col1, .certificate-info .col2 {
	display:        table-cell;
	vertical-align: top
}

.certificate-info .col1 {
	width:      140px;
	text-align: center
}

#header {
	height:   125px;
	z-index:  2;
	position: relative
}

#header h1 {
	margin:  0;
	padding: 10px 0 0 0
}

#header h1 a {
	overflow:        hidden;
	text-indent:     -9000px;
	display:         block;
	float:           left;
	background:      url(/media/img/design/logo_carbon-connect.jpg) no-repeat;
	background-size: 77px auto;
	width:           77px;
	height:          104px;
	text-decoration: none
}

#header #headerbg {
	position:           relative;
	height:             125px;
	background:         #fff;
	-webkit-box-shadow: rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	-moz-box-shadow:    rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	box-shadow:         rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	behavior:           url(/media/js/pie/PIE.htc);
	z-index:            2
}

#header .r {
	position: absolute;
	top:      79px;
	right:    0
}

#header nav li {
	float:     left;
	font-size: 14px
}

#header nav li a {
	text-decoration: none;
	color:           #333;
	display:         inline-block
}

#nav_main {
	float: left
}

#nav_main li {
	padding: 0 16px
}

#nav_main a {
	text-transform: uppercase;
	line-height:    36px
}

#nav_main li.active a, #nav_main li.selected a {
	color:       #51AD31;
	font-weight: 900
}

#nav_lang {
	display: none
}

#header #nav_sub {
	clear:            both;
	position:         relative;
	z-index:          1;
	*zoom:            1;
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.7);
	-pie-background:  rgba(255, 255, 255, 0.7);
	behavior:         url(/media/js/pie/PIE.htc)
}

#header #nav_sub:before, #header #nav_sub:after {
	content: " ";
	display: table
}

#header #nav_sub:after {
	clear: both
}

#header #nav_sub > ul {
	width:  940px;
	margin: 0 auto
}

#header #nav_sub li {
	padding: 0 16px
}

#header #nav_sub a {
	line-height: 50px
}

#header #nav_sub a:hover {
	text-decoration: underline
}

#header #nav_sub li.active a, #header #nav_sub li.selected a {
	font-weight: 900
}

#content {
	padding:          80px 0 80px 0;
	background-color: #007C42;
	min-height:       400px;
	z-index:          1;
	position:         relative
}

#content.pt-100,
.pt-100 #content {
	padding-top: 100px;
}

div[data-bgimg] {
	background-repeat:       no-repeat;
	background-position:     center top;
	-moz-background-size:    cover;
	-webkit-background-size: cover;
	background-size:         cover
}

.col2 {
	clear: both
}

.col2-1 {
	float: left;
	width: 300px
}

.col2-2 {
	float: right;
	width: 540px
}

.contstyle-1 {
	*zoom:              1;
	background:         #fff;
	padding:            30px 0 30px 0;
	-webkit-box-shadow: rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	-moz-box-shadow:    rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	box-shadow:         rgba(1, 1, 1, 0.75) 0px 0px 6px 0;
	behavior:           url(/media/js/pie/PIE.htc)
}

.contstyle-1:before, .contstyle-1:after {
	content: " ";
	display: table
}

.contstyle-1:after {
	clear: both
}

#tpl_main #content[data-bgimg] .contstyle-1, #tpl_hof #col_main {
	margin-top: 250px
}

.contstyle-2 {
	color:       #fff;
	font-size:   28px;
	margin-top:  -35px;
	line-height: 1.2em;
	text-align:  right
}

.contstyle-2 .c-content {
	padding-left:   200px;
	padding-bottom: 20px
}

#tpl_main .col2 {
	padding-top: 20px
}

#tpl_main .col2-1, #tpl_main .col2-2 {
	width: 430px
}

.plugin_cms-image + .plugin_cms-text {
	padding-top: 30px
}

blockquote {
	margin-bottom: 30px
}

#nav_foot {
	margin-bottom: 5px;
	*zoom:         1
}

#nav_foot:before, #nav_foot:after {
	content: " ";
	display: table
}

#nav_foot:after {
	clear: both
}

#nav_foot li {
	float: left;
	width: 155px
}

#footer {
	position:    relative;
	padding-top: 40px;
	height:      300px;
	background:  #fff;
	color:       #000;
	font-size:   12px;
	line-height: 24px;
	z-index:     2;
	*zoom:       1
}

#footer:before, #footer:after {
	content: " ";
	display: table
}

#footer:after {
	clear: both
}

#footer a {
	color:           #097F4B;
	text-decoration: none
}

#footer a:hover {
	text-decoration: underline
}

#footer .c-content {
	min-height: 100px
}

#footer .col {
	width: 200px
}

#footer .col + .col {
	margin-left: 10px
}

#footer .col4-1 {
	padding-top: 4px
}

#footer .col4-2 {
	width: 310px
}

#footer .col4-2 > a {
	float:       left;
	clear:       both;
	background:  #00804A;
	color:       #fff;
	line-height: 34px;
	padding:     0 48px 0 8px;
	position:    relative
}

#footer .col4-2 > a:after {
	content:    "";
	position:   absolute;
	right:      8px;
	top:        50%;
	width:      27px;
	height:     19px;
	margin-top: -9px;
	background: url(/media/img/design/sprite.svg) no-repeat -200px -40px
}

#footer .col4-2 > a:hover {
	text-decoration: none
}

#footer .col4-4 dl {
	float:         right;
	margin-bottom: 0
}

#footer .col4-4 dt {
	float: left;
	width: 20px;
	clear: left
}

#footer .col4-4 dd {
	float:  left;
	margin: 0
}

#footer .col4-4 > a {
	clear:         both;
	float:         right;
	margin-bottom: 5px
}

#footer .list-share {
	clear: both;
	float: right
}

#footer .list-share li {
	float:       left;
	margin-left: 3px
}

#footer .list-share a {
	filter: invert(1);
}

#footer .list-share a:hover {
	filter: invert(0);
}

.list-share-fixed {
	display:                   inline-block;
	background:                black;
	position:                  fixed;
	top:                       50%;
	vertical-align:            middle;
	transform:                 translateY(-50%);
	right:                     0;
	z-index:                   9999;
	border-top-left-radius:    3px;
	border-bottom-left-radius: 3px;
}

.list-share-fixed li {
	margin: 5px 0;
}

.list-share-fixed .pint, .list-share-fixed .email, .list-share-fixed .phone {
	margin-left: 2px !important;
}