/* CARLOS KLEIN PHOTOGRAPHY RESPONSIVE ELEMENTS */

/* Zu geringe Höhe des Browsers */
@media only screen and (max-height:290px) {
    .subnav-menu-button {display:none;}
    .subnav-menu.on ul {display:none;}
    .arrow {display:none;}
}

/* Screen width under 768px */
@media (orientation:portrait) and (max-width:767px) {
    .header {position:-webkit-sticky !important; position:sticky !important; top:0 !important;}
}

/* Mobiles (Portrait), Low Resolution */
@media only screen and (max-width:374px) {
    .buttonsub:hover {color:#FFF;}
    .buttonsub.active {color:#FFF; font-weight:600;}
    h1 {font-size: 44px; line-height: 1.1;}
    h1.portfolio {font-size: 44px; line-height: 1.1;}
    #supersized img {background-image: url("../images/slider/carlosklein-slider-sunglasses-blank-2026.jpg"); background-position:50%;}
}

/* Mobiles (Portrait), Most of the Smartphones */
@media only screen and (min-width:375px) and (max-width:480px) {
    .logoblock {width:280px; height:auto;}
    .logo {max-width:90px; height:auto; padding:18px 0 0 25px !important;}
    .arrow-container {bottom:40px;}
    .arrow {width:30px; height:12px;}
    nav {justify-content:right;}
    .nav li.active a {color:#FFFFFF}
    .buttonsub:hover {color:#FFF;}
    .buttonsub.active {color:#FFF; font-weight:600;}
    .page-portfolio {padding-bottom:8px;}
    h1 {font-size: 52px; line-height: 1.1;}
    h1.portfolio {font-size: 52px; line-height: 1.1;}
    hr.light {border:0; border-bottom:1px solid #777777; opacity:0.3; width:auto; margin:0 35% 0 35%;}
    .spacer {height:25px !important;}
    .item {height:auto;}
    .lines {width:90%; font-size:20px;}
    .adress {font-size:14px;}
    #copyright {height:auto; padding:0 20px 40px 20px;}
    .contact-social-icons li a {width:30px; height:30px; font-size:20px;}
    .landing {display:flex; justify-content:center; align-content:center; width:auto; height:100%; padding-bottom:0px; outline:none; border:none;}
    .scale {padding:0px 20px 12px 20px;}
    .anker {height:0 !important; position:absolute; margin-top:-55px;}
    .watermark:after {content:""; display:block; width:70px; height:19px; position:relative; float:right; right:20px; bottom:38px; background-image:url("../images/logos/logo-carlosklein-fotografie-block-white.png"); background-size:70px 19px; /*background-position: 100px 300px;*/ background-repeat:no-repeat; opacity:0.2; z-index:9999;}
    #portrait-body {right:-45px; background-image: url("../images/carlosklein/carlosklein-easteregg-body-small.png"); width:310px; height:281px;}
    #portrait-hand {right:-45px; background-image: url("../images/carlosklein/carlosklein-easteregg-hand-small.png"); width:310px; height:76px;}
    .me-off {right:140px; bottom:100px; margin:0;}
    #supersized img {background-image: url("../images/slider/carlosklein-slider-sunglasses-blank-2026.jpg"); background-position:50%;}
}

/* Mobiles (Landscape), Low Resolution Tablets */
@media only screen and (min-width:481px) and (max-width:767px) {
    .logoblock {width:400px; height:auto;}
    .logo {max-width:90px; height:auto; padding:18px 0 0 25px;}
    .nav li.active a {color:#FFF}
    .buttonsub:hover {color:#FFF;}
    .buttonsub.active {color:#FFF; font-weight:600;}
    .arrow-container {position:absolute; align-content:center; justify-content:center; display:flex; bottom:20px; width:100%; height:auto;}
    .arrow {width:30px; height:12px;}
    .header {position:relative;}
    .page-portfolio {padding-bottom:8px;}
    .spacer {height:25px !important;}
    h1 {font-size: 70px; line-height: 1.1;}
    hr.light {border:0; border-bottom:1px solid #777777; opacity:0.3; width:auto; margin:0 40% 0 40%;}
    .one-text {font-size:14px;}
    .lines {font-size:24px; width:70%;}
    .contact-social-icons li a {width:40px; height:40px; font-size:20px;}
    .contact-social-icons li {margin:0 0px 0 0px;}
    #contact {background-size:cover; height:auto;}
    #copyright {height:auto; padding:0 30px 40px 30px;}
    .social-icons {vertical-align:middle; display:table-cell; position:absolute; top:18px; right:5px;}
    .social-icons li a {width:28px; height:28px; line-height:1.8; font-size:15px;}
    .column .img-wrp {margin:40px 0px 0px 0px;}
    .selectnav {display:none;}
    .option-set {margin-left:0;}
    .scale {padding:0px 90px 10px 90px;}
    .anker-flat {visibility:hidden; height:0px !important; position:absolute; margin:-55px;}
    #portrait-body {right:20px; background-image: url("../images/carlosklein/carlosklein-easteregg-body-small.png"); width:310px; height:281px;}
    #portrait-hand {right:20px; background-image: url("../images/carlosklein/carlosklein-easteregg-hand-small.png"); width:310px; height:76px;}
    .me-off {right:190px; bottom:100px; margin:0;}
}

/* Mobiles (Landscape), Low Resolution Tablets */
@media (orientation:landscape) and (max-width:1023px) {
    .header {position:relative;}
    .subheader {top:0;}
    hr.light {border:0; border-bottom:1px solid #777777; opacity:0.3; width:auto; margin:0 40% 0 40%;}
}
    
/* Tablets, iPads (Portrait) */
@media only screen and (min-width:768px) and (max-width:1023px) {
    .logoblock {width:480px; height:auto;}
    .logo {max-width:90px; height:auto; padding:18px 0 0 25px;}
    .nav li.active a {color:#FFF}
    .buttonsub:hover {color:#FFF;}
    .buttonsub.active {color:#FFF; font-weight:600;}
    .arrow-container {bottom:60px;}
    .arrow {width:30px; height:12px;}
    hr.light {border:0; border-bottom:1px solid #777777; opacity:0.3; width:auto; margin:0 40% 0 40%;}
    #contact {background-size: cover;}
    #copyright {height: auto; padding: 0 60px 40px 60px;}
    .lines {font-size:24px; width:60%;}
    .adress {font-size:14px;}
    .scale {padding:0px 20px 10px 20px;}
    #portrait-body {right:20px; background-image: url("../images/carlosklein/carlosklein-easteregg-body-small.png"); width:310px; height:281px;}
    #portrait-hand {right:20px; background-image: url("../images/carlosklein/carlosklein-easteregg-hand-small.png"); width:310px; height:76px;}
    .me-off {right:200px; bottom:100px; margin:0;}
    #supersized img {background-image: url("../images/slider/carlosklein-slider-sunglasses-blank-2026.jpg"); background-position:50%;}
}

/* Tablets, iPads (Landscape) */
@media (min-width:1024px) and (max-width:1366px) {
    .logoblock {width:400px; height:auto;}
    .logo {max-width:90px; height:auto; padding:18px 0 0 25px;}
    .arrow-container {bottom:40px;}
    .arrow {width:30px; height:12px;}
    #contact {background-size:cover;}
    hr.light {display:none;}
    #copyright {height:auto; padding:0 60px 40px 60px;}
    .lines {font-size:24px; width:40%;}
    .adress {font-size:14px;}
    .scale {padding:0px 30px 10px 30px;}
    #supersized img {background-image: url("../images/slider/carlosklein-slider-sunglasses-blank-2026.jpg"); background-position:50%;}
}

/* Widescreens */
@media only screen and (min-width:1367px) {
    hr.light {display:none;}
}