/*****************************************
		CUSTOM CSS
******************************************/


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


div.anchor {
    display: block;
    position: relative;
    top: -50px;
    visibility: hidden;}



#edius_edu_bestellung_form input{
background:#EAEAEA;
color: #2c115f;

}

.items-more ol > li:before {
position: absolute;    
left: -28px;
top: 12px;
background: #f3f3f3;
height: 27px;
width: 27px;
border: 1px solid rgba(0,0,0,.06);
text-align: center;
font: bold 12px/23px Roboto;
color: #999;
border-radius: 50%;
content: counter(li-counter);
counter-increment: li-counter;
z-index: 1;
}

input[type="submit"], button, .btn-primary {
    background: #333;
    border: 1px solid #666;
    border-color: rgba(255,255,255,0.14);
    color: #ddd;
}

input[type="submit"]:hover, button:hover, .btn-primary:hover, .btn-default:hover, .btn:hover  {
    background: transparent url(../images/black-25.png) 0 0 repeat;

    border: 1px solid #999;
    border-color: rgba(0,0,0,0.2);
    color: #fff;
}

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="tel"], input[type="color"], input[type="search"], .inputbox {
    background: #9E9C9C38;
    border: 1px solid #555;
    border-color: rgba(255,255,255,0.09);
    color: #2c115f;
}


input[type="file"] {
    display: block;
    padding: 0px;
    margin: 0px;
    height: 3em;
    border: None;
    background: white;
    box-shadow: None;
}

/*
.js-border .main_component img, #tinymce .js-border img, img.js-border {
box-shadow : 0px 1px 3px rgba(96, 3, 255, 0.2);
}
*/
.js-border .main_component img, #tinymce .js-border img, img.js-border {
box-shadow : none;
border: none;
}

/* visited link */
/*
    .content-module a:visited::after {
    content: "\a0\2611";
}
.content-module a:visited {
     padding-left: 14px;
     background: url("/templates/joomspirit_119/favicon.ico") left no-repeat;
}   

.main_component a:link::after  {
U+2611 (9745)
    //background-color: yellow;
    content: "";
    color: #cdc0d8;
   
    display: block;
    background: url("/templates/joomspirit_119/favicon.ico") no-repeat;
    width: 20px;
    height: 20px;
    float: left;
    margin: 0 3px 0 0px;
}


.check-me::after {
  font-family: FontAwesome;
  content: "\f00c";
  color: white
}

.check-me.active::after {
  font-family: FontAwesome;
  content: "\f00c";
  color: green
}

$('.check-me').click(function() {
  $('.check-me').toggleClass('active');
});



The following code will analyze each and every link on your webpage in a way so when a user clicks on a link it will store its location in browser's localStorage. The code first loops over the links, placing event handler on their click event. Then when user clicks on a link it checks for its existence in the local-storage array and if not pushes it there. At the same time adds class 'visited' to all visited links found in the array.


function check_visited_links(){
var visited_links = JSON.parse(localStorage.getItem('visited_links')) || [];
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
    var that = links[i];
    that.onclick = function () {
        var clicked_url = this.href;
        if (visited_links.indexOf(clicked_url)==-1) {
            visited_links.push(clicked_url);
            localStorage.setItem('visited_links', JSON.stringify(visited_links));
        }
    }
    if (visited_links.indexOf(that.href)!== -1) { 
        that.parentNode.className += ' visited';
    }
}
}

if you want to add some styling just add the following css rule:

.visited{
color:silver
}

    */
/* externe: Links 
And following code will prevent the external icon style on specific urls:

a[href^="http://www.stackoverflow.com"]  {
    background: none;
    padding-right: 0;
}

a[href^="http://"]:after, a[href^="https://"]:after {
    content: url(http://upload.wikimedia.org/wikipedia/commons/6/64/Icon_External_Link.png);
    margin: 0 0 0 5px;
}
https://www.youtube.com/embed/g5qZQlKe3-c?vq=1080p&enablejsapi=1&controls=1&showinfo=0&rel=0&theme=light&autoplay=1&playsinline=0
a[href^="http://www.youtu"]:after , a[href^="https://www.youtube.com"]:after  {
  content: '';
  margin: 0;
}
*/
a[href^="http://"], a[href^="https://"],a[href^="/downloads/"] {
    background: url(https://upload.wikimedia.org/wikipedia/commons/6/64/Icon_External_Link.png)     center right no-repeat;
    padding-right: 13px;
}

/*a[href^="https://www.youtube.com/"], a[href^="https://www.edius./"], a[href^="http://www.edius./"]  {*/
a[href^="https://www.youtube.com/"],a[href^="http://www.template-joomspirit.com"],a[href^="http://edius"],a[href^="http://www.edius"] ,a[href^="https://edius"],a[href^="https://www.edius"] , a[href^="https://order.shareit"]  {
    background: none;
    padding-right: 0;
}
/*
.website-content, .image-position{
    max-width: 1920px;
    margin: auto;
    }
.slides .no-kenburns{
    max-width: 1920px;
    margin: auto;
    }
*/
table,th,td {
    padding: 10px;
    border-color: rgba(181, 181, 181, 0.4) !important;
    }
podcastmenuentrie, a p.visited::after{
content: "\a0\2705";
}
/*podcastmenuentrie, a p:not(.visited)::before{
podcastmenuentrie, a p::before{
content: "\25CF\a0";
}*/
[itemprop="articleBody"] {
    overflow: unset;
}
.goback_menu:hover{
     text-decoration: underline;
    
}
a:hover:not([href]){
 text-decoration: none;    
}

.video_watched{
    display: none;
    color: white;
    text-shadow: black -1px -1px 3px, black 1px 1px 1px, black 1px 1px 3px;
    margin: auto;
    position: absolute;
    left: 0;
    bottom: 10%;
    right: 0;
    width: 100px;
    font-weight: bold;
    //color: red;
}
.moduletable > div {
    padding: 10px;
}

/* make code mirror editor resizeable *gruml* */
.CodeMirror.cm-s-default.CodeMirror-wrap {
    resize: both;
}

.js-border .main_component img.img_margin_only_right{
    margin: 5px 2% 10px 0px;
    padding: 0px;
    float: left;
    width: 40%;

}

.block_img_text{
margin-bottom: 10px;
display:block;
}

/* patch für hardware site, slider adjustments */
.hardware_slider  div#flexslider-184 {
    max-width: 568px;
}
@media screen and (max-width: 768px)  
.hardware_slider  div#flexslider-184 {
    /* height: auto; */
    /* width: 100%; */
    height: 0;
    padding-bottom: 56.25%;
    position: relative;
}
.hardware_slider  #flexslider-184 .jslider-image {
    max-width: 568px;
    /* height: auto; */
    /* width: 100%; */
    height: 0 !important;
    padding-bottom: 56.25%;
    position: relative;
}
@media screen and (max-width: 768px){
#flexslider-184 .slides, #flexslider-184 .slides li {
    background: #fff !important;
        margin: 0px;
}
}

/* mik: patches for menu in the background */
@media screen and (max-width: 979px) {
.drop-down ul {
    border: none;
    display: none;
    width: 500px;
    position: static;
    top: 0;
    left: 0;
    max-width: 100%;
    padding: 0 15px 100px 15px;
    z-index: 1337;
}
#js_navigation:target::before {
    content: "";
    position: static;
    z-index: -1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,.76);
}
.isStuck > ul {
    margin: 0;
    text-align: center;
    max-width: 100%;
}

}


}