/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #333;
}



body {
    font-size:100%;
    background:#fff;
    line-height: 1.4;
}


::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}


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

img {
    vertical-align: middle;
}

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

textarea {
    resize: vertical;
}

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




/* ==========================================================================
   Author's custom styles
   ========================================================================== */

 /*!
 * Gridpak Beta CSS
 *
 * Generator - http://gridpak.com/
 * Created by @erskinedesign
 */

.container {
     margin: 0 auto;
     max-width:78.3em;
     min-width:76.7em;
     padding-left:15px;
     padding-right:15px;
     position:relative;
     /* overflow:hidden; */ /* stattdessen Clearing Methode von Skeleton! */
}


.col {
    border:0px solid rgba(0,0,0,0);
    float:left;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -moz-background-clip:padding-box !important;
    -webkit-background-clip:padding-box !important;
    background-clip:padding-box !important;
       
    min-height: 1px; /* added by xtine: otherwise width is ignored, when col is empty */
}



/* #Clearing (von Skeleton: http://www.getskeleton.com/)
================================================== */
     /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }


 /*---- Dateilinks -----*/
 UL.csc-uploads SPAN.csc-uploads-fileName {
	text-decoration:none; 
 }

 ul.csc-uploads-1 .csc-uploads-description {
	padding-left:2.1em; 
	color:#666;
 }
 ul.csc-uploads-1 .csc-uploads-fileSize {
	padding-left:2.1em; 
	font-size: 95%;
	font-style: italic;
 }
 
 UL.csc-uploads IMG {
    padding-right: 0.7em;
}


 /* --- Icons im Text ---*/
 a.pdf IMG,  a.xls IMG,  a.doc IMG,  a.zip IMG, a.download IMG, a.mail IMG {
 	padding-right:5px;
 	/* vertical-align: baseline; */
 	vertical-align: text-bottom;
 	width:15px;
 	height:15px;
 }

a.mail IMG {
 	width:16px;
 	height:12px;
 	padding-top:0.15em;
 	vertical-align: top;
}


@media screen and (min-width: 0px) {
        
        .col {
            margin-left:2.1%;
            padding:0 0px;
        }
               
        .row .col:first-child {
            margin-left:0;
        }

        .span_1 {
            width:4.28125%;
        }
        .span_2 {
            width:10.6625%;
        }
        .span_3, #intromenu, #languagemenu {
            width:17.04375%;
        }
        .span_4, #leftmenu, .startLeftCol, .startRightCol, #headerright {
            width:23.425%;
        }
        .span_5  {
            width:29.80625%;            
        }
        .span_6 {
            width:36.1875%;
        }
        .span_7 {
            width:42.56875%;
        }
        .span_8, .half, .startNormalCol {
            width:48.95%;
        }
        .span_9 {
            width:55.33125%;
        }
        .span_10 {
            width:61.7125%;
        }
        .span_11 {
            width:68.09375%;
        }
        .span_12, #maincontent, #headerleft {
            width:74.475%;
        }
        .span_13, #topright {
            width:80.85625%;
        }
        .span_14 {
            width:87.2375%;
        }
        .span_15 {
            width:93.61875%;
        }
        .span_16, .full, #pagetitle {
            margin-left:0;
            width:100%;
        }
        
        /* inner cols */
        #colnormal {
            width:65.7142%;	
        }
        
        #colnormal.wide {
            width:100%;	
        }
        
        #colright {
            width:31.4285%;	
        }
        
        #colright.col {
            margin-left:2.857%;
        }
        
}

   @media only screen and (max-width: 768px) {
	#headerleft {
    		width: 57%; 
	}
	#headerright {
    		width: 40.5%; 
	} 
   }
   
   @media only screen and (max-width: 600px) {
	.half, #headerright, #headerleft {
    		width: 100%; 
    		float:left;
    		margin-bottom:1em;
	}
        .startNormalCol, .startRightCol, #info {
    		width: 47%;
    		margin-top:2em;
	}
	#intromenu, .startLeftCol {
    		width: 48.5%;
	}
	
	/* inner cols */
        #colnormal {
            width:100%;
	
        }
        #colright {
                width:100%;
                margin-left:0;

        }
        #colright.col {
            margin-left:0;
        }
        
    }

    @media only screen and (max-width: 568px) {
        .startNormalCol, .startRightCol, #info {
    		margin-top:0;
	}
    }

    @media only screen and (max-width: 480px) {
	.half, #headerright, #headerleft {
    		width: 100%; 
    		float:left;
    		margin-bottom:1em;
	}
    }

    @media only screen and (max-width: 320px) {
	.span_1, .span_2, .span_3, .span_4, .span_5, .span_6, .span_7, .span_8, .span_9, .span_10, .span_11, .span_12, .span_13, .span_14, .span_15, .span_16, 
	#intromenu, .startLeftCol, .startNormalCol, .startRightCol, #leftmenu, #info, .half, #headerright, #headerleft, #maincontent, #colnormal, #colright {
    		width: 100%; 
    		float:left;
    		margin-bottom:1em;
	}
	#colright.col {
            margin-left:0;
        }
    }


/* ==========================================================================
   Media Queries
   ========================================================================== */

   @media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

   }

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}



/* ==========================================================================
   Print styles
   ========================================================================== */
   
@media print {

	#topbar,
	#headerright,
	#printer,
	.csc-linkToTop,
	#footermenu {
		display:none;
	}
	#pageheader {
    		padding-top:0;
	}
	.container {
		min-width:0;
		width:100%;		
		padding:0;
	}
	#topnavigation,
	#pagetitle {
		width:100%;
	}
	#headerimage {
    		background-color: #fff !important;
    	}
	.startLeftCol, 
	.startRightCol,
	#leftmenu {
		width:24%;
	}
	.startNormalCol {
    		width:46%;
    		margin: 0 2.1%;
	}
	#maincontent {
		width:73%;
		margin-left: 2.1%;
	}

	#maincontent #colnormal {
		width:70%;
	}
	
	#maincontent #colnormal.wide  { 
		width:100% !important;
	}
	
	.singleView .team_photo,
	.singleView .team_entries {
		width:100% !important;
		clear:both !important;
		margin: 1em 0 !important;
	}
	.team_entries .team_description_large {
    		width:100% !important;
    		clear:both !important;
	}
	
	#maincontent #colright {
		width:24%;
		margin-left:2.1%;
	}
	.multicolumnContainer .column {
		width:100%;
	}
}