/************************************************** *************************************************** *** WAITER BOX *************************************************** **************************************************/ .animationContainer { display: block; position: absolute; bottom: 35px; left: 50%; margin-left: -70px; } .animationContainer, .animationContainer div { border: none !important; } .bol { display: block; width: 15px; height: 15px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; float: left; margin-right: 10px; background: #999; opacity: 0;   -webkit-box-shadow: 0 2px 6px -3px rgba(0,0,0,0.6);   -moz-box-shadow: 0 2px 6px -3px rgba(0,0,0,0.6);   -ms-box-shadow: 0 2px 6px -3px rgba(0,0,0,0.6);   -o-box-shadow: 0 2px 6px -3px rgba(0,0,0,0.6);   box-shadow: 0 2px 6px -3px rgba(0,0,0,0.6); } .bol:last-child { margin-right: 0; } .animation { -webkit-animation: loadingAnimation 3s infinite; /* Safari 4+ */ -moz-animation: loadingAnimation 3s infinite; /* Fx 5+ */ -ms-animation: loadingAnimation 3s infinite; /* Fx 5+ */ -o-animation: loadingAnimation 3s infinite; /* Opera 12+ */ animation: loadingAnimation 3s infinite; /* IE 10+, Fx 29+ */ -webkit-animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000); -moz-animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000); -ms-animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000); -o-animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000); animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000); /* easeInOutCubic */ } .d1 { -webkit-animation-delay: 200ms; -moz-animation-delay: 200ms; -ms-animation-delay: 200ms; -o-animation-delay: 200ms; animation-delay: 200ms; } .d2 { -webkit-animation-delay: 400ms; -moz-animation-delay: 400ms; -ms-animation-delay: 400ms; -o-animation-delay: 400ms; animation-delay: 400ms; } .d3 { -webkit-animation-delay: 600ms; -moz-animation-delay: 600ms; -ms-animation-delay: 600ms; -o-animation-delay: 600ms; animation-delay: 600ms; } .d4 { -webkit-animation-delay: 800ms; -moz-animation-delay: 800ms; -ms-animation-delay: 800ms; -o-animation-delay: 800ms; animation-delay: 800ms; } .d5 { -webkit-animation-delay: 1s; -moz-animation-delay: 1s; -ms-animation-delay: 1s; -o-animation-delay: 1s; animation-delay: 1s; } @-webkit-keyframes loadingAnimation { 0% { opacity: 0; } 40% { opacity: 1; } 80% { opacity: 0; } } @-moz-keyframes loadingAnimation { 0% { opacity: 0; } 40% { opacity: 1; } 80% { opacity: 0; } } @-o-keyframes loadingAnimation { 0% { opacity: 0; } 40% { opacity: 1; } 80% { opacity: 0; } } @keyframes loadingAnimation { 0% { opacity: 0; } 40% { opacity: 1; } 80% { opacity: 0; } } /************************************************** *************************************************** *** LOGIN POPUP *************************************************** **************************************************/ .loginpopupcomponentmain { z-index: 1000; } .loginpopupcomponent { border-color: #FFD634; } .loginpopupcomponent .myheader.fr-BE { background-image: url("images/mypassport-fr-small.gif"); } .loginpopupcomponent .myheader.nl-BE { background-image: url("images/mypassport-nl-small.gif"); } /************************************************** *************************************************** *** STORED LISTER *************************************************** **************************************************/ .storedLister .pagerTop .header { color: #c00; border-top: 1px solid #fc0; } .storedLister .pagerTop .headerCorner { display: none; } .storedLister .pagerTop { background-image: url(images/pagerbackgroundsl1.gif); } .storedLister .pagerTop .leftSide, .storedLister .pagerTop .rightSide { background-image: url(images/pageroutlinesl1.gif); } .storedItem .header { border-top: 1px solid #FFCC00; border-left: 1px solid #FFCC00; border-right: 1px solid #FFCC00; background-color: #FEF5CC; } .storedItem .header .country { display: block; } .storedItem .detail { border-left: 1px solid #FFCC00; border-right: 1px solid #FFCC00; border-bottom: 1px solid #FFCC00; } .storedLister .pagerTop .line { border-top: 1px solid #F3E8BD; } .storedLister .delete { background-image: url(images/icodelete.gif); } .storedLister .icoPrint { background-image: url(images/icoprint.gif); } .storedLister .icoStored { background-image: url(images/icostored.gif); } .storedLister .icoNotStored { background-image: url(images/iconotstored.gif); } .storedListerPrice .storedItem .header { color: #336699; background-color: #E7EEF8; border-top: 1px solid #336699; border-right: 1px solid #336699; border-left: 1px solid #336699; } .storedListerPrice .storedItem .detail { color: #336699; background-color: #FFFFFF; border-right: 1px solid #336699; border-left: 1px solid #336699; border-bottom: 1px solid #336699; } .credentialinput { width: 200px !important; } .compareclose { background: url(images/btclose.gif) no-repeat; border: 1px solid #00448A; cursor: pointer; height: 15px; position: absolute; right: 5px; text-align: center; top: 6px; width: 15px; z-index: 1001; } /* NVB hacks */ .personalizationheader .loginheader { width: 100%; margin: 0; } .storedLister .pagerTop { width: 100%; } .storedLister .pagerTop .rightSide { position: static; float: right; margin: 0; } .recentitemsheader .header { margin: 0; padding: 0; width: 100%; } .storedListerPrice .pagerMain { padding: 5px 0 0; width: 100%; } .personalization-layout .toolbarBlueUp .pager, .personalization-layout .toolbarBlueDown .pager { padding-right: 10px; } .newsletterChangeMode .loginregistration { width: 100%; } .newsletterChangeMode .loginregistration .newsletter { position: relative; padding: 0 0 10px; } .newsletterframe { margin: 0; height: 730px; width: 100%; } .storedLister .go-to { padding: 2px 6px !important; } .storedLister .go-to .icon { margin: 2px 0 0 1px !important; } /************************************************** *************************************************** *** LOGIN BANNER *************************************************** **************************************************/ .loginregistration .nl-BE .loginheader, .loginconfirmation .nl-BE .loginheader, .loginactivation .nl-BE .loginheader, .personalizationheader .nl-BE .loginheader { background-image: url("images/mypassport-nl.gif"); background-repeat: no-repeat; } .loginregistration .fr-BE .loginheader, .loginconfirmation .fr-BE .loginheader, .loginactivation .fr-BE .loginheader, .personalizationheader .fr-BE .loginheader { background-image: url("images/mypassport-fr.gif"); background-repeat: no-repeat; }