@charset "utf-8";

html { scroll-behavior: smooth; }
body { overflow-x: hidden; font-weight: normal; font-size: 22px; line-height: 1.5em; background: #f7f8ff; color: #3f5862; font-family: GloberRegular; }
body.ov_hidden { overflow: hidden; }
@media only screen and (max-width: 1600px) {
    body { font-size: 20px; line-height: 1.5em; }
}
@media only screen and (max-width: 1440px) {
    body { font-size: 18px; line-height: 1.5em; }
}

header { z-index: 10; padding: 10px 20px; position: fixed; top: 0; left: 0; right: 0; transition: 300ms; }
header .width_basic { z-index: 10; position: static; }
header .inner { border-radius: 1.6em; background: linear-gradient(to top right, rgba(57,55,91,1.0), #4f569a); }
header .width_full { padding: 0 15px; }
@media only screen and (max-width: 1740px) {
    header .width_basic { max-width: 100%; }
}
header.active { height: 100%; }
@media only screen and (max-width: 1340px) {
    header { height: 75px; }
    header .inner { height: 100%; overflow: auto; }
}
@media only screen and (max-width: 767px) {
    header { padding: 10px 20px; }
    header .width_basic { padding: 0 10px; }
}

#captcha_image { border-radius: 6px;opacity: 0.5; }
.svg-secondary { enable-background:new 0 0 214.367 214.367; } 
.verlauf_animation_container { position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; }
.verlauf_animation { position: absolute; left: 0; top: 100%; width: 100%; height: 100%; }
.verlauf_1 { background: linear-gradient(to top, rgba(166,35,77,0.0), rgba(166,35,77,0.2), rgba(166,35,77,0.2), rgba(166,35,77,0.0)); animation-name: verlauf; animation-duration: 20s;
    animation-iteration-count: infinite; }
.verlauf_2 { background: linear-gradient(to top, rgba(66,119,147,0.0), rgba(66,119,147,0.2), rgba(66,119,147,0.2), rgba(66,119,147,0.0)); animation-name: verlauf; animation-duration: 20s; animation-delay: 5s;
        animation-iteration-count: infinite; }
.verlauf_3 { background: linear-gradient(to top, rgba(95,160,103,0.0), rgba(95,160,103,0.1), rgba(95,160,103,0.1), rgba(95,160,103,0.0)); animation-name: verlauf; animation-duration: 20s; animation-delay: 10s;
            animation-iteration-count: infinite; }
.verlauf_4 { background: linear-gradient(to top, rgba(236,113,51,0.0), rgba(236,113,51,0.15), rgba(236,113,51,0.15), rgba(236,113,51,0.0)); animation-name: verlauf; animation-duration: 20s; animation-delay: 15s;
                animation-iteration-count: infinite; }

@keyframes verlauf {
    0%   { top: 100%; }
    25%  { }
    50%  { top: 0%; }
    100% { top: -100%; }
}

main { z-index: 1; position: relative; padding: 5.45em 0 2.27em; overflow: hidden; }

footer { padding: 20px; }
footer .inner { padding: 40px 0; border-radius: 1.6em; background: linear-gradient(to top right, rgba(57,55,91,1.0), #4f569a); overflow: hidden; }

@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 1020px) {
}
@media only screen and (max-width: 767px) {
}

h1 { margin: 0 0 0.5em 0; font-size: 2em; line-height: 1.2em; font-weight: normal; font-style: normal; font-family: 'GloberBold'; color: #4f569a; }
h2 { margin: 0 0 0.6em 0; font-size: 1.5em; line-height: 1.2em; font-weight: normal; font-style: normal; font-family: 'GloberBold'; color: #4f569a; }
h3 { margin: 0 0 10px 0; font-size: 1.2em; line-height: 1.2em; font-weight: normal; font-style: normal; font-family: 'GloberBold'; }
h4 { margin: 0; font-size: 1em; font-weight: normal; font-style: normal; }
h5 { }
h6 { }
@media only screen and (max-width: 767px) {
	h1 { font-size: 1.8em; }
    h2 { font-size: 1.5em; line-height: 1.3em; }
}

h1 .icon, h2 .icon { font-size: 1.5em; display: inline-block; }

.text-white h1, .text-white h2 { color: #ffffff !important; }
.blog h2 { font-size: 1.2em;}

.font_size_16 { font-size: 0.72em; line-height: 1.5em; }
.font_size_18 { font-size: 0.81em; line-height: 1.5em; }
.font_size_20 { font-size: 0.9em; line-height: 1.5em; }
.font_size_24 { font-size: 1.1em; line-height: 1.5em; }
.font_size_26 { font-size: 1.2em; line-height: 1.3em; }
.font_size_30 { font-size: 1.36em; line-height: 1.3em; }
.font_size_60 { font-size: 2.72em; line-height: 1.3em; }
.line_height_1 { line-height: 1.3em!important; }

a { text-decoration: underline; color: #3f5862; }
a:hover { text-decoration: none; color: #3f5862; }
p { margin-bottom: 1.5em; }
div { position: relative; }
img { -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0); backface-visibility: hidden; transform: translateZ(0); }
big { line-height: 1.2em;}


blockquote, .blockquote { font-size: 1.4em; line-height: 1.3em; font-family: 'GloberBold';border-left:5px solid;padding-left:20px;margin-left:30px;color: #bbb; }
.blockquote-footer { font-size: 0.8em; }
.blockquote-footer:before { display: none; }
@media only screen and (max-width: 767px) {
    .blockquote { padding: 0 40px; }
    .blockquote-footer { padding: 0 40px; }
}

ul { margin-bottom: 1.5em; padding-left: 1.2em; }
ul li { }

ul.preise { padding: 0; }
ul.preise li { list-style: none; border-bottom: 1px solid #d6d6d6; padding: 0.5em 0; }

ol { margin-bottom: 1.5em; }
ol li {}

b, strong { font-weight: normal; font-style: normal; font-family: 'GloberBold'; }

dl.row { margin-right: 0; margin-left: 0; }
dd { margin-bottom: 0; }

figure, .btn { margin-bottom: 1em; }

table { font-size: 0.9em; width: 100%; }
table td, table th { padding: .75rem 0; vertical-align: top; }

.portrait { width: 200px; height: 200px; margin: 0 auto 20px; }
.portrait img { border-radius: 50%; }

.border_radius_18 { border-radius: 0.8em; overflow: hidden; }

.cardlink { display: block; background: linear-gradient(to top right, rgba(57,55,91,1.0), #4f569a); color: #ffffff; text-decoration: none; font-family: 'GloberBold'; padding: 1em; height: 7em; transition: 400ms; }
.cardlink:hover { color: #ffffff; opacity: 0.9; }
.cardlink i { opacity: 0.5; font-size: 4em; position: absolute; right: 0.5em; bottom: 0.2em; transition: 400ms; scale: 0.8; }
.cardlink:hover i { opacity: 1; scale: 1; }

/* Button bootstrap classes */
.text-primary { color: #3f5862!important; }
.text-secondary { color: #4f569a!important; }
.text-success { color: #6fc55e!important; }
.text-light { color: #788a91!important; }

.bg-primary { background: #4f569a!important; }
.bg-success { background: #6fc55e!important; }
.bg-lightgray { background-color: rgb(242 242 252)}
.bg_gradient_blue { background: linear-gradient(to top right, rgba(57,55,91,1.0), #4f569a); }

.btn { text-decoration: none; font-size: 0.9em; font-family: 'GloberSemiBold'; }
.btn.btn-lg { font-size: 1em; padding: 0.4em 0.8em 0.4em 0.8em; }
.btn.btn-sm { font-size: 0.75em; padding: 0.4em 0.8em 0.4em 0.8em; }

.btn-primary { background-color: #4f569a; border-color: #4f569a; color: #ffffff; }
.btn-primary:hover { background-color: #4e5598; border-color: #4e5598; }

.btn-primary.focus, .btn-primary:focus { box-shadow: none;  }
.btn-primary.active, .btn-primary:active { box-shadow: none!important; background-color: #4e5598!important; border-color: #4e5598!important; }

.btn-outline-primary { border-color: #3a385d; color: #3a385d; }
.btn-outline-primary:hover { background-color: #4e5598; border-color: #4e5598; }

.btn-outline-primary.focus, .btn-outline-primary:focus { box-shadow: none;  }
.btn-outline-primary.active, .btn-outline-primary:active { box-shadow: none!important; background-color: #4e5598!important; border-color: #4e5598!important; }

.btn-secondary { background-color: #0069b4; border-color: #0069b4; color: #ffffff; }
.btn-secondary:hover { background-color: #0078ce; border-color: #0078ce; }

.btn-secondary.focus, .btn-secondary:focus { box-shadow: none;  }
.btn-secondary.active, .btn-secondary:active { box-shadow: none!important; background-color: #0078ce!important; border-color: #0078ce!important; }

.btn-success { background-color: #6fc55e; border-color: #6fc55e; color: #ffffff; }
.btn-success:hover { background-color: #59ae71; border-color: #59ae71; }

.btn-success.focus, .btn-success:focus { box-shadow: none;  }
.btn-success.active, .btn-success:active { box-shadow: none!important; background-color: #59ae71!important; border-color: #59ae71!important; }

.btn-outline-success { border-color: #6fc55e; color: #6fc55e; }
.btn-outline-success:hover { background-color: #59ae71; border-color: #59ae71; }

.btn-outline-success.focus, .btn-outline-success:focus { box-shadow: none;  }
.btn-outline-success.active, .btn-outline-success:active { box-shadow: none!important; background-color: #59ae71!important; border-color: #59ae71!important; }


.nav-link  { color: #4f569a; }
.nav-pills .nav-link.active, .nav-pills .show>.nav-link { background-color: #4f569a; }

.alert-success {}
.alert-danger {}

.badge { margin-bottom: 1em;}
.badge.text-bg-primary { background: rgba(79,86,154,0.9)!important; }

.progress { height: 4px; background: rgba(79,86,154,0.25)!important; }

.form-control {}
.form-control-lg { font-size: 0.9em; padding: 0.4em 0.8em 0.4em 0.8em; }
textarea.form-control { height: 180px; }
.form-check-label { font-size: 0.8em; line-height: 1.5em; }
.form-check-input:checked { background-color: #4f569a; border-color: #4f569a; }
.form-check { margin-bottom: 0.3em; }

.input-group-lg .form-control { font-size: 0.9em; padding: 0.4em 0.8em 0.4em 0.8em; }
.input-group-lg .input-group-text { font-size: 0.9em; padding: 0.4em 0.8em 0.4em 0.8em; }

.form-select-lg { font-size: 0.9em; padding: 0.4em 2.25rem 0.4em 0.8em; }

@media only screen and (max-width: 767px) {
    .input-group-lg .form-control { border-top-right-radius: 0.5rem!important; border-bottom-right-radius: 0.5rem!important; }
}

/* Custom */
.overlay { position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.bg_overlay { position: absolute; left: 0; right: 0; top: 0; bottom: 0; }
.bg_overlay.dark_left_top { background: linear-gradient(to bottom right, rgba(0,0,0,0.2), transparent); }

.content { max-width: 700px; }
.height_300 { height: 300px; }
.height_600 { height: 600px; }
.width_60 { max-width: 60%; }
.max_width_420 { max-width: 19.09em; }
.max_width_750 { max-width: 34.09em; }
@media only screen and (max-width: 767px) {
    .max_width_420 { max-width: 100%; }
}

.plugin_trenner {}
.width_basic { max-width: 1280px; padding: 0 20px; }
.width_extrasmall { max-width: 480px; padding: 0 20px; }
.width_small { max-width: 640px; padding: 0 20px; }
.width_medium { max-width: 800px; padding: 0 20px; }
.width_normal { max-width: 1024px; padding: 0 20px; }
.width_large { max-width: 1120px; padding: 0 20px; }
.width_extralarge { max-width: 1280px; padding: 0 20px; }
.width_superlarge { max-width: 1600px; padding: 0 20px; }
.width_full { padding: 0 20px; }
.width_full_complete { padding: 0; }

.paddin_bottom_80 { padding-bottom: 3.63em; }
.paddin_top_120 { padding-top: 5.45em; }
.paddin_top_160 { padding-bottom: 7.27em; }
.padding_y_80 { padding-top: 3.635em; padding-bottom: 3.635em; }
.padding_y_160 { padding-top: 7.27em; padding-bottom: 7.27em; }
.padding_x_160 { padding-left: 7.27em; padding-right: 7.27em; }
.background_white_transparent { background: rgba(255,255,255,0.7); }
.backdrop_blur { -webkit-backdrop-filter: blur(10px); -moz-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }

.headerbild {}
.headerbild h3 { font-size: 1em; }
.headerbild .bild_container { position: absolute; left: 0; top: 0; right: 0; bottom: 0; }
@media only screen and (max-width: 980px) {
    .headerbild.padding_x_160 { padding-left: 3.63em; padding-right: 3.63em; }
}
@media only screen and (max-width: 767px) {
    .headerbild.padding_x_160 { padding-left: 20px; padding-right: 20px; }
    .headerbild.padding_y_80 { padding-top: 0; padding-bottom: 0px; }
    .headerbild { margin-bottom: 11em; }
    .headerbild .bild_container { bottom: auto; height: 15em; }
    .headerbild.border_radius_18 { overflow: inherit; }
    .headerbild.cover { background-position: center; }
    .headerbild .backdrop_blur { -webkit-transform: translate3d(0, 9.2em, 0); transform: translate3d(0, 9.2em, 0); }
}

.vdsl_adresse_pruefen {}
.vdsl_adresse_pruefen h2 { color: #ffffff; }
.vdsl_adresse_pruefen h3 { font-size: 1em; }
.vdsl_adresse_pruefen .bild_container { position: absolute; left: 0; top: 0; right: 0; bottom: 0; }
@media only screen and (max-width: 980px) {
    .vdsl_adresse_pruefen.padding_x_160 { padding-left: 3.63em; padding-right: 3.63em; }
}
@media only screen and (max-width: 767px) {
    .vdsl_adresse_pruefen.padding_x_160 { padding-left: 0px; padding-right: 0px; }
    .vdsl_adresse_pruefen.padding_x_160 { padding-top: 12em; padding-bottom: 0px; }
    .vdsl_adresse_pruefen.border_radius_18 { }
    .vdsl_adresse_pruefen { box-shadow: 0 1px 8px rgba(0,0,0,0.1); }
    .vdsl_adresse_pruefen h2 { color: #4f569a; margin-bottom: 0; }
    .vdsl_adresse_pruefen h2 br { display: none; }
    .vdsl_adresse_pruefen .bild_container { bottom: auto; height: 12em; }
    .vdsl_adresse_pruefen .bild_container.border_radius_18 { border-radius: 0.8em 0.8em 0 0; }
    .vdsl_adresse_pruefen .bg_overlay { bottom: auto; height: 12em; }
    .vdsl_adresse_pruefen .inner { background: #ffffff; padding-top: 1.5em; }
    .vdsl_adresse_pruefen .background_white_transparent { background: rgba(255,255,255,0.0); }
}

.cover { background-position: center; background-repeat: no-repeat; background-size: cover; }

#logo { width: 8.18em; position: absolute; left: 0.68em; top: 0.5em; }
@media only screen and (max-width: 1740px) {
    #logo { position: relative; left: auto; float: left; margin-right: 1.2em; }
}
@media only screen and (max-width: 1340px) {
    #logo { float: none; margin: 0 0 0 0; }
}
@media only screen and (max-width: 767px) {
	#logo { }
}

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

.mainnav { float: left; }
.mainnav ul.level0 { display: block; margin: 0 0 0 0; padding: 0; }
.mainnav ul.level0 li { list-style: none; float: left; margin: 0 2.2em 0 0; position: relative; }
.mainnav ul.level0 li a { color: #ffffff; padding: 0.81em 0; display: block; text-decoration: none; font-family: 'GloberSemiBold'; }
.mainnav ul.level0 li.active a { color: rgba(255,255,255,0.6); }
.mainnav ul.level0 li a i { font-size: 0.7em; }
@media only screen and (max-width: 1340px) {
    .mainnav { float: none; display: none; margin: 20px 0 0 0; }
    .mainnav ul.level0 { margin: 0 0 20px 45px; }
    .mainnav ul.level0 li { float: none; margin: 0 0 0 0; }
    .mainnav ul.level0 li a { padding: 0.5em 0; }
}

.mainnav ul li ul.level1 { position: absolute; transition: 300ms; left: -60px; width: 240px; border-radius: 10px; text-align: left; padding: 20px 20px 20px 20px; opacity: 0.0; pointer-events: none; background: linear-gradient(to top right, rgba(57,55,91,0.8), #4f569a); webkit-backdrop-filter: blur(10px);
    -moz-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px); -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); }
.mainnav ul li ul.level1 li { float: none; margin: 0 0 0 0; padding: 0; }
.mainnav ul li ul.level1 li a { color: #ffffff; font-size: 0.9em; padding: 2px 0; border: none; text-transform: none; }
.mainnav ul li ul.level1 li:hover a { color: rgba(255,255,255,0.6); }
.mainnav ul li ul.level1 li.active a { color: rgba(255,255,255,0.6); }
.mainnav ul li:hover ul.level1 { opacity: 1.0; pointer-events: auto; -webkit-transform: translate3d(0, 0px, 0); transform: translate3d(0, 0px, 0); }

.mainnav ul.level0 li.active ul.level1 li a { color: rgba(255,255,255,1.0); }
.mainnav ul.level0 li.active ul.level1 li a:hover { color: rgba(255,255,255,0.6); }
.mainnav ul.level0 li.active ul.level1 li.active a { color: rgba(255,255,255,0.6); }

@media only screen and (max-width: 1340px) {
	.mainnav ul li ul.level1 { display: none; position: relative; left: auto; transition: 0ms; width: auto; padding: 0 20px 10px; border-top: none; padding: 0; opacity: 1.0; pointer-events: auto; -webkit-transform: translate3d(0, 0px, 0); transform: translate3d(0, 0px, 0); background: transparent; }
}

.metanav { position: absolute; right: 40px; font-size: 0.8em; }
.metanav ul { margin: 0; padding: 0; }
.metanav ul li { list-style: none; float: left; margin: 0 0 0 1.8em; }
.metanav ul li a { display: block; color: #ffffff; text-decoration: none; padding: 1.1em 0 0.9em; }
@media only screen and (max-width: 1340px) {
    .metanav { position: relative; right: auto; font-size: 0.8em; margin: 0 0 0 45px; padding: 0 0 20px 0; display: none; }
    .metanav ul li { float: none; margin: 0 0 0 0; }
    .metanav ul li a { padding: 0.5em 0 0.5em; }
}

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

.produkte_container {}
.produkte_container.border_radius_18 { overflow: inherit; }
.produkte_container img { margin-top: -3em; margin-left: -0.5em; }

@media only screen and (max-width: 1280px) {
    .produkte_container.padding_x_160 { padding-left: 3.63em; padding-right: 3.63em; }
}
@media only screen and (max-width: 767px) {
    .produkte_container.padding_x_160 { padding-left: 1.8em; padding-right: 1.8em; }
}

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

.kontakt_container {}
.kontakt_container .card { box-shadow: 0 0 1px rgba(0, 0, 0, 0.4); overflow: hidden; }
/*.kontakt_container .card .custom-header { rotate: 45deg; border-radius: 0.8em; }*/

.kontakt_container .card .custom-header {
    position: relative;
    background: linear-gradient(to top right, rgba(57, 55, 91, 1.0), #4f569a);
    padding: 0.5em;
    font-size: 2.5em;
    clip-path: polygon(0 0, 100% 0, 100% 60%, 50% 100%, 0 60%); 
    border-radius: 0;  
  }
  
  .kontakt_container .card .custom-header::after {
    content: '';
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 100px solid transparent;
    border-right: 100px solid transparent;
    border-top: 20px solid #f0f0f0; /* Gleiche Farbe wie der Header-Hintergrund */ }
  

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

.teaserverlinkungen .card { overflow: hidden; min-height: 20em; color: #ffffff; }
.teaserverlinkungen .card .card-body { padding-top: 2em; padding-right: 5em; color: #ffffff; }
.teaserverlinkungen .card .card-footer { padding-bottom: 1.5em; }
.teaserverlinkungen .card:hover .card-footer { padding-bottom: 1.5em; text-decoration: underline; }
.background_bild { position: absolute; left: 0; top: 0; right: 0; bottom: 0; transition: 1000ms; transform: scale(1.0); }
.teaserverlinkungen .card:hover .background_bild { transform: scale(1.2); }
.teaserverlinkungen .dark_left_top { background: linear-gradient(to right, rgba(0, 0, 0, 0.5), transparent); }

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

#slider_preise { overflow: inherit; }
#slider_preise .swiper-slide { width: 31.7%; height: auto !important; }
#slider_preise .swiper-pagination { position: relative; bottom: 0; padding: 10px 0 0 0; }
#slider_preise .card-header { background: linear-gradient(to top right, rgba(57,55,91,1.0), #4f569a); color: #ffffff; padding: 0.9em 24px 0.6em; }
#slider_preise .card-body { padding: 16px 24px; }
.swiper-pagination-bullet-active { background: #4f569a; }
.swiper-button-prev, .swiper-button-next { width: 2.5em; height: 2.5em; background: #ffffff; border-radius: 50%; box-shadow: 0 2px 40px rgba(0,0,0,.1); }
.swiper-button-prev { left: -1.75em; }
.swiper-button-next { right: -1.75em; }
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { opacity: .0; }
.swiper-button-next:after, .swiper-button-prev:after { font-size: 1em; color: #4f569a; }
@media only screen and (max-width: 1224px) {
    #slider_preise .swiper-slide { width: 44%; }
}
@media only screen and (max-width: 767px) {
    #slider_preise .swiper-slide { width: 90%; }
}

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

.label { min-height: 25em; overflow: hidden; }
.label .logo { width: 3em; }
.label .label_badge { background: #ffffff; padding: 0.2em 0; rotate: 45deg; position: absolute; top: 13%; right: -32%; width: 100%; box-shadow: 0 3px 5px rgba(0,0,0,0.4); }
@media only screen and (max-width: 767px) {
    .label { max-width: 20em; margin: 0 auto; }
}

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

.domain_container {}
.domain_container .btn { min-width: 7.5em; display: inline-block; }
.domain_container .card { border-radius: 0em; box-shadow: 0 0 1px rgba(0,0,0,0.4); }
.domain_container .card:first-child { border-radius: 0.8em 0.8em 0em 0em; }
.domain_container .card:last-child { border-radius: 0em 0em 0.8em 0.8em; }
@media only screen and (max-width: 767px) {
    .domain_container .text-md-end br { display: none; }
    .domain_container .font_size_16 { font-size: 0.81em; line-height: 1.5em; }
}

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

#so_funktioniert_trunk_container { height: 17em; font-size: 0.8em; line-height: 1.3em; color: #ffffff; }
.circle { width: 14em; height: 14em; padding: 20px; background: rgba(255,255,255,0.3); border-radius: 50%; position: absolute; left: 0; top: 0; }
.circle.firma { left: auto; right: 0; }
.circle.router { left: auto; right: 16em; top: 3em; width: 8em; height: 8em; background: rgba(255,255,255,1); color: #597a99; opacity: 0.0; transform: scale(0.5,0.5); -webkit-transform: scale(0.5,0.5); }
.circle.smart_node { left: auto; right: 27.5em; top: 3em; width: 8em; height: 8em; background: rgba(255,255,255,1); color: #597a99; opacity: 0.0; transform: scale(0.5,0.5); -webkit-transform: scale(0.5,0.5); }

.line_container_1 { position: absolute; top: 7em; left: 14em; right: 14em; height: 1px; }
.line_1 { background: rgba(255,255,255,0.3); position: absolute; left: 0; top: 0; height: 1px; width: 100%; }
.line_2 { background: rgba(255,255,255,1); position: absolute; left: 0; top: 0; height: 1px; width: 0; }

.pbxicon { display: inline-block; font-size: 4em; margin: 15px 0 0 0; }
.routericon { display: inline-block; font-size: 2em; margin: 8px 0 0 0; }

.line_2.go { width: 100%; transition: 2000ms; }
.sip_faehig { position: absolute; left: 50%; margin-left: -100px; top: 4em; font-size: 1.2em; opacity: 0.0; transition: 1000ms; }
.nicht_sip_faehig { position: absolute; left: 35%; margin-left: -100px; top: 4em; font-size: 1.2em; opacity: 0.0; }

.sip_faehig.go { margin-left: -35px; opacity: 1.0; }
.sip_faehig.go.go_2 { margin-left: 30px; opacity: 0.0; }

.nicht_sip_faehig.go { margin-left: -35px; opacity: 1.0; transition: 1000ms; transition-delay: 3500ms; }
.circle.router.go { opacity: 1.0; transform: scale(1,1); transition: 1000ms; -webkit-transform: scale(1,1); transition-delay: 1000ms; }
.circle.firma.go { background: rgba(255,255,255,1); transition: 1000ms 2000ms; }
.circle.smart_node.go { opacity: 1.0; transform: scale(1,1); -webkit-transform: scale(1,1); transition: 1000ms; transition-delay: 4500ms; }

.logo_swisscom { position: absolute; left: 10%; right: 10%; top: 50%; margin-top: -1.4em; }
.logo_swisscom img { width: 100%; }

.logo_solution { position: absolute; left: 10%; right: 10%; top: 50%; margin-top: -1.4em; opacity: 0.0; }
.logo_solution img { width: 100%; }

.logo_solution.go { opacity: 1.0; transition: 1000ms 2000ms; }

.reset_animation { position: absolute; bottom: 30px; left: 50%; margin-left: -75px; cursor: pointer; font-size: 0.8em; transition: 1000ms; opacity: 0.0; }
.reset_animation.go { opacity: 1.0; transition-delay: 6000ms }

@media only screen and (max-width: 1024px) {
	#so_funktioniert_trunk_container { font-size: 0.6em; }
}
@media only screen and (max-width: 767px) {
	#so_funktioniert_trunk { display: none; }
}

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

footer { color: #ffffff; font-size: 0.8em; line-height: 1.5em; }
footer a { text-decoration: underline; color: #ffffff; }
footer a:hover { text-decoration: none; color: #ffffff; }

.footernav {}
.footernav ul { padding: 0; margin: 0; }
.footernav ul li { list-style: none; }
.footernav ul li a { text-decoration: none; opacity: 0.6; }
.footernav ul li a:hover { opacity: 1.0; }

.footer_sub_menu {}
.footer_sub_menu ul { margin: 0; padding: 0; }
.footer_sub_menu ul li { list-style: none; float: left; margin: 0 2em 0 0; }
.footer_sub_menu ul li a { display: block; text-decoration: none; opacity: 0.6; }
.footer_sub_menu ul li a:hover { opacity: 1.0; }

.menuicon { display: none; position: absolute; right: 40px; top: 26px; width: 25px; height: 25px; margin: 0 0 0 0; transition: 0ms; }
.menuicon .line { width: 25px; height: 2px; background: #ffffff; position: absolute; }
.menuicon .line:nth-of-type(1) { top: 0; }
.menuicon .line:nth-of-type(2) { top: 9px; }
.menuicon .line:nth-of-type(3) { top: 18px; }
.menuicon.active .line:nth-of-type(1) { top: 8px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.menuicon.active .line:nth-of-type(2) { opacity: 0.0; visibility: hidden; }
.menuicon.active .line:nth-of-type(3) { top: 8px; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
@media only screen and (max-width: 1340px) {
	.menuicon { display: block; }
}

/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------ */

ul.square { list-style-type:square; }
ul.circle { list-style-type:circle; }
ul.square { list-style-type:square; }
ul.image { list-style-image: url('img/sqpurple.gif'); }

ol.decimal-leading-zero { list-style-type:decimal-leading-zero; }
ol.lower-alpha { list-style-type:lower-alpha; }
ol.upper-alpha { list-style-type:upper-alpha; }
ol.upper-roman { list-style-type:upper-roman; }

ul.linklist { list-style-type:none; }
ul li { position: relative; }
ul.linklist span { position: absolute; left: -20px; top: 2px; }
.plugin_faqsuche li .icomoon { margin-right:20px; }

.card { box-shadow: 0 1px 8px rgba(0,0,0,0.1); border: none; border-radius: 0.8em; color: #3f5862; }
.card.low_box_shadow { box-shadow: 0 0 1px rgba(0,0,0,0.4); }
.card-header { border-bottom: none; }
.card-header:first-child { border-radius: 0.8em 0.8em 0 0; }
.card-body { color: #3f5862; }
.card-footer { background: transparent; padding: 8px 24px; border: none; font-size: 0.9em; line-height: 1.5em; }
.card-title {font-size: 1.2em; color: #4f569a; margin: 0 0 0.6em 0;}

.cardbox {}
.cardbox .card { border-radius: 0em; box-shadow: 0 0 1px rgba(0,0,0,0.4); }
.cardbox .card:first-child { border-radius: 0.8em 0.8em 0em 0em; }
.cardbox .card:last-child { border-radius: 0em 0em 0.8em 0.8em; }
@media only screen and (max-width: 767px) {
    .cardbox .text-md-end br { display: none; }
    .cardbox .font_size_16 { font-size: 0.81em; line-height: 1.5em; }
}

.card_accordion i { -webkit-transform: rotateX(0deg); transform: rotateX(0deg); transition: 400ms; }
.card_accordion.open i { -webkit-transform: rotateX(180deg); transform: rotateX(180deg); }

.card.thumbnail { height: 180px; overflow: hidden; box-shadow: 0 0 1px rgba(0,0,0,0.4); }
.card.thumbnail a { padding: 10px; width: 100%; height: 100%; }
.card.thumbnail img { max-height: 100%; max-width: 100%; }
.card.thumbnail a .overlay { background: rgba(255,255,255,0.5); visibility: hidden; opacity: 0.0; -webkit-backdrop-filter: blur(10px); -moz-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.card.thumbnail a:hover .overlay { visibility: visible; opacity: 1.0; }
.card.thumbnail .overlay .bi-search { font-size: 2em; }


.newsbild {height: 177px; background-position: center; background-size: cover; border-radius: 0.8em 0.8em 0 0;}
.newsbilddetail {border-radius: 0.8em !important;}
.blogbadge { /* background-color: #6fc55e; */}
.accordion-item { background: transparent; border: none; border-bottom: solid 1px #3f5862; border-radius: 0!important; }
.accordion-button { font-size: 1em; font-family: 'GloberBold'; background: transparent; color: #4f569a; }
.accordion-button.collapsed { border-radius: 0; } 
.accordion-button::after { color: #4f569a; }
.accordion-button:not(.collapsed) { background-color: transparent; box-shadow: none; }
.accordion-button.icon { position: relative; padding-left: 2em; }
.accordion-button.icon i.bi { position: absolute; left: 0.5em; top: 0.5em; display: inline-block; }

.list-line { background: transparent; border: none; border-bottom: solid 1px #3f5862; border-radius: 0!important; font-size: 1.2em; font-family: 'GloberBold'; background: transparent; color: #4f569a;  margin: 0; padding: 16px; }
.list-line.icon { position: relative; padding-left: 2em; }
.list-line.icon i.bi { position: absolute; left: 0.5em; top: 0.5em; display: inline-block; }

.height_250 { height: 250px; }
@media (min-width: 576px) {
	.galerieUebersicht.card-deck { -ms-flex-flow: column; flex-flow: column; margin-right: 0; margin-left: 0; }
	.galerieUebersicht.card-deck .card { margin-right: 0; margin-left: 0; margin-bottom: 15px; }
}
@media (min-width: 776px) {
	.galerieUebersicht.card-deck { -ms-flex-flow: row wrap; flex-flow: row wrap; margin-right: -15px; margin-left: -15px; }
	.galerieUebersicht.card-deck .card { margin-right: 15px; margin-left: 15px; margin-bottom: 30px; }
}

.plugin_galerie_height { height: 180px; }

.responsive-video { position: relative; padding-bottom: 56.25%; padding-top: 0px; height: 0; overflow: hidden; width: 100%; }
.responsive-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

figure video { width: 100%; height: auto; display: block; }

hr { margin: 0; border: 0 none; background-color: #000000; height: 1px; clear: both; opacity: 1; }
hr.space1 { height: 1px; }
hr.space2 { height: 2px; }
hr.space3 { height: 3px; }
hr.space4 { height: 4px; }
hr.space5 { height: 5px; }
hr.space6 { height: 6px; }
hr.space10 { height: 10px; }

.text-color-none { background-color: transparent !important; }

footer hr { background-color: #ffffff; opacity: 0.1; border-radius: 4px; }
