@font-face {
font-family: 'parisienneregular';
src: url('../font/parisienne-regular-webfont.woff2') format('woff2'),
url('../font/parisienne-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
html *{
margin:0;               
padding:0;
border:none;
}  
 body{           
color:#000; 
}
.pagebg{
position:fixed;
left:0;
top:0;
z-index:-1;
width: 100vw;
height: 100vh;
margin:0;
padding:0;
opacity:0.6;
background-image: url('../images/background/landscapeopeningnew.jpg');
background-position: 50% 100%;
background-repeat: no-repeat;
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover;
background-size: cover;
}
.container{
display:flex;
flex-flow:column;
width:100%;
min-height:100%;
margin:auto;
padding:0;
}
.openingtop{
display:flex;
flex-flow:row wrap;
justify-content:space-around;
align-items:center;
width:100%;
height:auto;
margin:10px auto auto auto;
padding:0;
}
.openingunder{
display:flex;
flex-flow:row wrap;
justify-content:space-around;
align-items:center;
width:100%;
height:auto;
margin:auto auto 10px auto;
padding:0;
}
.midden{
display:flex;
flex-flow:row wrap;
justify-content:center;
width:100%;
height:auto;
margin:0 auto 0 auto;
padding:0;
}
.starter{
width:100%;
max-width:75%;
font-family:Lato;
font-size:1.2rem;
font-weight:bold;
text-align:center;
color:#000;
padding:10px;
margin:0 auto 10px auto;
background: -webkit-linear-gradient(rgba(151,201,227,0.7),rgba(151,201,227,0.7)); 
background: -o-linear-gradient(rgba(151,201,227,0.7),rgba(151,201,227,0.7));      
background: -moz-linear-gradient(rgba(151,201,227,0.7),rgba(151,201,227,0.7));     
background: linear-gradient(rgba(151,201,227,0.7),rgba(151,201,227,0.7)); 
-moz-border-radius:50px 0 50px 0;
border-radius:50px 0 50px 0;
}
.imgmiddle{
width:100%;
margin:0 auto 0 auto;
}
img.middle{
width:100%;
margin:0 auto 0 auto;
}
a.kliknews, a:link.kliknews, a:visited.kliknews, a:active.kliknews{
display:inline-block;
width:auto;
font-family:Lato,Arial;
font-size:0.8rem;      
font-weight:bold;  
color:#fff;
text-transform: uppercase;
margin: 0 auto;
padding:5px 25px 5px 25px;
text-decoration:none;
outline-style:none;
background-color: #c6144c;
-webkit-border-radius:0 20px 0 20px;
-moz-border-radius:0 20px 0 20px;
border-radius:0 20px 0 20px;
}
a:hover.kliknews{
color:#fff;
margin: 0 auto;
padding:5px 25px 5px 25px;
background-color: #646464;
}
a:hover.kliknews::after{
content:'>';
position:absolute;
margin:0 0 0 10px;
}
.openingbox{
width:auto;
height:auto;
margin:0 10px 0 10px;  
}
img.item{
width:100%;
max-width:150px;
height:auto;
margin:auto 5px 10px auto;
box-shadow: rgba(0, 0, 0, 1) 0 15px 20px -20px;
}
.overlay{
position:relative;
width:auto;
height:auto;
z-index:2;
margin:0;
padding:0;
}
.title{
display:flex;
justify-content:center;
align-items:center;
position:absolute;
top:0;
z-index:5;
width:100%;
height:100%;
font-family:Lato;
font-size:1.2rem;
font-weight:bold;
color:#fff;
text-shadow:3px 3px 5px #000;
-webkit-animation: fadeintitle 2s; 
-moz-animation: fadeintitle 2s; 
-ms-animation: fadeintitle 2s; 
-o-animation: fadeintitle 2s; 
animation: fadeintitle 2s;
}      
 @keyframes fadeintitle
 {
from { 
opacity: 0; 
}
to { 
opacity: 1; 
}
}

/* Firefox */
@-moz-keyframes fadeintitle {
from { 
opacity: 0; 
}
to { 
opacity: 1; 
}
}

/* Safari and Chrome */
@-webkit-keyframes fadeintitle {
from { 
opacity: 0; 
}
to { 
opacity: 1; 
}
}

/* Internet Explorer */
@-ms-keyframes fadeintitle {
from { 
opacity: 0; 
}
to { 
opacity: 1; 
}
}

/* Opera */
@-o-keyframes fadeintitle {
from { 
opacity: 0; 
}
to { 
opacity: 1; 
}
}

.imgtitle:hover .title, .imgtitlecurrent .title{
/*display:none;*/
opacity:0.9;
color:#ff0000;

-webkit-animation: fadeout 2s; 
-moz-animation: fadeout 2s; 
-ms-animation: fadeout 2s; 
-o-animation: fadeout 2s; 
animation: fadeout 2s;
}      
 @keyframes fadeout {
from { 
opacity: 1; 
color:#fff;
}
to { 
opacity: 0.9; 
color:#ff0000;
}
}

/* Firefox */
@-moz-keyframes fadeout {
from { 
opacity: 1; 
color:#fff;
}
to { 
opacity: 0.9; 
color:#ff0000;
}
}
/* Safari and Chrome */
@-webkit-keyframes fadeout {
from { 
opacity: 1; 
color:#fff;
}
to { 
opacity: 0.9; 
color:#ff0000;
}
}

/* Internet Explorer */
@-ms-keyframes fadeout {
from { 
opacity: 1; 
color:#fff;
}
to { 
opacity: 0.9; 
color:#ff0000;
}
}

/* Opera */
@-o-keyframes fadeout {
from { 
opacity: 1; 
color:#fff;
}
to { 
opacity: 0.9; 
color:#ff0000;
}
}
.backtop a{
position:fixed;
right:1%;
bottom:1%;
width:50px;
height:50px;
z-index:20;
background-image: url('../images/backtop.png');
background-position: 0 0;
background-repeat: repeat;
text-decoration:none;  
outline-style:none; 
cursor:pointer;
}

html, body{
height:100%;
}  

@media only screen and (min-width: 696px) and (max-width: 1024px){
img.item{
width:100%;
max-width:125px;
}
.title{
font-size:1rem;
}
}
@media only screen and (min-width: 240px) and (max-width: 695px){
img.item{
width:100%;
max-width:115px;
}
.title{
font-size:0.8rem;
}
}
@media only screen and (min-width: 240px) and (max-width: 336px){
img.item{
width:100%;
max-width:105px;
}
.title{
font-size:0.8rem;
}
}
@media only screen and (orientation:portrait){
.pagebg{
position:fixed;
left:0;
top:0;
z-index:-1;
width: 100vw;
height: 100vh;
margin:0;
padding:0;
opacity:0.6;
background-image: url('../images/background/portraitopeningnew.jpg');
background-position: 50% 100%;
background-repeat: no-repeat;
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover;
background-size: cover;
}
}

