/*
Theme Name : ScanPlus
Theme URI: http://www.scanplus.de
Description: Theme for the new ScanPlus Website
Version: 1
Author: Andreas Neubert
Author URI: http://www.spoongraphics.co.uk
*/

/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 *
 * Detailed information about this CSS: h5bp.com/css
 *
 * ==|== normalize ==========================================================
 */


/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { font-family: Helvetica, Arial,sans-serif; color: #222; }

body { margin: 0; font-size: 1em; line-height: 1.4; background-color:#efefee;}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate
 * Also: hot pink! (or customize the background color to match your design)
 */



/* =============================================================================
   Links
   ========================================================================== */

a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }


/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

ins { background: #ff9; color: #000; text-decoration: none; }

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
ul { list-style-type: disc;}
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
 */

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; max-width: 100%; }
img[class*="align"],
img[class*="wp-image-"] {
height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
}
img.size-full {
max-width: 97.5%;
width: auto; /* Prevent stretching of full-size images with height and width attributes in IE8 */
}

/*
 * Correct overflow not hidden in IE9
 */

svg:not(:root) { overflow: hidden; }


/* =============================================================================
   Figures
   ========================================================================== */

figure { margin: 0; }


/* =============================================================================
   Forms
   ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/*
 * 1. Correct color not inheriting in IE6/7/8/9
 * 2. Correct alignment displayed oddly in IE6/7
 */

legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 */

button, input { line-height: normal; }

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
 */

button, input[type="button"], input[type="reset"], input[type="submit"] { 
    cursor: pointer; -webkit-appearance: button; 
    *overflow: visible; 
    padding: 7px 12px 7px  12px;
    border: 0px solid;
    background-repeat: no-repeat;
    background-position: 0px 2px;
    background-color: #e20021;
    color: #ffffff;
    font-weight: bold;
}

button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
    background-color: #ff1a3c;    
}

/*
 * Re-set default cursor for disabled elements
 */

button[disabled], input[disabled] { cursor: default; }

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/*
 * Remove inner padding and border in FF3/4: h5bp.com/l
 */

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/*
 * 1. Remove default vertical scrollbar in IE6/7/8/9
 * 2. Allow only vertical resizing
 */

textarea { overflow: auto; vertical-align: top; resize: vertical; }

/* Colors for form validity */
input:valid, textarea:valid {  }


/* =============================================================================
   Tables
   ========================================================================== */

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }


/* ==|== primary styles =====================================================
   Author: Andreas Neubert
   ========================================================================== */

.logo_link a {
    width: inherit;
    height: inherit;
    display: block;
}


#header_container {
	width:100%;
	background-color:#dcdcdc;
}

#header{
	width: 960px;
	height: 379px;
	padding-top: 40px;
	margin: 0px auto;
	position: relative;
}

.social_icon {
	position: absolute;
	width: 50px;
	height: 50px;
	background-color: #ffffff;
	right: -50px;
}


#header #xing_icon {
	top: 168px;
}

#header #twitter_icon {
        top: 112px;
}

#header #linkedin_icon {
        top: 224px;
}


#header_subpage #xing_icon {
        top: 138px;
}

#header_subpage #twitter_icon {
        top: 82px;
}

#header_subpage #linkedin_icon {
        top: 194px;
}


#header_subpage{
	width: 960px;
	height: 259px;
	padding-top: 40px;
	margin: 0px auto;
	position: relative;
}

#scanplus_logo{
	/*background: transparent url('img/logo.png') no-repeat;*/
	width: 95px;
	height: 39px;
	float: left;
}

#header_menu{
	background-color: #ffffff;
	height: 30px;
	width: 198px;
	padding-top: 4px;
	margin-left: 763px;
	margin-top: 9px;
}

ul.menu{
    margin:                                 0;
    padding:                                0;
}

ul.menu li{
	list-style:                             none;
	float:                                  left;
	position:                               relative;
    padding:                                0;	
}

#header_menu a:link,#header_menu a:active,#header_menu  a:visited{
	color: #e20021;
	font-weight: bold;
	font-size: 0.70em;	
	text-decoration: none;
	padding-left: 19px;
}

#header_menu a:hover{
	text-decoration: underline;
}


.bxslider-wrap { 
	visibility: hidden; 
}

ul#slider {
        margin: 0;
        position: relative;
}

.teaser_image_frontpage{
	width: 100%;
	background: url('img/teaser_big.png') no-repeat;
	cursor: pointer;
}

.teaser_image_big {
	width: 100%;
	height: 300px;
	padding-top: 230px;
}

.teaser_image_frontpage_content{
        position: absolute;
        margin-top: 190px;
        width: 100%;
        top: 0;
}

.teaser_image_subpage{
	width: 100%;
	height: 180px;
	padding-top: 110px;
	background: url('../img/teaser_small.png') no-repeat;
}

.red_teaser_heading {
	height: 22px;
	color: #ffffff;
	font-size: 1em;
	font-weight:bold;
	margin: 0px;
	margin-top: 190px;
	padding-top: 4px;
	margin: 0px;
}

/*only background the part where there is text*/
.red_teaser_heading span{
	background-color:#e20021;
	/*This corrects the space that occures in safari between the headings*/
        padding: 6px 6px 7px 6px;	
}

.white_teaser_heading{
	height: 44px;
	font-weight: bold;
	color: #2a2d2d;
	font-size: 1em;
	padding-top: 13px;
}

.white_teaser_heading span{
	background-color: #ffffff;
	padding: 6px 6px 6px 6px;
}

.main_navigation{
	margin: 0px auto;
	background-color: #2a2d2d;
	background-image: url('img/menu_background.png');
	height:30px;
	width: 960px;
	padding-left:5px;
	padding-top: 3px;
}



.main_navigation a:link,.main_navigation a:active,.main_navigation  a:visited{
	color: #ffffff;
	font-weight: bold;
	font-size: 0.80em;	
	text-decoration: none;
	padding-top:4px;
	padding-left: 16px;
	padding-right: 16px;	
	margin-left: 2px;
	margin-right: 2px;
	height:27px;
	display:block;
}

.main_navigation a:hover{
	background-color:#ffffff;	
	color: #000000;
}

/*the active main menu item*/
.current-menu-item a:link,.current-menu-item a:active,.current-menu-item a:visited{
	background-color:#ffffff;
	color:#000000;
}

/*the active main menu item if subpages are selected*/
.current-page-ancestor a:link,.current-page-ancestor a:active,.current-page-ancestor a:visited{
        background-color:#ffffff;
        color:#000000;
}



ul.menu{
    margin:                                 0;
    padding:                                0;
}

ul.menu li{
	list-style:                             none;
	float:                                  left;
	position:                               relative;
    padding:                                0;	
}

#content{
	clear:both;
	width:960px;			/* width of whole page */
	overflow:hidden;		/* This chops off any overhanging divs */
	margin: 0px auto;
	background-color: #ffffff;
	font-family: Helvetica, Arial, sans-serif; 	
	font-size:0.8em;
	line-height: 1.6em;
	color: #191b1b;
	padding: 20px;
	padding-top: 30px;
	padding-bottom: 30px;
}

a:link,  a:visited,  a:active {
	color: #e20021;
	text-decoration: none;
	font-weight: bold;
}

a:hover{
	text-decoration: underline;
}

#content p{
	margin: 0px 0px 20px 0px;
	padding: 0px;
}

#content h1{
	color:#e20021;	
	font-size: 1.5em;
	font-weight:bold;
	font-family: Helvetica, Arial, sans-serif; 	
	margin: 0px 0px 30px 0px;
}

#content h2{
	font-size: 1.5em;
	font-weight:bold;
	font-family: Helvetica, Arial, sans-serif; 	
	margin: 0px 0px 15px 0px;
}

#content h3{
	font-family: Helvetica, Arial, sans-serif; 	
	font-size: 1em;
	line-height: 1.7em;
	font-weight: bold;
	color: #191b1b;	
	margin: 0px 0px 15px 0px;
	padding: 0px;
}



.col_container{
	float:left;
	width: 100%;
	position:relative;
	right:50%;	
}

.col_left{
	float:left;
	position:relative;
	padding:0 0 1em 0;
	overflow:hidden;
	width:450px;			/* left column content width (column width minus left and right padding) */
	left:460px;
	padding-right: 10px;	
}

.col_right{
	float:left;
	position:relative;
	padding:0 0 1em 0;
	overflow:hidden;
	padding-left: 10px;
	width:450px;			/* right column content width (column width minus left and right padding) */
	left:480px;			/* (right column width) plus (left column left and right padding) plus (right column left padding) */
}

/*And the three col layout*/
.three_col_container{
	position: relative;
	float: left;
	width: 960px;
	background-color: #cccccc
}

.col_1{
	position: relative;
	float: left;
	left: 0px;
	width: 165px;
}

.col_2{
	position: relative;
	float: left;
	left: 57px;
	width: 410px;
}

.col_3{
	position: relative;
	float: left;
	left: 82px;
	width: 282px;
}


.col_double{
	position: relative;
	float: left;
	width: 692px;
	left: 57px;
}

#sub_navigation{
	padding: 0px;
	margin: 0px;
}

#sub_navigation li{
	list-style: none;
	border-bottom: 1px dashed #d9dadb;
	font-weight: bold;
	font-size: 1em;	
	text-decoration: none;	
	padding-top: 8px;
	padding-bottom:8px;
	font-family: Helvetica, Arial, sans-serif; 	
	line-height: 1.4em;	
}

#sub_navigation li.first_item{
	padding-top: 0px;
}

#sub_navigation li.last_item{
	border-bottom: 0px solid;
}

#sub_navigation li a:link,#sub_navigation li a:visited{
	color: #000000;
	text-decoration: none;
}

#sub_navigation li a:active,#sub_navigation li a:hover{
	color:#e20021;
}

#sub_navigation li a.active_link{
	color:#e20021;
}

.unternehmen_table {
    width: 400px;
}

.mini_teaser{
	width: 216px;
	height: 235px;
	background-color: #f5f5f5;
	float: left;
	margin-right:18px;
	margin-bottom: 40px;
}

.mini_teaser .mini_teaser_heading{
	display: block;
	padding-left: 15px;
	padding-top: 5px;
	color:#ffffff;	
	font-size: 1em;
	font-family: Helvetica, Arial, sans-serif; 	
	font-weight: bold;
	background-image: url('img/teaser_heading_background.jpg');
	height: 30px;
}

.mini_teaser .mini_teaser_heading a:link,.mini_teaser .mini_teaser_heading a:link,.mini_teaser .mini_teaser_heading a:link{
	color:#ffffff;
	text-decoration: none;
} 

.mini_teaser .mini_teaser_heading a:hover{	
	text-decoration: underline;
}

.products {
    margin-bottom: 20px;
}


.product_closed{
	width: 455px;
	height: 30px;
	background-image: url('img/product_closed_background.png');
	padding-left: 18px;
	padding-top: 5px;
	border-bottom: 2px solid #ffffff;
	color: #000000;
	cursor: pointer;
}

.product_closed:hover{
	background-image: url('img/product_open_background.png');
	color: #ffffff;
}

.product_open{
	width: 455px;
	height: 30px;
	color: #ffffff;
	background-image: url('img/product_open_background.png');
	padding-left: 18px;
	padding-top: 5px;
        cursor: pointer;
}

.product_text{
	width: 455px;
	background-color: #2a2d2d;
	color: #ffffff;
	padding-left: 18px;
	padding-right: 18px;
	padding-top: 10px;	
	padding-bottom: 10px;
	border-bottom: 2px solid #ffffff;	
	font-size: 0.9em;
	font-weight: bold;
	display: none;	
}

.product_link:link,.product_link:active,.product_link:visited{
	height:26px; 
	background-color:#e20021; 
	padding:6px; 
	color:#ffffff; 
	font-weight:bold;	
	text-decoration: none;
}

.product_link:hover{
	text-decoration: underline;

}

.red_block_link:link,.red_block_link:active,.red_block_link:visited{
	padding: 7px 12px 7px  25px;
	background-image: url('img/block_link_background.png');
	background-repeat: no-repeat;
	background-position: 0px 2px;
	background-color: #e20021;
	color: #ffffff;
	font-weight: bold;	
}

.red_block_link:hover{
	text-decoration: underline;
}

/*FORM*/

input[type=text].error {
	border: 1px solid #df2f00;
}

label {
	font-weight: bold;
}

input[type=text],input[type=email] {
        height: 20px;
	font-size: 14px;
	border: 1px solid #3b3b3b;
	padding-left: 3px;
}

label.error {
	cursor: auto;
	padding: 0;
	padding-top: 3px;
	margin: 0;
	color: #df2f00;
	display: block;
	width: 100%;
	font-weight: normal;
}

.news_date{
	float: left;
	width:25%; 
	color:#e20021; 
	font-weight:bold;
	border-top: 1px dashed #d9dadb;		
	padding-top: 30px;	
	padding-bottom: 30px;
}

.news_date_single {
        color:#e20021;
        font-weight:bold;
        margin-bottom: 4px;
}

.news_content{
	float: left;
	width:66%;
	border-top: 1px dashed #d9dadb;		
	padding-top: 30px;	
	padding-bottom: 30px;	
}

.news_content_single{
	width: 80%;
	margin: 0 auto;
}

.news_thumbnail{
	float: left;
	width: 25%;	
	border-top: 1px dashed #d9dadb;	
	padding-top: 30px;
	padding-bottom: 30px;	
	text-align: center;	
}

.news_first_td{
	border-top: 0px solid;
	padding-top: 0px;
}

.to_top {
	width: 22px;
}

/*pagination bei news*/
.nav-previous{
	margin-left: 87px;
        float: left;
}

.nav-next{
        float:right;
	margin-right: 87px;
}

/* Images */
.alignleft {
	display: inline;
        float: left;
}

img.alignleft {
        margin: 1em;
}

.alignright {
	display: inline;
        float: right;
}

img.alignright {
       margin: 1em;
}

.aligncenter {
        display: block;
        margin-left: auto;
        margin-right: auto;
}

/*Keep the images with the right size*/
.wp-caption,.news_content img {
	max-width: 460px !important;
}

.wp-caption.alignleft {
	margin-right: 1.6em;
}

.wp-caption.alignright {
        margin-right: 1.6em;
}


.wp-caption img[class*="wp-image-"] {
	display: block;
	margin: 0;
}

.wp-caption-text {
	color: #707070;
	color: rgba(51, 51, 51, 0.7);
	font-family: "Noto Sans", sans-serif;
	padding: 0.5em 0;
}

.clearer{
        clear: both;
}

#footer{
	width: 960px;
	margin: 0px auto;
	padding: 36px 0px 36px 20px;
	font-size:0.75em;
	line-height: 1.7em;	
	color: #848484;	
	margin-bottom: 40px;
}

th.info_table_header{
	background-image:url('img/table_header.png');
        background-repeat: no-repeat;
	width: 400px;
	height: 30px;
	text-align: left;
	color: #ffffff;
	font-weight: normal;
	padding-left: 10px;
}

td.info_table_label_light_grey{
	color: #828282;
	background-color: #f0f0ef;
	padding-left: 10px;
	padding-right: 10px;	
	height: 40px;
	width: 100px;
	vertical-align:middle;
	border-bottom: 2px solid #ffffff;	
}

td.info_table_content_light_grey{
	color: #000000;
	background-color: #f0f0ef;
	padding-left: 10px;
	padding-right: 10px;		
	height: 40px;
	width: 260px;
	font-weight: bold;
	vertical-align:middle;
        border-bottom: 2px solid #ffffff;
}

td.info_table_label_dark_grey{
        color: #828282;
        background-color: #e8e8e8;
        padding-left: 10px;
        padding-right: 10px;
        height: 40px;
        width: 140px;
        vertical-align:middle;
        border-bottom: 2px solid #ffffff;
}

td.info_table_content_dark_grey{
        color: #000000;
        background-color: #e8e8e8;
        padding-left: 10px;
        padding-right: 10px;
        height: 40px;
        width: 300px;
        font-weight: bold;
        vertical-align:middle;
        border-bottom: 2px solid #ffffff;
}

.frontpage_news_div {
        width: 80%;
}

.frontpage_news_post {
	font-size: 0.9em;
        margin-bottom: 20px;
	line-height: 1.5em;
}

.frontpage_news_date {
	font-size: 0.8em;
	color: #e20021;
}

.frontpage_news_title {
	font-size: 1.1em;
	font-weight: bold;
	margin-bottom: 6px;
}

.frontpage_news_title img{
	vertical-align: baseline;
}

.frontpage_news_title a{
	color: #191b1b;
}

.frontpage_news_title a:hover{
	text-decoration: underline;
}

.frontpage_news_read_more{
	margin-bottom: 20px;
}

.fb-like-box {
    margin-top: 54px;
}

.footer_part{
	float: left;
	width: 233px;
}

.footer_part a:link, .footer_part a:visited, .footer_part a:active{
	color: #848484;
	font-weight: normal;
}

.footer_part a:hover{
	color: #848484;
	text-decoration: underline;
	font-weight: normal;
}

.footer_logo_grey {
	margin-top:13px; 
	padding-bottom:5px;
	width: 84px;
}

.box {
    width: 400px;
}

.box-header {
    background-image: url('img/table_header.png');
    background-repeat: no-repeat;
    height: 30px;
    color: #ffffff;
    padding-left: 8px;
    padding-top: 6px;
}

#content .box-header h2 {
    margin-bottom: 0;
    font-size: 1em;
}

.box-content div.image-row{
    border: 1px solid #e8e8e8;
}

.box-row {
   background-color: #d8d8d8;
   padding: 8px;
}

.box-row-no-padding {
    padding: 0;
}

.box-row-light {
    background-color: #fafafa;
}


/**********************************************
* Contact Form & Managed Microsoft SQL Server *
***********************************************/
#contact-form input[type=text], input[type=email] {
    height: 40px;
    width: 50%;
}

#contact-form #captcha-input {
    width: 25%;
}

#contact-form textarea {
    width: 50%;
    border: 1px solid #3b3b3b;
}

#contact-form input[type=radio] {
    margin-right: 4px;
    vertical-align: middle;
}

/******************
    * Anpassungen Karriereseite SP DEC 2016
    ******************/
.quiz-link{
display:block;
width:149px;
height:71px;
background-image:url('img/it_quiz_link.png');
margin-left:-7px;
padding:0;
}
.quiz-link:hover{
background-image:url('img/it_quiz_link_hover.png');
}


.teaser_rechts{
margin-right:20px;
background-color:#3b3b3b;
padding:0px;
}
.teaser_rechts img{
padding-bottom:-10;
margin:0;
}

.teaser_rechts .schrift1{
display:block;
color: #ffffff;
font-weight: bold;
font-size:1.3em;
padding: 7px 0px 3px 13px;


}
.teaser_rechts .azubi-teaser{
border-top:1px solid #ffffff;
background-color: #efefee;
border-bottom:12px solid #c1c1bd;
padding: 7px 0px 3px 13px;
}

.azubi-teaser a{
font-size:1.6em;
}

.azubi-teaser a:hover{
text-decoration:none;
}

.azubi_bild{border-top:1px solid #ffffff;}

#content h3.headline_bigger{font-size:1.3em;}
ul.list_bigger{font-weight:600;list-style-image:url(img/plus.png);}

#weihnachtsgruss{
background-image:url('img/weihnachtskarte.jpg');
width:800px;
height:910px;
}
#weihnachtsgruss div{
	text-align:center;
	margin:0px auto;
	padding-top:300px;
	font-size:1.4em;
	
}


/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }



/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}


.mobile_navigation {
    display: none;
}


@media screen and (max-width: 560px) {    
    
    /********************
     * Menu
     ********************/
    .main_navigation {
        display: none;
    }    
    .mobile_navigation {
        display: block;        
    }
    .mobile_navigation a:link, 
    .mobile_navigation a:active, 
    .mobile_navigation a:visited {
	    color: #000;
	    font-weight: bold;
	    font-size: 1.1em;	
	    text-decoration: none;
	    padding-top: 7px;
	    padding-bottom: 7px;
	    padding-left: 15px;	    
	    display:block;
    }
    .mobile_navigation a:active {
        color: #fff;
        background-color: #e20021;
    }

    .menu-hauptmenue-container {
        
    }
    ul.menu {
        padding-bottom: 10px;
    }
    ul.menu li {
        display: block;
        float:none;    
        padding: 0 20px;
    }
    
    .burger-div {
        width: 100%;
        text-align:right;
        padding: 15px 15px 15px 20px;
	cursor: pointer;
    }    
    .burger-image {
        width: 30px;
    }
    .burger-content {
        display:none;
    }
    .burger-text {
        font-size: 1.1em;
        padding-right: 5px;
        font-weight: normal;
    }

    /********************
     * Sub-Menu
     ********************/
    #sub_navigation li {
        font-size: 1.2em;
    }


    /********************
     * Header
     ********************/
    #header_container {
        width: 100%;
    }
    #header {
	width: 100% !important;
	height: auto;
        padding-top: 20px;
    }
    
    #header_subpage{
       width: 100% !important;
	height: auto;
        padding-top: 20px;
    }
    
    #header_menu {
	float: right;
	margin-left: 0;
        width: 163px;
    }
    #header_menu a:link {
        padding-left: 10px;
    }
    #scanplus_logo {
        margin-left: 5px;
    }

    /*TODO: Show somewhere else*/
    .social_icon {
	display: none;
    }

    /********************
     * Slider
     ********************/    
    .bx-wrapper {
        margin-bottom: 0 !important;
    }

    .bx-pager {
        display: none;
    }

    .teaser_image_frontpage_content {
	display: none;
    }


    /********************
     * Content
     ********************/
    #content {
        width: 100%;
        padding: 15px 15px 0 15px;
        margin: 0;
    }

    #content iframe {
        margin: 0 5px;
    }

    /*#content table, #content table tr,
    #content table tr td,
    #content table tr td h2,
    #content table tr td p  {
        width: 100%;
    }*/


    .news_content{
        width:100%;
        padding-left: 3%;        
        padding-right: 3%;
	float: none;
	border-top: 0;
	padding-top: 0;
    }

    .news_content img {
        max-width: 100% !important;
        max-height: auto !important;
        height: auto !important;
    }

    .news_date{
        padding-left: 10px;
	float: none;
	width: 100%;
	padding-bottom: 10px;
    }

    .nav-previous {
        margin-left: 40px;
    }
    .nav-next {
        margin-left: 0px;
    }

    .col_left {
        float:none;
        width: 100%;
        left: 50%;
        padding: 0 15px 1em 0px;
    }

    .col_right {
        float:none;
        width: 100%;
        padding: 0 0 1em 0;
        left: 50%;
    }

    .col_1 {
        float:none;
        padding: 10px;
    }

    .col_2 {
        float:none;
        width: 100%;
        left: 0;
        padding: 30px 10px;
    }

    .col_3 {
        float:none;
        width: 100%;
        left: 0;
        padding: 30px 10px;
	margin-left: 0 !important;
    }

    .col_3 .zertifikate:after {
        content:'';
        display:block;
        clear: both;
    }
    .col_3 .zertifikate p {
        width: 50%;
        height: auto;
        float: left;
        display:block;
    }
    .col_3 .zertifikate p img {
        max-width: 90%;
        display:block;
        margin: 0 auto;
    }
    
    
    /* frontpage */
    #mini_teaser_container {
        width: 100%; /* wide enough to break after square no. 2 */
    }
    .mini_teaser {
        width: 100%;
        height: 100%;
        margin-top: 40px;
        margin-bottom: 0;
    }
    .mini_teaser img {
        width: 100%;
    }
    .mini_teaser .mini_teaser_heading {
        background-color: #333;
        background-image: none;
    }

    /********************
     * Accordion/Products
     ********************/
    .product_header {
        
    }
    .product_closed {
        width: 100% !important;
	    height: 40px;
	    background-image: none;
        background-color: #ddd;
	    padding-left: 5px;
	    padding-right: 5px;
	    padding-top: 5px;
    }
    .product_closed:hover {
        background-image: none;
        background-color: #222;
    }
    .product_open {
        width: 100% !important;
	    height: 40px;
	    background-image: none;
        background-color: #222;
	    padding-left: 5px;
	    padding-right: 5px;
	    padding-top: 5px;
    }
    .product_text {
	    width: 100%;
	    padding-left: 8px;
	    padding-right: 18px;
	    padding-top: 10px;	
	    padding-bottom: 10px;
    }


    /********************
     * Specials
     ********************/
    .unternehmen_table {
        width: 100% !important;
    }

    th.info_table_header {
	width: 100% !important;
	background-repeat: repeat-x;
    }

    .cloud_table {
        width: 100% !important;
    }

    #telekomag, #emc, #cisco  {
        margin-bottom: 50px;
    }
    #telekomag a img, #emc a img, #cisco a img {
        width: 150px !important;
        height: auto !important;
    }

    .with_frm_style .frm_form_fields input, #wpcontent .with_frm_style .frm_form_fields select, .with_frm_style .frm_form_fields select, .with_frm_style .frm_form_fields textarea {
        width: 100% !important;
    }

    /********************
     * Footer
     ********************/
    #footer {
        margin: 0;
        width: 100%;
        font-size: 0.8em;        
    }
    .footer_part {
        margin-bottom: 10px;
	width: 50%;
	height: 66px;
	padding-left: 10px;
    }

    /******************
    * Contact Form
    ******************/
    #contact-form input[type=text], input[type=email], #contact-form #captcha-input {
        width: 80%;
    }

    #contact-form textarea {
        width: 80%;
    }
	
#weihnachtsgruss{
	background-image:url('img/weihnachtskarte_mobile.jpg');
	background-color:#96000b;
	width:100%;
	height:auto;
	background-position:center top; 
	margin-bottom:3px;
} 
#weihnachtsgruss div{
	text-align:center;
	margin:0px auto;
	padding:160px 5px 100px 5px;
	font-size:1.4em;
	
}
#weihnachtsgruss div font{
	display:none;
	
}
	
	
}