/* Nikodemus-Kirche CSS
*********************************************/
/*Farben alte site
hellblau (body) #dee1f0
dunkelblau #053982
mittel-dunkelblau #00509d
mittel-hellblau #d3d7eb
hellrot #f3d4d0
rot #c1003b
anthrazit #231f20
#e0e5e9 blassblaugrau hintergrund
#ae2f88 violett
#f3c017 goldgelb*/
/* east-sea-dokdo-regular - latin */
@font-face {
  font-family: 'East Sea Dokdo';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/east-sea-dokdo-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/east-sea-dokdo-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/east-sea-dokdo-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/east-sea-dokdo-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/east-sea-dokdo-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/east-sea-dokdo-v18-latin-regular.svg#EastSeaDokdo') format('svg'); /* Legacy iOS */
}
     url('../../fonts/source-sans-pro-v14-latin-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}
html {
	/* scrollbar fix (prevent ugly left pull for lower content sites) */
	overflow-y: scroll;
	box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
background-color: #fff; 
color:#231f20;
font-size:.9em;
line-height:140%;
}
/*---edit buttons-----------*/
body a.btn.jmodedit:before{
 content:"edit module";
 color:#fff !important;
 background-color:green !important;
 border: 1px solid black !important;
 padding:5px !important;
 font-size:20px !important;
 font-weight:bold !important;
}

.hidden {display:none;}
/* Menü-Bearbeiten-Button */
body a.btn.jfedit-menu:before{
 content:"edit menu";
 color:#fff !important;
 background-color:green !important;
 border: 1px solid black !important;
 padding:5px !important;
 font-size:20px !important;
 font-weight:bold !important;
}
/*damit Kalenderbeschriftungen umgebrochen werden und genug Kontrast haben */
.viewContainerTBody a.label {white-space:pre-wrap;color:#000;}
 .fabrikEvent a:hover,  .fabrikEvent a:focus,  .fabrikEvent a:active {color:#000;text-decoration:underline;}
 .well.well-small.monthDisplay {font-weight:bold;font-size:2em;}
/*------------------*/
.table th, .table td{padding:2px;}
/*damit Nachricht editierbar bleibt
.dropdown-menu {display:inline;}
.dropdown-menu li {display:none;}
.dropdown-menu li.edit-icon {display:inline;}
----------------*/
#screen {

    font: 13px/150% Arial,Helvetica,sans serif;
    height: auto;
	width:96%; padding:2%;
    margin: 10px auto;
    overflow: hidden;
    position: relative;
    text-align: left;
    max-width: 980px;
	z-index:2;
}

ul.breadcrumb {list-style-type:none;
  float:left;margin:0; 
  margin: 0 0 5px 0px;
  padding:0 10px;
  }
ul.breadcrumb li {float:left;color:#053982;margin:0;}
ul.breadcrumb a {color:#053982; text-decoration:none;padding: 0 3px; font-weight:bold;}
span.divider {padding:0 5px;}
/*Header und Navi*/
#header {
  float:left;
  width:100%;
  margin:0px;
  background-color:#ffffff;
  text-align:center;padding:0px;height:80px;
  }
  .jmg-calendar-body {margin-bottom:20px;}
  #slideshow {width:100%;display:none; height:auto;}

	#logo{text-align:right;float:left; z-index:2;width:60%; height:120px; background-image:url("https://www.kulturkirche-nikodemus.berlin/templates/kulturkirche/images/kirchlicher-ort.svg"); 
			background-repeat: no-repeat; background-size: contain; margin-left:10px;
			background-position:0px 0px;
	}
	#logo a {display:block; padding:40px; text-decoration:none;}
	#uebergang {background-image: linear-gradient(to left, transparent, white);width:20px; height:163px;position:absolute;top:0px;left:25%;z-index:5;}

	#navigation {width:auto;float:left;background-color:#fff; height:auto;margin:15px 9px 0;}
	#navigation ul {margin:0;padding:0;list-style:none;}
	#navigation li {float:left; width:auto;}
	#navigation a:link, #navigation a:visited {padding:10px 15px; font-weight:bold; color: #053982;}
	#navigation a:focus, #navigation a:hover, #navigation a:active {text-decoration:none; background-color: #dee1f0; }
	/*Suche*/
	.search-suche  {float:right;margin:17px 8px 0 0;}
	.search-suche button {border:none;padding:5px;color:#053982;font-weight:bold; background-image:linear-gradient(to bottom, #dee1f0,#dee1f0);}
	input {font-size:13px;}
	.form-inline label.element-invisible {display:none;}
.element-invisible {display:none;}
.search-suche  {width:auto; float:right;margin:0px 8px 0 0;}
.inputbox.search-query {height:20px;}
.componentheading {display:none;}
.open {

			width: 40px;
            height: 30px;
			position:absolute; right:20px; top:20px;
            background: url(../images/menu.png) center center no-repeat #053982;
            -moz-border-radius: 8px;
            -webkit-border-radius: 8px;
            -border-radius: 8px;
            box-shadow: inset 0 0 3px #000;
            text-indent: -999999px;
            border: 0;
        }
#pageslide {
            /* These styles MUST be included. Do not change. */
            display: none;
            position: absolute;
            position: fixed;
            top: 0;
            height: 100%;
            z-index: 999999;
			overflow-y: scroll;
            /* Specify the width of your pageslide here */
            width: 250px;
            padding: 20px;

            /* These styles are optional, and describe how the pageslide will look */
            background-color: #dee1f0;
            color: #053982;
           /* -webkit-box-shadow: inset 0 0 5px 5px #222;
            -moz-shadow: inset 0 0 5px 5px #222;
            box-shadow: inset 0 0 5px 5px #222;*/
			border-right:5px solid #053982;
        }
#hauptteil {
   float:left;
   width: 90%; 
   height:auto; min-height:500px;
   text-align: left;
   padding:0px 12px 30px 12px;
   margin-top:0px;}
.facebook p {clear:both;}
.facebook img {margin-bottom:10px;}
#navigation {display:none;}


#footer {padding:10px 10px;}   
 #login ul.menu {margin:0; padding:0; list-style-type:none;}
#login ul.nav li {float :left; padding:2px 10px;background-color:#cccccc; border:1px solid #fff;}

  #links {float:right; width:100%;} 
.moduletable.newsletter { background-color:#dee1f0; padding:1px 0 0 6px; width:100%;color:#053982;margin: 10px 0;}
.custom-spenden {max-height: 100px;overflow: hidden;margin: 10px auto; max-width:300px; background-image:url(../images/spende-1.jpg); background-repeat:no-repeat; background-position:center top; }
.custom-spenden h3 a {background-color: #fff; margin: 10px; color: #053982; text-align:center;}
.custom-spenden a {display:block;}
#rechte_seite {float:right;width:100%;}

#rechts{width:100%;  float:left;  height:auto; margin:20px;}
.veranstaltungen h1 a, .gottesdienste h1 a {
    margin-right: 0px;
    padding: 5px 5px 5px 10px;
    text-decoration: none;
	 background-color: #053982;
    color: #ffffff;
    display: block;
    font: bold 11px/15px Arial,Helvetica,sans serif;}
  #inhalt {width:100%;
  float:left;
  height:auto;
  color:#1d1512;

  }
  .brush { font-family: 'East Sea Dokdo', Verdana;}
  .scroll {overflow-y:scroll;}
  .scroll p  {margin:0;}
.moduletable {max-width:98%;}
   .veranstaltungen, .gottesdienste{width:100%;}
 #inhalt .veranstaltungen, #inhalt .gottesdienste {display:none;}
.custom.rosa {background-color:#f3cde8; padding: 0 10px; margin-bottom:10px;}
#rechts .moduletable.rosa {
  margin-right: 20px;
}
.moduletable.slider.center { /*GKR Slider Abstand */
  margin-left: 40px;
}
div.gkr { width: 100%;}
#inhalt .veranstaltungen, #inhalt .gottesdienste {display:inline-block;}
#inhalt .veranstaltungen h1 a, #inhalt .veranstaltungen h4 a {    margin-right: 0px;margin-top:-8px;   padding: 5px 5px 5px 10px;  background-color: #053982;
    color: #ffffff;
    display: block;
    font: bold 11px/15px Arial,Helvetica,sans serif;}
pre {background-color:transparent !important;border:0 !important;}
#rechts .veranstaltungen, #rechts .gottesdienste {display:none;}
#footer {clear:both; text-align:center; width:100%;padding:10px 20px;background-color:#053982;color:#ffffff;font-size:90%;
  -moz-column-count: 1;
  -webkit-column-count: 1;  
  column-count: 1;
}
 #footer .custom{
	 -webkit-column-break-inside: avoid;
     page-break-inside: avoid;
     break-inside: avoid;
	 text-align:left;padding:0;
	 max-width:90%;}
.gm-style .gm-style-iw {color:#053282;}
#footer ul.menu {list-style-type:none; margin:0 ;  width:100%; padding:0;text-align:left;display:flex; flex-wrap:wrap;
     page-break-inside: avoid;     break-inside: avoid; font-weight:bold; justify-content:space-between;}
#footer ul li { width:48%;}
#footer ul.menu a:link, #footer ul.menu a:visited {color:#fff; padding:3px 0 3px 20px;}
#footer ul.menu a:hover, #footer ul.menu a:active, #footer ul.menu a:focus , #footer .nav >li>a:focus, #footer >.nav > li > a:hover, #footer> .nav > li > a:active{color:#fff; text-decoration : underline; background-color:transparent;}
#ihreanzeige {padding:10px;margin:0 0 30px;
	background-color: #d3d7eb; width:100%; text-align: center;}
	#ihreanzeige h2 a{color:#053982;}
.newsflash, .moduletable.hellblau {padding:25px 10px 5px 10px;margin:0 0 30px;
	background-color: #d3d7eb;
    background-image: url("https://kulturkirche-nikodemus.berlin/templates/kulturkirche/images/news.gif");
    background-position: 0 0;
    background-repeat: no-repeat;
    height: auto;
	width:100%;}
.newsflash.kirchenmusik {margin:15px 0;}
.newsflash a {font-weight:bold;}
.gottesdienst-video {/* background-color:#b3e681; margin-bottom:10px;*/}
.gottesdienst-video .moduletable {padding:0 10px; margin-bottom:15px;}
#corona-telefon {background-image: url('https://kulturkirche-nikodemus.berlin/images/news/2020/CoronaTelefon-hintergrund.jpg');  color: #fff !important; padding: 40px; text-align: center;}
#corona-telefon h3 {font-size: 18px; line-height: 150%; color: #fff !important;}
#corona-telefon h1 {color:#fff !important;}
#inhalt img{float:left; margin-right:10px;}
#inhalt .bilder {display:flex; flex-wrap:wrap;}
#inhalt .bilder img {width:98%; padding:10px 5px 0 5px;}
#inhalt .newsflash img.normal, #inhalt img.normal {width:100%;margin-left:0px;margin-right:0px;}
#inhalt .newsflash img.left {float:left; padding:0 0 10px 0;}
 .nikokirche {background-image:url('https://kulturkirche-nikodemus.berlin/images/bilder/kirchenansicht/nikokirche.jpg'); background-repeat:no-repeat; background-position:top right; color: #fff !important;
padding:10px 150px 10px 10px;} 
#inhalt .nikokirche h2,.nikokirche p {line-height:140%; padding:5px;}
.nikokirche p{background-color:#e2001a; }
.wirsindda {    padding: 1px 10px;
    background-color: #c2a2e1;
    border-radius: 10px;margin-bottom:10px;
	max-width: 90%;
	display: inline-block;}
.wirsindda h3 {font-size:19px;}
.ausschuss {width:100%; background-color:#e0e5e9; padding:10px; margin-bottom:20px;}
.avPlayerWrapper .avPlayerContainer .avPlayerBlock audio {  background-color: transparent;}
div.magazin {width:100%; background-color:#e0e5e9; padding:15px; margin-bottom:20px; overflow:hidden;}
.magazin h3 {font-size:17px; line-height:1.5;color:#053982; margin-top:0;}
.magazin h2 a {color:#053982;}
ul.magazin {list-style-type:none; clear:both;}
ul.magazin li {float:left; width:250px; padding:5px;}
ul.magazin li img {}
ul.magazin {padding:0;margin-left:12px;}
div.weihnachten {width:100%; background-color:#b8a3ca; padding:10px; margin:20px 0; overflow:hidden;}
.weihnachten h3 {font-size:17px; line-height:1.5;color:#053982; margin-top:0;}
.ostern {background-color:#fff; padding:5px; width:100%;}
.ostern h2 {color: #ae2f88;}
.goldgelb {background-color:#f3c017; padding:10px;margin:5px 0;}
.violett {background-color: #ae2f88; color:#fff; padding:10px;}
.links {float:left; margin-right:15px;}
.right {float:right; margin-left:15px;}
.facebook p {font-size:90%;}
.facebook img, .google img {float:left;margin-right:10px;}
a.readmore {font-size:90%;color:#000; text-decoration:none; font-weight:bold;}
p.readmore {margin-top:-10px;margin-bottom:15px;text-align:right;}
a.readmore:link, a.readmore:visited  {color:#053282; text-decoration:none;padding-bottom:10px;}
.alarm a.readmore:link, .alarm a.readmore:visited  {color:#fff; background-color:#053282; text-decoration:none;padding:5px;}
a.readmore:hover, a.readmore:focus, a.readmore:active {text-decoration:underline;}
.blog a.btn:link, .blog a.btn:visited {border:0; background-image:none;color:#053282; font-weight:bold}
.blog a.btn:hover, .blog a.btn:focus, .blog a.btn:active {text-decoration:underline;}
a:link, a:visited {color:#000;text-decoration:none;}
a:focus, a:hover, a:active {text-decoration:underline;}
a.nach_oben{padding-right: 30px;margin-top:5px; color:#1d1512;font-size:75%;background-image:url(https://www.kulturkirche-nikodemus.berlin/templates/kulturkirche/images/nach_oben.png); background-repeat:no-repeat; background-position: right 0px;padding-top:8px;}
#inhalt h1 {font-size:140%; color:#053982; font-family: Arial, Helvetica, sans serif; line-height:140%;}
#inhalt #acyarchiveview .contentheading {  display: none;}
#inhalt h2 {font-size:1.5em;}

#inhalt h3 {font-size:1.2em;}
ul#nav {display:none;list-style-type:none;margin:0; padding:0; }
ul#nav ul {list-style-type:none;margin:0;padding-left:20px;}
ul#nav li {font-weight:bold;} ul#nav ul li {font-weight:normal;}
ul#nav li >a:link, ul#nav li > a:visited {padding:6px 0; display:block;color:#000;}
ul#nav li > a:hover, ul#nav li > a:active, ul#nav li >a:focus {color:#1d1512;text-decoration:underline;}
.icon-delete {background-position:-310px 0;}
.fabrik_select.fabrik_element input, .heading.fabrik_select input {display:none;}
th.heading div.btn-group {display:none;}

.fabrikSubElementContainer {float:left;width:45%;}
td,th {padding:5px 10px 0 0px}

.fabrikEvent.label.Gottesdienst,.fabrik_row.Gottesdienst{background-color:#CB84E3!important;}/*violett*/
.fabrikEvent.label.Konzert, .fabrik_row.Konzert{background-color: #90C3D4!important;}/*hellblau*/
.fabrikEvent.label.Privatfeier, .fabrikEvent.label.Tonaufnahme, .fabrikEvent.label.andere, .fabrik_row.Tonaufnahme, .fabrik_row.Privatfeier, .fabrik_row.andere {background-color:#F5DE84!important;}/*hellgoldgelb*/
.fabrik_row.Gemeinde, .fabrikEvent.label.Gemeinde {background-color:#96F071!important;}/*hellgruen*/
.fabrik_row.wichtig, .fabrikEvent.label.wichtig {background-color:#F76D6D!important;}/*hellrot*/
.fabrik_row.extern, .fabrik_row.Martin-Luther, .fabrikEvent.label.extern, .fabrikEvent.label.Martin-Luther {background-color:#81D6A4!important;}/*mintgruen*/
.fabrik_row.intern, .fabrikEvent.label.intern{background-color:#D4C7C7!important;}/*roetlichgrau*/
.fabrik_row.intern, .fabrikEvent.label.abgesagt{background-color: rgb(237, 237, 237) !important;text-decoration:line-through;}
.table-hover tbody tr:hover >td, .table-hover tbody tr:hover >th {background-color:#dee1f0;}
/*JEVENTS*/
#jevents_header{display:none;}
/*Inputfelder geraeumiger*/
.ff_elem.inputbox, .fabrikinput.inputbox, .controls input, input.inputbox, .filter-search.btn-group.pull-left > input {height:30px;}
/*Kategorieblog*/
dt.article-info-term{display:none;}
/*Accordion*/
h4.panel-title, .panel h3 { background-color:#5057a9;}
h4.panel-title a, .panel h3 a {padding:5px 10px; color:#fff; font-weight:bold; display:block;}
.panel h3 a:link, .panel h3 a:visited ,h4.panel-title a:link, h4.panel-title a:visited {color:#fff;}
.panel h3 a:hover, .panel h3 a:active, .panel h3 a:focus, h4.panel-title a:hover, h4.panel-title a:active, h4.panel-title a:focus {color:#fff; text-decoration: underline;}
.panel h3.pane-toggler-down:before, .panel-heading .accordion-toggle:before {
    /* symbol for "opening" panels */
  content:url(../images/icons/accordion-open.png); float:left; padding:10px 5px 0;

}
.panel h3.pane-toggler:before,.panel-heading .accordion-toggle.collapsed:before {
    /* symbol for "collapsed" panels */
    content:url(../images/icons/accordion-close.png); float:left; padding:5px;
}
.phoca-dl-file-box-mod .pd-document32 {height:auto !important;}
.zweispaltig {column-count:1;}
div.info { background-color:#c9ddf0; padding:0 20px 10px;}
/*3G Regel - Banner*/

.newsflash.slider {
   padding: 0 10px;
   clear:both;
}
.alarm {
  position: relative;
}
.banner {
  transform: rotate(38deg);
  text-align: center;
  right: -27px;
  top: 75px;
  position: absolute;
  z-index: 30;
  background-color: #c1003b;
  color: #fff;
  font-weight: bold;
  padding: 5px 20px;
  letter-spacing: 1px;
}
/* MEDIA QUERIES
*********************************************/

/* Extra small devices (phones, less than 768px) */
/* No media query -> mobile first strategy */
@media (min-width:450px){#hauptteil {margin-top:20px;}}
@media (min-width:550px){
	#inhalt .newsflash img.normal, #inhalt img.normal {width:50%;margin-left:10px;float:right;}
  div.gkr {margin-left: 30px; float: right; width: 250px;}
}

/* Small devices (tablets, 760px and up) */
@media (min-width: 760px) {
	.zweispaltig {column-count:2; column-gap:10px;}
	.search-suche  {margin:-22px 8px 0 0;}
	.search-suche form {margin:0;}
	.search-suche  {width:auto; float:right;margin:-22px 0px 0 0;}
	.search-suche input {font-size:13px;max-width:100px;margin:3px;}
	.inputbox.search-query {    height: 16px;}
	#navigation {display:inline; margin: -5px 0px 5px; background-color:#dee1f0;width:100%;display:flex;justify-content:space-between; height:auto;}
  	.search-suche  {margin:3px 0;}
	.search-suche form {margin:0;}
	#navigation a:link, #navigation a:visited {padding:8px 5px; font-weight:normal; color: #053982;font-size:12px;}
	.open { display: none; }
	ul.breadcrumb li {margin: 0px;}
	#screen {padding:0;}
ul.magazin li {float:left; width:200px; padding:5px;}
ul.magazin li img {}
.ostern {background-image:url('https://www.kulturkirche-nikodemus.berlin/templates/kulturkirche/images/osterblumen.jpg'); background-repeat:no-repeat; background-position:top left; padding: 5px 5px 5px 150px;}
	#header {text-align:right;height:auto;padding:0px;margin-bottom:5px;}

		#slideshow {font:12px italic normal Arial; float:right; width:75%; padding:0;display:inline;	}
		#logo {width:23%; height:155px; top:0px; position:absolute;	left:0px;background-position:0px 58px;}
	#logo a {padding:90px 40px 60px 40px;}
#hauptteil {margin-top:0px; width:100%;}
#footer ul.menu {flex-wrap:nowrap;}
#footer ul.menu li {width:100%;}
#footer {  display:flex; flex-wrap: wrap; justify-content:space-between;} 
#footer .custom { width:48%;}
#newsletter{padding: 5px 66% 10px 10px;margin-top:0px;}
#rechte_seite {width:100%;
	display: flex;
	justify-content: space-between;}
#rechts div, #rechts h1 {}
#rechts {margin-top:-10px; width:30%; margin:0;}
#inhalt {width:66%; }
#ihreanzeige {width:40%; float:right; margin:15px;}
#inhalt h1 {font-size:140%;}
#inhalt h2 {font-size:1.5em;}
#inhalt h3 {line-height:24px; font-family:Arial, Helvetica, sans serif;}
#inhalt img.normal, #inhalt .newsflash img.normal {float:right; margin-left:10px;margin-right:0px; width:30%; height:auto;}
#inhalt .newsflash img.normal { margin-left:10px;margin-right:0px;  }
#inhalt .bilder img {width:48%;}
#inhalt .veranstaltungen {display:none;}
   #rechts{  width:29%;   }
 #rechts .veranstaltungen, #rechts .gottesdienste {display:inline;}
 #rechts .gottesdienste .moduletable {margin-bottom:10px;}
   #rechts .custom {width:100%; margin-top:5px; padding:10px;}
	.ux-menu-container {width:auto;}
	.items-leading [class*="leading"] {padding:10px;}
	.item-page {padding:0 10px;}
	.ausschuss {width:45%; margin-right:20px; float:left;}
	div.info {padding: 10px;float: right; margin: 0 0 0 10px;}
}
/*Zwischen Tablet und Desktop*/
@media(min-width:867px){
	#inhalt img {}
	#navigation {margin:10px 0 5px 0;}
	#navigation a:link, #navigation a:visited {padding:8px 13px; font-weight:normal; color: #053982;font-size:13px;}
	#logo {background-position:0px 79px; height:165px;}
	#logo a {padding:60px 40px 90px 20px;}
	#inhalt {padding: 0 10px;}
	.ux-menu-container {width:auto;max-width:700px;}

 .newsflash {width:98%;}
  #corona-telefon {background-repeat: no-repeat; background-size: contain; height: 357px;}
  #corona-telefon h3 {font-size:24px;}
}
/* Medium devices (desktops, 992px and up) */
@media (min-width: 997px) {
		#screen {-webkit-box-shadow: 3px 3px 5px 1px #666;
		-moz-box-shadow: 3px 3px 5px 1px #666;
		box-shadow: 3px 3px 5px 1px #666;}
	#navigation a:link, #navigation a:visited {padding:10px 13px; font-weight:bold;font-size:14px;}
ul.magazin li {float:left; width:150px; padding:5px; width: calc(100%/4 - 10px); height: auto;}
ul.magazin li img {max-height:200px;}
	.search-suche input {font-size:13px;max-width:200px;}

	#links {width:24%; float:left;}
#links #newsletter {padding:0;}
#newsletter{padding: 1px 10px 10px;}
	
	.newsflash {width: 92%; margin: 0 auto 30px;}
#rechte_seite {
	width:73%;
	display: flex;
	justify-content: space-between;
	padding-right:20px;}
#rechts div, #rechts h1 {}
#rechts {margin-top:-10px;}
#header {height:160px;}
#rechts .custom {width:100%;}
#footer {  -moz-column-count: 3;
  -webkit-column-count: 3;  
  column-count: 3;} 
  #footer ul.menu a:link, #footer ul.menu a:visited { padding:3px 24px 3px 0px;}
  #inhalt img.normal {float:right; margin-left:10px;margin-right:0; width:45%; height:auto;}
    #inhalt .newsflash img.normal {margin-left:10px;margin-right:0px; width:45%;}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}

/* for higher resolutions (android and retina) */
@media screen and (-webkit-min-device-pixel-ratio: 1.5), screen and (max--moz-device-pixel-ratio: 1.5) {
  
}