/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*     Slider mit verschiedenen Styles - responsive                                                        */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------*/
	
		
       /* jssor slider bullet navigator skin 01 css */
        /*
        .jssorb01 div           (normal)
        .jssorb01 div:hover     (normal mouseover)
        .jssorb01 .av           (active)
        .jssorb01 .av:hover     (active mouseover)
        .jssorb01 .dn           (mousedown)
        */
        .jssorb01 {
            position: absolute;
        }
        .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av {
            position: absolute;
            /* size of bullet elment */
            width: 12px;
            height: 12px;
            filter: alpha(opacity=70);
            opacity: .7;
            overflow: hidden;
            cursor: pointer;
            border: #000 1px solid;
        }
        .jssorb01 div { background-color: gray; }
        .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
        .jssorb01 .av { background-color: #fff; }
        .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }

		/* jssor slider arrow navigator skin 02 css */
        /*
        .jssora02l                  (normal)
        .jssora02r                  (normal)
        .jssora02l:hover            (normal mouseover)
        .jssora02r:hover            (normal mouseover)
        .jssora02l.jssora02ldn      (mousedown)
        .jssora02r.jssora02rdn      (mousedown)
        */
		
        .jssora02l, .jssora02r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 55px;
            height: 55px;
            cursor: pointer;
            background: url('../images/a02.png') no-repeat;
            overflow: hidden;
        }
		
        .jssora02l { background-position: -3px -33px; }
        .jssora02r { background-position: -63px -33px; }
        .jssora02l:hover { background-position: -123px -33px; }
        .jssora02r:hover { background-position: -183px -33px; }
        .jssora02l.jssora02ldn { background-position: -3px -33px; }
        .jssora02r.jssora02rdn { background-position: -63px -33px; }

        /*jssor slider loading skin spin css*/
        .jssorl-009-spin img {
            animation-name: jssorl-009-spin;
            animation-duration: 1.6s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
        }

        @keyframes jssorl-009-spin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        /*jssor slider bullet skin 072 css*/
        .jssorb072 .i {position:absolute;color:#000;font-family:"Helvetica neue",Helvetica,Arial,sans-serif;text-align:center;cursor:pointer;z-index:0;}
        .jssorb072 .i .b {fill:#fff;opacity:.3;}
        .jssorb072 .i:hover {opacity:.7;}
        .jssorb072 .iav {color:#fff;}
        .jssorb072 .iav .b {fill:#000;opacity:.5;}
        .jssorb072 .i.idn {opacity:.3;}

        /*jssor slider arrow skin 073 css*/
        .jssora073 {display:block;position:absolute;cursor:pointer;}
        .jssora073 .a {fill:#ddd;fill-opacity:.7;stroke:#000;stroke-width:160;stroke-miterlimit:10;stroke-opacity:.7;}
        .jssora073:hover {opacity:.8;}
        .jssora073.jssora073dn {opacity:.4;}
        .jssora073.jssora073ds {opacity:.3;pointer-events:none;}		
		
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*     Image Anzeige mit Thumbnails                                                        */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.silde-explain { 
	position: absolute; 
	top: 20px; 
	left: 30%; 
	width: 350px; 
	height: 30px; 
	background-color: rgba(235,81,0,0.5); 
	font-size: 20px; 
	color: #ffffff; 
	line-height: 30px; 
	text-align: center;
	}	
	

.title { 
	position: absolute; 
	top: 630px;
	left: 210px;
    color: #3265A3;
	font: bold  140%/100% Arial,Trebuchet MS,times new roman,verdana,helvetica,sans-serif,Arial;
	text-align: center;
	background-color: #ccc;
    opacity: 0.6;
	width: 100%;
	max-width: 520px;

	}	

 /* jssor slider thumbnail navigator skin 01 css */
        /*
        .thumb-square .p            (normal)
        .thumb-square .p:hover      (normal mouseover)
        .thumb-square .p.pav        (active)
        .thumb-square .p.pdn        (mousedown)
        */
        .thumb-square .p {
            position: absolute;
            top: 0;
            left: 0;
            width: 99px;
            height: 99px;
        }
        
        .thumb-square .t {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: none;
        }
        
        .thumb-square .w {
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
        }
        
        .thumb-square .c {
            position: absolute;
            top: 0px;
            left: 0px;
            width: 95px;
            height: 95px;
            border: #000 2px solid;
            box-sizing: content-box;
            background: url('../images/t01.png') -800px -800px no-repeat;
            _background: none;
        }
        
        .thumb-square .pav .c {
            top: 2px;
            _top: 0px;
            left: 2px;
            _left: 0px;
            width: 95px;
            height: 95px;
            border: #000 0px solid;
            _border: #fff 2px solid;
            background-position: 50% 50%;
        }
        
        .thumb-square .p:hover .c {
            top: 0px;
            left: 0px;
            width: 97px;
            height: 97px;
            border: #fff 1px solid;
            background-position: 50% 50%;
        }
        
        .thumb-square .p.pdn .c {
            background-position: 50% 50%;
            width: 95px;
            height: 95;
            border: #000 2px solid;
        }
        
        * html .thumb-square .c, * html .thumb-square .pdn .c, * html .thumb-square .pav .c {
            /* ie quirks mode adjust */
            width /**/: 99px;
            height /**/: 99px;
        }