/*
Theme Name: Optimotion
Description: WordPress-Theme für Optimotion - www.optimotion.de
Author: Jing Zhou | www.lk-service.com
Author URI: http://www.lk-service.com
Version: 1.0
*/

/* --------------------------------------------------------- */
/* BASIC CSS ----------------------------------------------- */
/* --------------------------------------------------------- */
	
html, body {
/* height: 100%; */
}

body {
color: #262626;
font-size: 10px;
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
background: url('images/bg.png') center center fixed #fff;
}

h1, h2, h3, h4, h5, h6 {
margin-top: 0;
margin-bottom: 0;
color: #1f2122;
}

strong {
font-weight: bold;
}

img.alignleft {
float: left;
padding: 0 5px 5px 0;
}

img.alignright {
float: right;
padding: 0 0 5px 5px;
}

a {
color: #009240;
}

a:hover, a:active, a:focus {
outline: 0;
text-decoration: none;
color: #000;
}

div.number-of-comments {
/* display: none; */
}

/* =========== WRAPPER-LAYOUT & BASICS ============ */



#pagewrapper {
margin-top: 15x;
}

#logowrapper {

}

#logowrapper, #content {
/* background: #fff; */

}

#logowrapper {
padding-top: 15px;
padding-bottom: 15px;
}

#logowrapper img {
max-width: 1170px;
width: 100%;
height: auto; 
}

#content {

}

#contentwrapper {
background: #fff;
padding-top: 50px;
}


/* =========== HEADER ============ */

#headerwrapper {
background: #fff;
}

#logo h1 {
text-transform: uppercase;
}

/* LÄNDERFLAGGEN */

.flag-widget h4 {
display: none;
}

ul.qtranxs_language_chooser  {
margin-left: 0;
padding-left: 0;
}

ul.qtranxs_language_chooser li {
list-style: none;
float: left;
margin: 0 10px 10px 0;
}



/* =========== NAVIGATION ============ */



/* TOPMENÜ */

nav#top-nav {
padding-left: 0;
padding-right: 0;
}

nav#top-nav ul#menu-top-menu {

}

nav#top-nav div ul  li {
padding-right: 0px;
border-left: solid 1px #e7e7e7;
}

nav#top-nav div ul  li:last-child {
padding-right: 0;
}

nav#top-nav div ul li:first-child {
border-left: solid 0px #e7e7e7;
}

nav#top-nav div ul li:last-child {

}


nav#top-nav a {
color: #000;
border: 0;
border-top: 0px solid #000;
border-radius: 0;
font-size: 13px;
font-size: 1.3rem;
padding-left: 10px;
padding-right: 10px;
margin: 0;
/* VERAUF */
background: #7db9e8; /* Old browsers */
background: -moz-linear-gradient(top,  #7db9e8 0%, #ffffff 0%, #ececec 100%, #1e5799 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7db9e8), color-stop(0%,#ffffff), color-stop(100%,#ececec), color-stop(100%,#1e5799)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#ececec 100%,#1e5799 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#ececec 100%,#1e5799 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#ececec 100%,#1e5799 100%); /* IE10+ */
background: linear-gradient(to bottom,  #7db9e8 0%,#ffffff 0%,#ececec 100%,#1e5799 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 ); /* IE6-9 */
}

nav#top-nav a:focus {
color: #000;
border: 0;
/* Verlauf */
background: #959595; /* Old browsers */
background: -moz-linear-gradient(top,  #959595 0%, #ececec 0%, #d1d1d1 100%, #d1d1d1 100%, #7db9e8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#959595), color-stop(0%,#ececec), color-stop(100%,#d1d1d1), color-stop(100%,#d1d1d1), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#959595', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
border-radius: 0;
text-shadow: 0px 0px 1px rgba(255, 255, 255, 1);
}

nav#top-nav div ul  li.current-menu-item a, nav#top-nav div ul  li.current-post-parent a, nav#top-nav div ul  li.current-post-ancestor a, nav#top-nav a:hover, nav#top-nav div ul  li.current-category-ancestor a {
color: #000;
border: 0;
border-top: 0px solid #009240;
border-radius: 0;
/* Verlauf */
background: #959595; /* Old browsers */
background: -moz-linear-gradient(top,  #959595 0%, #ececec 0%, #d1d1d1 100%, #d1d1d1 100%, #7db9e8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#959595), color-stop(0%,#ececec), color-stop(100%,#d1d1d1), color-stop(100%,#d1d1d1), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#959595', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
text-shadow: 2px 1px #fff;
}





/* HAUPTMENÜ */


nav#nav {
padding-left: 0;
padding-right: 0;
background: #fff;
  text-transform: uppercase;
  margin-top: 50px;
}

.navbar-collapse {
padding-left: 0;
padding-right: 0;
}



nav#nav ul#menu-hauptmenu {
background: #fff;

}

nav#nav div ul  li {
padding-right: 0px;
border-left: solid 1px #e7e7e7;
}

nav#nav div ul  li:last-child {
padding-right: 0;
}

nav#nav div ul li:first-child {
border-left: solid 0px #e7e7e7;
}

nav#nav div ul li:last-child {

}


nav#nav li.optimotion-logo-menu  {

}

nav#nav li.optimotion-logo-menu a {
padding-top: 5px;
padding-bottom: 5px;
}

nav#nav a {
color: #000;
border: 0;
border-top: 0px solid #000;
border-radius: 0;
font-size: 13px;
font-size: 1.3rem;
padding-left: 30px;
padding-right: 30px;
/* VERAUF */
background: #7db9e8; /* Old browsers */
background: -moz-linear-gradient(top,  #7db9e8 0%, #ffffff 0%, #ececec 100%, #1e5799 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7db9e8), color-stop(0%,#ffffff), color-stop(100%,#ececec), color-stop(100%,#1e5799)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#ececec 100%,#1e5799 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#ececec 100%,#1e5799 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#ececec 100%,#1e5799 100%); /* IE10+ */
background: linear-gradient(to bottom,  #7db9e8 0%,#ffffff 0%,#ececec 100%,#1e5799 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 ); /* IE6-9 */
margin: 0;
}

nav#nav a:focus {
color: #000;
border: 0;
/* Verlauf */
background: #959595; /* Old browsers */
background: -moz-linear-gradient(top,  #959595 0%, #ececec 0%, #d1d1d1 100%, #d1d1d1 100%, #7db9e8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#959595), color-stop(0%,#ececec), color-stop(100%,#d1d1d1), color-stop(100%,#d1d1d1), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#959595', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
border-radius: 0;
text-shadow: 0px 0px 1px rgba(255, 255, 255, 1);
}

nav#nav div ul  li.current-menu-item a, nav#nav div ul  li.current-post-parent a, nav#nav div ul  li.current-post-ancestor a, nav#nav a:hover, nav#nav div ul  li.current-category-ancestor a {
color: #000;
border: 0;
border-top: 0px solid #009240;
border-radius: 0;
/* Verlauf */
background: #959595; /* Old browsers */
background: -moz-linear-gradient(top,  #959595 0%, #ececec 0%, #d1d1d1 100%, #d1d1d1 100%, #7db9e8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#959595), color-stop(0%,#ececec), color-stop(100%,#d1d1d1), color-stop(100%,#d1d1d1), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #959595 0%,#ececec 0%,#d1d1d1 100%,#d1d1d1 100%,#7db9e8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#959595', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
text-shadow: 2px 1px #fff;
}

a.navbar-brand {
display: none;
}

.navbar-toggle {
float: right;
margin-top: 0;
background: #009240;
color: #fff;
height: 50px;
border-radius: 0px;
}

.navbar-toggle .icon-bar {
background: #fff;
}

li.menu-item-has-children ul li a {
padding-left: 15px!important;
padding-right: 15px!important;
}

/* SUBMENU */

.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown-menu {
padding: 0;
border-radius: 0;
border: 0px solid #fff;
}

.dropdown-menu > li > a {
padding: 8px 20px;
}

.navbar-collapse {
width: 100%;
}

a.navbar-brand {

}

.navbar-toggle {
float: right;
margin-top: 0;
background: #584d51;
color: #fff;
height: 50px;
border-radius: 0px;
}

.navbar-toggle .icon-bar {
background: #fff;
}




/* =========== BASIC ============ */

article {
padding-top: 20px;
padding-bottom: 20px;
font-size: 13px;
font-size: 1.3rem;
}

article img.alignnone {
max-width: 748px;
width: 100%;
height: auto;
}

.post-footer i {
color: #009240;
}

.entry-meta {
margin-top: 15px;
}

.entry-meta .fa-user {
margin-left: 30px;
}

/*

.entry-meta i {
color: #009240;
}

.entry-meta a {
color: #009240;
}

.entry-meta a:hover {
color: #009240;
text-decoration: underline;
} */



/* =========== BEITRAGSSEITE (INDEX.PHP) ============ */

article.post {
  background-color: #ffffff;
	border-bottom: 1px solid #d9d9d9;
}

.post-content {
padding-top: 25px;
margin-top: 25px;
margin-bottom: 25px;
}

.post-footer {
margin-top: 25px;
padding-top: 25px;

}

.col-lg-4:nth-child(3n+1){
/* FIREFOX FLOAT BUGFIX */
    clear: left;
}




/* PAGINATION */


#navigation li.active a {
background: #000;
color: #fff;
border-color: #000;
}

#navigation li.active a:hover {
border-color: #ddd;
}

#navigation li a {
background: #fff;
color: #000;
}

#navigation li a:hover {
background: #ddd;
color: #000;
border-color: #000;
}


.featured-image img {
max-width: 712px;
height: auto;
width: 100%;
margin-bottom: 1.4rem;
margin-bottom: 14px;
}


/* =========== SEITEN (PAGE.PHP) ============ */

h2.page-title {
border-bottom: 1px solid #d9d9d9;
padding-bottom: 15px;
}

blockquote {
border-left: 0;
color: #8c8888;
font-family: Georgia, Geneva, 'Times New Roman', times;
font-size: 14px;
font-size: 1.4rem;
}

blockquote:before {
  font-family: FontAwesome;
  content: "\f10d";
  margin: 0 20px 0px 0;
  float: left;
  font-size: 40px;
color: #f3f3f3;
}


article.page, article#page-content {
  background-color: #ffffff;
  margin: 0 0 20px;
}


#page-content {
margin-top: 30px;
}

/* h2 {
font-size: 18px;
font-size:  1.8rem;
} */

.the-content {

}



.wpcf7 form, .wpcf7 form input, .wpcf7 form textarea {
width: 100%;
}

.wpcf7 form input.wpcf7-submit {
padding: 5px 14px;
    background-color: #009240;
	color: #fff;
    border: 0px solid #DDD;
    border-radius: 0px;
	margin: 5px 0;
	width: auto;
}

img.ajax-loader {
width: auto;
}


/* iframe {
max-width: 540px;
width: 100%;
height: 310px;
} */

.col-lg-6 img.size-full {
max-width: 520px;
width: 100%;
height: auto;
}


/* =========== CATEGORY.PHP ============ */

h2.page-category-title {
border-bottom: 1px solid #d9d9d9;
padding-bottom: 15px;
font-size: 16px;
font-size: 1.6rem;
color: #888;
}

.the-category a{
color: #000;
}

.the-category a:hover {
color: #7F7F7F;
}

h3.category-post-title  {
margin-bottom: 15px;
}


h3.category-post-title a {
color: #7F7F7F;
}

h3.category-post-title a:hover {
color: #000;
}

/* =========== PARTNER UND SPONSOREN ============ */

.partner-image, .sponsoren-image {
min-height: 219px;
}

div.partner-featured-image, .sponsoren-featured-image  {
min-height: 219px;
position: relative;
}


.partner-featured-image img, .sponsoren-featured-image img {
max-width: 219px;
width: 100%;
height: auto;
position: absolute;  
    top: 0;  
    bottom: 0;  
    left: 0;  
    right: 0;  
    margin: auto;  
}

.partner-title, .sponsoren-title {
text-align: center;
padding-top: 15px;
margin-bottom: 35px;
}


/* =========== SUCHFELD & SUCHERGEBNISSE (SEARCH.PHP) ============ */

.search-field {
background: #DADADA;
color: #fff;
font-weight: normal;
}


#searchresult {
  background-color: #ffffff;
  padding-top: 20px;
  padding-bottom: 20px;
  margin: 0 0 20px;
}



/* =========== SINGLE (SINGLE.PHP) ============ */

h4.in-the-category {
margin-bottom: 15px;
font-size: 14px;
font-size: 1.4rem;
border-bottom: 1px solid #d9d9d9;
padding-bottom: 15px;
}

h4.in-the-category a {
color: #888;
}

h4.in-the-category a:hover {
color: #888;
text-decoration: underline;
}

/* =========== SIDEBAR (SIDEBAR.PHP) ============ */

.sidebar-widget {
  background-color: #ffffff;
  margin: 0 0 20px;
  font-size: 1.3rem;
  font-size: 13px;
  padding-bottom: 20px;
}

.sidebar-widget .textwidget {
text-align: center;
}

.sidebar-widget ul {
padding-left: 15px;
}

.sidebar-widget ul li {
  margin: -2px 0 8px 0;
  padding: 0 0 6px 0;
  list-style-type: none;
  }

  .sidebar-widget li:before {
  font-family: 'FontAwesome';
  content: '\f105';
  margin: 0 5px 0 -15px;
  color: #009240;
  }
  
  .sidebar-widget ul li a {
  color: #2f2f2f;
  }
  
  .sidebar-widget ul li a:hover {
  color: #009240;
  }
  
  .sidebar-widget  img {
  max-width: 200px;
  width: 100%;
  height: auto;
  border: 1px solid #d9d9d9;
  padding: 5px;
  }
  
.widget-title {
margin-bottom: 15px;
font-size: 14px;
font-size: 1.4rem;
border-bottom: 1px solid #d9d9d9;
padding-bottom: 15px;
text-transform: uppercase;
}

  
  
/* =========== FOOTER ============ */

#footerwrapper a {
color: #000;
}

#footerwrapper a:hover {
color: #000;
text-decoration: underline;
}

#footerwrapper {
font-size: 13px;
font-size: 1.3rem;
border-top: 1px solid #d9d9d9;
}

#footerwrapper h3 {
color: #333;
font-size: 16px;
font-size: 1.6rem;
font-weight: bold;
}

#footergroup1 {
background: #fff;
color: #333;
padding-top: 25px;
padding-bottom: 25px;
}

.footer-widget-right {
text-align: right;
}



/* =========== FOOTER NAV ============ */

#menu-footer-menu {
margin: 0;
}

#menu-footer-menu li {
float: left;
list-style: none;
font-size: 13px;
font-size: 1.3rem;
}

#menu-footer-menu li a {
color: #000;
margin: 0;
padding: 0px 15px;
}

#menu-footer-menu li a span{

}

#menu-footer-menu li a:focus, #menu-footer-menu li a:active, #menu-footer-menu li a:hover {
background: transparent;
border: 0;
color: #000;
}

#menu-footer li {
	float: right;
	list-style-type: none;
	margin-left: 15px;
}


/* =========== MOBILE NAV ============ */

#mobile-nav #menu-mobile-menu {
margin-left: 0;
margin-right: 0;
border-bottom: 1px solid #000;
}

#mobile-nav #menu-mobile-menu li {
float: none;
font-size: 12px;
font-size: 1.2rem;
}

#mobile-nav #menu-mobile-menu li  a {
color: #000;
border: 0;
border-radius: 0;
}

#mobile-nav #menu-mobile-menu li  a:hover {
color: #fff;
background: #888;
border: 0;
border-radius: 0;
}

#mobile-nav a.navbar-brand {
margin-left: 0;
padding-left: 0;
color: #000;
}

#mobile-nav .navbar-toggle {
background: #000;
}


nav#mobile-nav div ul  li.current-menu-item a, nav#mobile-nav div ul  li.current-post-parent a, nav#mobile-nav div ul  li.current-post-ancestor a, nav#mobile-nav div ul  li.current-category-ancestor a {
color: #fff!important;
background: #000;
}

/* --------------------------------------------------------- */
/* 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).

### */




/* --------------------------------------------------------- */
/* 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) {
	nav#nav {
	background: #fff;
	}
	a.navbar-brand {
	display: block;
	margin-left: 15px;
	}
	.navbar-toggle {
	margin:0;
	}
	nav#nav a {text-align: left;}
	nav#nav ul.nav {
	margin: 7.5px 0px;
	}
	
	nav#nav div.navbar-collapse {
	margin-left: 0px;
	margin-right: 0px;
	}
	
	nav#nav ul.nav li a {
	padding-left: 15px;
	padding-right: 15px;
	}
}


/* Old Smartphones (e.g. portrait) ------------------------- */
@media
only screen and (max-width: 319px) {
	nav#nav {
	background: #fff;
	}
	a.navbar-brand {
	display: block;
		margin-left: 15px;
	}
	.navbar-toggle {
	margin:0;
	}
	nav#nav a {text-align: left;}
	nav#nav ul.nav {
	margin: 7.5px 0px;
	}
	nav#nav div.navbar-collapse {
	margin-left: 0px;
	margin-right: 0px;
	}
	nav#nav ul.nav li a {
	padding-left: 15px;
	padding-right: 15px;
	}
}


/* Smartphones (portrait and landscape) -------------------- */
@media
only screen and (min-device-width: 320px) and (max-device-width: 640px) {
	nav#nav {
	background: #fff;
	}
	a.navbar-brand {
	display: block;
		margin-left: 15px;
	}
	.navbar-toggle {
	margin:0;
	}
	nav#nav a {text-align: left;}
	nav#nav ul.nav {
	margin: 7.5px 0px;
	}
	nav#nav div.navbar-collapse {
	margin-left: 0px;
	margin-right: 0px;
	}
	nav#nav ul.nav li a {
	padding-left: 15px;
	padding-right: 15px;
	}
}


/* Smartphones (portrait) & Old SP (landscape) ------------- */
@media
only screen and (min-width: 320px) and (max-width: 479px) {
	nav#nav {
	background: #fff;
	}
	a.navbar-brand {
	display: block;
		margin-left: 15px;
	}
	.navbar-toggle {
	margin:0;
	}
	nav#nav a {text-align: left;}
	nav#nav ul.nav {
	margin: 7.5px 0px;
	}
	nav#nav div.navbar-collapse {
	margin-left: 0px;
	margin-right: 0px;
	}
	nav#nav ul.nav li a {
	padding-left: 15px;
	padding-right: 15px;
	}
}


/* Smartphones (landscape) & Old Tablets (Portrait) -------- */
@media
only screen and (min-width: 480px) and (max-width: 639px) {
	nav#nav {
	background: #fff;
	}
	a.navbar-brand {
	display: block;
		margin-left: 15px;
	}
	.navbar-toggle {
	margin:0;
	}
	nav#nav a {text-align: left;}
	nav#nav ul.nav {
	margin: 7.5px 0px;
	}
	nav#nav div.navbar-collapse {
	margin-left: 0px;
	margin-right: 0px;
	}
	nav#nav ul.nav li a {
	padding-left: 15px;
	padding-right: 15px;
	}
}


/* Smartphones & Tablets (portrait & landscape) ------------ */
@media
only screen and (min-device-width: 640px) and (max-device-width: 960px) {
	nav#nav {
	background: #fff;
	}
	a.navbar-brand {
	display: block;
		margin-left: 15px;
	}
	.navbar-toggle {
	margin:0;
	}
	nav#nav a {text-align: left;}
	nav#nav ul.nav {
	margin: 7.5px 0px;
	}
	nav#nav div.navbar-collapse {
	margin-left: 0px;
	margin-right: 0px;
	}
	nav#nav ul.nav li a {
	padding-left: 15px;
	padding-right: 15px;
	}
}


/* Smartphones & Tablets (portrait) & Tiny Desktops -------- */
@media
only screen and (min-width: 640px) and (max-width: 799px) {
	nav#nav {
	background: #fff;
	}
	a.navbar-brand {
	display: block;
		margin-left: 15px;
	}
	.navbar-toggle {
	margin:0;
	}
	nav#nav a {text-align: left;}
	nav#nav ul.nav {
	margin: 7.5px 0px;
	}
	nav#nav div.navbar-collapse {
	margin-left: 0px;
	margin-right: 0px;
	}
	nav#nav ul.nav li a {
	padding-left: 15px;
	padding-right: 15px;
	}
}


/* 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) {
	/* YOUR STYLES */
}


/* 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 */
}