Style & Look von Lt. Colonel Curtis

/* ----------------------------------------- */ /* View: Filmrolle-single-page - Start */ /* ----------------------------------------- */ /* Start SzbQuer UND SzbHoch */ .mein-szb-wrap { padding: 0; margin-bottom: 30px; } .mein-szb-wrap .sznbild-wrapper { position: relative; } .mein-szb-wrap .mein-szb-titel { margin-top: 20px; margin-bottom: 3px; font-size:28px; } .mein-szb-wrap .mein-szb-titel a { color: #333; -webkit-transition: color 0.8s; -moz-transition: color 0.8s; -o-transition: color 0.8s; transition: color 0.8s; } .mein-szb-wrap .mein-szb-titel a:hover, .mein-szb-wrap .mein-szb-titel a:focus { color: #e21d96; text-decoration: none; } #impName { color: #e21d96; font-size:28px; display: inline-block; } #impName span{ color: #333; display:inline; } /* END */ /*Start Placement*/ div.plcInner { display: none; padding: 15px; box-shadow: 0 0 10px #868686; } div.plcInner:first-child { display:block; } div.plcInner h1 {font-size:24px !important; margin: 0; padding-bottom: 10px; padding-top:0; } .orgSize { height: auto !important; } .orgSize .plcFRlink{ position:relative !important; padding-left: 0; padding-bottom:0; padding-right:0; bottom: 0 !important; } .orgSize .plcText { height:auto !important; } @media only screen and (max-width: 767px) { .mein-szb-wrap .mein-szb-titel { margin-top: 20px; margin-bottom: 3px; font-size:24px; } #impName { color: #e21d96; font-size:24px; display: inline-block; } #impName span{ color: #333; display:inline; } div.plcInner{ height: auto !important; } div.plcInner .plcText { height:auto !important; } div.plcInner .plcFRlink{ position:relative !important; padding-left: 5px; padding-bottom:0; padding-right:5px; bottom: 0 !important; } div.plcInner div.defMore.weiter { display:none; } } @media only screen and (max-width: 991px) { .impName-wrapper { padding:0; } } @media only screen and (min-width:992px) and (max-width: 1199px) { .row.horizontal-padding15 { padding-right:10px !important; padding-left:10px !important; } .impName-wrapper { padding:0; } } /* END */ /* Start Nutzungserklärung Overlay CSS*/ @-webkit-keyframes swipeleft {from {left:50px;}to {left:10px;}} @-moz-keyframes swipeleft {from {left:50px;}to {left:10px;}} @-o-keyframes swipeleft {from {left:50px;}to {left:10px;}} @keyframes swipeleft {from {left:50px;}to {left:10px;}} @-webkit-keyframes swiperight {from {left:-100px;}to {left:-20px;}} @-moz-keyframes swiperight {from {left:-100px;}to {left:-20px;}} @-o-keyframes swiperight {from {left:-100px;}to {left:-20px;}} @keyframes swiperight {from {left:-100px;}to {left:-20px;}} @-webkit-keyframes fadein {from {opacity:0;}to {opacity:1;}} @-moz-keyframes fadein {from {opacity:0;}to { opacity:1;}} @-o-keyframes fadein {from {opacity:0;}to {opacity: 1;}} @keyframes fadein {from {opacity:0;}to {opacity:1;}} @-webkit-keyframes fadeout {from {opacity:1;}to {opacity:0;}} @-moz-keyframes fadeout {from {opacity:1;}to { opacity:0;}} @-o-keyframes fadeout {from {opacity:1;}to {opacity: 0;}} @keyframes fadeout {from {opacity:1;}to {opacity:0;}} @-webkit-keyframes meinneon { from { -webkit-box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; -moz-box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; } to { -webkit-box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; -moz-box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; } } @-moz-keyframes meinneon { from { -webkit-box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; -moz-box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; } to { -webkit-box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; -moz-box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; } } @-o-keyframes meinneon { from { -webkit-box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; -moz-box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; } to { -webkit-box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; -moz-box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; } } @keyframes meinneon { from { -webkit-box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; -moz-box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; box-shadow: 0 0 6px 2px #ff4fbb, inset 0 0 5px 100px #ff4fbb; } to { -webkit-box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; -moz-box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; box-shadow: 0 0 6px 0 #ff4fbb, inset 0 0 5px 0 #ff4fbb; } } @-webkit-keyframes klickstl {0% {margin: 0;} 50% {margin: -5px 0 0 -5px;} 100% {margin: 0;}} @-moz-keyframes klickstl {0% {margin: 0;} 50% {margin: -5px 0 0 -5px;} 100% {margin: 0;}} @-o-keyframes klickstl {0% {margin: 0;} 50% {margin: -5px 0 0 -5px;} 100% {margin: 0;}} @keyframes klickstl {0% {margin: 0;} 50% {margin: -5px 0 0 -5px;} 100% {margin: 0;}} @-webkit-keyframes klickstr {0% {margin: 0;} 50% {margin: -5px 0 0 5px;} 100% {margin: 0;}} @-moz-keyframes klickstr {0% {margin: 0;} 50% {margin: -5px 0 0 5px;} 100% {margin: 0;}} @-o-keyframes klickstr {0% {margin: 0;} 50% {margin: -5px 0 0 5px;} 100% {margin: 0;}} @keyframes klickstr {0% {margin: 0;} 50% {margin: -5px 0 0 5px;} 100% {margin: 0;}} @-webkit-keyframes klicksbr {0% {margin: -5px 0 0 -5px;} 50% {margin: 0;} 100% {margin: -5px 0 0 -5px;}} @-moz-keyframes klicksbr {0% {margin: -5px 0 0 -5px;} 50% {margin: 0;} 100% {margin: -5px 0 0 -5px;}} @-o-keyframes klicksbr {0% {margin: -5px 0 0 -5px;} 50% {margin: 0;} 100% {margin: -5px 0 0 -5px;}} @keyframes klicksbr {0% {margin: -5px 0 0 -5px;} 50% {margin: 0;} 100% {margin: -5px 0 0 -5px;}} @-webkit-keyframes klicksbl {0% {margin: -5px 0 0 5px;} 50% {margin: 0;} 100% {margin: -5px 0 0 5px;}} @-moz-keyframes klicksbl {0% {margin: -5px 0 0 5px;} 50% {margin: 0;} 100% {margin: -5px 0 0 5px;}} @-o-keyframes klicksbl {0% {margin: -5px 0 0 5px;} 50% {margin: 0;} 100% {margin: -5px 0 0 5px;}} @keyframes klicksbl {0% {margin: -5px 0 0 5px;} 50% {margin: 0;} 100% {margin: -5px 0 0 5px;}} @-webkit-keyframes klickripple {0% {opacity:1;margin:0;width:0;height:0;} 50% {opacity: 1;margin:0;width:0;height:0;} 100% {opacity:0;margin:-32px;width:64px;height:64px;}} @-moz-keyframes klickripple {0% {opacity:1;margin:0;width:0;height:0;} 50% {opacity: 1;margin:0;width:0;height:0;} 100% {opacity:0;margin:-32px;width:64px;height:64px;}} @-o-keyframes klickripple {0% {opacity:1;margin:0;width:0;height:0;} 50% {opacity: 1;margin:0;width:0;height:0;} 100% {opacity:0;margin:-32px;width:64px;height:64px;}} @keyframes klickripple {0% {opacity:1;margin:0;width:0;height:0;} 50% {opacity: 1;margin:0;width:0;height:0;} 100% {opacity:0;margin:-32px;width:64px;height:64px;}} /***** ANimationnen ******/ #meintourb { display:none; } body.btour #meintourb { position: absolute; display:block; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0,0.5); z-index: 6; -webkit-animation: fadein 2s; -moz-animation: fadein 2s; -o-animation: fadein 2s; animation: fadein 2s; } body.btour .mein-szb-wrap:first-child .einstrp:first-child > .einStr { z-index:7; } body.btour .mein-szb-wrap:first-child .einstrp:first-child > .span-meinripple { width: 0; height: 0; margin: 0; background:#fff; -webkit-transform: translate(12px,12px); -moz-transform: translate(12px,12px); -o-transform: translate(12px,12px); -ms-transform: translate(12px,12px); transform: translate(12px,12px); display: inline-block; border-radius: 100%; -webkit-animation: klickripple 2s ease 1s; -moz-animation: klickripple 2s ease 1s; -o-animation: klickripple 2s ease 1s; animation: klickripple 2s ease 1s; z-index:11; } .mein-szb-wrap:first-child .plc-wrapper.aktiv .swipetour.l-r-b { opacity:0; position: fixed; display:block; background: 0 0/78px 78px no-repeat url(https://dress-me-like.com/wp-content/uploads/2017/05/links.png); width:100%; max-width: 360px; height:80px; top:40%; left:50px; bottom:0; right:0; margin:0 auto; z-index:3; -webkit-animation: fadein 1s ease 0.5s forwards, swipeleft 1s ease 0.5s forwards, fadeout 2s ease 15s forwards; -moz-animation: fadein 1s ease 0.5s forwards, swipeleft 1s ease 0.5s forwards, fadeout 2s ease 15s forwards; -o-animation: fadein 1s ease 0.5s forwards, swipeleft 1s ease 0.5s forwards, fadeout 2s ease 15s forwards; animation: fadein 1s ease 0.5s forwards, swipeleft 1s ease 0.5s forwards, fadeout 2s ease 15s forwards; } .mein-szb-wrap:first-child .plc-wrapper.aktiv .swipetour.l-r-a { opacity:0; position: fixed; display:block; background: 0 0/78px 78px no-repeat url(https://dress-me-like.com/wp-content/uploads/2017/05/rechts.png); width:100%; max-width: 370px; height:80px; top:40%; left:-100px; bottom:0; right:0; margin:0 auto; z-index: 3; -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); transform:rotate(180deg); -webkit-animation: fadein 1s ease 1s forwards, swiperight 1s ease 1s forwards, fadeout 2s ease 15s forwards; -moz-animation: fadein 1s ease 1s forwards, swiperight 1s ease 1s forwards, fadeout 2s ease 15s forwards; -o-animation: fadein 1s ease 1s forwards, swiperight 1s ease 1s forwards, fadeout 2s ease 15s forwards; animation: fadein 1s ease 1s forwards, swiperight 1s ease 1s forwards, fadeout 2s ease 15s forwards; } .mein-szb-wrap:first-child .plc-wrapper.aktiv .swipetour.l-r { opacity:0; display: block; position: fixed; z-index: 2; top: 40%; left:0; right:0; bottom:0; text-align: center; width: 100%; margin-top:-25px; /*Zusatz, nur zum ausprobieren*/ -webkit-animation: fadein 1s ease 0.5s forwards, fadeout 2s ease 15s forwards; -moz-animation: fadein 1s ease 0.5s forwards, fadeout 2s ease 15s forwards; -o-animation: fadein 1s ease 0.5s forwards, fadeout 2s ease 15s forwards; animation: fadein 1s ease 0.5s forwards, fadeout 2s ease 15s forwards; } @media screen and (min-width: 768px) and (max-width: 991px) { .mein-szb-wrap:first-child .plc-wrapper.aktiv:before, .mein-szb-wrap:first-child .plc-wrapper.aktiv:after { max-width:400px; } .mein-szb-wrap:first-child .plc-wrapper.aktiv .swipetour.l-r-b { max-width: 410px; } .mein-szb-wrap:first-child .plc-wrapper.aktiv .swipetour.l-r-a { max-width: 420px; } } .meintours.s-t-l, .meintours.s-t-r, .meintours.s-b-l, .meintours.s-b-r { display:none; } body.btour .meintours.s-t-l, body.btour .meintours.s-t-r, body.btour .meintours.s-b-l, body.btour .meintours.s-b-r { display:block; -webkit-animation: fadein 2.5s; -moz-animation: fadein 2.5s; -o-animation: fadein 2.5s; animation: fadein 2.5s; } /*Stern Top-Left*/ body.btour .meintours.s-t-l { width: 120px; height: 80px; position: absolute; z-index: 8; margin: 0; } body.btour .meintours.s-t-l > p { position: relative; top: 56px; left: -5px; right: 0; bottom: 0; width: 160px; margin: 0; } body.btour .meintours.s-t-l > span { display: block; position: absolute; width: 72px; height: 72px; top: -9px; left: 12px; right: 0; bottom: 0; z-index: 1; margin: 0; padding: 0; -webkit-transform: rotate(330deg); -moz-transform: rotate(330deg); -ms-transform: rotate(330deg); transform: rotate(330deg); -webkit-animation: klickstl 0.3s ease 2s forwards; -moz-animation: klickstl 0.3s ease 2s forwards; -o-animation: klickstl 0.3s ease 2s forwards; animation: klickstl 0.3s ease 2s forwards; } /*Stern Top-Right*/ body.btour .meintours.s-t-r { width: 120px; height: 80px; position: absolute; z-index: 8; margin-left: -96px; } body.btour .meintours.s-t-r > p { position: relative; top: 60px; left: -55px; right: 0; bottom: 0; width: 160px; margin: 0; } body.btour .meintours.s-t-r > span { display: block; position: absolute; width: 72px; height: 72px; top: 0px; left: 40px; right: 0; bottom: 0; z-index: 1; margin: 0; padding: 0; -webkit-transform: rotate(85deg); -moz-transform: rotate(85deg); -ms-transform: rotate(85deg); transform: rotate(85deg); -webkit-animation: klickstr 0.3s ease 2s forwards; -moz-animation: klickstr 0.3s ease 2s forwards; -o-animation: klickstr 0.3s ease 2s forwards; animation: klickstr 0.3s ease 2s forwards; } /*Stern Bottom-Left*/ body.btour .meintours.s-b-l { width: 120px; height: 80px; position: absolute; z-index: 8; margin: -56px 0 0 0; } body.btour .meintours.s-b-l > p { position: relative; top: -36px; left: -6px; right: 0; bottom: 0; width: 160px; margin: 0; } body.btour .meintours.s-b-l > span { display: block; position: absolute; width: 72px; height: 72px; top: 5px; left: -6px; right: 0; bottom: 0; z-index: 1; margin: -5px 0 0 5px; padding:0; -webkit-transform: rotate(250deg); -moz-transform: rotate(250deg); -ms-transform: rotate(250deg); transform: rotate(250deg); -webkit-animation: klicksbl 0.3s ease 2s forwards; -moz-animation: klicksbl 0.3s ease 2s forwards; -o-animation: klicksbl 0.3s ease 2s forwards; animation: klicksbl 0.3s ease 2s forwards; } /*Stern Bottom-Right*/ body.btour .meintours.s-b-r { width: 120px; height: 80px; position: absolute; z-index: 8; margin-left: -96px; margin-top: -56px; } body.btour .meintours.s-b-r > p { position: relative; top: -32px; left: -40px; right: 0; bottom: 0; width: 160px; margin:0; } body.btour .meintours.s-b-r > span { display: block; position: absolute; width: 72px; height: 72px; top: 10px; left: 48px; right: 0; bottom: 0; z-index: 1; margin: -5px; padding:0; -webkit-transform: rotate(166deg); -moz-transform: rotate(166deg); -ms-transform: rotate(166deg); transform: rotate(166deg); -webkit-animation: klicksbr 0.3s ease 2s forwards; -moz-animation: klicksbr 0.3s ease 2s forwards; -o-animation: klicksbr 0.3s ease 2s forwards; animation: klicksbr 0.3s ease 2s forwards; } @media screen and (min-width:992px) { body.btour #meintourb { position: fixed; display:block; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, 0.9); z-index: 100; -webkit-animation: fadein 2s; -moz-animation: fadein 2s; -o-animation: fadein 2s; animation: fadein 2s; overflow: auto; text-align: center; padding: 50px 0 0; } #meintourc { width: 742px; height:527px; position: absolute; margin: auto; padding: 15px; background: white; top: 0; bottom: 0; left: 0; right: 0; } body.btour .close-thik.mit-x-1 { display: block; position: absolute; width:22px; right: 20px; text-decoration: none; top: 20px; cursor: pointer; z-index: 9999; } body.btour .meinicon-info { display: block; position: absolute; width: 28px; left: 20px; text-decoration: none; top: 15px; cursor: pointer; z-index: 9999; } body.btour .willkom-wrapper { position: relative; display: block; top: 0; left: 0; z-index: 12; width: 100%; margin:0; padding:0; } body.btour .willkom-1 { font-size: 28px; margin: 0; font-family: 'Oswald',sans-serif; } body.btour .willkom-2 { font-size: 18px; margin:0; font-family: 'Oswald',sans-serif; } body.btour .willkom-3 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; line-height: 1.42857143; margin:10px 0 0 0; padding:0 8px; } .willkom-1, .willkom-2, .willkom-3 { color: #000; text-align: center; } body.btour .willkom-wrapper-2 { display: block; text-align: center; position: relative; padding-top: 30px; width:712px; } .willkom-wrapper-2 img { width: 100%; } #meininfo { position: relative; padding: 0; width: 18px; height: 18px; float: left; line-height: 18px; margin-top: 3px; margin-right:5px; cursor: pointer; } body.btour #meininfo.animierbar { -webkit-animation: none; -moz-animation: none; -o-animation: none; animation: none; } #meininfo.animierbar { border-radius:100%; -webkit-animation: meinneon 300ms ease-in-out 9 alternate; -moz-animation: meinneon 300ms ease-in-out 9 alternate; -o-animation: meinneon 300ms ease-in-out 9 alternate; animation: meinneon 300ms ease-in-out 9 alternate; } #meininfo > .meininfo-bild-1{ vertical-align:baseline; border-radius:100%; } #meininfo > .meininfo-bild-2{ display:none; position: absolute; opacity:0; top: 0; left: 0; z-index: 0; } } /* END Nutzungserklärung Overlay CSS*/ /*START Szenenbild Copyrights und Credits*/ .mein-szb-credits { font-size:10px; color: #a2a2a2; margin:0; float:right; } /*END Szenenbild Copyrights und Credits*/ /* ----------------------------------------- */ /* View: Filmrolle-single-page - Ende */ /* ----------------------------------------- */

/* ----------------------------------------- */ /* Inhalts-Template: navagation-in-index-layout-template - Start */ /* ----------------------------------------- */ @media screen and (max-width:767px) { .myFixedFooter #infinite-footer { position:relative; padding:0; } .myFixedFooter #infinite-footer .blog-info { float:none; white-space:normal; text-align: center; } .myFixedFooter #infinite-footer .container .blog-info img { float:none; width:auto; display:block; margin:4px auto 0 auto; } .myFixedFooter #infinite-footer .blog-credits { float:none; text-align:center; margin-bottom:4px; } .myFixedFooter #infinite-footer .blog-info a { float:none; margin-top:5px; display:block; font-size:11px; } } @media only screen and (min-width:768px) and (max-width: 790px) { .myFixedFooter #infinite-footer { padding:0; } } .meinBlended { display:none; } /* ----------------------------------------- */ /* Inhalts-Template: navagation-in-index-layout-template - Ende */ /* ----------------------------------------- */