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

body {
    color: #555 !important;
    font-family: "Verdana" !Important;  
    line-height: 18px !important;
  
}

.main_component {
    padding: 16px 20px 20px 10px;
}

p {
    margin: 0 0 12px !important;
}

/* Menü dropdown top */
.drop-down li li a, .drop-down li li span.separator {
    padding: 10px 8px 10px 7px; 
}

.left_column .moduletable {
    font-family: verdana !important;
/*    font-size: 1.1em !important; */
    color: #555 !imoportant;
}

.left_image .moduletable > div, .left_column .moduletable > div {
    padding-top: 0;
}

.left_column {
    margin-top: 0;
    font-family: "Verdana" !Important;
}

.vertical_menu ul li a {
    font-size: 1em;
    line-height: 150%;
    padding-right: 20px !important;
}

.website-footer, .middle-site {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.website-footer.transparency-white-05 {
    box-shadow: none;
    background-image: none;
}

.website-footer a {
    color: #666;
}

.vertical_menu ul li a {
/*    font-size: 106%; */
    padding: 2px 10px 4px 15px;
}

.website-footer a:hover {
    color: #fdfdfd;
}

.middle-site.transparency-white-04 {
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: url("../images/white-70.png");
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto auto;
    box-shadow: 0 0 4px #888888 inset;
    min-height: 700px;
}

.breadcrumb {
    margin: 30px 10px 0 0;
    border-radius: 0 !important;
    font-size: 75%;
}

a {
    color: #666;
}

a:hover {
    color: #aaa;
}

.drop-down li a:hover, .drop-down li span.separator {
    color: #fea737;
}

.drop-down li li a, .drop-down li li span.separator {
    font-size: 0.96em;
    padding: 10px 8px 10px 7px;
}

.website-footer a:hover {
    color: #fdfdfd;
}

.user1 {
    margin-left: -15px;
}

.user2 {
    margin: 0px -1px -10px;
}

.users_bottom {
    margin-top: -150px !important;
}

h1, .componentheading {
    font-size: 1.9em;
    margin: 10px 4px 25px 0;
}

h2 {
    color: #444;
    font-size: 152%;
    margin-bottom: 8px;
}

h3 {
    margin-top: 15px !important;
}

/* modul 1-9 startseite */

.left_image .moduletable > div, .right_image .moduletable > div, .top-module-position .moduletable > div, .bottom-module-position .moduletable > div, .left_column .moduletable > div, .right-module-position .moduletable > div, .user1 .moduletable > div, .user2 .moduletable > div, .user3 .moduletable > div, .user4 .moduletable > div, .user5 .moduletable > div, .user6 .moduletable > div, .user7 .moduletable > div, .user8 .moduletable > div, .user9 .moduletable > div {
    padding: 1px 8px;
}

.slider-change {
padding-right: 20px;
margin: 0 1px -10px;
}

.mod-change {
    font-family: "Verdana" !important;
    color: #ff0000 !important;  
}


/* FAV IMAGE HOVER  */

h4[id^="favimagehover-title"], h4[id*=" favimagehover-title"] {
    font-size: 1.1em !important;
    text-align: center !important;
}

div[id^="favimagehover-readmore"] a.btn, div[id*=" favimagehover-readmore"] a.btn {
    font-weight: bold;
}




/*****************************************
		MEDIA QUERIES - JoomSpirit Default
******************************************/

	/* Phone and little tablet */
		@media screen and (max-width: 767px) and (orientation : portrait) {
		/* Styles */
		
		img, video, .scale {
		max-width: 100%;
		/* width: 100% !important; */
		}
		}


	/* Phone and little tablet */
		@media screen and (max-width: 767px) and (orientation : landscape) {
		/* Styles */
		
		img, video, .scale {
		max-width: 40%;
		width: 40% !important;
		}

		}

	/* Portrait tablet to landscape and desktop */
		@media screen and (max-width: 979px) {
        /* Styles */
		}

/*****************************************
		MEDIA QUERIES - Devices div.
******************************************/

	/* Desktops and laptops ----------- */
        @media only screen
        and (min-width : 1224px) {
        /* Styles */
        }
     
	/* Large screens ----------- */
        @media only screen
        and (min-width : 1824px) {
        /* Styles */
        }
     
	/* old Smartphones (portrait and landscape) */
        @media only screen
        and (min-device-width : 320px)
        and (max-device-width : 480px) {
        /* Styles */
        }
     
    /* old Smartphones (landscape) */
        @media only screen
        and (min-width : 321px) {
        /* Styles */
        }
     
    /* old Smartphones (portrait) */
        @media only screen
        and (max-width : 320px) {
        /* Styles */
        }
          
    /* Android Tablet (portrait and landscape) */
        @media only screen
        and (min-device-width : 800px)
        and (max-device-width : 1280px) {
        /* Styles */
        }
     
    /* Android Tablet (landscape) */
        @media only screen
        and (min-device-width : 800px)
        and (max-device-width : 1280px)
        and (orientation : landscape) {
        /* Styles */
        }
     
    /* Android Tablet (portrait) */
        @media only screen
        and (min-device-width : 800px)
        and (max-device-width : 1280px)
        and (orientation : portrait) {
        /* Styles */
        }
     
    /* Desire + Galaxy S2 (portrait and landscape) */
        @media only screen
        and (min-device-width : 480px)
        and (max-device-width : 800px) {
        /* Styles */
        }
     
    /* Desire + Galaxy S2 (landscape) */
        @media only screen
        and (min-device-width : 480px)
        and (max-device-width : 800px)
        and (orientation : landscape) {
        /* Styles */
        }
     
    /* Desire + Galaxy S2 (portrait) */
        @media only screen
        and (min-device-width : 480px)
        and (max-device-width : 800px)
        and (orientation : portrait) {
        /* Styles */
        }	

/* iPphone Media Queries (All generations) */

	/* iPhone 6 Media Queries */

	/* iPhone 6 in portrait & landscape */
		@media only screen 
		and (min-device-width : 375px) 
		and (max-device-width : 667px) {
        /* Styles */
        }	

	/* iPhone 6 in landscape */
		@media only screen 
		and (min-device-width : 375px) 
		and (max-device-width : 667px) 
		and (orientation : landscape){
        /* Styles */
        }	

	/* iPhone 6 in portrait */
		@media only screen 
		and (min-device-width : 375px) 
		and (max-device-width : 667px) 
		and (orientation : portrait){
        /* Styles */
        }	

	/* iPhone 6 Plus Media Queries

	/* iPhone 6 Plus in portrait & landscape */
		@media only screen 
		and (min-device-width : 414px) 
		and (max-device-width : 736px){
        /* Styles */
        }	

	/* iPhone 6 Plus in landscape */
		@media only screen 
		and (min-device-width : 414px) 
		and (max-device-width : 736px) 
		and (orientation : landscape){
        /* Styles */
        }	

	/* iPhone 6 Plus in portrait */
		@media only screen 
		and (min-device-width : 414px) 
		and (max-device-width : 736px) 
		and (orientation : portrait){
        /* Styles */
        }	

	/* iPhone 5 & 5S Media Queries */

	/* iPhone 5 & 5S in portrait & landscape */
		@media only screen 
		and (min-device-width : 320px) 
		and (max-device-width : 568px) {
        /* Styles */
        }	

	/* iPhone 5 & 5S in landscape */
		@media only screen 
		and (min-device-width : 320px) 
		and (max-device-width : 568px) 
		and (orientation : landscape) {
        /* Styles */
        }	

	/* iPhone 5 & 5S in portrait */
		@media only screen 
		and (min-device-width : 320px) 
		and (max-device-width : 568px) 
		and (orientation : portrait) {
        /* Styles */
        }	

	/* iPhone 2G, 3G, 4, 4S Media Queries */
	/* It's noteworthy that these media queries are also the same for iPod Touch generations 1-4. */

	/* iPhone 2G-4S in portrait & landscape */
		@media only screen 
		and (min-device-width : 320px) 
		and (max-device-width : 480px){
        /* Styles */
        }	

	/* iPhone 2G-4S in landscape */
		@media only screen 
		and (min-device-width : 320px) 
		and (max-device-width : 480px) 
		and (orientation : landscape) {
        /* Styles */
        }	

	/* iPhone 2G-4S in portrait */
		@media only screen 
		and (min-device-width : 320px) 
		and (max-device-width : 480px) 
		and (orientation : portrait){
        /* Styles */
        }	

	/* iPhone 5 Resolution 
		Screen Width = 320px (CSS Pixels)
		Screen Height = 568px (CSS Pixels)

		Screen Width = 640px (Actual Pixels)
		Screen Height = 1136px (Actual Pixels)

		Device-pixel-ratio: 2 */

	/* iPhone 4/4S Resolution

		Screen Width = 320px (CSS Pixels)
		Screen Height = 480px (CSS Pixels)

		Screen Width = 640px (Actual Pixels)
		Screen Height = 960px (Actual Pixels)

		Device-pixel-ratio: 2 */

	/* iPhone 2G/3G/3GS Resolution

		Screen Width = 320px (CSS Pixels)
		Screen Height = 480px (CSS Pixels)

		Screen Width = 320px (Actual Pixels)
		Screen Height = 480px (Actual Pixels)

		Device-pixel-ratio: 1 */


/* iPad Media Queries (All generations - including iPad mini) */

    /* iPads (portrait and landscape) ----------- */
		@media only screen
		and (min-device-width : 768px)
		and (max-device-width : 1024px) {
		/* Styles */
		}
     
    /* iPads (landscape) ----------- */
		@media only screen
		and (min-device-width : 768px)
		and (max-device-width : 1024px)
		and (orientation : landscape) {
		/* Styles */
		}
     
        /* iPads (portrait) ----------- */
		@media only screen
		and (min-device-width : 768px)
		and (max-device-width : 1024px)
		and (orientation : portrait) {
        
		img, video, .scale {
		max-width: 35%;
		width: 35% !important;
		}
        
		}

	/* iPad 3 & 4 Media Queries
	If you're looking to target only 3rd and 4th generation Retina iPads (or tablets with similar resolution) to add @2x graphics, or other features for the tablet's Retina display, use the following media queries. */

	/* Retina iPad in portrait & landscape */
		@media only screen  */
		and (min-device-width : 768px) 
		and (max-device-width : 1024px)
		and (-webkit-min-device-pixel-ratio: 2) { 
		/* Styles */
		}

	/* Retina iPad in landscape */
		@media only screen 
		and (min-device-width : 768px) 
		and (max-device-width : 1024px) 
		and (orientation : landscape)
		and (-webkit-min-device-pixel-ratio: 2) { 
		/* Styles */
		}

	/* Retina iPad in portrait */
		@media only screen 
		and (min-device-width : 768px) 
		and (max-device-width : 1024px) 
		and (orientation : portrait)
		and (-webkit-min-device-pixel-ratio: 2) { 
		/* Styles */
		}

	/* iPad 1 & 2 Media Queries
	If you're looking to supply different graphics or choose different typography for the lower resolution iPad display, the media queries below will work like a charm in your responsive design! */

	/* iPad 1 & 2 in portrait & landscape */
		@media only screen 
		and (min-device-width : 768px) 
		and (max-device-width : 1024px) 
		and (-webkit-min-device-pixel-ratio: 1){ 
		/* Styles */
		}

	/* iPad 1 & 2 in landscape */
		@media only screen 
		and (min-device-width : 768px) 
		and (max-device-width : 1024px) 
		and (orientation : landscape)
		and (-webkit-min-device-pixel-ratio: 1)  { 
		/* Styles */
		}

	/* iPad 1 & 2 in portrait */
	@media only screen 
	and (min-device-width : 768px) 
	and (max-device-width : 1024px) 
	and (orientation : portrait) 
	and (-webkit-min-device-pixel-ratio: 1) { 
	/* Styles */
	}