/* text */
html,body, input, select, textarea, a { font-family: opensans-regular, Calibri, Arial, sans-serif ; font-size: 14px; color: #666666; }
@font-face { font-family: opensans-light; src:url('../fonts/opensans-light.eot'); }
@font-face { font-family: opensans-light; src:url(http://:/) format("No-IE-404"),url('../fonts/opensans-light.ttf') format("truetype"); }
@font-face { font-family: opensans-regular; src:url('../fonts/opensans-regular.eot'); }
@font-face { font-family: opensans-regular; src:url(http://:/) format("No-IE-404"),url('../fonts/opensans-regular.ttf') format("truetype"); }
@font-face { font-family: opensans-bold; src:url('../fonts/opensans-bold.eot'); }
@font-face { font-family: opensans-bold; src:url(http://:/) format("No-IE-404"),url('../fonts/opensans-bold.ttf') format("truetype"); }
p { margin: 0px 0px 20px 0px; line-height: 150%; }
p.columns { column-count: 2; -moz-column-count: 2; -webkit-column-count: 2; column-gap: 40px; -moz-column-gap: 40px; -webkit-column-gap: 40px }
h1 { font-family: opensans-light; font-weight: normal; font-size: 40px; line-height: 1; margin: 0px 0px 15px 0px; }
h2 { font-family: opensans-light; font-size: 24px; font-weight: normal; margin: 0px 0px 5px 0px; }
h3 { font-family: opensans-light; font-size: 24px; font-weight: normal; color: #FFFFFF; margin: 0px 0px 5px 0px; }
h4 { font-family: opensans-light; font-size: 18px; font-weight: normal; color: #FFFFFF; margin: 0px 0px 10px 0px; }
h5 { font-size: 24px; margin: 0px 0px 15px 0px; font-weight: normal; }
a, a:visited { text-decoration: none; outline: none; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s;-webkit-transition:.5s; transition:.5s; }
a:active, a:hover { text-decoration: none; outline: none; }
b { font-family: 'opensans-bold'; font-weight: normal }
/* BUTTONS */
.button.link { background: red; font-size: 20px}
.button.link1 { background-image: url('../img/buttons/button-link1.png'); background-repeat: no-repeat; background-position: right center; border: none; display: inline-block; font-family: opensans-light; font-size: 22px; padding: 14px 55px 15px 15px; color: #FFFFFF; text-transform: uppercase; }
.button.link1:hover { text-decoration: none }
.button.link2 { background: #666666 url('../img/buttons/button-link2.png') no-repeat right center; border: none; display: inline-block; font-family: opensans-light; font-size: 14px; padding: 5px 40px 5px 10px; color: #FFFFFF; }
.button.link2:hover { background-image: url('../img/buttons/button-link2.png'); background-repeat: no-repeat; background-position: right center; text-decoration: none }
.button.link3 { background: #666666; font-family: opensans-regular; font-size: 12px; white-space: nowrap; padding: 3px 10px; color: #FFFFFF; }
.button.link3.red { background: #FF0000 }
.button.link3:hover { background: #888888; text-decoration: none }
.button.link3.active { color: #FFFFFF; text-decoration: none }
.button.square { background: #666666; display: inline-block; width: 60px; height: 60px; }
.button.square:hover { background: #888888; text-decoration: none }
.button.square.selection { background: #666666; display: inline-block; white-space: nowrap; width: auto; height: 20px; color: #FFFFFF; padding: 20px }
.button.square.selection:hover { background: #888888; text-decoration: none }
.button.square.selection span { display: inline-block; border: 1px solid #FFFFFF; height: 35px; width: 35px; box-sizing: border-box; border-radius: 50%; padding: 8px; float: left; font-size: 24px; line-height: 0.7; margin: -7px 10px 0px -5px }
.button.squaresmall { display: block; padding: 4px 12px; background: #666666; color: #FFFFFF; }
.button.squaresmall:hover { background: #888888; text-decoration: none }
.button.submit { display: inline-block; border: none; color: #666666; font-size: 14px; padding: 5px 10px; background: #DDDDDD; }
.button.submit:hover { background: #F1F1F1; color: #666666 }
a.button.close { display: block; position: absolute; z-index: 9999; top: 0px; right: 0px; padding: 4px 12px; background: #666666; color: #FFFFFF; }
a.button.close:before { content: "×";font-size: 22px; font-weight: bold; }
a.button.close:hover { background: #888888; text-decoration: none }
a.button.full { display: block; font-size: 12px; width: 100%; margin: 0px 0px 1px 0px; padding: 5px 10px; background: #222222; color: #FFFFFF; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; }
a.button.full:hover { background: #444444; }
.slider a.button.close:hover { background: #FFFFFF; color: #666666 }
a.button.yourpp { display: block; position: relative; background: #DDDDDD; width: 100%; margin: 0px 0px 5px 0px; padding: 15px }
a.button.yourpp span { font-family: opensans-light; font-size: 20px; float: right; display: block; position: absolute; padding: 12px 10px 0px 0px; right: 0px; top: 0px; bottom: 0px; width: 50px; text-align: center }
a.button.yourpp:hover { background: #CCCCCC; color: #666666 }
.button-popupmenu span { display: inline-block; float: right; border-radius: 50%; border: 1px solid #DDDDDD; width: 25px; height: 25px; margin: 0px 0px 0px 10px; text-align: center}
/* FORMLAYOUT */
.input,
.select,
.textarea { padding: 5px 10px; border: none; background: #F2F2F2; border-left: 5px solid #CCCCCC; margin: 0px 0px 15px 0px; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; }
.input:focus,
.select:focus,
.textarea:focus { border-left-width: 5px; border-left-style: solid; color: #666666 }
input[type="radio"] { display:none; }
input[type="radio"] + label { margin: 0px 0px 5px 0px; display: inline-block }
input[type="radio"] + label span { display:inline-block; width:14px; height:14px; border-radius: 50%; margin:-4px 10px 0 0; vertical-align: middle; padding: 1px; cursor:pointer; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s;-webkit-transition:.5s; transition:.5s; }
input[type="radio"]:checked + label span { padding: 1px }
input[type='submit'] { -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s;-webkit-transition:.5s; transition:.5s; }
.input.small, .select.small { width: 30%; max-width: 200px }
.input.medium, .select.medium { width: 50%; max-width: 400px }
.input.large, .select.large, .textarea.large { width: 100%; max-width: 600px }
.label { font-family: opensans-light; font-size: 24px; margin: 0px 0px 5px 0px; display: block; }
.field label { padding: 0px 20px 0px 0px; display: inline-block; }
.error { border-left-width: 5px; border-left-style: solid; }
.form-errors { display: none; color: #CC0000; font-family: opensans-bold; }
/* SUPERSIZED */
body.nospecial { background: url('../img/supersized/default.jpg'); background-repeat: no-repeat; background-position: center 0px; -webkit-background-size: cover; -o-background-size: cover; background-size: cover; }
#supersized { position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
#supersized li { list-style-type: none }
#supersized img { width:auto; height:auto; position:relative; outline:none; border:none; }
#supersized a { z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111; display:block; }
#supersized a.image-loading { background: url('../img/supersized/progress.gif') no-repeat center center; width:100%; height:100%; }
/* GENERAL LAYOUT */
.displaynone { display: none }
.horline { margin: 0px 0px 20px 0px; padding: 0px 0px 20px 0px; height: 1px }
.horline.dashed { border-bottom: 1px dashed #CCCCCC }
.metrolabel { float: left; margin: 0px 30px 0px 0px }
.metrolabel span, .metrolabel a { font-size: 30px; line-height: 1.2; font-family: opensans-light;}
.metrolabel.inpage { margin: 0px 0px 20px 0px; float: none; display: block }
.pagevale { display: none; position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; }
.popupvale { z-index: 5000; display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255,255,255,0.7); }
.block { z-index: 7500; max-width: 400px; padding: 50px 50px 100px 50px; position: absolute; left: 50%; top: 0; margin: 100px 0px 0px -250px }
.block p a { text-decoration: underline; outline: none; }
.block a:hover { text-decoration: underline; outline: none; }
.block #ctr-logo { float: none }
.block .input { background: #FFFFFF }
.block .button.link1 { float: right}
.block.hide,
.block#ctr-popupdownload,
.block#ctr-zipdelivery { display: none }
#page-misc .block { max-width: 80%; margin: 100px 0px 0px -40%; box-sizing: border-box; }
/* LAYOUT */
#ctr-wrapper { min-height: 100%; height: auto !important; height: 100%; }
#ctr-content { margin: 0px 0px 0px 0px; }
.centered-content { padding: 0px 100px; position: relative; }
.wide-content { padding: 0px 100px 200px; position: relative; }
/* header */
#ctr-header { margin: 0px -100px 40px; padding: 0px 100px; background: #F2F2F2; height: 71px }
/* logo */
#ctr-logo { margin: 10px 0px 0px 0px; float: right }
/* footer */
#ctr-footer { position: fixed; z-index: 8500; bottom: 0px; left: 0px; right: 0px; padding: 0px 30px; color: #FFFFFF }
#ctr-footer a { color: #FFFFFF }
#ctr-footer a:hover { text-decoration: none; color: #999999 }
#ctr-footer .button { font-size: 18px; font-family: opensans-light; color: #FFFFFF; font-weight: normal; display: inline-block; padding: 10px 0px; margin: 0px 20px 0px 0px; box-sizing: border-box; }
#ctr-footer .ctr-menu-popupmenu { position: relative; }
#ctr-footer .menu-popupmenu { position: absolute; bottom: 34px; left: -20px; display: none; }
#ctr-footer .menu-popupmenu a { display: block; width: 200px; padding: 10px 20px; }
#ctr-footer .menu-popupmenu a:hover { text-decoration: none; color: #000000 }
/* basket & selection button */
.selectionsbutton { float: right;}
.selectionsbutton a { font-size: 18px; font-family: opensans-light; color: #FFFFFF; display: block; padding: 10px 20px; }
.selectionsbutton:hover a { text-decoration: none; }
.selectionsbutton .counter { display: inline-block; font-family: opensans-light; margin: 0px 0px 0px 5px}
/* register */
#ctr-register.block { width: 800px; max-width: 100%; margin: 100px 0px 0px -450px }
#registerfeedback { font-weight: bold }
#ctr-registerform form { }
/* yourdeliveries & selections */
.summarylist .listitem { position: relative; color: #FFFFFF; background: rgb(0,0,0); background: rgba(0,0,0,0.6); display: block; width: 50%; min-width: 350px; margin: 0px 0px 2px 0px; padding: 10px 50px 10px 10px }
.summarylist .listitem:hover { cursor: pointer; background: rgb(0,0,0); background: rgba(0,0,0,0.2); }
.summarylist .listitem .counter { font-family: opensans-light; font-size: 24px; float: right; display: block; position: absolute; padding: 3px 0px 0px 0px; right: 0px; top: 0px; bottom: 0px; width: 50px; text-align: center }
.summarylist .listitem a { position: absolute; top: 0px; bottom: 0px; left: -38px; font-size: 24px; box-sizing: border-box; }
.summarylist .listitem .shared { float: right; font-weight: bold; margin: 0px 20px 0px 0px }
#page-yourdeliveries #ctr-thumbnails { margin: 0px 0px 0px -4px }
#page-yourselection #ctr-thumbnails { margin: 0px 0px 0px -4px }
#page-yourdeliveries #ctr-thumbnails #downloadbutton-withusage { display: none}
#page-yourdeliveries #ctr-thumbnails #downloadbutton-normal { display: block !important }
.column-contentwithinfo { float: right; width: 400px; background: red}
.column-contentinfo { margin: 0px 440px 0px 0px; background: red }
.column-sidebar { float: right; width: 400px;}
.column-body { margin: 0px 440px 0px 0px }
/* searchform */
#ctr-searchform.block { width: 60%; position: relative; left: 50%; margin: 5% 0 0 -30%; padding: 0px; box-sizing: border-box; max-width: 100%; background: none }
#ctr-searchform.block.no-special { width: 60%; max-width: 100%; position: absolute; left: 50%; margin: 10% 0 0 -30% }
#ctr-searchform.block h4 { color: #2DA449;}
#ctr-searchform.block .select { background: #FFFFFF }
#ctr-searchform .searchform-holder { margin: 0px 0px 0px 0px; max-width: 100%; position: relative; background: #FFFFFF }
#ctr-searchform .searchform-holder .input { width: 100%; border-left: 5px solid #CCCCCC; margin: 0px; padding: 15px 80px 15px 10px; font-size: 30px; text-transform: lowercase; background: #FFFFFF }
#ctr-searchform .searchform-holder .input:focus { border-left-width: 5px; border-left-style: solid }
#ctr-searchform .searchform-holder .submit { background-image: url('../img/buttons/button-search.png'); background-repeat: no-repeat; background-position: center center; position: absolute; width: 71px; right: 0px; margin: 0px; top: 0px; bottom: 0px; border: none; }
#ctr-searchform .searchform-holder .submit:hover,
#ctr-searchform .searchform-holder .submit:active { background-image: url('../img/buttons/button-search.png'); background-repeat: no-repeat; background-position: center center; color: #666666 }
#ctr-searchform.next { position: absolute; }
#ctr-searchform.next .searchform-holder { width: 400px; }
#ctr-searchform.next.advanced { background: #333333; width: 400px; /* same as holder*/; z-index: 9999; top: 0px; padding: 0px 0px; margin: 0px 0px 0px 0px }
#ctr-searchformadvanced { display: none; position: relative; }
#ctr-searchformadvanced.body { padding: 20px; color: #FFFFFF }
#ctr-searchformadvanced .field { border-bottom: 1px solid #666666; padding: 0px 0px 10px 0px; margin: 0px 0px 10px 0px }
#ctr-searchformadvanced .field input[type="radio"] + label span,
#ctr-searchformadvanced .field input[type="checkbox"] + label span
{ background: #666666 }
#ctr-searchformadvanced .select { padding: 0px; border: 1px solid #666666 }
#ctr-searchformadvanced .select option { padding: 5px;}
#ctr-searchform .advancedoptions { position: absolute; left: 420px; top: 25px; width: 100% }
.column { float: left; width: 49.8%; box-sizing: border-box; }
.column.left { margin: 0px 2px 0px 0px; min-width: 420px; padding: 30px 30px; }
.column.right { min-width: 420px }
#ctr-searchform.block.no-special .column { float: none; width: 100% }
#ctr-searchform.block.no-special .column.left { margin: 0px; }
.searchform-options { margin: 0px 0px 0px 0px; }
/* specials */
#ctr-specials { width: 100% }
#ctr-specials .special { display: block; box-sizing: border-box; margin: 0px 0px 2px 0px; }
#ctr-specials .special .title { padding: 18px 0px 0px 15px; text-overflow: ellipsis; font-family: opensans-light; font-size: 20px; overflow: hidden; white-space: nowrap;}
#ctr-specials .special:hover { text-decoration: none }
#ctr-specials .special:last-of-type { margin: 0px;}
#ctr-specials .special .image { float: left; width: 80px; overflow: hidden; margin: 0px }
#ctr-specials .special .image img { float: left; max-height: 62px }
/* page-selection */
#page-selectionorder .column-left { width: 35%; float: left; margin: 0px 0 0px 0; }
#page-selectionorder .column-right { width: 60%; float: right }
/* SEARCHRESULTS */
/* navigation */
#ctr-navigation { float: right }
#ctr-navigation .button { font-size: 70px; line-height:0.8; display: block; padding: 0px 0px 0px 0px; }
#ctr-navigation .button:hover { color: #666666 }
#ctr-navigation .button.inactive { color: #F2F2F2 }
#ctr-navigation .button.inactive:hover { color: #F2F2F2 }
#ctr-navigation .button.previouspage { float: left; margin: 0px 20px 0px 0px }
#ctr-navigation .button.nextpage { float: left }
.nonumberofpages #ctr-navigation .numberofpages { display: none}
/* thumbnails per page */
.thumbsperpage .select { font-family: opensans-light; font-size: 30px; margin: -20px 0px 0px 0px; height: 40px;background: transparent; padding: 0px; border: none }
.thumbsperpage .select option { font-family: opensans-regular; font-size: 14px }
/* thumbnails */
#ctr-thumbnails .thumbnail { position: relative }
#ctr-thumbnails .thumbnail .thumbnailimage { display: block;}
#ctr-thumbnails .thumbnail img { border: 2px solid transparent; }
#ctr-thumbnails.classic-thumbnails .thumbnail { float: left; border: none; background: none; margin: 0px 5px 5px 0px }
#ctr-thumbnails.classic-thumbnails .thumbnail img { border: none; }
#ctr-thumbnails .thumbnailoptions { display: none; position: absolute; z-index: 1000; left: 4px; bottom: 4px; top: 4px }
#ctr-thumbnails .thumbnailoptions span:hover { cursor: pointer}
#ctr-thumbnails .thumbnailoptions .button,
#ctr-thumbnails .thumbnailoptions .downloadlink-popup { color: #FFFFFF; background-repeat: no-repeat; background-position: center center; display: block; font-size: 16px; text-align: center; margin: 0px 0px 2px 0px; line-height: 1; font-weight: bold; height: 30px; width: 30px; padding: 4px; border: 2px solid transparent; box-sizing: border-box;}
#ctr-thumbnails .thumbnailoptions .downloadlink-popup,
#ctr-thumbnails .thumbnailoptions .lbselector { background-image: url('../img/backgrounds/black-60.png'); }
#ctr-thumbnails .thumbnailoptions .thumbnailmetadata { background-image: url('../img/backgrounds/black-60.png'); font-family: 'Times New Roman'; font-size: 20px }
#ctr-thumbnails .selectedlb .thumbnailoptions .lbselector { background-image: none; background-color: #2DA449; }
#ctr-thumbnails .thumbnailoptions .lbselector:hover,
#ctr-thumbnails .thumbnailoptions .downloadlink-popup:hover { background-color: #2DA449; background-image: none }
#ctr-thumbnails .thumbnailoptions .lbselector { font-size: 18px }
#ctr-thumbnails .basketselector { background-image: url('../img/buttons/thumbnail-basket-white.png'), url('../img/backgrounds/black-60.png'); }
#ctr-thumbnails .basketselector:hover { background-image: url('../img/buttons/thumbnail-basket-white.png'); background-color: #2DA449 ; }
#ctr-thumbnails .selectedbasket .basketselector { background-image: url('../img/buttons/thumbnail-basket-white.png'); background-color: #2DA449 ; }
/* with info */
#ctr-thumbnailswithdetails .thumbnail { position: relative; }
#ctr-thumbnailswithdetails .thumbnail img { max-height: 100px; }
#ctr-thumbnailswithdetails .thumbnail .thumbnailimage { display: block; background: url('../img/placeholder/thumbnail.png'); }
#ctr-thumbnailswithdetails .thumbnailoptions { display: none; position: absolute; z-index: 1000; left: 4px; bottom: 4px; top: 4px }
#ctr-thumbnailswithdetails .thumbnailoptions span:hover { cursor: pointer}
#ctr-thumbnailswithdetails .thumbnailoptions .button,
#ctr-thumbnailswithdetails .thumbnailoptions .downloadlink-popup { color: #FFFFFF; background-repeat: no-repeat; background-position: center center; display: block; font-size: 16px; text-align: center; margin: 0px 0px 2px 0px; line-height: 1; font-weight: bold; height: 30px; width: 30px; padding: 4px; border: 2px solid transparent; box-sizing: border-box;}
#ctr-thumbnailswithdetails .thumbnailoptions .downloadlink-popup,
#ctr-thumbnailswithdetails .thumbnailoptions .lbselector { background-image: url('../img/backgrounds/black-60.png'); }
#ctr-thumbnailswithdetails .thumbnailoptions .thumbnailmetadata { background-image: url('../img/backgrounds/black-60.png'); font-family: 'Times New Roman'; font-size: 20px }
#ctr-thumbnailswithdetails .selectedlb .thumbnailoptions .lbselector { background-image: none; background-color: #2DA449; }
#ctr-thumbnailswithdetails .thumbnailoptions .lbselector:hover,
#ctr-thumbnailswithdetails .thumbnailoptions .downloadlink-popup:hover { background-color: #2DA449; background-image: none }
#ctr-thumbnailswithdetails .thumbnailoptions .lbselector { font-size: 18px }
#ctr-thumbnailswithdetails .basketselector { background-image: url('../img/buttons/thumbnail-basket-white.png'), url('../img/backgrounds/black-60.png'); }
#ctr-thumbnailswithdetails .basketselector:hover { background-image: url('../img/buttons/thumbnail-basket-white.png'); background-color: #2DA449 ; }
#ctr-thumbnailswithdetails .selectedbasket .basketselector { background-image: url('../img/buttons/thumbnail-basket-white.png'); background-color: #2DA449 ; }
#ctr-thumbnailswithdetails .selectedbasket .thumbnailoptions,
#ctr-thumbnails .selectedbasket .thumbnailoptions,
#ctr-thumbnailswithdetails .selectedlb .thumbnailoptions,
#ctr-thumbnails .selectedlb .thumbnailoptions { display: block !important }
#ctr-hovermetadata { visibility: hidden; position: absolute; z-Index: -1; font-size: 12px; overflow: hidden }
#ctr-hovermetadata { padding: 45px 20px; background: url('../img/backgrounds/triangle-top.png') no-repeat 45px 25px; }
#ctr-hovermetadata .hover-content { padding: 10px; overflow-y: auto; box-shadow: 0px 0px 2px #000000; height: 150px; background: rgba(0,0,0,0.8); color: #FFFFFF}
/* orderthumbnails */
#ctr-orderthumbnails .resolutions .resolution { line-height: 1; margin: 0px 0px 10px 180px; text-transform: lowercase; }
#ctr-orderthumbnails .resolution .checkbox { height: 17px; margin: 0px 5px -3px 0px; width: 17px; display: inline-block; background: #DDDDDD}
#ctr-orderthumbnails .resolution a.selected .checkbox { background: #FF0000 }
#ctr-orderthumbnails .title { font-family: opensans-bold; }
#ctr-orderthumbnails .image { float: left; width: 180px }
#ctr-orderthumbnails img { max-height: 100px; max-width: 150px }
#ctr-orderthumbnails .info { display: block; margin: 0px 0px 0px 28px; font-size: 12px }
/* previews */
#ctr-preview .column-left { float: left; width: 50%; max-width: 100%; margin: 0px 5% 0px 0px }
#ctr-preview .column-right { float: left; width: 45%; margin: 0px 0px 0px 0px }
#ctr-preview .preview-image { max-width: 100%;}
#ctr-preview .navigation { padding: 0px 0px 0px 0px}
#ctr-preview .navigation.formobiledevice { display: none }
#ctr-preview .navigation.forscreen { display: inline; }
#ctr-preview .navigation .button { font-size: 70px; line-height:0.8; display: block; padding: 0px 0px 0px 0px; }
#ctr-preview .navigation .button:hover { color: #666666 }
#ctr-preview .navigation .button.inactive:hover { color: #F2F2F2 }
#ctr-preview .navigation .button.previouspage { float: left; margin: 0px 20px 0px 0px }
#ctr-preview .navigation .button.nextpage { float: left }
#ctr-preview .actionbuttons { margin: 0px 0px 15px 0px; }
#ctr-preview .actionbuttons .button { margin: 0px 1px 0px 0px; float: left }
#ctr-preview #ctr-resolutions a { display: block; }
#ctr-preview #ctr-resolutions .resolution { margin-bottom: 5px; padding: 7px 0px 7px 10px; background: #DDDDDD; position: relative; }
#ctr-preview #ctr-resolutions .resolution .title { font-family: opensans-light; font-size: 20px; margin: 0px 0px 2px 0px; }
#ctr-preview #ctr-resolutions .resolution .price { font-family: opensans-light; display: block; float: right; font-size: 30px; padding: 10px 30px 0px 0px }
#ctr-preview #ctr-resolutions .resolution .img-info { font-size: 12px; font-weight: 200; text-align: left; }
#ctr-preview #ctr-resolutions .resolution .img-info span { display: inline-block; text-align: right; cursor: help}
#ctr-preview #ctr-resolutions .resolution .buttons { position: absolute; right: 0px; top: 0px;bottom: 0px; }
#ctr-preview #ctr-resolutions .resolution .buttons a { background: #CCCCCC; display: block; height: 100%; color: #FFFFFF; width: 60px; float: right; font-size: 30px; padding: 7px 0px 0px 0px; margin: 0px 0px 0px 1px; text-align: center; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; }
#ctr-preview #ctr-resolutions .resolution .buttons.selected a.basketbutton,
#ctr-preview #ctr-resolutions .resolution .buttons a.basketbutton
{ background-image: url('../img/buttons/previewinbasket.png'); background-repeat: no-repeat; background-position: center center }
/* popups */
#zipdeliveryfeedback { display:none; }
#zipdelivery_waiting { display:block; }
#zipdelivery_succes { display:none; }
#zipdelivery_error { display:none; }
/* AUTOCOMPLETE */
.ac_input { }
.ac_results { padding: 0px; position: absolute; z-index: 99999; }
.ac_results ul { list-style-type: none; padding:0; margin:0; width: 325px; background:#EEEEEE; }
.ac_results li { margin:0px; padding: 10px; cursor:pointer; display:block; }
.ac_over { background-color: #666666; color: #FFFFFF; }
/* productionjob */
#form-productionjobanders .column-left,
#productionjob-page2 .column-left { float: left; width: 48%; margin: 0 4% 0 0 }
#form-productionjobanders .column-right,
#productionjob-page2 .column-right { float: left; width: 48% }
#page-yourproductionjob .thumbnail { display:inline-block; position: relative; margin: 0px 5px 39px 0px }
#page-yourproductionjob .thumbnailoptions { padding: 0px; background: url('../images/backgrounds/black-70.png'); position: absolute; z-index: 5000; left: 0px; right: 0px; bottom: -36px }
#page-yourproductionjob .thumbnailoptions a { display: inline-block; font-size: 18px; padding: 4px 0px 0px 0px; width: 50%; height: 31px; text-align: center; color: #FFFFFF; float: right }
#page-yourproductionjob .thumbnailoptions a:hover { background: url('../images/backgrounds/white-60.png') ;}
.production-summarylist { width: 100%; min-width: 350px }
.production-summarylist .listitem { position: relative; border-bottom: 1px solid #DDDDDD; }
.production-summarylist .listitem th { text-align: left; padding: 5px 0px}
.production-summarylist .listitem td { vertical-align: middle; padding: 5px 0px }
.production-summarylist .listitem:hover { background: rgb(0,0,0); background: rgba(0,0,0,0.6); color: #FFFFFF; cursor: pointer }
.production-summarylist .listitem a { position: absolute; top: 3px; right: 100px; font-size: 18px }
.production-summarylist .listitem .counter { font-family: opensans-light; font-size: 24px; padding: 3px 0px 0px 0px; text-align: center }
.production-summarylist .input,
.production-summarylist .select { margin: 4px; padding: 2px 10px }
h1.productionjob { padding: 17px 0px 0px 0px; width: 70%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* selectionLB */
#ctr-selectionLB { display: none; box-sizing: border-box; background: rgba(0,0,0,1); height: 320px; position: fixed; bottom: 0px; right: 0px; left: 0px; padding: 0px; width: 100%; padding: 20px 20px 20px 20px; color: #FFFFFF; z-index: 9000; }
#ctr-selectionLB .slider-content { position: relative; }
#ctr-selectionLB .thumbnails { margin: 0px 0px 0px 0px; width: 80% }
#ctr-selectionLB .selectionLBthumbnail { margin: 0px 10px 10px 0px; position: relative; height: 90px; width: 90px; overflow: hidden; float: left; outline: 1px solid #DADADA; }
#ctr-selectionLB .selectionLBthumbnail .image { text-align: center; }
#ctr-selectionLB .selectionLBthumbnail .image img { position: absolute; top: 0; left: 0; max-height: 150px; max-width: 150px }
#ctr-selectionLB .selectionLBthumbnail a.button { box-sizing: border-box; width: 50%; height: 21px; z-index: 4000; color: #FFFFFF; bottom: 0px }
#ctr-selectionLB .selectionLBthumbnail a.button.basketselector { left: 0; background: url('../img/buttons/thumbnail-basket-white.png'),rgba(0,0,0,1); background-repeat: no-repeat, repeat; background-position: center center, center; position:absolute; }
#ctr-selectionLB .selectionLBthumbnail a.button.basketselector:hover { background: url('../img/buttons/thumbnail-basket-white.png'), rgba(0,0,0,1); background-repeat: no-repeat, repeat; background-position: center center, center; }
#ctr-selectionLB .selectionLBthumbnail.selectedlb a.lbselector { right: 0; position: absolute; background: #FF0000; }
#ctr-selectionLB .options { position: absolute; background: #000000; bottom: 0px; right: 0px; top: 0px; width: 20%; z-index: 5000; }
/* TABLET LAYOUT */
@media
(min-device-width:1024px) and (max-width:989px),
screen and (max-device-width:480px),
(max-device-width:768px) and (orientation:landscape),
(min-device-width:481px) and (max-device-width:1024px) and (orientation:portrait) {
.wide-content { padding: 0px 5% 100px; }
#ctr-header { margin: 0px -5% 40px; padding: 0px; }
.formobiledevice { display: inline !important; margin: 0px 0px 20px 0px }
.forscreen { display: none !important; }
p.columns { column-count: 1; -moz-column-count: 1; -webkit-column-count: 1; column-gap: 0px; -moz-column-gap: 0px; -webkit-column-gap: 0px }
.button-popupmenu span { padding: 2px 0px 0px; height: 23px; line-height: 1}
#ctr-logo { }
#ctr-registerform form { column-count: 1; -moz-column-count: 1; -webkit-column-count: 1; column-gap: 0px; -moz-column-gap: 0px; -webkit-column-gap: 0px;}
#ctr-navigation { display: block; margin: 0px 0px 20px 0px;}
#ctr-navigation:after { clear: both }
#ctr-preview .navigation { margin: 20px 0px; }
.block h1 { font-size: 26px }
#page-misc .block { max-width: 80%; margin: 100px 0px 0px -40%; }
#page-misc .block .text { column-count: 1; -moz-column-count: 1; -webkit-column-count: 1; column-gap: 0px; -moz-column-gap: 0px; -webkit-column-gap: 0px;}
.summarylist .listitem { width: auto; }
#ctr-thumbnails .thumbnailoptions { display: block !important }
#ctr-preview .column-left { float: none; width: 100%; margin: 0px 0px 0px 0px }
#ctr-preview .column-right { float: none; width: 100%; margin: 0px 0px 0px 0px }
#ctr-preview .preview-image { max-width: 100%; }
#ctr-preview .actionbuttons { display: none }
.column-sidebar,
.column-body { float: none; width: 100%; }
#page-selection .column-left { width: 100%; float: none; margin: 0px 5% 0px 0px }
#page-selection .column-right { width: 100%; float: none }
#ctr-orderthumbnails .info { display: block; margin: 2px 0px 0px 25px; font-size: 12px }
#ctr-footer .menu-popupmenu { bottom: 33px; }
}
@media
(min-device-width:1024px) and (max-width:509px),
(max-device-width:480px) and (orientation:portrait) {
.wide-content { position: relative; }
.block { width: 90%; margin: 5% 0px 0px -45%; padding: 5%; left: 50%; box-sizing: border-box; max-width: 100% }
.slider { display: none; overflow: auto; background: #333333; position: absolute; height: 100%; bottom: auto; right: 0px; top: 0px; padding: 0px; width: 100%; padding: 5%; box-sizing: border-box; color: #FFFFFF; z-index: 9000; }
.metrolabel { float: left; margin: 0px 10px 0px 0px }
.metrolabel span { font-size: 20px; line-height: 1.2; font-family: opensans-light;}
.thumbsperpage .select { font-family: opensans-light; font-size: 20px; margin: -15px 0px 0px 0px; height: 40px;background: transparent; padding: 0px; border: none }
#ctr-navigation .button { font-size: 50px; }
#ctr-searchform.home { width: 90%; max-width: 100%; min-width: 90%; margin: 0 auto; padding: 4%; }
#ctr-searchform.home .searchform-holder .input { padding: 5px; font-size: 24px}
#ctr-searchform.next .searchform-holder { width: 100%; }
#ctr-searchform.next.advanced { width: 100%; z-index: 9999 }
#ctr-searchform .advancedoptions { position: absolute; left: 5%; top: 75px; z-index: 0 }
.button.link1 { font-size: 16px; padding: 10px 55px 10px 15px; }
.button.link2 { background: #666666 url('../img/buttons/button-link2.png') no-repeat right center; border: none; display: inline-block; font-family: opensans-light; font-size: 12px; padding: 5px 40px 5px 10px; color: #FFFFFF; }
.button.link3 { background: #666666; font-family: opensans-regular; font-size: 12px; padding: 3px 10px; color: #FFFFFF; }
.button-popupmenu span { width: 20px; padding: 1px 0px 0px; height: 19px; margin: 0px 0px 0px 0px; text-align: center}
#ctr-preview #ctr-resolutions .resolution .buttons { position: static; margin: 20px 0px 0px -10px; }
#ctr-preview #ctr-resolutions .resolution .buttons a { background: #CCCCCC; display: block; color: #FFFFFF; width: 100%; float: none; font-size: 24px; padding: 15px 0px 0px 0px ; line-height: 0; height: 40px; margin: 0px 0px 0px 0px; text-align: center; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; }
.column-sidebar { float: none; width: 100%;}
.column-body { margin: 0px 0px 0px 0px }
#ctr-orderthumbnails .resolutions .resolution { line-height: 1; margin: 20px 0px 10px 0px; text-transform: lowercase; }
#ctr-orderthumbnails .resolution .checkbox { height: 17px; margin: 0px 5px -3px 0px; width: 17px; display: inline-block; background: #DDDDDD}
#ctr-orderthumbnails .resolution a.selected .checkbox { background: #C8087E }
#ctr-orderthumbnails .title { font-family: opensans-bold; }
#ctr-orderthumbnails .image { float: none; width: 100% }
#ctr-orderthumbnails img { max-height: 100px; max-width: 150px }
#ctr-orderthumbnails .info { display: block; margin: 0px 0px 0px 28px; font-size: 12px }
#page-selectionorder .column-left { width: 100%; float: none; margin: 0px 5% 0px 0px; }
#page-selectionorder .column-right { width: 100%; float: none }
#ctr-footer { position: static; bottom: 0px }
#ctr-footer .button,
.selectionsbutton a { display: block; width: 100%; text-transform: lowercase; font-size: 14px; padding: 5px 0px 5px; }
.selectionsbutton { float: none }
#ctr-specials { margin: 0px 0px 0px 0px; }
#ctr-specials .special { float: none; margin: 0 0px 5px 0px; width: 100% }
#ctr-specials .special:hover { text-decoration: none }
#ctr-specials .special .image { overflow: hidden; position: relative; float: left; text-align: left; margin: 0px; height: auto; width: 90px }
#ctr-specials .special .image img { position: static; max-height: 60px; }
#ctr-specials .special .title { font-family: opensans-light; font-size: 14px; padding: 10px; box-sizing: border-box; height: auto; overflow: auto; text-align: left; }
}