/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

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

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

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

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

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

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

/*
 * A better looking default horizontal rule
 */

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

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

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

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

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

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

html, body
{
	height: 100%;
}

body
{
	background-color: #ffffff;
	color: #ffffff;
	font-family: "Noto Sans", sans-serif;
	font-size: 1em; 		/*16px*/
	font-weight: 400;
	line-height: 1.5625;	/*25px*/
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a, a:link, a:hover, a:active
{
	color: #ffffff;
	font-family: "Noto Sans", sans-serif;
	font-size: 1em; 		/*16px*/
	font-weight: 400;
	line-height: 1.5;		/*24px*/
	outline: 0;
	text-decoration: none;
}

.fontsize15bold a, .fontsize15bold a:link

{	color: #ffffff !important;
	font-family: "Noto Sans", sans-serif;
	font-size: 23px; 	/*23px*/
	font-weight: 700;
	height: 100%;
	line-height: 28px;	/*28px*/
}

.fontsize15bold a:hover, .fontsize15bold a:active
{
	color: #603813 !important;
}

a[href^="tel"]:link,
a[href^="tel"]:visited,
a[href^="tel"]:hover
{
	text-decoration: none;
	cursor: default;
}

.fontsize20regular
{
	font-size: 20px; 	/*20px*/
	font-weight: 400;
	line-height: 27px;	/*27px*/
}

.fontsize23regular
{
	font-size: 23px; 	/*23px*/
	font-weight: 400;
	line-height: 30px;	/*30px*/
}

.fontsize41regular
{
	font-size: 41px; 	/*43px*/
	font-weight: 400;
	line-height: 53px;	/*55px*/
}

.fontwhite
{
	color: #ffffff;
}

.fontorange
{
	color: #f7931e;
}

.fontlightgreen
{
	color: #cccc00;
}

.fontbluegreen
{
	color: #33ffcc;
}

.fontblue-exclusive
{
	color: #1e234f;
}

.fontred-exclusive
{
	color: #ba1333;
}

.fontwhite-exclusive
{
	color: #ffffff;
}

.fontblack-exclusive
{
	color: #000000;
}


.fontyellow
{
	color: #ffff00;
}

.fontgold
{
	color: #be9203;
}

.fontbrown, .fontbrown a
{
	color: #603813;
}

.font-wen-man-sieht-intro
{
	color: #ff00ff;
}

.font-wen-man-sieht-becka
{
	color: #41eeff;
}

.font-wen-man-sieht-otto
{
	color: #ffc91c;
}

.font-wen-man-sieht-reichert
{
	color: #ff6633;
}

.font-wen-man-sieht-meissner
{
	color: #a7a3d4;
}

.font-wen-man-sieht-hecht
{
	color: #8bd3f6;
}

.font-wen-man-sieht-arndt
{
	color: #e2dd7b;
}

.font-wen-man-sieht-kloeble
{
	color: #a6c5d7;
}

.font-wen-man-sieht-schubert
{
	color: #e38f91;
}

.font-wen-man-sieht-moradi
{
	color: #b7b6b6;
}

.no-underline a
{
	text-decoration: none !important;
}

.underline a
{
	text-decoration: underline !important;
}

.showsmart, .showtabletportrait, .showsmartinline
{
	display: none !important;
}

.hidesmart, .hidetabletportrait
{
	display: block;
}

.no-padding
{
	padding: 0;
}

.skrollr-desktop body
{
	height: 100% !important;
}

#skrollr-body
{
	height: 100%;
	overflow: visible;
	position:relative;
}

.parallax-image-wrapper
{
	left: 0;
	overflow: hidden;
	position: fixed;
	width: 100%;
}

.parallax-image-wrapper-50
{
	height: 50%;
	top: -50%;
}

.parallax-image-wrapper-100
{
	height: 100%;
	top: -100%;
}

.parallax-image
{
	display: none;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	bottom: 0;
	left: 0;
	position: absolute;
	width: 100%;
}

.parallax-image-50
{
	height: 200%;
	top: -50%;
}

.parallax-image-100
{
	height: 100%;
	top: 0;
}

.parallax-image.skrollable-between
{
	display: block;
}

.no-skrollr .parallax-image-wrapper
{
	display: none !important;
}

.gap
{
	background: transparent center no-repeat;
	background-size: cover;
}

.skrollr .gap
{
	background: transparent !important;
}

.gap-50
{
	height: 50%;
}

.gap-100
{
	height: 100%;
}

.gap-150 {
	
}

.header, .content
{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.content-full{

	height:100%;
}

main
{
	overflow-x: hidden;
}

.boxwrapper, .boxwrappersmart
{
	margin: 0px auto;
	width: 924px;
}

.boxwrapper-head {
	margin: 0px auto;
	width: 100%;
	max-width: 1300px;
}

.boxwrapper1024
{
	margin: 0px auto;
	width: 1024px;
}

.banner-container-wrapper {
	background-image: url( ../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-banner-herbstaktion25-desktop.jpg );
	background-size: contain;
	background-repeat: no-repeat;
	height: 25.3vw;
	width: 100%;
}

.banner-text-container {
	margin: 0px auto 0px auto;
	padding: 35px 0px 19px 0px;
	text-align: center;
	width: 376px;
}

.banner-text {
	padding: 0px 0px 16px 0px;
}

.text-container-wrapper
{
	float: left;
	width: 100%;
}

.pic-container-wrapper
{
	width: 100%;
}

.introwrapper
{
	margin: 0px auto;
	padding: 30% 0% 0% 0%;
	width: 463px;
}

.intrologo
{
	float: left;
	height: auto;
	width: 100%;
}

.introarrow
{
	float: left;
	margin: 60px 0px 0px 0px;
	text-align: center;
	width: 100%;
}

.wie-man-sieht-introtext
{
	margin: 0px 0px 0px 56px;
	padding: 290px 0px 0px 0px;
	width: 808px;
}

.wie-man-sieht-buchungsbutton-wrapper {
	margin: 50px 0px 0px 56px;
}

.wie-man-sieht-buchungsbutton {
	background-color: #41585b;
	border: 2px solid #ffffff;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	cursor: pointer;
	margin: 0px 0px 23px 0px;
	padding: 14px 0px 15px 0px;
	text-align: center;
	width: 372px;
}

.wie-man-sieht-buchungsbutton-banner {
	background-color: #00334b;
}

.wie-man-sieht-text-container
{
	float: left;
	margin: 0px 0px 0px 56px;
	padding: 77px 0px 76px 0px;
	width: 696px;
}

#wie-man-sieht-intro
{
	display: none;
}

.wie-man-sieht-intro-pic
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-intro.jpg);
}

.wie-man-sieht-intro-pic2
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-optiker-berlin-charlottenburg-intro-unscharf.jpg);
}

.bgcolor-wie-man-sieht-banner
{
	background-color: #00334b;
}

#wie-man-sieht-1
{
	display: none;
}

.wie-man-sieht-1-pic
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-willkommen.jpg);
}

.wie-man-sieht-2-pic
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-innenraum.jpg);
}

#wie-man-sieht-2-19
{
	display: none;
}

.wie-man-sieht-2-19-pic
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-innenraum-2.jpg);
}

.bgcolor-wie-man-sieht-2
{
	background-color: #622f23;
	border-bottom: 1px solid #cccc00;
	border-top: 1px solid #cccc00;
}

.wie-man-sieht-3-19-pic
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-detail-19.jpg);
}

.bgcolor-wie-man-sieht-3
{
	background-color: #002657;
	border-bottom: 1px solid #33ffcc;
	border-top: 1px solid #33ffcc;
}

#wie-man-sieht-4-19
{
	display: none;
}

.wie-man-sieht-4-19-pic
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-detail-2-19.jpg);
}

/*
#wie-man-sieht-5
{
	display: none;
}

.wie-man-sieht-5-pic
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-detail-3.jpg);
}
*/

.wie-man-sieht-6-pic
{
	background-image: url(../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-sehtestgeraet.jpg);
}

.bgcolor-wie-man-sieht-6
{
	background-color: #004a51;
	border-bottom: 1px solid #ffff00;
	border-top: 1px solid #ffff00;
}

/*Bereich: was man sieht*/

.bgcolor-was-man-sieht-intro
{
	background-color: #5c3326;
	border-bottom: 1px solid #ff00ff;
}

.was-man-sieht-introtext-container
{
	float: right;
	margin: 0px 151px 0px 0px;
	padding: 77px 0px 0px 0px;
	width: 508px;
}

.was-man-sieht-introtext
{
	padding: 176px 0px 76px 0px;
}

.was-man-sieht-logo-container-wrapper
{
	background-image: url(../art/was-man-sieht/bg-was-man-sieht-1.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	float: left;
	width: 100%;
}

.was-man-sieht-logo-wrapper
{
	margin: 0px auto;
	width: 828px;
}

.was-man-sieht-logo-wrapper-inner
{
	float: left;
	padding: 83px 0px 63px 0px;
	width: 100%;
}

.was-man-sieht-logo
{
	height: auto;
	float: left;
	margin: 0px 10px 20px 10px;
	width: 187px;
}

.bgcolor-was-man-sieht-brillenabo
{
	background-color: #ffffff;
	border-top: 1px solid #ff00ff;
}

.was-man-sieht-brillenabo-container
{
	float: left;
	margin: 0px 0px 0px 56px;
	width: 808px;
}

.was-man-sieht-brillenabo-text
{
	float: left;
	padding: 77px 0px 76px 0px;
	width: 601px;
}

.was-man-sieht-brillenabo-pic
{
	float: right;
	margin: 75px 0px 0px 0px;
}

.was-man-sieht-brillenabo-pic img
{
	height: auto;
	width: 187px;
}

.bgcolor-was-man-sieht-mehrbrillen
{
	background-color: #e5e1d8;
	border-top: 1px solid #ff00ff;
}

.was-man-sieht-mehrbrillen-container
{
	float: left;
	margin: 0px 0px 0px 56px;
	width: 601px;
}

.was-man-sieht-mehrbrillen-text
{
	padding: 77px 0px 76px 0px;
}


/*Bereich: wen man sieht*/

.wen-man-sieht-introtext-container
{
	float: right;
	padding: 77px 0px 46px 0px;
	width: 451px;
}

.bgcolor-wen-man-sieht-intro
{
	background-color: #004a51;
}

.wen-man-sieht-introtext
{
	padding: 176px 0px 76px 0px;
}

.wen-man-sieht-headline-container
{
	float: right;
	margin: 0px 0px 0px 56px;
	padding: 38px 0px 79px 0px;
	width: 451px;
}

.bgcolor-wen-man-sieht-headline-0
{
	background-color: #583a2e;
	border-top: 1px solid #ff00ff;
}

.bgcolor-wen-man-sieht-headline-1
{
	background-color: #293958;
	border-top: 1px solid #ff00ff;
}

.bgcolor-wen-man-sieht-headline-2
{
	background-color: #234261;
	border-top: 1px solid #ff00ff;
}

.wen-man-sieht-boxwrapper1024
{
	margin: 0px auto;
	width: 1024px;
}

.wen-man-sieht-text-container
{
	float: right;
	padding: 77px 0px 0px 0px;
	margin: 0px 50px 0px 0px;
	width: 451px;
}

.wen-man-sieht-pic-container
{
	float: left;
}

.bgcolor-wen-man-sieht-becka
{
	background-color: #5a4c43;
	border-top: 1px solid #41eeff;
}

.bgcolor-wen-man-sieht-otto
{
	background-color: #a7866d;
	border-top: 1px solid #ffc91c;
}

.bgcolor-wen-man-sieht-reichert
{
	background-color: #7f5d38;
	border-top: 1px solid #ff6633;
}

.bgcolor-wen-man-sieht-meissner
{
	background-color: #4e3c2f;
	border-top: 1px solid #a7a3d4;
}

.bgcolor-wen-man-sieht-hecht
{
	background-color: #a87e56;
	border-top: 1px solid #8bd3f6;
}

.bgcolor-wen-man-sieht-arndt
{
	background-color: #656b84;
	border-top: 1px solid #e2dd7b;
}

.bgcolor-wen-man-sieht-kloeble
{
	background-color: #6d4125;
	border-top: 1px solid #a6c5d7;
}

.bgcolor-wen-man-sieht-schubert
{
	background-color: #2a4454;
	border-top: 1px solid #e38f91;
}

.bgcolor-wen-man-sieht-moradi
{
	background-color: #82182e;
	border-top: 1px solid #b7b6b6;
}


/*wo man sieht*/

.nav-spacer
{
	height: 176px;
}

.wo-man-sieht-intro-2-text-container
{
	float: left;
	margin: 0px 0px 0px 56px;
	padding: 40px 0px 76px 0px;
	width: 696px;
}

.bgcolor-wo-man-sieht-intro
{
	background-color: #002657;
	border-bottom: 1px solid #ff00ff;
}

.font-wo-man-sieht-intro
{
	color: #8bd3f6;
}

.bgcolor-wo-man-sieht-pic-1
{
	background-color: #b79c76;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-wo-man-sieht-intro-2
{
	background-color: #a45514;
	border-bottom: 1px solid #ff00ff;
}

.font-wo-man-sieht-intro-2
{
	color: #fff89a;
}

.bgcolor-wo-man-sieht-pic-2
{
	background-color: #dfcaa5;
	border-bottom: 1px solid #ff00ff;
}

.wo-man-sieht-pic-container-wrapper
{
	float: left;
	width: 100%;
}

.wo-man-sieht-map-link
{
	padding: 38px 0px 64px 0px;
	width: 100%;
}

.wo-man-sieht-map-link-icon {
	float: left;
	margin: -23px -1px 0px 0px;
	width: 57px;
}

.wo-man-sieht-map-text-wrapper
{
	float: left;
}


/*Impressum*/

.bgcolor-impressum-intro
{
	background-color: #272f32;
	border-bottom: 1px solid #ff00ff;
}

.impressum-text-container
{
	margin: 0px 0px 0px 56px;
	padding: 77px 0px 76px 0px;
	width: 808px;
}


/*Archiv*/

.bgcolor-archiv-pic-1
{
	background-color: #4c6681;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-2
{
	background-color: #546f6e;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-3
{
	background-color: #273b48;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-4
{
	background-color: #565f72;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-5
{
	background-color: #33383e;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-6
{
	background-color: #456f81;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-7
{
	background-color: #5f7497;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-8
{
	background-color: #48537a;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-9
{
	background-color: #5685a7;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-10
{
	background-color: #7f9ca5;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-11
{
	background-color: #1c1b38;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-12
{
	background-color: #2c328a;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-13
{
	background-color: #2da8d8;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-14
{
	background-color: #1b2737;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-15
{
	background-color: #b18b36;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-16
{
	background-color: #566369;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-17
{
	background-color: #737047;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-18
{
	background-color: #00709e;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-19
{
	background-color: #466464;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-20
{
	background-color: #943d68;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-21
{
	background-color: #ad9c44;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-22
{
	background-color: #6a5d4a;
	border-bottom: 1px solid #ff00ff;
}

.bgcolor-archiv-pic-23
{
	background-color: #5e4265;
	border-bottom: 1px solid #ff00ff;
}


.archiv-text-container
{
	float: left;
	margin: 0px 0px 0px 56px;
	padding: 77px 0px 76px 0px;
	width: 696px;
}


/*exklusiv*/

.bgcolor-exklusiv-grey
{
	background-color: #acacac;
	border-bottom: 1px solid #000000;
}

.bgcolor-exklusiv-white
{
	background-color: #ffffff;
	border-bottom: 1px solid #ba1034;
}

.exklusiv-eyevan7285-introtext-wrapper
{
	float: left;
	margin: 176px 0px 0px 265px;
	width: 615px;
}

.exklusiv-eyevan7285-intro-pic
{
	float: left;
	height: auto;
	padding: 83px 39px 83px 0px;
	width: 167px;
}

.exklusiv-eyevan7285-introtext
{
	padding: 77px 0px 75px 0px;
}

.exklusiv-eyevan7285-wrapper
{
	float: left;
	width: 100%;
}

.exklusiv-eyevan7285-pic
{
	float: left;
	height: auto;
	width: 512px;
}

.exklusiv-eyevan7285-text
{
	float: left;
	padding: 107px 0px 0px 11px;
}

.exklusiv-vuarnet-introtext-wrapper
{
	float: left;
	margin: 0px 0px 0px 265px;
	width: 615px;
}

.exklusiv-vuarnet-intro-pic
{
	float: left;
	height: auto;
	padding: 81px 68px 81px 0px;
	width: 140px;
}

.exklusiv-vuarnet-introtext
{
	padding: 94px 0px 98px 0px;
}

.exklusiv-vuarnet-wrapper
{
	float: left;
	width: 100%;
}

.exklusiv-vuarnet-pic
{
	float: left;
	height: auto;
	width: 512px;
}

.exklusiv-vuarnet-text
{
	float: left;
	padding: 107px 0px 0px 11px;
}

.bgcolor-exklusiv
{
	background-color: #000000;
	border-bottom: 1px solid #be9203;
}

.exklusiv-masunaga-introtext-wrapper
{
	float: left;
	margin: 0px 0px 0px 265px;
	width: 615px;
}

.exklusiv-masunaga-intro-pic
{
	float: left;
	height: auto;
	padding: 83px 68px 83px 0px;
	width: 140px;
}

.exklusiv-masunaga-introtext
{
	padding: 122px 0px 116px 0px;
}

.exklusiv-container
{
	width: 100%;
}

.exklusiv-text-wrapper
{
	float: left;
	margin: 0px 0px 0px 56px;
	width: 696px;
}

.exklusiv-text
{
	padding: 77px 0px 76px 0px;
}

footer
{
	background-color: #5c3326;
	border-top: 1px solid #ff00ff;
	float: left;
	width: 100%;
}

.footerinner
{
	float: left;
	padding: 52px 0px 50px 0px;
	width: 415px;
}

.footerinnerwrapper
{
	padding: 26px 0px 0px 0px;
}

.footer-row-wrapper
{
	float: left;
	width: 100%;
}

.footer-row-wrapper-360
{
	padding: 0px 0px 14px 0px;
}

.footer-row-wrapper-phone {
	
}

.footer-row-wrapper-open-hours {
	
}

.footer-row-wrapper-social-media {
	padding: 14px 0px 0px 57px;
	width: calc( 100% - 57px );
}

.footericon
{
	height: auto;
	float: left;
	width: 57px;
}

.footericon-email
{
}

.footericon-calendar {
	margin: -2px 0px 0px 0px;
}

.footer-icon-buchungsbutton {
	cursor: pointer;
	display: inline;
}

.footericon-location
{
}

.footericon-social-media
{
	margin: 0px 20px 0px 0px;
	width: 37px;
}

.footertext
{
}

.flexible
{
	height: auto;
	max-width: 100%;
	outline: 0;
}


/* ==========================================================================
   Navigation
   ========================================================================== */

.nav-logo img
{
	display: inline;
  	vertical-align: middle;
}

.nav-logo
{
  	padding: 40px 0px 0px 0px;
}

.lt-ie8 .nav-logo
{
  	padding-top: 15px;
}

.mainnavhide
{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
}

.mainnav
{
	background-color: #ffffff;
	border-bottom: 1px solid #ff00ff;
  	border-top: 1px solid #ff00ff;
	display: block;
  	width: 100%;
	height: 174px;
  	z-index: 1050;
}

.mainnavabsolute {

  	width: 100%;
}

.mainnavfixed
{
	display: none;
	left: 0px;
  	position: fixed;
  	height: 174px;
  	top: 0px;
  	width: 100%;
  	z-index: 1050;
}

.no-js .mainnavfixed
{
	display: block;
	left: 0px;
  	position: fixed;
  	height: 174px;
  	top: 0px;
  	width: 100%;
  	z-index: 1050;
}



.mainnav .mainnavwrapper
{
  	float: left;
	height: 174px;
  	width: 100%;
}



.mainnav select
{
	display: none;
}

.nav-active > a:hover
{
	cursor: default;
}

.mainnav a:hover, a:hover #nav-above a:hover
{
	color: #ff00ff;
}

.mainnav a
{
	color: #603813;
}

.nav-active > a
{
	color: #ced550 !important;
}


/*navigation*/

.smartnavi-background
{		
	float: left;
	margin: 0px 0px 17px 0px;
	width: 100%;
}

#menubutton-absolute, #menubutton-fixed
{

	background: transparent url("../art/bg-menu-icon-mobile.svg") no-repeat;
	background-size: cover;
	cursor: pointer;
	display: block;
	float: right;
	height: 61px;
	margin: 94px 60px 0px 0px;
	width: 93px;
	-webkit-tap-highlight-color: #ffffff;
}

.mainnav .mainnavinner
{
	float: right;
	padding: 0;
	width: 1055px;
}

.nav-logo
{
	padding: 20px 0px 0px 0px;
	float: left;
}

.nav-logo img
{
	height: auto;
	width: 277px;
}

.nav-links
{

}

.mainnav ul
{
	float: right;
	display: block;
	padding: 0;
	width: 165px;
}

.mainnav ul.nav-links
{
	display: none;
	margin: 0px 0px 0px 0px;
	padding: 0;
}

.mainnav ul li,
.mainnav ul li.mainnav-smart-event,
.mainnav ul li.mainnav-smart-social-media
{
	background-color: #ffffff;
	border-bottom: 1px solid #ff00ff;
	color: #ff00ff;
	display: block;
	font-family: "Noto Sans", sans-serif;
	font-size: 16px; 	/*23px*/
	font-weight: 700;
	line-height: 22px;	/*28px*/
	text-align: left;
	margin-right: 0;
	height: auto;
	width: 100%;
}

.mainnav ul li.hilite {
	padding: 14px 0px 13px 13px;
	width: calc( 100% - 13px );
}

.mainnav ul li.mainnav-smart-event
{
	background-color: #ff00ff;
}

.mainnav ul li a,
.mainnav ul li.mainnav-smart-event a
{
	color: #603813;
	display: block;
	font-family: "Noto Sans", sans-serif;
	font-size: 16px; 	/*23px*/
	font-weight: 700;
	line-height: 22px;	/*28px*/
	padding: 14px 0px 13px 13px;
	width: 100%;
}

.mainnav ul li.mainnav-smart-event a
{
	color: #ffffff;
	padding: 13px 0px 12px 0px;
}

.mainnav ul li.mainnav-smart-event a:hover,
.mainnav ul li.mainnav-smart-event a:active
{
	color: #603813;
}

.mainnav-appendix-left,
.mainnav-appendix-right
{
	display: none;
}

.navHide
{
	overflow: hidden !important; 
	height: auto !important;
}

.navShow
{
	display: list-item !important;
}

.no-js nav
{
	width: 100%;
}

.no-js .mainnav ul > li
{
	display: block;
}

.no-js .nav-links
{
	display: none;
}

.no-js .mainnav:hover .nav-links
{
	display: block;
}

.nav-links
{
	border-top: none;
}


p
{
	margin: 0;
	padding: 0;
}

strong, b
{
	font-family: "Noto Sans", sans-serif;
	font-weight: normal;
}

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

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

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

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

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
   
@media screen and (max-width: 1300px){  
	.smartnavi-background
	{		
		margin: 0px 0px 16px 0px;
	}
	
	#menubutton-absolute, #menubutton-fixed
	{	
		margin: 94px 0px 0px 0px;
	}
	
	.mainnav ul.nav-links
	{
		margin: 0px -60px 0px 0px;	
	}

	.mainnav .mainnavinner
	{
		float: none;
		margin: 0px auto;
		width: 808px;
	}
/*
   .banner-container-wrapper {
		background-image: url( ../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-banner-tablet.jpg );
		height: 51vw;
	}
*/
}


/*Tablet landscape*/
@media screen and (max-width: 1170px){

	/*Bereich: wie man sieht*/

	.introwrapper
	{
		padding: 20% 0% 0% 0%;
	}
}

/*Tablet landscape*/
@media screen and (max-width: 1170px) and (orientation: landscape){
	.gap-120 {
		height: 135%;
	}
	
	.parallax-image-wrapper-120 {
		height: 135%;
		top: -150%;
	}
}


/*Tablet portrait*/
@media screen and (max-width: 991px){

	.showtabletportrait
	{
		display: block;
	}

	.hidetabletportrait
	{
		display: none;
	}

	.no-padding-tabletportrait
	{
		padding: 0 !important;
	}

	body
	{
		font-size: 18px; 		/*18px*/
		line-height: 25px;		/*25px*/
	}

	a, a:link, a:hover, a:active
	{
		font-size: 18px; 		/*18px*/
		line-height: 25px;		/*25px*/
	}

	.footertext a, .footertext a:link,
	.footertext a:hover, .footertext a:active
	{
		font-size: 16px; 		/*16px*/
		line-height: 25px;		/*25px*/
	}

	.fontsize15bold a, .fontsize15bold a:link,
	.fontsize15bold a:hover, .fontsize15bold a:active
	{
		font-size: 20px; 	/*20px*/
		line-height: 25px;	/*25px*/
	}
	
	.fontsize20regular
	{
		font-size: 18px; 	/*20px*/
		line-height: 25px;	/*27px*/
	}

	.fontsize23regular
	{
		font-size: 18px; 	/*18px*/
		line-height: 25px;	/*25px*/
	}

	.fontsize41regular
	{
		font-size: 33px; 	/*35px*/
		line-height: 45px;	/*47px*/
	}

	.boxwrapper
	{
		margin: 0px auto;
		width: 718px;
	}
	
	.boxwrapper1024
	{
		margin: 0px auto;
		width: 100%;
	}

	/*navigation*/
	.boxwrappersmart
	{
		width: 100%;
	}

	.mainnav .mainnavinner
	{		
		width: 668px;
	}

	.nav-logo
	{
		padding: 20px 0px 0px 0px;
	}

	.nav-logo img
	{
		width: 200px;
	}

	.mainnav ul
	{
		padding: 0px 0px 35px 26px;
	}

	.smartnavi-background
	{		
		margin: 0px 0px 18px 0px;
	}

	#menubutton-absolute, #menubutton-fixed
	{	
		height: 48px;
		margin: 70px 0px 0px 0px;
		width: 74px;
	}

	.mainnav ul.nav-links
	{
		margin: 0px 0px 0px 0px;	
	}

	.mainnav
	{
		height: 137px; 	
	}

	.mainnavfixed
	{
		height: 137px;
	}

	.no-js .mainnavfixed
	{
		height: 137px;
	}

	.mainnav .mainnavwrapper
	{
		height: 137px;
	}


	/*Bereich: wie man sieht*/

	.introwrapper
	{
		padding: 40% 0% 0% 0%;
		width: 384px;
	}

	.introarrow
	{
		margin: 70px 0px 0px 0px;
	}

	.wie-man-sieht-introtext
	{
		margin: 0px 0px 0px 25px;
		padding: 273px 0px 0px 0px;
		width: 668px;
	}
	
	.wie-man-sieht-buchungsbutton-wrapper {
		margin: 50px 0px 0px 25px;
	}

	.wie-man-sieht-text-container
	{
		margin: 0px 0px 0px 25px;
		padding: 51px 0px 54px 0px;
		width: 552px;
	}
	
	.banner-container-wrapper {
		background-image: url( ../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-banner-herbstaktion25-mobile.jpg );
		height: 65.1vw;
	}
	
	.banner-text-container {
		padding: 22px 0px 6px 0px;
	}

	.banner-text {
		padding: 0px 0px 18px 0px;
	}
	
	/*Bereich: was man sieht*/

	.was-man-sieht-introtext-container
	{
		margin: 0px 122px 0px 0px;
		padding: 162px 0px 0px 0px;
		width: 400px;
	}

	.was-man-sieht-introtext
	{
		padding: 51px 0px 54px 0px;
	}

	.was-man-sieht-logo-wrapper
	{
		width: 688px;
	}

	.was-man-sieht-logo-wrapper-inner
	{
		padding: 60px 0px 40px 0px;
	}

	.was-man-sieht-logo
	{
		width: 152px;
	}

	.was-man-sieht-brillenabo-container
	{
		margin: 0px 0px 0px 25px;
		width: 688px;
	}

	.was-man-sieht-brillenabo-text
	{
		padding: 54px 0px 54px 0px;
		width: 496px;
	}

	.was-man-sieht-brillenabo-pic
	{
		margin: 54px 0px 0px 0px;
	}

	.was-man-sieht-brillenabo-pic img
	{
		width: 152px;
	}

	.was-man-sieht-mehrbrillen-container
	{
		margin: 0px 0px 0px 25px;
		width: 496px;
	}

	.was-man-sieht-mehrbrillen-text
	{
		padding: 54px 0px 54px 0px;
	}


	/*Bereich: wen man sieht*/
	
	.wen-man-sieht-boxwrapper1024
	{
		width: 767px;
	}
	
	.wen-man-sieht-introtext-container
	{
		padding: 162px 0px 0px 0px;
		width: 349px;
	}

	.wen-man-sieht-introtext
	{
		padding: 51px 0px 54px 0px;
	}
	
	.wen-man-sieht-headline-container
	{
		padding: 23px 0px 51px 0px;
		width: 349px;
	}

	.wen-man-sieht-text-container
	{
		margin: 0px 24px 0px 10px;
		padding: 51px 0px 31px 0px;
		width: 349px;
	}

	.wen-man-sieht-pic-container
	{
		height: auto;
		width: 384px;
	}


	/*wo man sieht*/

	.nav-spacer
	{
		height: 137px;
	}

	.wo-man-sieht-intro-2-text-container
	{
		margin: 0px 0px 0px 25px;
		padding: 24px 0px 54px 0px;
		width: 552px;
	}
	
	.wo-man-sieht-map-link
	{
		padding: 24px 0px 32px 0px;
	}

	.wo-man-sieht-map-link-icon {
		margin: -26px 0px 0px 1.5%;
		width: 55px;
	}


	/*Impressum*/

	.impressum-text-container
	{
		margin: 0px 0px 0px 25px;
		padding: 51px 0px 54px 0px;
		width: 668px;
	}


	/*Archiv*/

	.archiv-text-container
	{
		margin: 0px 0px 0px 25px;
		padding: 51px 0px 54px 0px;
		width: 552px;
	}


	/*exklusiv*/

	.exklusiv-eyevan7285-introtext-wrapper
	{
		float: left;
		margin: 162px 0px 0px 46px;
		width: 552px;
	}

	.exklusiv-eyevan7285-intro-pic
	{
		padding: 64px 31px 63px 0px;
		width: 120px;
	}

	.exklusiv-eyevan7285-introtext
	{
		padding: 54px 0px 54px 0px;
	}

	.exklusiv-eyevan7285-pic
	{
		width: 384px;
	}

	.exklusiv-eyevan7285-text
	{
		padding: 81px 0px 0px 11px;
	}

	.exklusiv-vuarnet-introtext-wrapper
	{
		float: left;
		margin: 0px 0px 0px 46px;
		width: 552px;
	}

	.exklusiv-vuarnet-intro-pic
	{
		padding: 59px 31px 59px 0px;
		width: 120px;
	}

	.exklusiv-vuarnet-introtext
	{
		padding: 73px 0px 72px 0px;
	}

	.exklusiv-vuarnet-pic
	{
		width: 384px;
	}

	.exklusiv-vuarnet-text
	{
		padding: 81px 0px 0px 11px;
	}

	.exklusiv-masunaga-introtext-wrapper
	{
		float: left;
		margin: 0px 0px 0px 46px;
		width: 552px;
	}

	.exklusiv-masunaga-intro-pic
	{
		padding: 60px 21px 60px 0px;
		width: 130px;
	}

	.exklusiv-masunaga-introtext
	{
		padding: 104px 0px 92px 0px;
	}

	.exklusiv-text-wrapper
	{
		margin: 0px 0px 0px 25px;
		width: 552px;
	}

	.exklusiv-text
	{
		padding: 55px 0px 53px 0px;
	}

	.footerinner
	{
		padding: 25px 0px 47px 11px;
		width: 334px;
	}

	.footerinnerwrapper
	{
		padding: 26px 0px 0px 0px;
	}
	
	.footer-row-wrapper-social-media {
		padding: 14px 0px 0px 57px;
	}

	.footer-row-wrapper-360
	{
		padding: 3px 0px 15px 0px;
	}

	.footericon
	{
		width: 55px;
	}

	.footertext
	{
		font-size: 16px; 	/*16px*/
		line-height: 25px;	/*25px*/
	}
	
	.footericon-social-media
	{
		margin: 0px 20px 0px 0px;
		width: 36px;
	}


}

@media screen and (max-width: 767px){

	body
	{
		font-size: 1em; 		/*16px*/
		line-height: 1.5;		/*24px*/
	}

	a, a:link, a:hover, a:active
	{
		font-size: 1em; 		/*16px*/
		line-height: 1.5;		/*24px*/
	}

	.footertext a, .footertext a:link,
	.footertext a:hover, .footertext a:active
	{
		font-size: 16px; 		/*16px*/
		line-height: 24px;		/*25px*/
	}
	
	.fontsize20regular
	{
		font-size: 16px; 	/*20px*/
		line-height: 24px;	/*27px*/
	}

	.fontsize23regular
	{
		font-size: 16px; 	/*16px*/
		font-weight: 400;
		line-height: 24px;	/*24px*/
	}

	.fontsize41regular
	{
		font-size: 16px; 	/*16px*/
		line-height: 24px;	/*24px*/
	}

	.showsmart
	{
		display: block !important;
	}

	.showsmartinline
	{
		display: inline !important;
	}

	.hidesmart
	{
		display: none !important;
	}

	.no-js .hidenojs
	{
		display: none;
	}

	.boxwrapper
	{
		margin: 0px auto;
		width: 89%;
	}

	/*navigation*/
	.boxwrappersmart
	{
		width: 100%;
	}

	.boxwrapper1024
	{
		margin: 0px auto;
		width: 100%;
	}

	/*navigation*/
	.smartnavi-background
	{
		background-color: #ffffff;
		float: left;
		margin: 0px 0px 14px 0px;
		width: 100%;
	}

	.boxwrapper-smartnavi
	{
		margin: 0% 5.5% 0% 5.5%;
		width: 89%;
	}

	#menubutton-absolute, #menubutton-fixed
	{
		height: 34px;
		margin: 70px 0px 0px 0px;
		width: 54px;
		-webkit-tap-highlight-color: #ffffff;
	}

	.menubutton-inner
	{
		padding: 0px 0px 0px 10px;
	}
	
	.mainnav
	{

		height: 120px; 	
	}

	.mainnavfixed
	{
		height: 120px;
	}

	.no-js .mainnavfixed
	{
		height: 120px;
	}

	.mainnav .mainnavwrapper
	{
		height: 120px;
	}

	.mainnav .mainnavinner
	{
		margin: 0;
		padding: 0;
		width: 100%;
	}

	.nav-logo
	{
	  	padding: 17px 0px 0px 0px;
	  	float: left;
	}

	.nav-logo img
	{
		height: auto;
		width: 180px;
	}

	.nav-links
	{
	  	max-height: 260px;
	  	overflow-y: scroll;
	  	-webkit-overflow-scrolling: touch;
	}

	.mainnav ul
	{
	  	float: right;
	  	display: block;
		padding: 0;
		width: 165px;
	}

	.mainnav ul.nav-links
	{
	  	display: none;
	}

	.mainnav ul li,
	.mainnav ul li.mainnav-smart-event,
	.mainnav ul li.mainnav-smart-social-media
	{
		background-color: #ffffff;
		border-bottom: 1px solid #ff00ff;
	  	display: block;
		font-family: "Noto Sans", sans-serif;
		font-size: 16px; 	/*23px*/
		font-weight: 700;
		line-height: 22px;	/*28px*/
	  	text-align: left;
	  	margin-right: 0;
	  	height: auto;
	  	padding: 0px 0px 0px 10px;
	  	width: 155px;
	}

	.mainnav ul li.mainnav-smart-event
	{
		background-color: #ff00ff;
	}

	.mainnav ul li.mainnav-smart-social-media
	{
		background-color: transparent;
		border-bottom: none;
		margin: 0% 0% 0% 40.5%;
		padding: 0;
		width: auto;
	}

	.mainnav ul li a,
	.mainnav ul li.mainnav-smart-event a
	{
		color: #603813;
		display: block;
		font-family: "Noto Sans", sans-serif;
		font-size: 16px; 	/*23px*/
		font-weight: 700;
		line-height: 22px;	/*28px*/
		padding: 14px 0px 13px 0px;
		width: 100%;
	}

	.mainnav ul li.mainnav-smart-event a
	{
		color: #ffffff;
		padding: 13px 0px 12px 0px;
	}

	.mainnav ul li.mainnav-smart-event a:hover,
	.mainnav ul li.mainnav-smart-event a:active
	{
		color: #603813;
	}

	.mainnav ul li.mainnav-smart-social-media a
	{
		padding: 0;
	}

	.mainnav-appendix-left,
	.mainnav-appendix-right
	{
		display: none;
    }

	.navHide
	{
		overflow: hidden !important; 
		height: auto !important;
	}

	.navShow
	{
		display: list-item !important;
	}

	.no-js nav
	{
		width: 100%;
	}

	.no-js .mainnav ul > li
	{
		display: block;
	}

	.no-js .nav-links
	{
		display: none;
	}

	.no-js .mainnav:hover .nav-links
	{
		display: block;
	}

	.mainnav a
	{
		border-bottom: none;
	}

	.nav-links
	{
		border-top: none;
    }

	.main
	{
		border-bottom: 0;
	}

	.nav-spacer
	{
		height: 122px;
	}


	/*Bereich: wie man sieht*/
	
	.introwrapper {
		width: 93%;
		max-width: 280px;
	}

	.introarrow
	{
		float: none;
		margin: 65% 0% 0% 0%;
	}

	.wie-man-sieht-introtext
	{
		margin: 0;
		padding: 150px 0px 0px 0px;
		width: 100%;
	}
	
	.wie-man-sieht-buchungsbutton-wrapper {
		margin: 30px 0px 0px 0px;
	}

	.wie-man-sieht-buchungsbutton {
		margin: 0px auto 23px auto;
		padding: 12px 0px 13px 0px;
		width: 302px;
	}

	.wie-man-sieht-text-container
	{
		float: none;
		margin: 0;
		padding: 30px 0px 30px 0px;
		width: 100%;
	}
/*	
	.banner-container-wrapper {
		background-image: url( ../art/wie-man-sieht/brillant-augenoptik-ihr-optiker-in-berlin-charlottenburg-banner-2-zu-1-mobile.jpg );
		height: 65.1vw;
	}
*/	
	.banner-text-container {
		padding: 30px 0px 14px 0px;
		width: 306px;
	}

	.banner-text {
		padding: 0px 0px 17px 0px;
	}

	/*Bereich: was man sieht*/

	.was-man-sieht-introtext-container
	{
		float: none;
		margin: 0px auto;
		padding: 152px 0px 30px 0px;
		width: 100%;
	}

	.was-man-sieht-introtext
	{
		padding: 0;
	}

	.was-man-sieht-logo-container-wrapper
	{
		background-image: url(../art/was-man-sieht/bg-was-man-sieht-1-mobile.jpg);
	}

	.was-man-sieht-logo-wrapper
	{
		width: 91%;
	}

	.was-man-sieht-logo-wrapper-inner
	{
		float: left;
		padding: 36px 0px 26px 0px;
		width: 100%;
	}

	.was-man-sieht-logo
	{
		height: auto;
		margin: 0px 5px 10px 5px;
		width: 135px;
	}

	.was-man-sieht-brillenabo-container
	{
		margin: 0;
		width: 100%;
	}

	.was-man-sieht-brillenabo-text
	{
		float: none;
		padding: 30px 0px 30px 0px;
		width: 100%;
	}

	.was-man-sieht-brillenabo-pic
	{
		float: none;
		margin: 0px 0px 36px 0px;
		width: 100%;
		text-align: center;
	}

	.was-man-sieht-brillenabo-pic img
	{
		margin: 0 auto;
		width: 135px;
	}

	.was-man-sieht-mehrbrillen-container
	{
		margin: 0;
		width: 100%;
	}

	.was-man-sieht-mehrbrillen-text
	{
		padding: 30px 0px 30px 0px;
		width: 100%;
	}


	/*Bereich: wen man sieht*/
	
	.wen-man-sieht-boxwrapper1024
	{
		width: 100%;
	}

	.wen-man-sieht-introtext-container
	{
		float: none;
		margin: 0px auto;
		padding: 152px 0px 30px 0px;
		width: 100%;
	}

	.wen-man-sieht-introtext
	{
		padding: 0;
	}
	
	.wen-man-sieht-headline-container
	{
		float: none;
		margin: 0px auto;
		padding: 30px 0px 40px 0px;
		width: 100%;
	}

	.wen-man-sieht-text-container
	{
		float: none;
		padding: 30px 0px 30px 0px;
		margin: 0px auto;
		width: 90%;
	}

	.wen-man-sieht-pic-container
	{
		float: none;
	}


	/*wo man sieht*/

	.wo-man-sieht-intro-2-text-container
	{
		float: none;
		margin: 0;
		padding: 30px 0px 30px 0px;
		width: 100%;
	}

	.wo-man-sieht-map-link
	{
		padding: 30px 0px 30px 0px;
	}

	.wo-man-sieht-map-link-icon {
		margin: -16px 0px 0px -3%;
		width: 40px;	
	}

	.wo-man-sieht-map-text-wrapper
	{
		width: 85%;
	}


	/*Impressum*/

	.impressum-text-container
	{
		margin: 0;
		padding: 30px 0px 30px 0px;
		width: 100%;
	}

	/*Archiv*/
	.archiv-text-container
	{
		float: none;
		margin: 0;
		padding: 30px 0px 30px 0px;
		width: 100%;
	}


	/*exklusiv*/
	.exklusiv-eyevan7285-introtext-wrapper
	{
		float: none;
		margin: 79px 0px 0px 0px;
		width: 100%;
	}

	.exklusiv-eyevan7285-intro-pic
	{
		float: none;
		margin: 0px auto;
		padding: 36px 0px 30px 0px;
	}

	.exklusiv-eyevan7285-introtext
	{
		padding: 0px 0px 30px 0px;
	}

	.exklusiv-eyevan7285-pic
	{
		float: none;
		width: 100%;
	}

	.exklusiv-eyevan7285-text
	{
		float: none;
		margin: 0px auto;
		padding: 31px 0px 29px 0px;
		width: 89%;
	}

	.exklusiv-vuarnet-introtext-wrapper
	{
		float: none;
		margin: 0px 0px 0px 0px;
		width: 100%;
	}

	.exklusiv-vuarnet-intro-pic
	{
		float: none;
		margin: 0px auto;
		padding: 35px 0px 31px 0px;
	}

	.exklusiv-vuarnet-introtext
	{
		padding: 0px 0px 29px 0px;
	}

	.exklusiv-vuarnet-pic
	{
		float: none;
		width: 100%;
	}

	.exklusiv-vuarnet-text
	{
		float: none;
		margin: 0px auto;
		padding: 29px 0px 30px 0px;
		width: 89%;
	}

	.exklusiv-masunaga-introtext-wrapper
	{
		float: none;
		margin: 0px 0px 0px 0px;
		width: 100%;
	}

	.exklusiv-masunaga-intro-pic
	{
		float: none;
		margin: 0 auto;
		padding: 36px 0px 0px 0px;
		width: 130px;
	}

	.exklusiv-masunaga-introtext
	{
		padding: 32px 0px 29px 0px;
	}

	.exklusiv-text-wrapper
	{
		margin: 0;
		width: 100%;
	}

	.exklusiv-text
	{
		padding: 31px 0px 29px 0px;
	}



	footer
	{
		padding: 7px 0px 29px 0px;
	}

	.footerinner
	{
		float: none;
		padding: 24px 0px 0px 0px;
		width: 100%;
	}

	.footerinnerwrapper
	{
		padding: 0px 0px 0px 0px;
	}

	.footer-row-wrapper-360
	{
		padding: 24px 0px 0px 0px;
	}
	
	.footer-row-wrapper-social-media {
		padding: 29px 0px 21px 40px;
		margin: 0% 0% 0% -3%;
		width: calc( 100% - 40px );
	}

	.footericon
	{
		margin: 0% 0% 0% -3%;
		width: 40px;
	}
	
	.footericon-calendar {
		margin: 2px 0% 0% -3%;
	}
	
	.footer-row-wrapper-phone {
		margin: -4px 0px 0px 0px;
	}
	
	.footer-row-wrapper-open-hours {
		margin: -6px 0px 0px 0px;
	}
	
	.footericon-email {
		padding: 5px 0px 0px 0px;
	}

	.footericon-location
	{
		padding: 8px 0px 0px 0px;
	}
	
	.footericon-social-media
	{
		margin: 0px 20px 0px 0px;
		width: 29px;
	}

	.footertext
	{
		font-size: 16px; 	/*16px*/
		line-height: 24px;	/*24px*/
	}
}


/*Smartphone landscape*/
@media screen and (max-width: 767px) and (orientation: landscape){

	/*Bereich: wie man sieht*/
	
	.wie-man-sieht-buchungsbutton .fontsize20regular {
		font-size: 0.9em; 		/*16px*/
		line-height: 1.5;		/*24px*/
	}

	.wie-man-sieht-buchungsbutton.wie-man-sieht-buchungsbutton-banner .fontsize20regular {
		font-size: 1em; 		/*16px*/
		line-height: 1.5;		/*24px*/
	}

	.introwrapper
	{
		margin: 0px auto;
		padding: 15% 0% 0% 0%;	
	}

	.gap-120 {
		height: 128%;
	}

	.parallax-image-wrapper-120 {
		height: 128%;
		top: -128%;
	}

	.wie-man-sieht-buchungsbutton {
		float: right;
		width: 200px;
	}
	
	.wie-man-sieht-buchungsbutton-left {
		float: left;
		width: 268px;
	}
	
	.banner-text-container {
		padding: 30px 0px 13px 0px;
		width: 300px;
	}
	
	.wie-man-sieht-buchungsbutton-banner {
		float: none;
		width: 296px;
	}
}

/*Smartphone portrait*/
@media screen and (max-width: 700px) and (orientation: portrait){

	/*Bereich: wie man sieht*/

	.introwrapper
	{
		margin: 0px auto;
		padding: 35% 0% 0% 0%;
	}
	
	.gap-120 {
		height: 115%;
	}

	.parallax-image-wrapper-120 {
		height: 115%;
		top: -115%;
	}	
}


@media screen and (max-width: 350px){
	.fontsize20regular
	{
		font-size: 14px; 	/*20px*/
		line-height: 20px;	/*27px*/
	}
	

	.wie-man-sieht-buchungsbutton {
		margin: 0px auto 30px auto;
		padding: 12px 0px 13px 0px;
		width: 266px;
	}
	
	.banner-text-container {
		width: 270px;
	}
	
	.banner-text {
		padding: 0px 0px 26px 0px;
	}

}


@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

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

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    /*a[href]:after {
        content: " (" attr(href) ")";
    }*/

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    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;
        height: auto;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

	body
	{
		font-size: 15px;
		line-height: 18px;
	}

	a, a:link, a:hover, a:active
	{
		font-size: 15px;
		line-height: 18px;
		text-decoration: underline
	}

	#frame
	{
		float: none;
		margin: 0cm 0cm 0cm 0.5cm;
		overflow: visible;
		width: 80%;
	}

	main,.main, #skrollr-body
	{
		background-color: #ffffff;
		float: none;
		margin: 0;
		overflow: visible;
		width: 100%;
	}


	.noprint, header, #primary-nav, #nav, #mainbottom, .aside, footer,
	.footerspacer, .headsmart, .formmenu, .subsubmenu, .slidergallerywrapper
	{
		display: none !important;
	}

}