/* Pictures LP styles */
@font-face{
    font-family: 'ProximaNova';
    font-style: normal;
    font-weight: normal;
    src: url('/common/fonts/ProximaNova-Reg-webfont.eot');
    src: url('/common/fonts/ProximaNova-Reg-webfont.eot?#iefix') format('embedded-opentype'),
    url('/common/fonts/ProximaNova-Reg-webfont.woff') format('woff'),
    url('/common/fonts/ProximaNova-Reg-webfont.ttf') format('truetype'),
    url('/common/fonts/ProximaNova-Reg-webfont.svg#proxima_nova_rgregular') format('svg');
}

body { padding-top: 190px; font-family: 'ProximaNova' !important; }

header { position: fixed !important; top: 0; left: 0; right: 0; padding-top: 35px; background: #ffffff; z-index: 99; }

.logo { position: relative; height: 105px; padding-top: 5px; margin-bottom: 20px; z-index: 1;
    transform: translate3d(0,0,0); -webkit-transform: translate3d(0,0,0); transition: all 0.3s ease-out; }
.logo:after { position: absolute; content: ''; top: 0; left: 290px; width: 340px; height: 105px;
    background: transparent url('/common/pics/pictures_lp/pictures.png') no-repeat; z-index: -1; }
header.scrolled .logo { transform: translate3d(0,-150px,0); -webkit-transform: translate3d(0,-150px,0); height: 0; margin-bottom: 0; }

nav { padding-bottom: 10px; text-transform: uppercase; letter-spacing: 2px; transition: all 0.3s ease-out; }
nav ul { float: left; margin: 0; padding: 0; font-size: 0; list-style: none; }
nav ul li { display: inline-block; font-size: 14px; line-height: 19px; border-left: 1px solid #deeae6; }
nav ul li:first-child { border: 0; }
nav ul li:first-child a { padding-left: 0; }
nav ul li a { padding: 0 10px; color: #918d88; }
nav ul li a.active,
nav ul li a:focus,
nav ul li a:hover { color: #a02b49; text-decoration: none; }
nav .to-index-page { float: right; color: #918d88; }

main { position: relative; padding-bottom: 10px; float: none !important; }
main .more-info { position: absolute; top: 0; right: 15px; bottom: 10px; width: 20%; text-align: center; overflow: hidden;
    font-family: 'Georgia', 'Century Schoolbook L', serif; }
main .more-info:after { position: absolute; content:''; height: 100%; width: 100%; -webkit-transform: rotate(25deg);
    -moz-transform: rotate(25deg); transform: rotate(25deg); right: -50%; bottom: -25%; background: rgba(189, 214, 206, .8); }
main .more-info a { position: absolute; right: 5%; bottom: 15px; z-index: 1; font-size: 1.2em; color: #ffffff;
    font-style: italic; text-decoration: none; }
main .more-info a:hover { color: #ffffff; text-decoration: none; }
main .more-info a .font-size46 { font-size: 1.8em; }
main img { width: 100%; }
main h1 { position: absolute; top: calc(50% - 45px); left: calc(50% - 204px); text-transform: uppercase; font-size: 40px;
    letter-spacing: 20px; text-indent: 20px; margin: 0; color: #ffffff; font-weight: normal; }
main h1:hover { cursor: pointer; }
main h1 span { display: block; margin: 0 20px; font-size: 23px; letter-spacing: 5px; text-transform: uppercase; text-align: center;
    color: #817e7a; line-height: 45px; background: rgba(255,255,255, .7); font-style: italic; font-weight: bold; }

.slogan { font-size: 25px; line-height: 30px; color: #91b1a5; text-align: center; padding-bottom: 5px; }

/* fotocards */
.fotocards main .more-info a { right: 5%; }
.fotocards main .more-info a .font-size41 { font-size: 1.8em; }

/* bigphoto */
.bigphoto main h1 { top: 31%; left: calc(50% - 180px); }

/* poster */
.poster main h1 { top: 7%; left: 15%; text-align: center; text-indent: 0; padding-left: 15px; }
.poster main h1 span { padding: 0 10px; margin: 0 0 0 -15px; }

/* photocalendar */
.photocalendar main h1 { top: calc(50% - 190px); }

/* photobook */
.photobook main h1 { top: 21%; left: 60%; }
.photobook main .more-info a { right: 7%; }

@media (max-width: 768px) {
    main .more-info a { font-size: 12px; line-height: 20px; }
    main .more-info a .font-size46 { font-size: 20px; }
    .fotocards main .more-info a .font-size41 { font-size: 20px; }
    .bigphoto main .more-info a .font-size41 { font-size: 20px; }
    .photobook main .more-info a .font-size41 { font-size: 20px; }
}
@media (min-width: 768px) {
    main .more-info a { font-size: 16px; line-height: 20px; }
    main .more-info a .font-size46 { font-size: 25px; }
    .fotocards main .more-info a .font-size41 { font-size: 20px; }
    .bigphoto main .more-info a .font-size41 { font-size: 20px; }
    .photobook main .more-info a .font-size41 { font-size: 20px; }
}

@media (min-width: 992px) {
    main .more-info a { font-size: 21px; line-height: 30px; }
    main .more-info a .font-size46 { font-size: 31px; }
    .fotocards main .more-info a .font-size41 { font-size: 26px; }
    .bigphoto main .more-info a .font-size41 { font-size: 26px; }
    .photobook main .more-info a .font-size41 { font-size: 26px; }
}

@media (min-width: 1200px) {
    main .more-info a { font-size: 25px; }
    main .more-info a .font-size46 { font-size: 41px; }
    .fotocards main .more-info a .font-size41 { font-size: 36px; }
    .bigphoto main .more-info a .font-size41 { font-size: 36px; }
    .photobook main .more-info a .font-size41 { font-size: 36px; }
}

@media (min-width: 1366px) {
    .container { width: 1366px; }
    main .more-info a { font-size: 31px; line-height: 40px; }
    main .more-info a .font-size46 { font-size: 46px; }
    .fotocards main .more-info a .font-size41 { font-size: 40px; line-height: 40px; }
    .bigphoto main .more-info a .font-size41 { font-size: 40px; line-height: 40px; }
    .photobook main .more-info a .font-size41 { font-size: 40px; line-height: 40px; }
}

@media (max-width: 991px) {
    main:after { top: 120px; left: 0; }
    .photobook main h1 { left: auto; right: 0; }
}

section { padding-top: 20px; background: #f1f4f1; }
section article[class^="product-"] { position: relative; width: 100%; max-width: 541px; margin: 0 auto; }
section article[class^="product-"] img { width: 100%; }
section article[class^="product-"] h2 { position: absolute; bottom: 20%; right: 28%; margin: 0; text-transform: uppercase;
    color: #ffffff; font-size: 21px; font-weight: normal; text-align: center; }
section article[class^="product-"] .switch-color { position: absolute; bottom: 13%; left: calc(50% - 180px); margin: 0;
    padding: 0; list-style: none; }
section article[class^="product-"] .switch-color li { position: relative; display: inline-block;  margin-left: 15px; }
section article[class^="product-"] .switch-color li.loading:after { position: absolute; content: ''; top: calc(50% - 16px);
    left: calc(50% - 16px); width: 32px; height: 32px;
    background: #ffffff url('/common/pics/ajax-loader_white.gif') no-repeat center center; z-index: 1; }
section article[class^="product-"] .switch-color li label { display: block; width: 34px; height: 34px; margin: 0;
    border: 8px solid #ffffff; cursor: pointer; }
section article[class^="product-"] .switch-color li.selected label { border-color: #a7bcb0; }
section article[class^="product-"] .switch-color li label.white-theme { background: #ffffff; }
section article[class^="product-"] .switch-color li label.sand-theme,
section article[class^="product-"] .switch-color li label.beige-theme { background: #f1ebda; }
section article[class^="product-"] .switch-color li label.rose-theme { background: #e8aea4; }
section article[class^="product-"] .switch-color li label.purple-theme { background: #e8ddef; }
section article[class^="product-"] .switch-color li label.green-theme { background: #dcebcf; }
section article[class^="product-"] .switch-color li label.blue-theme { background: #c8d1ec; }
section article[class^="product-"] .switch-color li label.black-theme { background: #000000; }
section article[class^="product-"] .link { position: absolute; bottom: 6%; right: 46%;
    color: #91b1a5; font-size: 25px; }

/* fotocards */
section.fotocards:not(:last-of-type) { padding-top: 0; margin-bottom: 90px; }
section.fotocards article[class^="product-"] h2 { bottom: 24%; right: 30%; }

/* bigphoto */
section.bigphoto article[class^="product-"] h2 { bottom: 18%; }
section.bigphoto article[class$="-h"] h2 { bottom: 22%; }
section.bigphoto .col-md-6:nth-child(2n) article[class^="product-"] h2 { right: 33%; }
section.bigphoto article[class^="product-"] .switch-color { bottom: 10%; }
section.bigphoto article[class$="-h"] .switch-color { bottom: 12%; }
section.bigphoto article[class^="product-"] .link { bottom: 2%; right: 49%; }
section.bigphoto article[class$="-h"] .link { bottom: 4%; }
section.bigphoto .col-md-6:first-child article[class^="product-"] .link { right: 43%; }

/* photobook */
section.photobook article[class^="product-"] h2 { bottom: 35%; }
section.photobook article[class^="product-"] .switch-color { bottom: 23%; }

footer:not(#footer) { padding: 35px 0; font-size: 24px; color: #91b1a5; text-align: center; }
footer:not(#footer) div { font-size: 32px; }

/* footer */
#footer { width: 976px; margin: 0 auto; padding-bottom: 180px; color: #8f8f8f; }
.footer_widget { float: left; width: 212px; }
.footer_widget:first-child { width: 300px; margin-right: 40px; }
.footer_widget h4 { font-size: 13.5px; line-height: 22px; padding-left: 20px; margin: 0 0 10px; font-weight: normal;
    text-transform: uppercase; }
.footer_widget ul { margin: 0; padding: 0 0 0 20px; }
.footer_widget ul li { line-height: 19px; }
.footer_widget ul li a { font-size: 12px; font-family: 'ProximaNova', sans-serif; }
.footer_widget h4 { background: #f9f9f9; }
.footer_widget ul li { list-style: none; }
.footer_widget ul li a { color: #8f8f8f; }
.footer_widget ul li a.active, .footer_widget ul li a:hover { color: #a02b49; text-decoration: none; }

/* delivery box */
.delivery-box { background: #f1f4f1; padding: 40px 0; margin-bottom: 90px; }
.delivery-box .delivery-box-text { text-align: center; }
.delivery-box .delivery-box-text h3 { margin: 0 0 50px; padding: 0; font-size: 38px; color: #91b1a5; text-transform: uppercase; font-weight: normal; }
.delivery-box .delivery-box-text p { margin: 0; padding: 0; font-size: 28px; color: #91b1a5; }
.delivery-box .delivery-box-bg.retrophotos { position: absolute; right: 0; top: -30px; content: ''; width: 832px; height: 479px;
    background: transparent url('/common/pics/pictures_lp/retrophotos/box.png'); }
.delivery-box .delivery-box-bg.photocards { position: absolute; right: 0; top: -30px; content: ''; width: 1030px; height: 506px;
    background: transparent url('/common/pics/pictures_lp/fotokarten/box.png'); }


.font-size41 { font-size: 41px; }
.font-size46 { font-size: 46px; }
