:root{
	--sws-blue:#004d9e;
    --sws-yellow:#ffcc00;
    --sws-grau:#e5ecf5;
    --dist:80%;
    --dist2:85%;
    --dist3:90%;
    --dist4:26%;
    --dist5:35%;
    --white-none:rgba(255,255,255,0);
    scroll-behavior:smooth;
}

h4 {
    color: #000000!important;
}

b, strong {
    font-weight: 700!important;
}

#top-btn {
    cursor:pointer;
    width:40px;
    height:40px;
    position:fixed;
    right:50px;
    bottom:50px;
    transform:rotate(-90deg);
    border-style:none;
  /* visual styling */	background:url('https://work.stadtwerke-sangerhausen.de/images/stadtwerke/formular_icon.jpg');
    background-size:cover;
    background-position:center;
    padding:10px;
  border-radius: 5px;
}

ul {
	list-style-position:outside!important;
}
li::marker {
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    text-transform: none;
    text-indent: 0px !important;
    text-align: start !important;
    text-align-last: start !important;
}

.tarifrechter-links a:hover {
    color: #fff;
}

.tarifrechter-links a {
    color: #fff;
}

.tm-child-list>ul>*>ul, .tm-child-list>ul>:nth-child(n+2), .uk-list>*>ul, .uk-list>:nth-child(n+2) {
    margin-top: 1px;
}

.uk-width-1-2\@s.uk-width-1-4\@m.uk-first-column ul {
    margin-bottom: 1px;
}

.uk-navbar-nav>li>a {
    color: #004d9e;
}

ul.uk-list li:before {
    
    display: inline-block;
    padding: 0px;
}
ul.uk-list li a {
    color: #004d9e !important;
    text-decoration: none !important;
    cursor: pointer !important;
}
ul.uk-list li a:hover {
    color: #004d9e !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

.clearfix {
    display: flex;
    justify-content:space-around;
    width: 100%;
    height:0px;
	opacity: 0.45;
}

.menu-title {
    color:#004d9e!important;
    padding: 0 5px;
    font-size:22px;
    font-weight:500;
    text-transform: capitalize;
    background:linear-gradient(110deg, 
               var(--sws-yellow) var(--dist), 
               var(--white-none) var(--dist), 
               var(--white-none) var(--dist2),
               var(--sws-blue) var(--dist2), 
               var(--sws-blue) var(--dist3),
               var(--white-none) var(--dist3))!important;
    padding-left:10px;
    margin-bottom: 20px;
}
.menu--title {
    width:100%;
	color:var(--sws-blue);
    
    padding: 0 5px;
    font-size:20px;
    font-weight:600;
    text-transform: uppercase;
    padding-left:10px;
}
/**************************************SIDEBAR--Kundenportal & Rechner*/

.side-map{
	width:360px;
    border-radius:15px;
    overflow:hidden;
}
.login-blue {
    height:400px;
    width:360px;
	background:#004d9e;
    color:white;

    padding:20px 20px 20px 20px;
    border-radius:0px;
}
.login-blue-w {
height: 220px;
    width: 100%;
    background: #004d9e;
    color: white;
    border-radius: 0px;
    border-top: 1px #fff solid;
}
.kunden-login-left {
    float: left;
    width: 100%;
    font-size: 18px;
}
.kunden-login-right {
    width: 100%;
    text-align: center;
    margin-top: 50px;
}
.login-blue .uk-button, .login-blue-w .uk-button{
	background:#ffcc00;
}
.login-blue a:last-child, .login-blue-w a:last-child{
	color:#e5ecf5;
}
#kunden-login h2, #kunden-login [target=_blank]{
	color:white;
}

/* Tarifrechner */
.tarifrechner-box h2, .tarifrechner-box-alles h2 {
text-align: center;
    font-weight: 600;
    color: #fff;
    padding: 10px;
    border-bottom: #fff 1px solid;
}
.tarifrechner-box, .tarifrechner-box-alles {
background-color: #004d9e;
}
.tarifrechner-box-alles {
/* height: 460px; */
}

.tarifrechner-box-inner #energy-rates-widget{
    padding-left: 35px;
    padding-right: 35px;
}

.waermerechner_only .vnc-energy-rate__heating .vnc-energy-rate__heating-type {
    width: 45%;
    float: left;
}
@media screen and (max-width:768px){
	.waermerechner_only .vnc-energy-rate__heating .vnc-energy-rate__heating-type {
    width: 100%;
    float: left;
}
}

.waermerechner_only .vnc-input__label, .vnc-energy-rate--heat .vnc-input__label {
    font-weight: 700;
    min-height: 0;
}

/**************************************HAMBURGER ICON*/

.uk-icon.uk-navbar-toggle-icon svg {
 width: 30px;   
}

/**************************************Dropbarmenu*/
.uk-child-width-expand.uk-grid-small.uk-grid {
    padding: 10px 0px 10px 0px;
	width: 100%; height: 100%;
    background-size: 200% 100%;
    background-image: linear-gradient(to right, 	none 50%, #00d4e9 50%);
    -webkit-transition: background-position 1s;
    -moz-transition: background-position 1s;
    transition: background-position 1s;
}
/**************************************Dropbarmenu - Ende*/

.uk-navbar-dropdown.uk-drop.uk-navbar-dropdown-dropbar {
	//background:red !important;
    top: 190px;
    width:100% !important;
    left: 40px !important;
    max-width: 1200px;
}
.start-wrapper{
	display:flex;
    justify-content:space-around;
    width:auto;
}
.--vorteile{
    width:360px;
	background:#ffcc00;
    border-radius:15px;
    padding:25px;
}
.sws-news{
	background-color:white; 
    padding:25px; 
    border-radius:15px; 
    margin-bottom:20px;
    box-shadow:0px 1px 7px #a8a8a8;
}
.sws-news:hover, .start-container:hover{
	box-shadow:0px 1px 7px;
}

/* LINKS */
.start-panel a, .side_bar a {
    color: #004d9e !important;
    text-decoration: none !important;
    cursor: pointer !important;
	font-weight: 700;
}
.start-panel a:hover, .side_bar a:hover {
    color: #f0be00 !important;
    text-decoration: none !important;
    cursor: pointer !important;
	font-weight: 700;
}

/*ARTIKEL LISTE*/

.start-panel,.uk-grid.uk-child-width-1-1.uk-grid-large .uk-article, .uk-child-width-1-1.uk-grid-row-large.uk-grid.uk-grid-stack .uk-article, .finder .uk-article{
	background-color:#f6f1f2; 
    padding:25px; 
    border-radius:15px; 
    margin-bottom:20px;
    box-shadow:0px 1px 7px #a8a8a8;
}

#tm-dialog{
    background:#ffffff;
    padding-top:50px;
	height:65vh !important;
    border-bottom: 3px solid #004d9e;
}
.menu-title{
    position:relative;
    background:#004d9e;
	color:white;
    padding-left:10px;
    left:-10px;
}

.uk-article-title {
	margin-top: 0px !important;

}

.tm-article-date {
    width: 60px;
    height: 60px;
    border-radius: 16px;
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
    border: 1px solid #b6ada9;
    color: #81726E;
    text-align: center;
    margin-right: 20px;
    float: left;
    padding: 8px 0px;
	margin-bottom: 20px;
	background-color: #fff;
}
.tm-article-date-year {
    font-size: 16px;
    line-height: 18px;
    display: block;
    font-weight: bold;
}
.tm-article-date-month {
    text-transform: uppercase;
    font-size: 26px;
    line-height: 28px;
    display: block;
}
h2[property*="headline"] {
    display: contents;
}


/*SECTION _ WELCOME*/

.welcome-panel-section{background-color:#f6f1f2;}

/*TILE STYLING*/
.uk-panel.uk-tile-secondary{
    
	border-radius:15px;
    padding:20px;
    border: 2px solid #ffcc00;
}
.uk-panel.uk-tile-secondary:hover{
	box-shadow:0px 1px 7px #a8a8a8;
    border: 2px solid white;
}

/**ATTENTION-BUTTON*/
#button-grid div:nth-child(1n+2) .uk-panel.uk-tile-secondary{
	background:#f6f1f2;
    border: 2px solid #f6f1f2;
}
/*ANSPRECHPARTNER*/
img[alt="Technischer Bereich"]{
	clip-path: polygon(20% 0%, 100% 0, 80% 100%, 0% 100%);
}


#grid-staff{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
	
}
#grid-staff .image{
	width:200px;
    height:200px;
    overflow:hidden;
    clip-path: polygon(20% 0%, 100% 0, 80% 100%, 0% 100%);
    
}
#grid-staff .person{
    margin-top:25px;
    height:100%;
	width:230px;
    
}

#hero-title{position:relative;top:80px;}
#page-title, #page-title-bottom{
    width:100%;
    font-size:70px;
    font-weight:800;
    text-transform: uppercase;
	color:white;
    text-shadow:1px 2px 3px rgba(36,39,40,0.8);
    padding-left:150px;
    padding-top:5px;
    padding-bottom:5px;
    margin:0px;
    margin-top:15px;
}
#page-title-bottom .kunde {
    clip-path: polygon(8% 0%, 100% 0, 92% 100%, 0% 100%);
	background:#ffcc00;
    padding: 0 58px;
    text-shadow:none;
}
#page-title .kunde {
    clip-path: polygon(8% 0%, 100% 0, 92% 100%, 0% 100%);
	background:#ffcc00;
    padding: 0 58px;
    text-shadow:none;
}
#page-title .kunde {
    color: #004d9e !important;
}
#page-title-bottom .gas {
    clip-path: polygon(8% 0%, 100% 0, 92% 100%, 0% 100%);
    background: #074791;
    padding: 0 58px;
    text-shadow: none;
}
#menu-logo img{
	opacity:0.1;
    mix-blend-mode: multiply;
}
/*MEGA_MENU*/
#mega-grid {
    margin-top:35px;
	
}
#mega-grid h3 {
	background:#fccd06;
    padding:3px 10px;
    transform:translateX(-10px);
    font-size:20px;
	color: #034897;
}
#mega-grid .el-meta {
    padding-right:25px;
}
#mega-grid .uk-panel {
	//background:lightblue;
    padding:15px;
    border-radius:5px;
    transform:translateX(0);
    transition:300ms;
}
#mega-grid .uk-panel:hover {
	//background:lightblue;
    transform:translateX(2px);    
}
/**************************************VISFORM*************/
.sws--form input.btn, .sws--form #field234_btn{
    background:var(--sws-yellow);
    color:var(--sws-blue);
}
.sws--form input.btn:hover, .sws--form #field234_btn:hover{text-shadow:none;border-color:var(--sws-yellow);}
.sws--form #field234_btn{margin-left:15px;}

.form-check-input[type=checkbox]:checked, .form-check-input[type=checkbox]:indeterminate, .form-check-input[type=radio]:checked, .uk-checkbox:checked, .uk-checkbox:indeterminate, .uk-radio:checked {
    background-color: #fc0;
    border-color: #004d9e;
    box-shadow: inset 0px 0px 0px 3px #fff;
}

/* LINK ICONS */
a.zipdownload {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-zip.png);
    background-repeat: no-repeat;
    padding: 2px 0 2px 30px;
    background-position: 0 0;
    background-size: 24px auto;
    margin-left: 5px;
    line-height: 30px
}

a:hover.zipdownload {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-zip.png)
}

a.xlsdownload {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-spreadsheet.png);
    background-repeat: no-repeat;
    padding: 2px 0 2px 30px;
    background-position: 0 0;
    background-size: 24px auto;
    margin-left: 5px;
    line-height: 30px
}

a:hover.xlsdownload {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-spreadsheet.png)
}

a.extern_website {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-html.png);
    background-repeat: no-repeat;
    padding: 2px 0 2px 30px;
    background-position: 0 0;
    background-size: 24px auto;
    margin-left: 5px;
    line-height: 30px
}

a:hover.extern_website {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-html.png)
}

.formular .tm-bottom-a a {
    background-image: url(../../../images/stadtwerke/download_icon.jpg);
    background-repeat: no-repeat;
    padding: 22px 30px 20px 0;
    background-position: 100% 40%;
    background-size: 22px;
    margin-right: 5px;
    line-height: 30px
}

.formular .tm-bottom-a a:hover {
    background-image: url(../../../images/stadtwerke/download_icon_hover.jpg)
}

a.download {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-pdf.png);
    background-repeat: no-repeat;
    padding: 2px 0 2px 30px;
    background-position: 0 0;
    background-size: 24px auto;
    margin-left: 5px;
    line-height: 30px
}

a:hover.download {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-pdf.png)
}

a.download-xls {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-spreadsheet.png);
    background-repeat: no-repeat;
    padding: 2px 0 2px 30px;
    background-position: 0 0;
    background-size: 24px auto;
    margin-left: 5px;
    line-height: 30px
}

a:hover.download-xls {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-spreadsheet.png)
}

a.formular {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-document.png);
    background-repeat: no-repeat;
    padding: 2px 0 2px 30px;
    background-position: 0 0;
    background-size: 25px;
    line-height: 30px
}

a:hover.formular {
    background-image: url(../../../media/com_phocadownload/images/mime/32/icon-document.png)
}

/* Button */
.btn-sm, .uk-button-small {
    font-size: 14px!important;
	}


/*RESPONSIVE*/
/*********/

@media screen and (max-width:768px){
    
    #hero-title{position:relative;top:0px;}
    #page-title, #page-title-bottom{
        width:100vw;
        font-size:30px;
        font-weight:500;
        text-align:left !important;
        text-transform: uppercase;
        color:white;
        text-shadow:1px 2px 3px rgba(36,39,40,0.8);
        /* padding-left:150px; */
		padding-left:30px;
		padding-right: 30px;
        padding-top:5px;
        padding-bottom:5px;
        margin:0px;
        margin-top:0px;
		left: unset !important;
    }
	#page-title.page-certificate, #page-title-bottom.page-certificate{
        font-size:24px;
    }
	.page-title-subline div {
    width: 100%;
	}
    #page-title-bottom .kunde {
        clip-path: polygon(8% 0%, 100% 0, 92% 100%, 0% 100%);
        background:#ffcc00;
        padding: 0 15px;
        text-shadow:none;
    }
    #kunden-login{width:100%; height: 100%;}    
    .login-blue {
        height:auto;
        width:100%;
        background:#004d9e;
        color:white;

        padding:20px 20px 0px 20px;
        border-radius:15px;
    }
    .side-map{width:100%;}    
    .--vorteile{
        width:90vw;
        background:#ffcc00;
        border-radius:15px;
        padding:25px;
    }
    .--vorteile h3, p{ font-size:15px;}
    
    .uk-button-primary {
        background-color: #ffcc00;
        color: #ffffff;
        padding: 5px;
        line-height:1em;
        text-align:left;
        font-size:18px;
	}
	.btn-sm, .uk-button-small {
    font-size: 14px!important;
	}
/******************MOBILE MENU*/
    div [aria-label="menu"] h3{
        padding-left:5px;
        color:var(--sws-blue);
        font-size:25px;margin:20px;}
    div [aria-label="top"]{margin:10px 20px;}
    section [aria-label="top"]{margin:10px 5px;}
    section [aria-label="top"] h3{
        color:white;
        font-weight:600;
        font-size:26px;
        border-style:solid;
        border-width:2px;
        border-radius:5px;
        background:linear-gradient(110deg, var(--sws-yellow) var(--dist), var(--white-none) var(--dist), var(--white-none) var(--dist2),var(--sws-blue) var(--dist2), var(--sws-blue) var(--dist3),var(--white-none) var(--dist3));
        padding: 5px 15px;
    	}
}

/************************************************/
/**************************************RESPONSIVE TABLET********************/
/************************************************/

@media (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
    
    #hero-title{position:relative;top:0px;}
    #page-title, #page-title-bottom{
        width:100vw;
        font-size:30px;
        font-weight:500;
        text-align:left !important;
        text-transform: uppercase;
        color:white;
        text-shadow:1px 2px 3px rgba(36,39,40,0.8);
        padding-left:150px;
        padding-top:5px;
        padding-bottom:5px;
        margin:0px;
        margin-top:0px;
    }
    #page-title-bottom .kunde {
        clip-path: polygon(8% 0%, 100% 0, 92% 100%, 0% 100%);
        background:#ffcc00;
        padding: 0 15px;
        text-shadow:none;
    }
    #kunden-login{width:100%;}    
    .login-blue {
        height:auto;
        width:100%;
        background:#004d9e;
        color:white;

        padding:20px 20px 0px 20px;
        border-radius:15px;
    }
    .side-map{width:100%;}    
    .--vorteile{
        width:90vw;
        background:#ffcc00;
        border-radius:15px;
        padding:25px;
    }
    .--vorteile h3, p{ font-size:15px;}
    
    .uk-button-primary {
        background-color: #ffcc00;
        color: #ffffff;
        padding: 5px;
        line-height:1em;
        text-align:left;
        font-size:18px;
}
}


/* Aktuelles */

.uk-slider-items .uk-button {
margin-top: 15px!important;
}

.titel_blau_weiss {
    background-color: #044796;
    color: #ffffff;
    text-align: left;
    padding: 5px 5px;
    box-sizing: border-box;
}
/* Formulare */
[id*="datenschutzlbl"] {
width: 100%;
}

/* Footer */

.footer_link_oez ul, .sidebar-anfahrt ul {
    padding-left: 0px;
}
@media screen and (max-width:768px){
	#footer_wrapper2 {
		margin-left: auto;
    margin-right: auto;
		gap: 0px 15px;
		width: 80%;
	}
}