/* VIZUAL */
.container.vizual { background: #232162; height: 343px }
.block.mantras { padding-top: 25px; text-align: left;}

#PhotoPreLoader { text-align: center; color: gray; line-height: 200%; font-size: 90%; padding: 80px 0 0 0 }
#SliderA, #SliderB { position: absolute; width: 100%; height: 500px; background-position: center top; background-repeat: no-repeat }

.promo-screen { /*background: rgba(191, 191, 191, 0.45);*/ float: right; text-align: right; z-index: 899; margin: 45px 105px 0 0; width: 65%; height: 275px; position: relative; color: #fff; text-shadow: 2px 1px 1px #000000; }
.promo-screen div.hover { display: none }
.promo-screen a h1 { font-size: 180%; font-weight: 100; line-height: 120%; color: #fff; text-decoration: none; }
/*.promo-screen a:hover div h1 { text-decoration: none; background: #00b1f1 }*/
.promo-screen p { line-height: 150%; padding: 20px 0 0 0 }
.promo-screen .mover { position: absolute; right: 15px; bottom: 0px; height: 50px; }
.promo-screen .mover img { margin: 0 25px; opacity: 0.7 }
.promo-screen .mover img.bull { margin: 0 8px 17px 0; cursor: pointer }
.promo-screen .mover img:hover  { opacity:1 }
.promo-screen .hover { cursor: pointer; min-height: 170px; position: relative; margin-top: 50px }
.promo-screen .hover .seemore { position: absolute; display: none; right: 50px; bottom: 40px; background: #2783d1; color: #fff; padding: 8px 14px; transition:background 0.3s ease-out; border-radius: 3px; font-size: 90%; text-shadow: none }
.promo-screen .hover:hover .seemore { display: block }
.promo-screen .hover .seemore:hover { background: #00b1f1; }


/* HOMEPAGE */
.mantra { float: left; width: 50%; min-height: 30px; line-height: 140%; margin: 15px 0; background: url(/img/ulli/ulli-blue-circ1.png) no-repeat 15px 0px }
.mantra p { padding: 0 0 0 50px; text-align: left }

.newsbox { float: left; width:22%; margin: 15px 1.5% 10px 1.5%; box-sizing: border-box; border-width: 1px; border-style: solid; overflow: hidden; position: relative }
.newsbox.tall { height: 350px }
.newsbox h2  { font-size: 120%; font-weight: 100; line-height: 120%; padding: 8px !important }
.newsbox figure { overflow:hidden; background: #fff; width: 100%; height: 50%; text-align: center }
.newsbox figure img { max-height: 100%; width: 100%; margin: 0px; padding: 0 }
.newsbox p { padding: 8px; line-height: 140%; font-size: 90% }
.newsbox .shape { position: absolute; right: 8px; bottom: 8px }

a .newsbox h2 { color: #fff !important }

a .newsbox { background:#232162; color: #fff;  border-color: #232162 }
a .newsbox.blue { background:#0082b1; color: #fff;  border-color: #0082b1 }
a .newsbox.gray { background:#2E3637; color: #fff;  border-color: #2E3637 }
a .newsbox.green { background:#4CAD2D; color: #fff;  border-color: #4CAD2D }
a .newsbox.CYAN  { background:#009ee0; color: #fff;  border-color: #009ee0 }
a .newsbox.CYAN h2 { color: #fff }
a .newsbox.BLACK { background:#0a0b0c; color: #fff;  border-color: #0a0b0c }
a .newsbox.DarkLava { background:#183884; color: #fff;  border-color: #183884 }
a .newsbox.Pink { background:#901e78; color: #fff;  border-color: #901e78 }
a .newsbox.GreyGreen { background:#009795; color: #fff;  border-color: #009795 }
a .newsbox.DarkGreen { background:#5bb26e; color: #fff;  border-color: #5bb26e }
a .newsbox.LightGreen { background:#84c525; color: #fff;  border-color: #84c525 }
a .newsbox.Grey { background:#2f3242; color: #fff;  border-color: #2f3242 }
a .newsbox.LightGrey { background:#c2c1c1; color: #fff;  border-color: #c2c1c1 }
a .newsbox.Violet { background: #232162; color: #fff;  border-color: #232162 }
a .newsbox.Tyrkys { background:#0dbad0; color: #fff;  border-color: #0dbad0 }
a .newsbox.Red { background:#da251d; color: #fff;  border-color: #da251d }

.nnx-homepage { text-align: center; padding: 0 23px 0 23px }
.nnx-homepage h1 { font-size: 180%; font-weight: 100; color:#00adec; padding: 0 0 10px 0 !important; margin: 0 !important; line-height: 120%;   }
.nnx-homepage h2 { font-size: 150%; font-weight: 100; color:#00adec; padding: 0 0 10px 0;  }
.nnx-homepage h3 { font-size: 120%; font-weight: 300; color:#00adec; padding: 0  }
.nnx-homepage hr { clear: none; width: 100%; height: 0px; display: block; margin: 15px 0; border: none; border-top:5px dotted #acacac }



@media screen and (max-width: 600px) {  
   .promo-screen { margin: 25px 20px 0 15px; width: auto }    
   .mantra { width: 90%; margin: 5% }
   .news-box { box-sizing: border-box}
   .news-box.full-size { width: 96%; margin: 2%; border: 1px solid #dfdfdf; height: auto }
   .news-box.half-size { width: 46%; margin: 2%; float: left  }   
}