/* additions for the "primera" page */

@font-face {
  font-family: 'Eurostile';
  src: url('../fonts/primera/eurostileltstd-cn-webfont.woff') format('woff');
  font-style:normal;
  font-weight:400;
}
@font-face {
  font-family: 'Eurostile';
  src: url('../fonts/primera/eurostileltstd-boldcn-webfont.woff') format('woff');
  font-style:normal;
  font-weight:600;
}

body,
html{
    background-color:#fff;
}
#primeraTopMenu{
    position:fixed;
    top:0px;
    left:0px;
    height:113px;
    width:100%;
    background-color:#fff;
    background-image:url('../img/primera/menu-top.jpg');
    background-repeat:no-repeat;
    background-position:center top;
    background-size:auto 100%;
    z-index:10;
    box-shadow:0px 0px 3px rgba(0,0,0,.3);
}
#primeraBottomMenu{
    background-image:url('../img/primera/menu-below-rep.jpg');
    background-size:100% 100%;
    background-repeat:repeat-x;
    width:100%;
    height:54px;
    position:relative;
}
#BottomMenuContent{
    height:100%;
    width:100%;
    position:absolute;
    left:0px;
    top:0px;
    background-image:url('../img/primera/menu-below.jpg');
    background-size:auto 100%;
    background-repeat:no-repeat;
    background-position:center top;
}
#contentbefore{
    width:100%;
    height:113px;
}
#content{
    height:calc(100% - 282px);
    width:100%;
    position:relative;
    padding:0;
}
#content #wallpaper{
    height:100%;
    width:100%;
    position:absolute;
    left:0px;
    top:0px;
    background-size:cover;
}
#contentCenter{
    width:980px;
    margin:0 auto;
    height:90%;
}
.message__wrapper{
    display:table-cell;
    vertical-align:middle;
    padding:80px 0px;
}
.message{
    margin:0 !important;
    color:#333399;
    font-family:'Eurostile';
    box-sizing:border-box;
    padding:110px 50px 70px 40px;
    position:relative;
    overflow:hidden;
    transform-origin:0 50%;
    -webkit-transform-origin:0 50%;
    width:100%;
}
.message:before{
    position:absolute;
    background-color:#fff;
    width:160%;
    height:90%;
    border-radius:50% 50% 50% 50%;
    z-index:0;
    content:"";
    left:50%;
    top:50%;
    transform:translate(-50%,-50%) rotate(-6deg);
    -webkit-transform:translate(-50%,-50%) rotate(-6deg);
    box-shadow:0px 2px 30px rgba(0,0,0,.1);
}
.messageContent{
    position:relative;
    z-index:10;
}
.message .tag{
    position:absolute;
    left:0px;
    top:-18px;
    width:200px;
    height:140px;
    background-repeat:no-repeat;
    background-position:center center;
    background-image:url('../img/primera/fijne-wensdagen.png');
    z-index:100;
}
.message h1{
    line-height:100%;
    font-weight:600;
    margin-top:16px;
}
.message p{
    padding-top:6px;
    font-weight:400;
}
.message__wrapper .message a.use-bot{
    font-family:'Eurostile',sans-serif;
    font-weight:600;
    background-color:#ffcc33;
    border-color:transparent;
    color:#fff;
    border-radius:30px;
    padding-left:26px;
    height:60px;
    line-height:58px;
}
#primeraBasket_before{
    width:100%;
    height:30px;
}
#primeraBasket{
    width:100%;
    height:544px;
    background-position:center center;
    background-repeat:no-repeat;
    background-image:url('../img/primera/shopping-basket.jpg');
    background-size:auto 100%;
}
#primeraFooter{
    width:100%;
    height:689px;
}
#aboveFooter{
    height:115px;
    width:100%;
    background-repeat:no-repeat;
    background-position:center center;
    background-image:url('../img/primera/footer-above.jpg');
    background-size:auto 100%;
    background-color:#e5ecf4;
}
#contentFooter{
    height:340px;
    width:100%;
    background-repeat:no-repeat;
    background-position:center center;
    background-image:url('../img/primera/footer-content.jpg');
    background-size:auto 100%;
    background-color:#f2f6f9;
}
#belowFooter{
    height:234px;
    width:100%;
    background-repeat:no-repeat;
    background-position:center center;
    background-image:url('../img/primera/footer-below.jpg');
    background-size:auto 100%;
    background-color:#fff;
}
/*.message a.use-bot:hover{
    background-color:#ffdb3c;
}*/


.message__wrapper .message a.use-bot span{
    background-color:#2a3ca5;
    background-image:url('../quriobot/assets/img/avatar/bot.png');
}
.message__wrapper .message a.use-bot span:after{
    display:none;
}

@media screen and (max-width:550px){
    #primeraTopMenu, #BottomMenuContent,
    #aboveFooter, #contentFooter {
        background-size: contain;
        background-position: left center;
    }
    #contentCenter {
        width: 100%;
    }
    .message__wrapper{
        display:table-cell;
        vertical-align:middle;
        padding:10px;
    }
    .message .tag {
        display: none;
    }
}