/*
Theme Name: Minium by rundum.digital
Description: Responsive WordPress-Theme.
Author: Jing Zhou | www.rundum.digital
Author URI: http://www.rundum.digital
Version: 0.96 // Januar 2018
*/


/* -------------------------------------------------------------------------------------- */
/* CSS STYLE TABLE OF CONTENT */
/* -------------------------------------------------------------------------------------- */
/* 
- 1.0 Basic Styles/General Structure
- 2.0 Headings
- 3.0 Links
- 4.0 Lists
- 5.0 Header
- 6.0 Navigation
--- 6.1 Parent Navigation Elements
--- 6.2 Child Navigation Elements
- 7.0 Main Content
--- 7.1.0 Pages
----- 7.1.1 Front-Page
----- 7.1.2 404 Error Page
----- 7.1.3 Search Result Page
----- 7.1.4 Contact Page
--- 7.2.0 Posts
----- 7.2.1 Categories/Archives
----- 7.2.2 Single Posts
----- 7.2.3 Comments
--- 7.3.0 Custom Post Types (CPT)
----- 7.3.1 CPT/Taxonomy Archive
----- 7.3.2 Single Custom Post Type
- 8.0 Sidebar
- 9.0 Footer
- 10.0 Misc
*/


/* -------------------------------------------------------------------------------------- */
/* 1.0 Basic Styles/General Structure
/* -------------------------------------------------------------------------------------- */

html, body {
    height:100%;
}

body {
font-size: 10px;
font-size: 1.0rem;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* ===== Wrapper ===== */

#pagewrapper {

}

#headerwrapper {
height: 100vh;
position: fixed;
}

#header-image-wrapper {

}

#containerwrapper {
min-height: 100vh;
}

#mobile-bar.affix {
      top: 0;
      width: 100%;
      z-index: 9999 !important;
  }

#mobile-bar.affix + .container-fluid {
      padding-top: 70px;
  }


/* 
.right-column.affix {
	left: 50%;
	position: absolute;
} */

/* ===== Image Alignment ===== */


/* -------------------------------------------------------------------------------------- */
/* 2.0 Headings
/* -------------------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
text-transform: uppercase;
}

.bbottom {
border-bottom-width: 2px;
border-bottom-style: solid;
padding-bottom: 2px;
	}

.ph2 h2, .ph1 h1 {
	font-size: 24px;
	font-size: 2.4rem;
}

.ph3 h3 {
	font-size: 12px;
	font-size: 1.2rem;
}


/* -------------------------------------------------------------------------------------- */
/* 3.0 Links
/* -------------------------------------------------------------------------------------- */

a:hover, a:focus, a:active {
	text-decoration: none;
}

/* -------------------------------------------------------------------------------------- */
/* 4.0 Lists
/* -------------------------------------------------------------------------------------- */

ul li {
	list-style-type: square;
}



/* -------------------------------------------------------------------------------------- */
/* 5.0 Header
/* -------------------------------------------------------------------------------------- */

#more-top {
	position: fixed;
	top:0;
	width: 100%;
	z-index: 9;
}

#more-top span {
	padding: 6px 10px;
	background: #000;
	color: #fff;
	display: inline-block;
}


#logo-row {
	position: relative;
	top: 35%;
	text-align: center;
}

#logo-row img {
	display: inline-block;
}


/*
div.shadow::after {
box-shadow: inset 0 -5px 0 rgba(0,0,0,0.15);
    -moz-box-shadow: inset 0 -5px 0 rgba(0,0,0,0.15);
    -webkit-box-shadow: inset 0 -5px 0 rgba(0,0,0,0.15);
}

div.shadow::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 15px;
    height: 5px;
    z-index: 2;
    pointer-events: none;
    } */

/* -------------------------------------------------------------------------------------- */
/* 6.0 Navigation
/* -------------------------------------------------------------------------------------- */

#desktop-nav {
margin-top: 25px;
}

#desktop-nav nav {
	border-radius: 0;
	min-height: auto;
	margin-bottom: 0;
	border: 0;
}

#desktop-nav-bar #main-menu {
	text-align: center;
	
}



/* -------------------------------------------------------------------------------------- */
/* 6.1 Parent Navigation Elements
/* -------------------------------------------------------------------------------------- */

ul.rd-nav {
	margin-right: 0;
	float: none;
	display: inline-block;
}

ul.rd-nav li {
	list-style-type: none;
}

ul.rd-nav li a {
	border-radius: 0;
	text-transform: uppercase;
	font-size: 14px;
	font-size: 1.4rem;
}

ul.rd-nav-desktop li a:after {
	content: '';
	display: block;
	margin: auto;
	height: 3px;
	width: 0px;
	background: transparent;
	transition: width .5s ease, transparent .5s ease;
}
ul.rd-nav-desktop li a:hover:after {
	width: 100%;
}

/*
ul.rd-nav li a::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #000;
    transition: width .3s;
}

ul.rd-nav li a:hover::after {
    width: 100%;
    transition: width .3s;
} */


ul.rd-nav li a:hover, ul.rd-nav li a:active, ul.rd-nav li a:focus {
	background: transparent;
  /* color: #000; */
}

ul.rd-nav li.current-menu-item, ul.rd-nav li.current_page_item, ul.rd-nav li.current-page-ancestor, ul.rd-nav li.current-menu-ancestor, ul.rd-nav li.current-menu-parent, ul.rd-nav li.current-page-parent, ul.rd-nav li.current_page_parent, ul.rd-nav li.current_page_ancestor {
border: none;
} 

ul.rd-nav li.current-menu-item a, ul.rd-nav li.current_page_item a, ul.rd-nav li.current-page-ancestor a, ul.rd-nav li.current-menu-ancestor a, ul.rd-nav li.current-menu-parent a, ul.rd-nav li.current-page-parent a, ul.rd-nav li.current_page_parent a, ul.rd-nav li.current_page_ancestor a { 
background: transparent;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 1);
}

ul.rd-nav li.current-menu-item a:hover, ul.rd-nav li.current_page_item a:hover, ul.rd-nav li.current-page-ancestor a:hover, ul.rd-nav li.current-menu-ancestor a:hover, ul.rd-nav li.current-menu-parent a:hover, ul.rd-nav li.current-page-parent a:hover, ul.rd-nav li.current_page_parent a:hover, ul.rd-nav li.current_page_ancestor a:hover { 
background: transparent;
}

ul.rd-nav ul.sub-menu {
/* display: none;
	background: #fff;
	border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
	border: 0;
  margin-top: 0;
  left: 0;        */
    opacity: 0;
    position: absolute;
    top: 0px;
    visibility: hidden;
	left: 0;
    z-index: 1;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
            display: block;
             border: 0;
 border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
}



ul.rd-nav li.menu-item-has-children:hover ul.sub-menu {
 /* display: block;
 visibility: visible;


  opacity: 1;
  z-index: 1;    */

   opacity: 1;
    top: 38px;
    visibility: visible;
}

ul.rd-nav ul.sub-menu li {

}

ul.rd-nav ul.sub-menu li:last-child {

}

ul.rd-nav ul.sub-menu li a {
  color: #000;
  padding: 3px 15px;
}

ul.rd-nav ul.sub-menu li a.active, ul.rd-nav ul.sub-menu li a:hover  {
    
}


/* ===== Mobile Navigation ===== */

#logo-mobile {
	padding-top: 5px;
	padding-bottom: 5px;
}

.navbar-toggle {
	border: 1px solid #fff;
	border-radius: 0;
	margin: 0;
	margin-top: 8px;
	float: none;
}

.mobile-dropdown {
	position: relative;
	clear: both;
	float: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}


/*
#mobile-nav nav {
	background: #fff;
	border: 0;
	margin-bottom: 0;
}

#mobile-nav nav button.navbar-toggle {
	border: 0;
	margin-right: 0;
	float: left;
	position: absolute;
	top: 20px;
	left: 0;
}

#mobile-nav nav button.navbar-toggle:hover, #mobile-nav nav button.navbar-toggle:active, #mobile-nav nav button.navbar-toggle:focus {
	border: 0;
	background: transparent;
	margin-right: 0;
}

#mobile-nav nav button.navbar-toggle .icon-bar {
	background: #000;
}

#mobile-nav-box {
margin-top: 0px;
}

#mobile-menu {
	border: 0;
	box-shadow: none;
	padding-left:0;
	padding-right: 0;
	font-size: 1.3rem;
	font-size: 13px;
}

#mobile-nav-box #mobile-menu ul.parent li {
	margin: 0;
}


#mobile-nav-box #mobile-menu ul.parent > li > a {
	color: #000;
	border-radius: 0;
	text-align: left;
	margin: 0;
}

#mobile-nav-box #mobile-menu ul.parent > li > a:hover, #mobile-nav-box #mobile-menu ul.parent > li.current_page_paren > a, #mobile-nav-box #mobile-menu ul.parent > li.current_page_item > a, #mobile-nav-box #mobile-menu ul.parent > li.active > a, #mobile-nav-box #mobile-menu ul.parent > li > a:active, #mobile-nav-box #mobile-menu ul.parent > li > a:focus {
	border-radius: 0;
	background: #000;
	color: #fff;
}

 #mobile-menu .dropdown-menu {
position: relative;
width: 100%;
border: 0;
border-radius: 0;
margin: 0;
bottom:0;
float: none;
padding: 0;
}
#mobile-menu .dropdown-menu li {
	padding: 0;
}

#mobile-menu .dropdown-menu li a {	
	font-size: 1.3rem;
	font-size: 13px;
	padding: 10px 30px;
}

#mobile-menu .dropdown-menu li a:hover, #mobile-menu .dropdown-menu li a:active, #mobile-menu .dropdown-menu li a:focus {
	background: #fff;
}
*/

/* -------------------------------------------------------------------------------------- */
/* 6.2 Child Navigation Elements
/* -------------------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------------------- */
/* 7.0 Main Content
/* -------------------------------------------------------------------------------------- */


main#content {
	
}

main#content img {

}

/* Wordpress img-align */

img.alignleft, .wp-caption.alignleft {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}

img.aligncenter, .wp-caption.aligncenter  {
	display: block;
	margin: 0 auto;
	margin-bottom: 10px;
}

img.alignright, .wp-caption.alignright {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}

.wp-caption p {
	margin-bottom: 0;
}




.slider-image {
	position: relative;
}

.shadowblur {
text-shadow: 0px 2px 5px rgba(0, 0, 0, 1);
}


.slider-image.opt-2{
	outline: 0px;	
}

.carousel-arrows .carousel-nav {
position: absolute;
background: transparent;
top: 15px;
right: 15px;
}

.carousel-arrows .arrow {
  padding: 4px 8px;
  margin-left: 0px;
  margin-right: 0px;
  background: #fff;
}

.carousel-arrows .arrow:hover {
  padding: 4px 8px;
  margin-left: 0px;
  margin-right: 0px;
  color: #fff;
}

blockquote {
	font-style: italic;
	margin-top: 25px;
	margin-bottom: 25px;
}



/* -------------------------------------------------------------------------------------- */
/* 7.1.0 Pages
/* -------------------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------------------- */
/* 7.1.1 Front-Page
/* -------------------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------------------- */
/* 7.1.3 Search Result Page
/* -------------------------------------------------------------------------------------- */


.search-result-post-type .dashicons {
	vertical-align: bottom;
}

.no-results {
	font-size: 50px;
	font-size: 5.0rem;
}

/* -------------------------------------------------------------------------------------- */
/* 7.1.4 Contact Page
/* -------------------------------------------------------------------------------------- */


/* ===== Google Map ===== */

.gmap {
	height: 381px;
}

.gmap iframe {
	width: 100%;
	height: 381px;
}


/* ===== Social Icons ===== */


#social-icons-group i.fa {
	-o-transition:.3s;
	-ms-transition:.3s;
	-moz-transition:.3s;
	-webkit-transition:.3s;
	/* ...and now for the proper property */
	transition:.3s;
	padding: 10px;
}

#social-icons-group i.fa:hover {
	-o-transition:.3s;
	-ms-transition:.3s;
	-moz-transition:.3s;
	-webkit-transition:.3s;
	/* ...and now for the proper property */
	transition:.3s;
}


#social-icons-group ul {
	margin: 0;
	padding: 0;
}

#social-icons-group ul li {
	display: inline-block;
	text-align: left;
}

#social-icons-group ul li:before {
	content: '';
}
/*
#social-icons-group ul li#facebook-icon a {
	color: #3b5a9a;
}

#social-icons-group ul li#facebook-icon a:hover {
	color: #324b80;
}

#social-icons-group ul li#google-icon a  {
	color: #df4b38;
}

#social-icons-group ul li#google-icon a:hover  {
	color: #b53e2b;
}

#social-icons-group ul li#twitter-icon a {
	color: #29a9e1;	
}

#social-icons-group ul li#twitter-icon a:hover {
	color: #288bb7;	
}

#social-icons-group ul li#linkein-icon a {
	color: #117bb8;	
}
#social-icons-group ul li#linkein-icon a:hover {
	color: #116698;	
}

#social-icons-group ul li#youtube-icon a {
	color: #cb312e;	
}
#social-icons-group ul li#youtube-icon a:hover {
	color: #a32a22;	
}

#social-icons-group ul li#vimeo-icon a {
	color: #1eb8eb;	
}
#social-icons-group ul li#vimeo-icon a:hover {
	color: #1a96bf;	
}

#social-icons-group ul li#xing-icon a {
	color: #00605e;	
}
#social-icons-group ul li#xing-icon a:hover {
	color: #004745;	
}

#social-icons-group ul li#tumblr-icon a {
	color: #2f4f6e;	
}
#social-icons-group ul li#tumblr-icon a:hover {
	color: #233c51;	
}

#social-icons-group ul li#pinterest-icon a {
	color: #cd2129;	
}
#social-icons-group ul li#pinterest-icon a:hover {
	color: #a61d1d;	
}

#social-icons-group ul li#flickr-icon a {
	color: #ed1384;	
}

#social-icons-group ul li#flickr-icon a:hover {
	color: #bb1c6c;	
}

#social-icons-group ul li#instagram-icon a {
	color: #5280a5;	
}
#social-icons-group ul li#instagram-icon a:hover {
	color: #446885;	
}
*/

/*
#social-icons-group ul li a {
	color: #616161!important;
}
#social-icons-group ul li a:hover {
	color: #fff!important;
}
*/

/* ===== Contactform 7 ===== */

.wpcf7 form, .wpcf7 form input, .wpcf7 form textarea, .wpcf7 form select {
width: 100%;

}

.wpcf7 form input, .wpcf7 form textarea, .wpcf7 form select  {
font-weight: 400;
border: 0px solid rgba(0,0,0,0.8);
border-bottom-width: 1px;
border-bottom-style: solid;
margin-bottom: 30px;
margin-top: 5px;
padding: 2px;
}
::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
}

:-ms-input-placeholder {  
   color: #fff;  
}

.wpcf7-not-valid {
border: 0px solid #f00!important;
}

.wpcf7 form input.wpcf7-submit {
padding: 5px 30px;
    color: #fff;
	border: 0px;
    border-radius: 0px;
	margin: 5px 0;
	width: auto;
	float: right;	
	 -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  transition:.5s;
}

.wpcf7 form input.wpcf7-submit:hover {
    
}

.wpcf7 form h4 {
margin-top: 20px;
margin-bottom: 20px;
color: #337ab7;
}

.wpcf7 form p {
margin-bottom: 0;
}

.wpcf7 form .col-md-4 p, .wpcf7 form .col-md-8 p {
margin-bottom: 10px;
}

img.ajax-loader {
width: auto;
}

span.required {
color: rgba(255,178,184,1);
}

.wpcf7 label {
	width: 100%;
}
/* -------------------------------------------------------------------------------------- */
/* 7.2.0 Posts
/* -------------------------------------------------------------------------------------- */

/* ===== BLOG LAYOUT 1 (IMG ONLY WITH TITLE) =====*/

.bloglayout-1 article {
	margin-bottom: 30px;
}
.bloglayout-1 a.absolute-cover {
	display: block;
	width: 100%;
	height: 100%;
	
}

.header-title-absolute {
	position: absolute;
	top: 0;
	width: 100%;
	top: 35%;
}

.bloglayout-1 .slider-image img {
	filter:brightness(100%);
	transition: 0.5s;
}

.bloglayout-1 .slider-image:hover img {
	filter:brightness(50%);
	transition: 0.5s;
}

.header-title-absolute h2 a {
	color: #fff;
}


/* ===== BLOG LAYOUT 2 (WITH META) =====*/



.post-liste {
margin-bottom: 30px;
}

.btn-collapse-meta i {
	width: 15px;
	height: 19px;
	display: inline-block;
}

.btn-collapse-meta i.meta-list-opened {
	position: relative;
	top: 0px;
	left: 1px;
}

.meta-data-collapse .well {
	background: transparent;
	border-radius: 0;
	font-size: 12px;
	font-size: 1.2rem;
	border-color: #9E9E9E;
}

.close-collapse {
position: relative;
    right: -25px;
    top: -15px;
}

ul.meta-list {
	padding-left: 0;
	margin: 0;
}

ul.meta-list li {
	list-style-type: none;
}

.post-meta i {
	margin-right: 15px;
}





.direction-down span em:before, .direction-down span em:after {
	content: "";
    position: absolute;
    top: 55%;
    width: 9999px;
    height: 1px;
    background: #9E9E9E;
}

.direction-down {
	overflow: hidden;
	margin-top: 50px;
	margin-bottom: 50px;
}
.direction-down span em:before {
	right: 100%;
    margin-right: 35px;
}

.direction-down span {
	position: relative;
    display: inline-block;
}


.direction-down span em {
	display: inline-block;
	border: 1px solid #9E9E9E;
	padding: 6px 10px;
	font-style: normal;
}

.direction-down span em:after {
	left: 100%;
    margin-left: 35px;
}

#pagination-navigation {
	padding-left: 15px;
	padding-right: 15px;
}
	
#pagination-navigation ul {
	margin:0;
}
#pagination-navigation ul li a {
	border-top: 0px solid #212121;
	border-right: 0px;
	border-bottom: 1px solid #9E9E9E;
	border-left: 0px;
	border-radius: 0;
	padding: 7px 14px;
	background: transparent;
	color: #9E9E9E;
}

#pagination-navigation ul li a:hover {	
	border-top: 0px solid #212121;
	border-right: 0px;
	border-left: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-radius: 0;	
}

#pagination-navigation ul li.active a {	
	border-width: 1px;
	border-style: solid;
	border-top-width: 1px;
	border-top-style: solid;
	border-bottom: 0;
	border-radius: 0;	

}


/* -------------------------------------------------------------------------------------- */
/* 7.2.1 Categories/Archives
/* -------------------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------------------- */
/* 7.2.2 Single Post
/* -------------------------------------------------------------------------------------- */

#prev_next_navigation {
	margin-bottom: 50px;
}

/* -------------------------------------------------------------------------------------- */
/* 7.2.3 Comments
/* -------------------------------------------------------------------------------------- */


#content-form input, #content-form textarea {
	background: transparent;
	border-radius: 0;
	border: 0;
border-bottom-width: 1px;
border-bottom-style: solid;
box-shadow: none;
}

.media-heading {
	font-weight: bold;
}

#commentslist li {
	border-radius: 0;	
}

#commentslist ul.children li {
	border: 0;
	padding: 15px 0 0 0;
	margin-bottom: 0;
}

textarea#comment {
	width: 100%;	
}

.rd-btn-submit {
	border-radius: 0;
	box-shadow: none;
	border: 0;
}

/* -------------------------------------------------------------------------------------- */
/* 7.3.0 Custom Post Types
/* -------------------------------------------------------------------------------------- */


p.read-more {
margin-top: 25px;
}

.rd-btn, .rd-btn:visited {
border-radius: 0;
 -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  transition:.5s;
  white-space: normal;
  border-width: 1px;
  border-style: solid;
}

.rd-btn:hover {
color: #fff;
border-radius: 0;
  border: 1px solid #fff;
}

/* -------------------------------------------------------------------------------------- */
/* 7.3.1 Custom Post Types ARCHIVE
/* -------------------------------------------------------------------------------------- */



/* -------------------------------------------------------------------------------------- */
/*  7.3.2 Single Custom Post Type
/* -------------------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------------------- */
/* 8.0 Sidebar
/* -------------------------------------------------------------------------------------- */

#sidebar {

}


/* TOP BAR MINILINKS / SIDEBAR WIDGET AREA */

#topbar-row {
	position: fixed;
    width: 100%;
    z-index: 9;
}

#topbar-mini-links {
	position: fixed;
	width: 100%;
}

#topbar-mini-links .mini-link {
	color: #fff;
	padding: 10px 12px;
	position:relative;
	top: 8px;
	z-index: 10;
	cursor: pointer;
	font-size: 15px;
	font-size: 1.5rem;
}

#topbar-mini-links .mini-link-search {
	background: #3498db;
}

#topbar-mini-links .mini-link-search:hover {
	background: #2980b9;
}

#topbar-mini-links .mini-link-info:hover {
	background: #000;
}

.rd-panel {
	background: transparent;
	border: 0;
	padding: 0;
	box-shadow: none;
}

.rd-panel-heading {
	padding: 5px 0;
	font-weight: bold;
	text-transform: uppercase;
}

.rd-panel-body {
	padding: 0;
}

.sidebar-widget ul {
	padding: 0;
	margin: 0;
}

.sidebar-widget ul li {
	list-style-type: none;
}

/* TOPBAR SEARCH */

#topbar-search  {
	background: #3498db;
	display: none;
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 13px;
	font-size: 1.3rem;
	color: #fff;
}

/* TOPBAR INFO */

#topbar-info  {
	display: none;
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 13px;
	font-size: 1.3rem;
	
}

#topbar-mini-links  {
	border-top: 0px solid #e74c3c;
}


#topbar-info input, #topbar-info button, #topbar-info input:focus, #topbar-info button:focus {
	border: 0;
	border-radius: 0;
}

/* KALENDER-WIDGET */

.calendar_wrap {

	color: #9E9E9E;
}

.calendar_wrap table {
		width: 100%;
}

.calendar_wrap table td a {
	display: inline-block;
	width: 100%;
}


/* -------------------------------------------------------------------------------------- */
/* 9.0 Footer
/* -------------------------------------------------------------------------------------- */


footer#footerwrapper {
	font-size: 13px;
font-size: 1.3rem;
}

.footer-content {
	padding-top: 10px;
}

footer#footerwrapper ul.menu {
	display: inline-block;
  padding: 0;
}

footer#footerwrapper ul.menu li {
	float: left;
	list-style-type: none;
	margin-right: 15px;
}

footer#footerwrapper ul.menu li:last-child {
	margin-right: 0;
}

footer#footerwrapper ul.menu li a {
	padding: 0;
}




/* -------------------------------------------------------------------------------------- */
/* 10.0 Misc
/* -------------------------------------------------------------------------------------- */



/* --------------------------------------------------------- */
/* MEDIA QUERIES ------------------------------------------- */
/* --------------------------------------------------------- */


/* --------------------------------------------------------- */
/* INFORMATION --- Version 1.1 --- 2012-VII-05 ------------- */
/* --------------------------------------------------------- */

/* ###

1.) Use e.g. "Respond.js" by Scott Jehl to enable responsive web designs in browsers that don't support CSS3 Media Queries (e.g. Internet Explorer 6, 7, 8) --> https://github.com/scottjehl/Respond/

2.) In this case, I use stages for all sizes. Between 1001 pixel and 1249 pixel the browser uses your basic-CSS. You can always delete some stages. After check the stages and adjust some min/max widths. (e.g. If you want to use only one stage for smartphones up to 320 width and one stage for smartphones and devices up to 960 pixel, delete the stages between and set the two new stages for a larger range.)

3.) If you think "Oh, the iPhone 4 has a 640x960 pixel display, so my stage needs only to fit on this in portrait and landscape orientation", it's a trap. The iPhone 4 has this resolution, but it uses only 320x480 pixel device-width. Or the Samsung Galaxy S2. It has a 480x800 pixel display --> 320x450 pixel and 320x508 pixel device-width in portrait orientation / 533x237 pixel in width and device-width in landscape orientation. // Quick Tip: "Tablet Computer - 150+ Display Measurements" --> http://www.designfalcon.com/#tablets

4.) Think about PNG-Fix for old IE (e.g. "jquery.pngFix.js" by Andreas Eberhard --> http://jquery.andreaseberhard.de/pngFix/), IE Background-Fix (e.g. "backgroundSize.js" by Louis Remi --> https://github.com/louisremi/jquery.backgroundSize.js) and last but noch least a emulator for CSS3 pseudo classes and attribut selectors for old IE (e.g. "Selectivizr.js" by Keith Clark --> http://selectivizr.com/).

5.) More information about "max-width" and "max-device-width": "max-width" refers to the actual viewport and can target specific sizes and orientations; "max-device-width" refers to the device viewport size, regardless of browser-scale, orientation or resizing. Shorthand: "max-width" (and "max-height") = target display area // "max-device-width" (and "max-device-height") = device entire rendering area. Same for "min" values.

6.) Thanks for your time! (: Andi "Licious" Wieser (Oh, you have some time left or further questions? --> andilicious.com // twitter.com/andiliciouscom // fb.com/andiliciouscom // pinterest.com/licious).

### */



/* --------------------------------------------------------- */
/* BOOTSTRAP GRID COLUMNS --------------------------- */
/* --------------------------------------------------------- */


/* ===== Col-xs and smaller ===== */

@media (max-device-width: 480px) and (orientation: landscape) {
	#headerwrapper {
		height: auto;
		position: relative;
	}
	.affix-top {
		position: relative!important;
	}
	.affix {
		position: relative;
	}
	#mobile-bar {
		padding-bottom: 10px;
	}
	#containerwrapper {
min-height: auto;
}
}

@media (max-width: 767px) {
	#headerwrapper {
		height: auto;
		position: relative;
	}
	.affix-top {
		position: relative!important;
	}
	.affix {
		position: relative;
	}
		#containerwrapper {
min-height: auto;
}
#mobile-bar {
	padding-bottom: 10px;
}
#mobile-bar.affix {
	position: fixed;
}
}


/* ===== Col-sm ===== */

@media (min-width: 768px) and (max-width: 991px) {
}

/* ===== Col-sm and larger/wider ===== */


@media (min-width: 768px) {
}


/* ===== Col-md ===== */

@media (min-width: 992px) and (max-width: 1199px) {

}


/* ===== Col-md and larger/wider ===== */

@media (min-width: 992px) {

}

/* ===== Col-lg ===== */

@media (min-width: 1200px) {
	
.footer-icons {
	text-align: right;
}
}


/* --------------------------------------------------------- */
/* APPLE MACBOOK PRO RETINA ETC. --------------------------- */
/* --------------------------------------------------------- */

/* Retina Displays/Screens (2880x1800) --------------------- */
@media
only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2),
only screen and (min-resolution: 2dppx) {
}


/* --------------------------------------------------------- */
/* SMARTPHONES, TABLETS & TINY DESKTOPS -------------------- */
/* --------------------------------------------------------- */

/* Old Smartphones (portrait and landscape) ---------------- */
@media
only screen and (min-device-width: 240px) and (max-device-width: 320px) {
	/* YOUR STYLES */
}


/* Old Smartphones (e.g. portrait) ------------------------- */
@media
only screen and (max-width: 319px) {
	/* YOUR STYLES */
}


/* Smartphones (portrait and landscape) -------------------- */
@media
only screen and (min-device-width: 320px) and (max-device-width: 640px) {
	/* YOUR STYLES */
}


/* Smartphones (portrait) & Old SP (landscape) ------------- */
@media
only screen and (min-width: 320px) and (max-width: 479px) {
	/* YOUR STYLES */
}


/* Smartphones (landscape) & Old Tablets (Portrait) -------- */
@media
only screen and (min-width: 480px) and (max-width: 639px) {
	/* YOUR STYLES */
}


/* Smartphones & Tablets (portrait & landscape) ------------ */
@media
only screen and (min-device-width: 640px) and (max-device-width: 960px) {
	/* YOUR STYLES */
}


/* Smartphones & Tablets (portrait) & Tiny Desktops -------- */
@media
only screen and (min-width: 640px) and (max-width: 799px) {
	/* YOUR STYLES */
}


/* Smartphones & Tablets (landscape) & Splitted Desktops --- */
@media
only screen and (min-width: 800px) and (max-width: 1000px) {
	/* YOUR STYLES */
}





/* --------------------------------------------------------- */
/* DEVICES BY RATIO ---------------------------------------- */
/* --------------------------------------------------------- */

/* LowRes (e.g. 240x320 / 320x480) ------------------------- */
@media
only screen and (min--moz-device-pixel-ratio: 0.75),
only screen and (-o-min-device-pixel-ratio: 3/4),
only screen and (-webkit-min-device-pixel-ratio: 0.75),
only screen and (min-device-pixel-ratio: 0.75),
only screen and (min-resolution: 0.75dppx) {
	/* YOUR STYLES */
}


/* HighRes ------------------------------------------------- */
@media
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	/* YOUR STYLES */
	
	/* e.g. HighRes Logo (use _2x as extension for double-sized images) */
	/* .logo {background-image: url(logo_2x.png); background-size: 50%;} */
}


/* RetinaRes Smartphones (e.g. iPhone 4 / portrait) -------- */
@media
only screen and (min--moz-device-pixel-ratio: 1.5) and (orientation: portrait),
only screen and (-o-min-device-pixel-ratio: 3/2) and (orientation: portrait),
only screen and (-webkit-min-device-pixel-ratio: 1.5) and (orientation: portrait),
only screen and (min-device-pixel-ratio: 1.5) and (orientation: portrait),
only screen and (min-resolution: 1.5dppx) and (orientation: portrait) {
	/* YOUR STYLES */
}


/* RetinaRes Smartphones (e.g. iPhone 4 / landscape) ------- */
@media
only screen and (min--moz-device-pixel-ratio: 1.5) and (orientation: landscape),
only screen and (-o-min-device-pixel-ratio: 3/2) and (orientation: landscape),
only screen and (-webkit-min-device-pixel-ratio: 1.5) and (orientation: landscape),
only screen and (min-device-pixel-ratio: 1.5) and (orientation: landscape),
only screen and (min-resolution: 1.5dppx) and (orientation: landscape) {
	/* YOUR STYLES */
}





/* --------------------------------------------------------- */
/* IPADS --------------------------------------------------- */
/* --------------------------------------------------------- */

/* iPads (portrait and landscape) -------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	/* YOUR STYLES */
}


/* iPads (portrait) ---------------------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
	
}


/* iPads (landscape) --------------------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
	/* YOUR STYLES */
}


/* iPad Retina (iPad 3; portrait and landscape) ------------ */
@media
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min--moz-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min-resolution: 2dppx) {
	/* YOUR STYLES */
}





/* --------------------------------------------------------- */
/* COMPUTERS / OTHER DEVICES ------------------------------- */
/* --------------------------------------------------------- */

/* Displays/Screens (e.g. MacBook @ 1280x800) -------------- */
@media
only screen and (min-width: 1250px) and (max-width: 1409px) {
	/* YOUR STYLES */
}


/* Displays/Screens (e.g. 19" WS @ 1440x900) --------------- */
@media
only screen and (min-width: 1410px) and (max-width: 1649px) {
	/* YOUR STYLES */
}


/* Displays/Screens (e.g. 22" WS @ 1680x1050) -------------- */
@media
only screen and (min-width: 1650px) and (max-width: 1889px) {
	/* YOUR STYLES */
}


/* Displays/Screens (e.g. 24" WS @ 1920x1080) -------------- */
@media
only screen and (min-width: 1890px) and (max-width: 2529px) {
	/* YOUR STYLES */
}


/* Really Large Displays/Screens (e.g. 2560x1440) ---------- */
@media
only screen and (min-width: 2530px) {
	/* YOUR STYLES */
}