#stacks_in_118 { border: solid rgba(77, 77, 77, 1.00); border-width: 0px 0px 1px 0px; margin: 0px 0px 15px 0px; } #stacks_in_119 { font-size: 193%; } /* @group Page */ /* Stop the background page scrolling when the modal is open */ body.sociableOpen { overflow: hidden !important; } /* @end */ /* @group Share Button */ #socialPopupTriggerButtonstacks_in_348 *, #socialPopupTriggerButtonstacks_in_348 *::after, #socialPopupTriggerButtonstacks_in_348 *::before { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } #socialPopupTriggerButtonstacks_in_348 { position: fixed; top: 10.00%; left: 2.00%; cursor: pointer; z-index: 999; } #socialPopupTriggerButtonstacks_in_348 { display: none; } #socialPopupTriggerButtonstacks_in_348 a { background: none; border: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; outline: none; } #socialPopupTriggerButtonstacks_in_348 a:focus { outline: none; border: none; } #socialPopupTriggerButtonstacks_in_348 #socialPopupTriggerButtonBorderstacks_in_348 { border: 2px solid #CDCDCD; background: #FFFFFF; border-radius: 27px; -webkit-border-radius: 27px; -moz-border-radius: 27px; height: 50px; overflow: hidden; z-index: 5; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } #socialPopupTriggerButtonstacks_in_348:hover #socialPopupTriggerButtonBorderstacks_in_348 { border: 2px solid #999999; background: #FFFFFF; } #socialPopupTriggerButtonstacks_in_348:hover #socialPopupTriggerButtonBorderstacks_in_348 { padding-right: 15px; } #socialPopupTriggerButtonstacks_in_348 #socialPopupTriggerButtonIconstacks_in_348 [class^="fa fa-"] { color: #333333; font-size: 24px; line-height: 50px; width: 50px; text-align: center; display: block; float: left; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } #socialPopupTriggerButtonstacks_in_348:hover #socialPopupTriggerButtonBorderstacks_in_348 [class^="fa fa-"] { color: #333333; } #socialPopupTriggerButtonstacks_in_348 #socialPopupTriggerButtonTextstacks_in_348 { color: #333333; font: 14px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; float: right; max-width: 0px; overflow: hidden; line-height: 50px; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } #socialPopupTriggerButtonstacks_in_348:hover #socialPopupTriggerButtonTextstacks_in_348 { max-width: 300px; color: #333333; } /* @end */ /* @group Content Block (top of modal) */ #sociableContentBlock { max-width: 1200px; margin: 0 auto; text-align: center; } #adBlockMessage { display: none; } #adBlockMessage.adBlockTrue { display: block; color: #ffffff; text-align: center; font-size: 16px; } /* @end */ /* @group Modal Window */ /* General styles for the modal */ /* Styles for the html/body for special modal where we want 3d effects Note that we need a container wrapping all content on the page for the perspective effects (not including the modals and the overlay). */ .socialPopupModalPerspective, .socialPopupModalPerspective body { height: 100%; overflow: hidden; } .socialPopupModalPerspective body { background: #222; -webkit-perspective: 600px; -moz-perspective: 600px; perspective: 600px; } .socialPopupModal-1 { position: fixed; top: 0%; left: 0%; width: 100%; overflow: auto; height: 100%; z-index: 19991; visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; } .socialPopupModalShow { visibility: visible; } .socialPopupModalOverlay { position: fixed; width: 100%; height: 100%; visibility: hidden; top: 0; left: 0; z-index: 1999; opacity: 0; background: #808080; -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; } .socialPopupModalShow ~ .socialPopupModalOverlay { opacity: 0.90; visibility: visible; } /* Content styles */ #socialPopupModalContentstacks_in_348 { position: relative; border-radius: 3px; margin: 0 auto; } /* Individual modal styles with animations/transitions */ /* */ /* @group Effect 1 */ /* Effect 1: Fade in and scale up */ .socialPopupModalEffect-1 #socialPopupModalContentstacks_in_348 { -webkit-transform: scale(0.7); -moz-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); opacity: 0; -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; } .socialPopupModalShow.socialPopupModalEffect-1 #socialPopupModalContentstacks_in_348 { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /* @end */ /* @group Effect 2 */ /* Effect 2: Slide from the right */ .socialPopupModalEffect-2 #socialPopupModalContentstacks_in_348 { -webkit-transform: translateX(20%); -moz-transform: translateX(20%); -ms-transform: translateX(20%); transform: translateX(20%); opacity: 0; -webkit-transition: all 1000ms cubic-bezier(0.25, 0.5, 0.5, 0.9); -moz-transition: all 1000ms cubic-bezier(0.25, 0.5, 0.5, 0.9); transition: all 1000ms cubic-bezier(0.25, 0.5, 0.5, 0.9); } .socialPopupModalShow.socialPopupModalEffect-2 #socialPopupModalContentstacks_in_348 { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); opacity: 1; } /* @end */ /* @group Effect 3 */ /* Effect 3: Slide from the bottom */ .socialPopupModalEffect-3 #socialPopupModalContentstacks_in_348 { -webkit-transform: translateY(20%); -moz-transform: translateY(20%); -ms-transform: translateY(20%); transform: translateY(20%); opacity: 0; -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; } .socialPopupModalShow.socialPopupModalEffect-3 #socialPopupModalContentstacks_in_348 { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; } /* @end */ /* @group Effect 4 */ /* Effect 4: Newspaper */ .socialPopupModalEffect-4 #socialPopupModalContentstacks_in_348 { -webkit-transform: scale(0) rotate(720deg); -moz-transform: scale(0) rotate(720deg); -ms-transform: scale(0) rotate(720deg); transform: scale(0) rotate(720deg); opacity: 0; } .socialPopupModalShow.socialPopupModalEffect-4 ~ .socialPopupModalOverlay, .socialPopupModalEffect-4 #socialPopupModalContentstacks_in_348 { -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; } .socialPopupModalShow.socialPopupModalEffect-4 #socialPopupModalContentstacks_in_348 { -webkit-transform: scale(1) rotate(0deg); -moz-transform: scale(1) rotate(0deg); -ms-transform: scale(1) rotate(0deg); transform: scale(1) rotate(0deg); opacity: 1; } /* @end */ /* @group Effect 5 */ /* Effect 5: fall */ .socialPopupModalEffect-5.socialPopupModal-1{ -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .socialPopupModalEffect-5 #socialPopupModalContentstacks_in_348 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateZ(600px) rotateX(20deg); -moz-transform: translateZ(600px) rotateX(20deg); -ms-transform: translateZ(600px) rotateX(20deg); transform: translateZ(600px) rotateX(20deg); opacity: 0; } .socialPopupModalShow.socialPopupModalEffect-5 #socialPopupModalContentstacks_in_348 { -webkit-transition: all 1000ms ease-in; -moz-transition: all 1000ms ease-in; transition: all 1000ms ease-in; -webkit-transform: translateZ(0px) rotateX(0deg); -moz-transform: translateZ(0px) rotateX(0deg); -ms-transform: translateZ(0px) rotateX(0deg); transform: translateZ(0px) rotateX(0deg); opacity: 1; } /* @end */ /* @group Effect 6 */ /* Effect 6: side fall */ .socialPopupModalEffect-6.socialPopupModal-1{ -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .socialPopupModalEffect-6 #socialPopupModalContentstacks_in_348 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translate(30%) translateZ(600px) rotate(10deg); -moz-transform: translate(30%) translateZ(600px) rotate(10deg); -ms-transform: translate(30%) translateZ(600px) rotate(10deg); transform: translate(30%) translateZ(600px) rotate(10deg); opacity: 0; } .socialPopupModalShow.socialPopupModalEffect-6 #socialPopupModalContentstacks_in_348 { -webkit-transition: all 1000ms ease-in; -moz-transition: all 1000ms ease-in; transition: all 1000ms ease-in; -webkit-transform: translate(0%) translateZ(0) rotate(0deg); -moz-transform: translate(0%) translateZ(0) rotate(0deg); -ms-transform: translate(0%) translateZ(0) rotate(0deg); transform: translate(0%) translateZ(0) rotate(0deg); opacity: 1; } /* @end */ /* @group Effect 7 */ /* Effect 7: slide and stick to top */ .socialPopupModalEffect-7{ top: 0; -webkit-transform: translateX(-0%); -moz-transform: translateX(-0%); -ms-transform: translateX(-0%); transform: translateX(-0%); } .socialPopupModalEffect-7 #socialPopupModalContentstacks_in_348 { -webkit-transform: translateY(-200%); -moz-transform: translateY(-200%); -ms-transform: translateY(-200%); transform: translateY(-200%); -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; opacity: 0; } .socialPopupModalShow.socialPopupModalEffect-7 #socialPopupModalContentstacks_in_348 { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); border-radius: 0 0 3px 3px; opacity: 1; } /* @end */ /* @group Effect 8 */ /* Effect 8: 3D flip horizontal */ .socialPopupModalEffect-8.socialPopupModal-1{ -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .socialPopupModalEffect-8 #socialPopupModalContentstacks_in_348 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-70deg); -moz-transform: rotateY(-70deg); -ms-transform: rotateY(-70deg); transform: rotateY(-70deg); -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; opacity: 0; } .socialPopupModalShow.socialPopupModalEffect-8 #socialPopupModalContentstacks_in_348 { -webkit-transform: rotateY(0deg); -moz-transform: rotateY(0deg); -ms-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } /* @end */ /* @group Effect 9 */ /* Effect 9: 3D flip vertical */ .socialPopupModalEffect-9.socialPopupModal-1{ -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .socialPopupModalEffect-9 #socialPopupModalContentstacks_in_348 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateX(-70deg); -moz-transform: rotateX(-70deg); -ms-transform: rotateX(-70deg); transform: rotateX(-70deg); -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; opacity: 0; } .socialPopupModalShow.socialPopupModalEffect-9 #socialPopupModalContentstacks_in_348 { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); -ms-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } /* @end */ /* @group Effect 10 */ /* Effect 10: 3D sign */ .socialPopupModalEffect-10.socialPopupModal-1{ -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .socialPopupModalEffect-10 #socialPopupModalContentstacks_in_348 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateX(-60deg); -moz-transform: rotateX(-60deg); -ms-transform: rotateX(-60deg); transform: rotateX(-60deg); -webkit-transform-origin: 50% 0; -moz-transform-origin: 50% 0; transform-origin: 50% 0; opacity: 0; -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; } .socialPopupModalShow.socialPopupModalEffect-10 #socialPopupModalContentstacks_in_348 { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); -ms-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } /* @end */ /* @group Effect 11 */ /* Effect 11: Super scaled */ .socialPopupModalEffect-11 #socialPopupModalContentstacks_in_348 { -webkit-transform: scale(2); -moz-transform: scale(2); -ms-transform: scale(2); transform: scale(2); opacity: 0; -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; } .socialPopupModalShow.socialPopupModalEffect-11 #socialPopupModalContentstacks_in_348 { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /* @end */ /* @group Effect 12 */ /* Effect 12: Just me */ .socialPopupModalEffect-12 #socialPopupModalContentstacks_in_348 { -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); opacity: 0; -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; } .socialPopupModalShow.socialPopupModalEffect-12 ~ .socialPopupModalOverlay { background: #000000; } .socialPopupModalEffect-12 #socialPopupModalContentstacks_in_348 h3, .socialPopupModalEffect-12 #socialPopupModalContentstacks_in_348 { background: transparent; } .socialPopupModalShow.socialPopupModalEffect-12 #socialPopupModalContentstacks_in_348 { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /* @end */ /* @group Effect 13 */ /* Effect 13: 3D slit */ .socialPopupModalEffect-13.socialPopupModal-1{ -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .socialPopupModalEffect-13 #socialPopupModalContentstacks_in_348 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateZ(-3000px) rotateY(90deg); -moz-transform: translateZ(-3000px) rotateY(90deg); -ms-transform: translateZ(-3000px) rotateY(90deg); transform: translateZ(-3000px) rotateY(90deg); opacity: 0; } .socialPopupModalShow.socialPopupModalEffect-13 #socialPopupModalContentstacks_in_348 { -webkit-animation: slit .7s forwards ease-out; -moz-animation: slit .7s forwards ease-out; animation: slit .7s forwards ease-out; } @-webkit-keyframes slit { 50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;} 100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; } } @-moz-keyframes slit { 50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;} 100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; } } @keyframes slit { 50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;} 100% { transform: translateZ(0) rotateY(0deg); opacity: 1; } } /* @end */ /* @group Effect 14 */ /* Effect 14: 3D Rotate from bottom */ .socialPopupModalEffect-14.socialPopupModal-1{ -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .socialPopupModalEffect-14 #socialPopupModalContentstacks_in_348 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateY(100%) rotateX(90deg); -moz-transform: translateY(100%) rotateX(90deg); -ms-transform: translateY(100%) rotateX(90deg); transform: translateY(100%) rotateX(90deg); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; transform-origin: 0 100%; opacity: 0; -webkit-transition: all 1000ms ease-out; -moz-transition: all 1000ms ease-out; transition: all 1000ms ease-out; } .socialPopupModalShow.socialPopupModalEffect-14 #socialPopupModalContentstacks_in_348 { -webkit-transform: translateY(0%) rotateX(0deg); -moz-transform: translateY(0%) rotateX(0deg); -ms-transform: translateY(0%) rotateX(0deg); transform: translateY(0%) rotateX(0deg); opacity: 1; } /* @end */ /* @group Effect 15 */ /* Effect 15: 3D Rotate in from left */ .socialPopupModalEffect-15.socialPopupModal-1{ -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .socialPopupModalEffect-15 #socialPopupModalContentstacks_in_348 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateZ(100px) translateX(-30%) rotateY(90deg); -moz-transform: translateZ(100px) translateX(-30%) rotateY(90deg); -ms-transform: translateZ(100px) translateX(-30%) rotateY(90deg); transform: translateZ(100px) translateX(-30%) rotateY(90deg); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; transform-origin: 0 100%; opacity: 0; -webkit-transition: all 1000ms; -moz-transition: all 1000ms; transition: all 1000ms; } .socialPopupModalShow.socialPopupModalEffect-15 #socialPopupModalContentstacks_in_348 { -webkit-transform: translateZ(0px) translateX(0%) rotateY(0deg); -moz-transform: translateZ(0px) translateX(0%) rotateY(0deg); -ms-transform: translateZ(0px) translateX(0%) rotateY(0deg); transform: translateZ(0px) translateX(0%) rotateY(0deg); opacity: 1; } /* @end */ /* */ /* @end */ /* @group Close button */ #sociableCloseButtonstacks_in_348 { position: absolute; top: 0; right: 0; padding: 0; margin: 0; color: #FFFFFF; font-size: 40px; line-height: 80px; width: 80px; text-align: center; text-decoration: none; background: none; border: none; outline: none; transition: all ease-in-out 300ms; } #sociableCloseButtonstacks_in_348 [class^="fa fa-"] { color: #FFFFFF; transition: all ease-in-out 300ms; } #sociableCloseButtonstacks_in_348:hover, #sociableCloseButtonstacks_in_348:hover [class^="fa fa-"] { color: #CDCDCD; } /* @end */ /* @group Radioactive Scroll Indicator */ @-webkit-keyframes radioactiveGlow { from { -webkit-box-shadow: 0 0 50px #FFFFFF; } 50% { -webkit-box-shadow: 0 0 0px #000000; } to { -webkit-box-shadow: 0 0 50px #FFFFFF; } } @-moz-keyframes radioactiveGlow { from { -moz-box-shadow: 0 0 50px #FFFFFF; } 50% { -moz-box-shadow: 0 0 0px #000000; } to { -moz-box-shadow: 0 0 50px #FFFFFF; } } @-ms-keyframes radioactiveGlow { from { -ms-box-shadow: 0 0 50px #FFFFFF; } 50% { -ms-box-shadow: 0 0 0px #000000; } to { -ms-box-shadow: 0 0 50px #FFFFFF; } } @keyframes radioactiveGlow { from { box-shadow: 0 0 50px #FFFFFF; } 50% { box-shadow: 0 0 0px #000000; } to { box-shadow: 0 0 50px #FFFFFF; } } #radioactiveScrollIndicatorstacks_in_348 { -webkit-animation-name: radioactiveGlow; -webkit-animation-duration: 2s; -webkit-animation-iteration-count: infinite; -moz-animation-name: radioactiveGlow; -moz-animation-duration: 2s; -moz-animation-iteration-count: infinite; -ms-animation-name: radioactiveGlow; -ms-animation-duration: 2s; -ms-animation-iteration-count: infinite; animation-name: radioactiveGlow; animation-duration: 2s; animation-iteration-count: infinite; position: fixed; bottom: -50px; left: 0px; width: 100%; height: 50px; background: #ffffff; display: none; } .socialPopupScrollable #radioactiveScrollIndicatorstacks_in_348 { display: block; } .modalScrolled #radioactiveScrollIndicatorstacks_in_348 { display: none; } /* @end */ /* @group Social Icon List */ #sociableIconWrapper *, #sociableIconWrapper *::after, #sociableIconWrapper *::before { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } #sociableIconWrapper { max-width: 1200px; margin: 60px auto; z-index: 1999; position: relative; } .socialIconArray { display: block; text-align: center; } .socialIconArray div { display: inline-block; width: auto; height: auto; line-height: 100px; text-align: center; position: relative; margin-bottom: 15px; text-align: center; line-height: 1.50em; font-size: 14px; z-index: 5; transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; color: #FFFFFF; } .socialIconArray div:hover { color: #FFFFFF; } .socialIconArray div a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; z-index: 10; } .socialIconArray div [class^="fa fa-"] { font-size: 60px; height: 100px; width: 100px; line-height: 100px; border-radius: 50px; position: relative; z-index: 5; border: 2px solid #FFFFFF; transition: all 300ms ease-in-out; overflow: hidden; display: block; margin: 15px; } .socialIconArray div:hover [class^="fa fa-"] { -webkit-box-shadow: 0px 0px 30px #FFFFFF; -moz-box-shadow: 0px 0px 30px #FFFFFF; box-shadow: 0px 0px 30px #FFFFFF; border: 2px solid #FFFFFF; } /* Sub headings */ .socialIconArray .subheading { margin-top: 15px; padding-top: 15px; font-size: 14px; display: block; float: none; color: #FFFFFF; } .socialIconArray .subheading a, .socialIconArray .subheading a:visited { color: #FFFFFF; text-decoration: underline; position: relative; top: auto; left: auto; width: auto; height: auto; display: inline; } .socialIconArray .subheading a:hover, .socialIconArray .subheading a:active { color: #FFFFFF; text-decoration: underline; } /* Utility icons */ #sociableUtilityIcons *, #sociableUtilityIcons *::after, #sociableUtilityIcons *::before { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } #sociableUtilityIcons { border-top: 1px solid #CDCDCD; margin-top: 20px; padding-top: 30px; display: block; } /* @end */ /* @group Print Styling */ @media print { #socialPopupstacks_in_348, #socialPopupModalOverlaystacks_in_348, #socialPopupTriggerButtonstacks_in_348 { display: none !important; } } /* @end */ /* @group Edit Mode Styling */ /* */ /* @end */#stacks_in_299>.s3_row { margin: 0 -10px; } #stacks_in_299>.s3_row>.s3_column_left { width: 33.33%; } #stacks_in_299>.s3_row>.s3_column_center { width: 33.339996%; } #stacks_in_299>.s3_row>.s3_column_right { width: 33.33%; } #stacks_in_299>.s3_row>.s3_column { padding: 0 10px; } @media only screen and (max-width: 770px) { } @media only screen and (max-width: 400px) { #stacks_in_299>.s3_row { margin: -10px 0; } #stacks_in_299>.s3_row>.s3_column { padding: 10px 0; width:100%; } } #stacks_in_299 { margin: 0px 0px 10px 0px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_260 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_260 .element-link, #stacks_in_260 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_260 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_260 .extend_image_main { background-image: url(../files/internal_bg_pop_5.jpg) !important; background-size: cover !important; background-position: 50% 50% !important; opacity: 1 !important; } #stacks_in_260 .extend_image_main_colour { } #stacks_in_260 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_260 .left-box-over-bg-0 path, #stacks_in_260 .left-box-over-bg-1 path, #stacks_in_260 .left-box-over-bg-2 path, #stacks_in_260 .left-box-over-bg-3 path, #stacks_in_260 .left-box-over-bg-4 path, #stacks_in_260 .left-box-over-bg-5 path, #stacks_in_260 .left-box-over-bg-6 path, #stacks_in_260 .left-box-over-bg-7 path, #stacks_in_260 .left-box-over-bg-8 path, #stacks_in_260 .left-box-over-bg-9 path, #stacks_in_260 .left-box-over-bg-10 path { fill: rgba(49, 69, 88, 1.00) !important; } #stacks_in_260 .left-box-over-bg-6 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_260 .morph-shape-1, #stacks_in_260 .morph-shape-1 path, #stacks_in_260 .morph-shape-2, #stacks_in_260 .morph-shape-2 path, #stacks_in_260 .morph-shape-3, #stacks_in_260 .morph-shape-3 path { fill: rgba(4, 27, 54, 0.22) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_260 .morph-shape-2, #stacks_in_260 .morph-shape-2 path { } #stacks_in_260 .morph-shape-1, #stacks_in_260 .morph-shape-1 path { } #stacks_in_260 .morph-shape-3, #stacks_in_260 .morph-shape-3 path { display: block !important; } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_260 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 500px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_260 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_260 .anim-line path { stroke-width: 19px !important; stroke: rgba(229, 202, 48, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_260 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; background-image: url(../files/pop_image-260.jpg) !important; max-width: 70% !important; height: 90% !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; background-size: cover !important; } #stacks_in_260 .extend_image_main_overlay { background-color: transparent !important; } #stacks_in_260 .extend_image_main_grid { } #stacks_in_260 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_260 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_260 .inner_slice_content, #stacks_in_260 .inner_slice_content p, #stacks_in_260 .inner_slice_content span, #stacks_in_260 .inner_slice_content [class*="fa fa-"], #stacks_in_260 .inner_slice_content h1, #stacks_in_260 .inner_slice_content h2, #stacks_in_260 .inner_slice_content h3, #stacks_in_260 .inner_slice_content h4, #stacks_in_260 .inner_slice_content h5, #stacks_in_260 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#FFFFFF !important; } #stacks_in_260 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_260 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_260 .inner_slice_content a:link, #stacks_in_260 .inner_slice_content a { color:#B5BED2 !important; } #stacks_in_260 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_260 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_260 .inner_slice_content a:hover { color:#FFFFFF !important; } /* hype elements */ #stacks_in_260 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_260 .viewport-rotscal-trigger { opacity: 0.45; margin-top: 200px !important; opacity: 1.0; } #stacks_in_260 .viewport-line-trigger { opacity: 0.45; } #stacks_in_260 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_260 .anim-line { } #stacks_in_260 .inner_slice {max-width: 35% !important;} #stacks_in_260 .hype_box, #stacks_in_260 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 500px; } #stacks_in_260 .left-box-over-bg-6 { margin-left: -15% !important; } #stacks_in_260 .extend_image { top: 5% !important; background-position: 35% 40% !important; /* below for desktop - 2 columns only- to use in one */ } #stacks_in_260 .setting_panel_slide { } #stacks_in_260 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_260 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_260 .inner_slice { max-width: 100% !important; margin-top: 315px; top: -100px !important; } #stacks_in_260 .inner_slice_content { background-color: rgba(49, 69, 88, 1.00); } #stacks_in_260 .hype_box, #stacks_in_260 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 315px; } #stacks_in_260 .hype_box { display: block !important; margin-top: 0px !important; } #stacks_in_260 .extend_image { top: 10% !important; max-width: 200px !important; height: 200px !important; background-position: 50% 30% !important; } #stacks_in_260 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 300px !important; height: 300px !important; margin-top: 30px !important; } #stacks_in_260 .HYPE_document { overflow: hidden !important; padding-top: 0px !important; margin-bottom: -100px !important; } /* link area */ #stacks_in_260 .element-link, #stacks_in_260 .wrapper-link, #stacks_in_260 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_260 .left-box-over-bg-6 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_260 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 700px) { #stacks_in_260 .extend_image { } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_260 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_260 .HYPE_document { } #stacks_in_260 .inner_slice_content { } #stacks_in_260 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_287 { padding: 25px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_268 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_268 .element-link, #stacks_in_268 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_268 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_268 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1531412501799-1b4c354ca957?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 50% !important; opacity: 1 !important; } #stacks_in_268 .extend_image_main_colour { } #stacks_in_268 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_268 .left-box-over-bg-0 path, #stacks_in_268 .left-box-over-bg-1 path, #stacks_in_268 .left-box-over-bg-2 path, #stacks_in_268 .left-box-over-bg-3 path, #stacks_in_268 .left-box-over-bg-4 path, #stacks_in_268 .left-box-over-bg-5 path, #stacks_in_268 .left-box-over-bg-6 path, #stacks_in_268 .left-box-over-bg-7 path, #stacks_in_268 .left-box-over-bg-8 path, #stacks_in_268 .left-box-over-bg-9 path, #stacks_in_268 .left-box-over-bg-10 path { fill: rgba(18, 65, 23, 1.00) !important; stroke-style: solid !important; stroke-width: 8px !important; stroke: rgba(255, 255, 255, 1.00) !important; } #stacks_in_268 .left-box-over-bg-6 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_268 .morph-shape-1, #stacks_in_268 .morph-shape-1 path, #stacks_in_268 .morph-shape-2, #stacks_in_268 .morph-shape-2 path, #stacks_in_268 .morph-shape-3, #stacks_in_268 .morph-shape-3 path { fill: rgba(14, 27, 53, 0.22) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_268 .morph-shape-2, #stacks_in_268 .morph-shape-2 path { } #stacks_in_268 .morph-shape-1, #stacks_in_268 .morph-shape-1 path { display: block !important; } #stacks_in_268 .morph-shape-3, #stacks_in_268 .morph-shape-3 path { } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_268 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 500px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_268 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_268 .anim-line path { stroke-width: 21px !important; stroke: rgba(255, 255, 255, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_268 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; border: solid !important; border-width: 9px !important; border-color: rgba(18, 65, 23, 1.00) !important; background-image: url(../files/pop_image-268.jpg) !important; max-width: 70% !important; height: 90% !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; background-size: cover !important; } #stacks_in_268 .extend_image_main_overlay { background: linear-gradient(130deg, rgba(243, 156, 170, 0.21), rgba(0, 163, 255, 0.37)) !important; display: block !important; } #stacks_in_268 .extend_image_main_grid { } #stacks_in_268 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_268 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_268 .inner_slice_content, #stacks_in_268 .inner_slice_content p, #stacks_in_268 .inner_slice_content span, #stacks_in_268 .inner_slice_content [class*="fa fa-"], #stacks_in_268 .inner_slice_content h1, #stacks_in_268 .inner_slice_content h2, #stacks_in_268 .inner_slice_content h3, #stacks_in_268 .inner_slice_content h4, #stacks_in_268 .inner_slice_content h5, #stacks_in_268 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#FFFFFF !important; } #stacks_in_268 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_268 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_268 .inner_slice_content a:link, #stacks_in_268 .inner_slice_content a { color:#F8C61C !important; } #stacks_in_268 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_268 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_268 .inner_slice_content a:hover { color:#FFFFFF !important; } /* hype elements */ #stacks_in_268 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_268 .viewport-rotscal-trigger { opacity: 0.45; margin-top: 200px !important; opacity: 1.0; } #stacks_in_268 .viewport-line-trigger { opacity: 0.45; } #stacks_in_268 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_268 .anim-line { } #stacks_in_268 .inner_slice {max-width: 35% !important;} #stacks_in_268 .hype_box, #stacks_in_268 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 500px; } #stacks_in_268 .left-box-over-bg-6 { margin-left: -15% !important; } #stacks_in_268 .extend_image { top: 5% !important; background-position: 35% 40% !important; /* below for desktop - 2 columns only- to use in one */ } #stacks_in_268 .setting_panel_slide { } #stacks_in_268 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_268 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_268 .inner_slice { max-width: 100% !important; margin-top: 308px; top: -100px !important; } #stacks_in_268 .inner_slice_content { background-color: rgba(18, 65, 23, 1.00); border-top-style: solid !important; border-top-width: 8px !important; border-top-color: rgba(255, 255, 255, 1.00) !important; } #stacks_in_268 .hype_box, #stacks_in_268 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 308px; } #stacks_in_268 .hype_box { display: block !important; margin-top: 0px !important; } #stacks_in_268 .extend_image { top: 10% !important; max-width: 200px !important; height: 200px !important; background-position: 50% 30% !important; } #stacks_in_268 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 220px !important; height: 220px !important; margin-top: 20px !important; } #stacks_in_268 .HYPE_document { overflow: hidden !important; padding-top: 0px !important; margin-bottom: -100px !important; } /* link area */ #stacks_in_268 .element-link, #stacks_in_268 .wrapper-link, #stacks_in_268 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_268 .left-box-over-bg-6 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_268 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 700px) { #stacks_in_268 .extend_image { } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_268 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_268 .HYPE_document { } #stacks_in_268 .inner_slice_content { } #stacks_in_268 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_291 { padding: 25px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_264 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_264 .element-link, #stacks_in_264 .wrapper-link { display: block !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_264 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_264 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1593968962217-241e6b9ff2e0?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 80% !important; opacity: 1 !important; } #stacks_in_264 .extend_image_main_colour { } #stacks_in_264 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_264 .left-box-over-bg-0 path, #stacks_in_264 .left-box-over-bg-1 path, #stacks_in_264 .left-box-over-bg-2 path, #stacks_in_264 .left-box-over-bg-3 path, #stacks_in_264 .left-box-over-bg-4 path, #stacks_in_264 .left-box-over-bg-5 path, #stacks_in_264 .left-box-over-bg-6 path, #stacks_in_264 .left-box-over-bg-7 path, #stacks_in_264 .left-box-over-bg-8 path, #stacks_in_264 .left-box-over-bg-9 path, #stacks_in_264 .left-box-over-bg-10 path { fill: rgba(255, 255, 255, 1.00) !important; } #stacks_in_264 .left-box-over-bg-6 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_264 .morph-shape-1, #stacks_in_264 .morph-shape-1 path, #stacks_in_264 .morph-shape-2, #stacks_in_264 .morph-shape-2 path, #stacks_in_264 .morph-shape-3, #stacks_in_264 .morph-shape-3 path { fill: rgba(255, 255, 255, 0.00) !important; stroke-style: solid !important; stroke-width: 2px !important; stroke: rgba(255, 255, 255, 1.00) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_264 .morph-shape-2, #stacks_in_264 .morph-shape-2 path { } #stacks_in_264 .morph-shape-1, #stacks_in_264 .morph-shape-1 path { } #stacks_in_264 .morph-shape-3, #stacks_in_264 .morph-shape-3 path { display: block !important; } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_264 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 500px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_264 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_264 .anim-line path { stroke-width: 3px !important; stroke: rgba(255, 255, 255, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_264 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; border: solid !important; border-width: 2px !important; border-color: rgba(255, 255, 255, 1.00) !important; background-image: url(../files/pop_image-264.jpg) !important; max-width: 70% !important; height: 90% !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; background-size: cover !important; } #stacks_in_264 .extend_image_main_overlay { background-color: transparent !important; } #stacks_in_264 .extend_image_main_grid { background: url(../files/dots12.png) center center repeat !important; display: block !important; } #stacks_in_264 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_264 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_264 .inner_slice_content, #stacks_in_264 .inner_slice_content p, #stacks_in_264 .inner_slice_content span, #stacks_in_264 .inner_slice_content [class*="fa fa-"], #stacks_in_264 .inner_slice_content h1, #stacks_in_264 .inner_slice_content h2, #stacks_in_264 .inner_slice_content h3, #stacks_in_264 .inner_slice_content h4, #stacks_in_264 .inner_slice_content h5, #stacks_in_264 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#2A2A2A !important; } #stacks_in_264 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_264 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_264 .inner_slice_content a:link, #stacks_in_264 .inner_slice_content a { color:#F40005 !important; } #stacks_in_264 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_264 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_264 .inner_slice_content a:hover { color:#FFFFFF !important; } /* hype elements */ #stacks_in_264 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_264 .viewport-rotscal-trigger { opacity: 0.45; margin-top: 200px !important; opacity: 1.0; } #stacks_in_264 .viewport-line-trigger { opacity: 0.45; margin-top: 220px !important; opacity: 1.0; } #stacks_in_264 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_264 .anim-line { } #stacks_in_264 .inner_slice {max-width: 35% !important;} #stacks_in_264 .hype_box, #stacks_in_264 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 500px; } #stacks_in_264 .left-box-over-bg-6 { margin-left: -15% !important; } #stacks_in_264 .extend_image { top: 5% !important; background-position: 35% 40% !important; /* below for desktop - 2 columns only- to use in one */ } #stacks_in_264 .setting_panel_slide { } #stacks_in_264 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_264 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_264 .inner_slice { max-width: 100% !important; margin-top: 315px; top: -40px !important; } #stacks_in_264 .inner_slice_content { background-color: rgba(255, 255, 255, 1.00); } #stacks_in_264 .hype_box, #stacks_in_264 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 315px; } #stacks_in_264 .hype_box { display: block !important; margin-top: 0px !important; } #stacks_in_264 .extend_image { top: 10% !important; max-width: 200px !important; height: 200px !important; background-position: 50% 30% !important; } #stacks_in_264 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 200px !important; height: 200px !important; margin-top: 31px !important; } #stacks_in_264 .HYPE_document { overflow: hidden !important; padding-top: 0px !important; margin-bottom: -40px !important; } /* link area */ #stacks_in_264 .element-link, #stacks_in_264 .wrapper-link, #stacks_in_264 .wrapper-link:hover { display: block !important; } /* hide show text background */ #stacks_in_264 .left-box-over-bg-6 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_264 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 700px) { #stacks_in_264 .extend_image { } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_264 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_264 .HYPE_document { } #stacks_in_264 .inner_slice_content { } #stacks_in_264 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_264 { border: solid rgba(238, 0, 10, 1.00); border-width: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } #stacks_in_289 { padding: 25px; } #stacks_in_271>.s3_row { margin: 0 -5px; } #stacks_in_271>.s3_row>.s3_column_left { width: 32.90%; } #stacks_in_271>.s3_row>.s3_column_center { width: 34.199997%; } #stacks_in_271>.s3_row>.s3_column_right { width: 32.90%; } #stacks_in_271>.s3_row>.s3_column { padding: 0 5px; } @media only screen and (max-width: 770px) { #stacks_in_271>.s3_row { margin: -5px 0; } #stacks_in_271>.s3_row>.s3_column { padding: 5px 0; width:100%; } } @media only screen and (max-width: 400px) { #stacks_in_271>.s3_row { margin: -5px 0; } #stacks_in_271>.s3_row>.s3_column { padding: 5px 0; width:100%; } } #stacks_in_271 { margin: 10px 0px 10px 0px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_277 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_277 .element-link, #stacks_in_277 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_277 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_277 .extend_image_main { background-image: url(../files/internal_bg_pop_5.jpg) !important; background-size: cover !important; background-position: 50% 50% !important; opacity: 1 !important; } #stacks_in_277 .extend_image_main_colour { } #stacks_in_277 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_277 .left-box-over-bg-0 path, #stacks_in_277 .left-box-over-bg-1 path, #stacks_in_277 .left-box-over-bg-2 path, #stacks_in_277 .left-box-over-bg-3 path, #stacks_in_277 .left-box-over-bg-4 path, #stacks_in_277 .left-box-over-bg-5 path, #stacks_in_277 .left-box-over-bg-6 path, #stacks_in_277 .left-box-over-bg-7 path, #stacks_in_277 .left-box-over-bg-8 path, #stacks_in_277 .left-box-over-bg-9 path, #stacks_in_277 .left-box-over-bg-10 path { fill: rgba(55, 69, 87, 0.51) !important; } #stacks_in_277 .left-box-over-bg-8 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_277 .morph-shape-1, #stacks_in_277 .morph-shape-1 path, #stacks_in_277 .morph-shape-2, #stacks_in_277 .morph-shape-2 path, #stacks_in_277 .morph-shape-3, #stacks_in_277 .morph-shape-3 path { fill: rgba(14, 27, 53, 0.22) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_277 .morph-shape-2, #stacks_in_277 .morph-shape-2 path { } #stacks_in_277 .morph-shape-1, #stacks_in_277 .morph-shape-1 path { } #stacks_in_277 .morph-shape-3, #stacks_in_277 .morph-shape-3 path { display: block !important; } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_277 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 440px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_277 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_277 .anim-line path { stroke-width: 2px !important; stroke: rgba(255, 255, 255, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_277 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; background-image: url(../files/pop_image-277.jpg) !important; max-width: 100% !important; height: 70% !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; background-size: cover !important; } #stacks_in_277 .extend_image_main_overlay { background-color: transparent !important; } #stacks_in_277 .extend_image_main_grid { } #stacks_in_277 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_277 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_277 .inner_slice_content, #stacks_in_277 .inner_slice_content p, #stacks_in_277 .inner_slice_content span, #stacks_in_277 .inner_slice_content [class*="fa fa-"], #stacks_in_277 .inner_slice_content h1, #stacks_in_277 .inner_slice_content h2, #stacks_in_277 .inner_slice_content h3, #stacks_in_277 .inner_slice_content h4, #stacks_in_277 .inner_slice_content h5, #stacks_in_277 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#FFFFFF !important; } #stacks_in_277 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_277 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_277 .inner_slice_content a:link, #stacks_in_277 .inner_slice_content a { color:#B7BED1 !important; } #stacks_in_277 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_277 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_277 .inner_slice_content a:hover { color:#FFFFFF !important; } /* hype elements */ #stacks_in_277 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_277 .viewport-rotscal-trigger { opacity: 0.45; margin-top: 200px !important; opacity: 1.0; } #stacks_in_277 .viewport-line-trigger { opacity: 0.45; } #stacks_in_277 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_277 .anim-line { } #stacks_in_277 .inner_slice {max-width: 35% !important;} #stacks_in_277 .hype_box, #stacks_in_277 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 440px; } #stacks_in_277 .left-box-over-bg-8 { margin-left: -15% !important; } #stacks_in_277 .extend_image { top: 15% !important; background-position: 50% 25% !important; /* below for desktop - 2 columns only- to use in one */ top: 15% !important; } #stacks_in_277 .setting_panel_slide { } #stacks_in_277 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_277 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_277 .inner_slice { max-width: 100% !important; margin-top: 330px; top: 0px !important; } #stacks_in_277 .inner_slice_content { background-color: rgba(55, 69, 87, 0.51); } #stacks_in_277 .hype_box, #stacks_in_277 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 330px; } #stacks_in_277 .hype_box { display: block !important; margin-top: 15px !important; } #stacks_in_277 .extend_image { top: 10% !important; max-width: 250px !important; height: 250px !important; background-position: 50% 30% !important; } #stacks_in_277 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 300px !important; height: 300px !important; margin-top: 32px !important; } #stacks_in_277 .HYPE_document { overflow: hidden !important; padding-top: 15px !important; margin-bottom: 0px !important; } /* link area */ #stacks_in_277 .element-link, #stacks_in_277 .wrapper-link, #stacks_in_277 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_277 .left-box-over-bg-8 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_277 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 700px) { #stacks_in_277 .extend_image { } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_277 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_277 .HYPE_document { } #stacks_in_277 .inner_slice_content { } #stacks_in_277 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_295 { padding: 25px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_281 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_281 .element-link, #stacks_in_281 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_281 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_281 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1562028798-f6f372d1a6f8?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 50% !important; opacity: 1 !important; } #stacks_in_281 .extend_image_main_colour { } #stacks_in_281 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_281 .left-box-over-bg-0 path, #stacks_in_281 .left-box-over-bg-1 path, #stacks_in_281 .left-box-over-bg-2 path, #stacks_in_281 .left-box-over-bg-3 path, #stacks_in_281 .left-box-over-bg-4 path, #stacks_in_281 .left-box-over-bg-5 path, #stacks_in_281 .left-box-over-bg-6 path, #stacks_in_281 .left-box-over-bg-7 path, #stacks_in_281 .left-box-over-bg-8 path, #stacks_in_281 .left-box-over-bg-9 path, #stacks_in_281 .left-box-over-bg-10 path { fill: rgba(20, 81, 31, 0.86) !important; stroke-style: solid !important; stroke-width: 14px !important; stroke: rgba(222, 193, 38, 1.00) !important; } #stacks_in_281 .left-box-over-bg-6 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_281 .morph-shape-1, #stacks_in_281 .morph-shape-1 path, #stacks_in_281 .morph-shape-2, #stacks_in_281 .morph-shape-2 path, #stacks_in_281 .morph-shape-3, #stacks_in_281 .morph-shape-3 path { fill: rgba(14, 27, 53, 0.22) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_281 .morph-shape-2, #stacks_in_281 .morph-shape-2 path { } #stacks_in_281 .morph-shape-1, #stacks_in_281 .morph-shape-1 path { } #stacks_in_281 .morph-shape-3, #stacks_in_281 .morph-shape-3 path { } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_281 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 500px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_281 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_281 .anim-line path { stroke-width: 19px !important; stroke: rgba(229, 202, 48, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_281 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; border: solid !important; border-width: 11px !important; border-color: rgba(20, 81, 31, 1.00) !important; background-image: url(../files/pop_image-281.jpg) !important; max-width: 70% !important; height: 90% !important; border-radius:400px; -webkit-border-radius:400px; -moz-border-radius:400px; background-size: cover !important; } #stacks_in_281 .extend_image_main_overlay { background: linear-gradient(130deg, rgba(222, 193, 38, 0.67), rgba(21, 46, 30, 0.00)) !important; display: block !important; } #stacks_in_281 .extend_image_main_grid { } #stacks_in_281 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_281 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_281 .inner_slice_content, #stacks_in_281 .inner_slice_content p, #stacks_in_281 .inner_slice_content span, #stacks_in_281 .inner_slice_content [class*="fa fa-"], #stacks_in_281 .inner_slice_content h1, #stacks_in_281 .inner_slice_content h2, #stacks_in_281 .inner_slice_content h3, #stacks_in_281 .inner_slice_content h4, #stacks_in_281 .inner_slice_content h5, #stacks_in_281 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#FFFFFF !important; } #stacks_in_281 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_281 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_281 .inner_slice_content a:link, #stacks_in_281 .inner_slice_content a { color:#FACE23 !important; } #stacks_in_281 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_281 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_281 .inner_slice_content a:hover { color:#FFFFFF !important; } /* hype elements */ #stacks_in_281 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_281 .viewport-rotscal-trigger { opacity: 0.45; margin-top: 200px !important; opacity: 1.0; } #stacks_in_281 .viewport-line-trigger { opacity: 0.45; } #stacks_in_281 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_281 .anim-line { } #stacks_in_281 .inner_slice {max-width: 35% !important;} #stacks_in_281 .hype_box, #stacks_in_281 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 500px; } #stacks_in_281 .left-box-over-bg-6 { margin-left: -15% !important; } #stacks_in_281 .extend_image { top: 5% !important; background-position: 35% 40% !important; /* below for desktop - 2 columns only- to use in one */ } #stacks_in_281 .setting_panel_slide { } #stacks_in_281 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_281 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_281 .inner_slice { max-width: 100% !important; margin-top: 315px; top: 0px !important; } #stacks_in_281 .inner_slice_content { background-color: rgba(20, 81, 31, 0.86); border-top-style: solid !important; border-top-width: 14px !important; border-top-color: rgba(222, 193, 38, 1.00) !important; } #stacks_in_281 .hype_box, #stacks_in_281 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 315px; } #stacks_in_281 .hype_box { display: block !important; margin-top: 15px !important; } #stacks_in_281 .extend_image { top: 10% !important; max-width: 250px !important; height: 250px !important; background-position: 50% 30% !important; } #stacks_in_281 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 260px !important; height: 260px !important; margin-top: 30px !important; } #stacks_in_281 .HYPE_document { overflow: hidden !important; padding-top: 15px !important; margin-bottom: 0px !important; } /* link area */ #stacks_in_281 .element-link, #stacks_in_281 .wrapper-link, #stacks_in_281 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_281 .left-box-over-bg-6 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_281 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 700px) { #stacks_in_281 .extend_image { } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_281 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_281 .HYPE_document { } #stacks_in_281 .inner_slice_content { } #stacks_in_281 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_297 { padding: 25px; } #stacks_in_352>.s3_row { margin: 0 -10px; } #stacks_in_352>.s3_row>.s3_column_left { width: 50.00%; } #stacks_in_352>.s3_row>.s3_column_right { width: 50.000000%; } #stacks_in_352>.s3_row>.s3_column { padding: 0 10px; } @media only screen and (max-width: 770px) { } @media only screen and (max-width: 400px) { #stacks_in_352>.s3_row { margin: -10px 0; } #stacks_in_352>.s3_row>.s3_column { padding: 10px 0; width:100%; } } #stacks_in_352 { margin: 0px 0px 10px 0px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_328 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_328 .element-link, #stacks_in_328 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_328 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_328 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1424581342241-2b1aba4d3462?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 50% !important; opacity: 1 !important; } #stacks_in_328 .extend_image_main_colour { } #stacks_in_328 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_328 .left-box-over-bg-0 path, #stacks_in_328 .left-box-over-bg-1 path, #stacks_in_328 .left-box-over-bg-2 path, #stacks_in_328 .left-box-over-bg-3 path, #stacks_in_328 .left-box-over-bg-4 path, #stacks_in_328 .left-box-over-bg-5 path, #stacks_in_328 .left-box-over-bg-6 path, #stacks_in_328 .left-box-over-bg-7 path, #stacks_in_328 .left-box-over-bg-8 path, #stacks_in_328 .left-box-over-bg-9 path, #stacks_in_328 .left-box-over-bg-10 path { fill: rgba(255, 255, 255, 0.80) !important; } #stacks_in_328 .left-box-over-bg-10 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_328 .morph-shape-1, #stacks_in_328 .morph-shape-1 path, #stacks_in_328 .morph-shape-2, #stacks_in_328 .morph-shape-2 path, #stacks_in_328 .morph-shape-3, #stacks_in_328 .morph-shape-3 path { fill: rgba(0, 255, 0, 0.29) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_328 .morph-shape-2, #stacks_in_328 .morph-shape-2 path { } #stacks_in_328 .morph-shape-1, #stacks_in_328 .morph-shape-1 path { } #stacks_in_328 .morph-shape-3, #stacks_in_328 .morph-shape-3 path { } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_328 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 590px; max-width: 500px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_328 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_328 .anim-line path { stroke-width: 2px !important; stroke: rgba(184, 0, 52, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_328 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px; border: solid !important; border-width: 2px !important; border-color: rgba(255, 255, 255, 0.96) !important; background-image: url(../files/pop_image-328.jpg) !important; max-width: 85% !important; height: 65% !important; filter: drop-shadow(11px 9px 4px rgba(0, 0, 0, 0.25)) !important; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px; background-size: cover !important; } #stacks_in_328 .extend_image_main_overlay { background-color: transparent !important; } #stacks_in_328 .extend_image_main_grid { } #stacks_in_328 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_328 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_328 .inner_slice_content, #stacks_in_328 .inner_slice_content p, #stacks_in_328 .inner_slice_content span, #stacks_in_328 .inner_slice_content [class*="fa fa-"], #stacks_in_328 .inner_slice_content h1, #stacks_in_328 .inner_slice_content h2, #stacks_in_328 .inner_slice_content h3, #stacks_in_328 .inner_slice_content h4, #stacks_in_328 .inner_slice_content h5, #stacks_in_328 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#3C241C !important; } #stacks_in_328 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_328 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_328 .inner_slice_content a:link, #stacks_in_328 .inner_slice_content a { color:#910016 !important; } #stacks_in_328 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_328 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_328 .inner_slice_content a:hover { color:#3C241C !important; } /* hype elements */ #stacks_in_328 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_328 .viewport-rotscal-trigger { opacity: 0.45; margin-top: 450px !important; opacity: 1.0; } #stacks_in_328 .viewport-line-trigger { opacity: 0.45; margin-top: 500px !important; opacity: 1.0; } #stacks_in_328 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_328 .anim-line { } #stacks_in_328 .inner_slice {max-width: 35% !important;} #stacks_in_328 .hype_box, #stacks_in_328 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 590px; } #stacks_in_328 .left-box-over-bg-10 { margin-left: -15% !important; } #stacks_in_328 .extend_image { top: 17% !important; background-position: 50% 0% !important; /* below for desktop - 2 columns only- to use in one */ } #stacks_in_328 .setting_panel_slide { } #stacks_in_328 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_328 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_328 .inner_slice { max-width: 100% !important; margin-top: 410px; top: 0px !important; } #stacks_in_328 .inner_slice_content { background-color: rgba(255, 255, 255, 0.80); } #stacks_in_328 .hype_box, #stacks_in_328 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 410px; } #stacks_in_328 .hype_box { display: block !important; margin-top: 0px !important; } #stacks_in_328 .extend_image { top: 15% !important; max-width: 400px !important; height: 300px !important; background-position: 55% 5% !important; } #stacks_in_328 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 300px !important; height: 300px !important; margin-top: 25px !important; } #stacks_in_328 .HYPE_document { overflow: hidden !important; padding-top: 0px !important; margin-bottom: 0px !important; } /* link area */ #stacks_in_328 .element-link, #stacks_in_328 .wrapper-link, #stacks_in_328 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_328 .left-box-over-bg-10 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_328 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 460px) { #stacks_in_328 .extend_image { max-width: 80% !important; border-top-left-radius:0px; -webkit-border-top-left-radius:0px; -moz-border-radius-topleft:0px; border-top-right-radius:0px; -webkit-border-top-right-radius:0px; -moz-border-radius-topright:0px; border-bottom-left-radius:0px; -webkit-border-bottom-left-radius:0px; -moz-border-radius-bottomleft:0px; border-bottom-right-radius:0px; -webkit-border-bottom-right-radius:0px; -moz-border-radius-bottomright:0px; } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_328 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_328 .HYPE_document { } #stacks_in_328 .inner_slice_content { } #stacks_in_328 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_330 { padding: 25px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_355 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_355 .element-link, #stacks_in_355 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_355 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_355 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1424581342241-2b1aba4d3462?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 50% !important; opacity: 1 !important; } #stacks_in_355 .extend_image_main_colour { } #stacks_in_355 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_355 .left-box-over-bg-0 path, #stacks_in_355 .left-box-over-bg-1 path, #stacks_in_355 .left-box-over-bg-2 path, #stacks_in_355 .left-box-over-bg-3 path, #stacks_in_355 .left-box-over-bg-4 path, #stacks_in_355 .left-box-over-bg-5 path, #stacks_in_355 .left-box-over-bg-6 path, #stacks_in_355 .left-box-over-bg-7 path, #stacks_in_355 .left-box-over-bg-8 path, #stacks_in_355 .left-box-over-bg-9 path, #stacks_in_355 .left-box-over-bg-10 path { fill: rgba(255, 255, 255, 0.80) !important; } #stacks_in_355 .left-box-over-bg-10 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_355 .morph-shape-1, #stacks_in_355 .morph-shape-1 path, #stacks_in_355 .morph-shape-2, #stacks_in_355 .morph-shape-2 path, #stacks_in_355 .morph-shape-3, #stacks_in_355 .morph-shape-3 path { fill: rgba(0, 255, 0, 0.29) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_355 .morph-shape-2, #stacks_in_355 .morph-shape-2 path { } #stacks_in_355 .morph-shape-1, #stacks_in_355 .morph-shape-1 path { } #stacks_in_355 .morph-shape-3, #stacks_in_355 .morph-shape-3 path { } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_355 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 590px; max-width: 500px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_355 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_355 .anim-line path { stroke-width: 2px !important; stroke: rgba(184, 0, 52, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_355 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px; border: solid !important; border-width: 2px !important; border-color: rgba(255, 255, 255, 0.96) !important; background-image: url(../files/pop_image-355.jpg) !important; max-width: 85% !important; height: 65% !important; filter: drop-shadow(11px 9px 4px rgba(0, 0, 0, 0.25)) !important; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px; background-size: cover !important; } #stacks_in_355 .extend_image_main_overlay { background-color: transparent !important; } #stacks_in_355 .extend_image_main_grid { } #stacks_in_355 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_355 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_355 .inner_slice_content, #stacks_in_355 .inner_slice_content p, #stacks_in_355 .inner_slice_content span, #stacks_in_355 .inner_slice_content [class*="fa fa-"], #stacks_in_355 .inner_slice_content h1, #stacks_in_355 .inner_slice_content h2, #stacks_in_355 .inner_slice_content h3, #stacks_in_355 .inner_slice_content h4, #stacks_in_355 .inner_slice_content h5, #stacks_in_355 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#3C241C !important; } #stacks_in_355 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_355 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_355 .inner_slice_content a:link, #stacks_in_355 .inner_slice_content a { color:#910016 !important; } #stacks_in_355 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_355 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_355 .inner_slice_content a:hover { color:#3C241C !important; } /* hype elements */ #stacks_in_355 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_355 .viewport-rotscal-trigger { opacity: 0.45; margin-top: 450px !important; opacity: 1.0; } #stacks_in_355 .viewport-line-trigger { opacity: 0.45; margin-top: 500px !important; opacity: 1.0; } #stacks_in_355 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_355 .anim-line { } #stacks_in_355 .inner_slice {max-width: 35% !important;} #stacks_in_355 .hype_box, #stacks_in_355 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 590px; } #stacks_in_355 .left-box-over-bg-10 { margin-left: -15% !important; } #stacks_in_355 .extend_image { top: 17% !important; background-position: 50% 0% !important; /* below for desktop - 2 columns only- to use in one */ } #stacks_in_355 .setting_panel_slide { } #stacks_in_355 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_355 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_355 .inner_slice { max-width: 100% !important; margin-top: 410px; top: 0px !important; } #stacks_in_355 .inner_slice_content { background-color: rgba(255, 255, 255, 0.80); } #stacks_in_355 .hype_box, #stacks_in_355 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 410px; } #stacks_in_355 .hype_box { display: block !important; margin-top: 0px !important; } #stacks_in_355 .extend_image { top: 15% !important; max-width: 400px !important; height: 300px !important; background-position: 55% 5% !important; } #stacks_in_355 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 300px !important; height: 300px !important; margin-top: 25px !important; } #stacks_in_355 .HYPE_document { overflow: hidden !important; padding-top: 0px !important; margin-bottom: 0px !important; } /* link area */ #stacks_in_355 .element-link, #stacks_in_355 .wrapper-link, #stacks_in_355 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_355 .left-box-over-bg-10 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_355 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 460px) { #stacks_in_355 .extend_image { max-width: 80% !important; border-top-left-radius:0px; -webkit-border-top-left-radius:0px; -moz-border-radius-topleft:0px; border-top-right-radius:0px; -webkit-border-top-right-radius:0px; -moz-border-radius-topright:0px; border-bottom-left-radius:0px; -webkit-border-bottom-left-radius:0px; -moz-border-radius-bottomleft:0px; border-bottom-right-radius:0px; -webkit-border-bottom-right-radius:0px; -moz-border-radius-bottomright:0px; } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_355 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_355 .HYPE_document { } #stacks_in_355 .inner_slice_content { } #stacks_in_355 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_357 { padding: 25px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_359 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_359 .element-link, #stacks_in_359 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_359 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_359 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1473421128459-ca4900980e03?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 50% !important; opacity: 1 !important; } #stacks_in_359 .extend_image_main_colour { } #stacks_in_359 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_359 .left-box-over-bg-0 path, #stacks_in_359 .left-box-over-bg-1 path, #stacks_in_359 .left-box-over-bg-2 path, #stacks_in_359 .left-box-over-bg-3 path, #stacks_in_359 .left-box-over-bg-4 path, #stacks_in_359 .left-box-over-bg-5 path, #stacks_in_359 .left-box-over-bg-6 path, #stacks_in_359 .left-box-over-bg-7 path, #stacks_in_359 .left-box-over-bg-8 path, #stacks_in_359 .left-box-over-bg-9 path, #stacks_in_359 .left-box-over-bg-10 path { fill: rgba(202, 202, 208, 1.00) !important; } #stacks_in_359 .left-box-over-bg-5 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_359 .morph-shape-1, #stacks_in_359 .morph-shape-1 path, #stacks_in_359 .morph-shape-2, #stacks_in_359 .morph-shape-2 path, #stacks_in_359 .morph-shape-3, #stacks_in_359 .morph-shape-3 path { fill: rgba(145, 0, 22, 0.47) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_359 .morph-shape-2, #stacks_in_359 .morph-shape-2 path { } #stacks_in_359 .morph-shape-1, #stacks_in_359 .morph-shape-1 path { } #stacks_in_359 .morph-shape-3, #stacks_in_359 .morph-shape-3 path { } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_359 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 590px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_359 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_359 .anim-line path { stroke-width: 2px !important; stroke: rgba(184, 0, 52, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_359 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; background-image: url(../files/pop_image-359.jpg) !important; max-width: 55% !important; height: 65% !important; filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.25)) !important; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; background-size: cover !important; } #stacks_in_359 .extend_image_main_overlay { background-color: transparent !important; } #stacks_in_359 .extend_image_main_grid { background: url(../files/dots12.png) center center repeat !important; display: block !important; } #stacks_in_359 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_359 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_359 .inner_slice_content, #stacks_in_359 .inner_slice_content p, #stacks_in_359 .inner_slice_content span, #stacks_in_359 .inner_slice_content [class*="fa fa-"], #stacks_in_359 .inner_slice_content h1, #stacks_in_359 .inner_slice_content h2, #stacks_in_359 .inner_slice_content h3, #stacks_in_359 .inner_slice_content h4, #stacks_in_359 .inner_slice_content h5, #stacks_in_359 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#000000 !important; } #stacks_in_359 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_359 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_359 .inner_slice_content a:link, #stacks_in_359 .inner_slice_content a { color:#970000 !important; } #stacks_in_359 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_359 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_359 .inner_slice_content a:hover { color:#000000 !important; } /* hype elements */ #stacks_in_359 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_359 .viewport-rotscal-trigger { opacity: 0.45; margin-top: 400px !important; opacity: 1.0; } #stacks_in_359 .viewport-line-trigger { opacity: 0.45; margin-top: 450px !important; opacity: 1.0; } #stacks_in_359 .setting_panel_slide { } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 1040px ) { #stacks_in_359 .anim-line { } #stacks_in_359 .inner_slice {max-width: 35% !important;} #stacks_in_359 .hype_box, #stacks_in_359 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 590px; } #stacks_in_359 .left-box-over-bg-5 { margin-left: -15% !important; } #stacks_in_359 .extend_image { top: 17% !important; background-position: 50% 0% !important; /* below for desktop - 2 columns only- to use in one */ } #stacks_in_359 .setting_panel_slide { position: absolute !important; margin-left: -8% !important; } #stacks_in_359 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_359 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 1040px ) { /* line 2 col */ #stacks_in_359 .inner_slice { max-width: 100% !important; margin-top: 410px; top: 0px !important; } #stacks_in_359 .inner_slice_content { background-color: rgba(202, 202, 208, 1.00); } #stacks_in_359 .hype_box, #stacks_in_359 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 410px; } #stacks_in_359 .hype_box { display: block !important; margin-top: 0px !important; } #stacks_in_359 .extend_image { top: 15% !important; max-width: 400px !important; height: 300px !important; background-position: 55% 5% !important; } #stacks_in_359 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 300px !important; height: 300px !important; margin-top: 60px !important; } #stacks_in_359 .HYPE_document { overflow: hidden !important; padding-top: 0px !important; margin-bottom: 0px !important; } /* link area */ #stacks_in_359 .element-link, #stacks_in_359 .wrapper-link, #stacks_in_359 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_359 .left-box-over-bg-5 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_359 .setting_panel_slide { position: absolute !important; margin-left: -25%; } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 460px) { #stacks_in_359 .extend_image { max-width: 80% !important; border-top-left-radius:0px; -webkit-border-top-left-radius:0px; -moz-border-radius-topleft:0px; border-top-right-radius:0px; -webkit-border-top-right-radius:0px; -moz-border-radius-topright:0px; border-bottom-left-radius:0px; -webkit-border-bottom-left-radius:0px; -moz-border-radius-bottomleft:0px; border-bottom-right-radius:0px; -webkit-border-bottom-right-radius:0px; -moz-border-radius-bottomright:0px; } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_359 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_359 .HYPE_document { } #stacks_in_359 .inner_slice_content { } #stacks_in_359 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_359 { margin: 0px 0px 10px 0px; } #stacks_in_362 { padding: 25px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_317 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_317 .element-link, #stacks_in_317 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_317 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_317 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1541754133541-1183bff921c8?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 50% !important; opacity: 1 !important; } #stacks_in_317 .extend_image_main_colour { background-color: rgba(0, 0, 0, 1.00); } #stacks_in_317 .extend_image_main_colour_border { border: 3px solid rgba(203, 0, 1, 1.00) !important; } /* ------- Text BG left ------ */ #stacks_in_317 .left-box-over-bg-0 path, #stacks_in_317 .left-box-over-bg-1 path, #stacks_in_317 .left-box-over-bg-2 path, #stacks_in_317 .left-box-over-bg-3 path, #stacks_in_317 .left-box-over-bg-4 path, #stacks_in_317 .left-box-over-bg-5 path, #stacks_in_317 .left-box-over-bg-6 path, #stacks_in_317 .left-box-over-bg-7 path, #stacks_in_317 .left-box-over-bg-8 path, #stacks_in_317 .left-box-over-bg-9 path, #stacks_in_317 .left-box-over-bg-10 path { fill: rgba(133, 135, 139, 0.94) !important; stroke-style: solid !important; stroke-width: 3px !important; stroke: rgba(203, 0, 1, 1.00) !important; } #stacks_in_317 .left-box-over-bg-2 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_317 .morph-shape-1, #stacks_in_317 .morph-shape-1 path, #stacks_in_317 .morph-shape-2, #stacks_in_317 .morph-shape-2 path, #stacks_in_317 .morph-shape-3, #stacks_in_317 .morph-shape-3 path { fill: rgba(117, 150, 195, 0.00) !important; stroke-style: solid !important; stroke-width: 2px !important; stroke: rgba(203, 0, 1, 1.00) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_317 .morph-shape-2, #stacks_in_317 .morph-shape-2 path { } #stacks_in_317 .morph-shape-1, #stacks_in_317 .morph-shape-1 path { display: block !important; } #stacks_in_317 .morph-shape-3, #stacks_in_317 .morph-shape-3 path { } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_317 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 590px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_317 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 450px !important; height: 450px !important; } #stacks_in_317 .anim-line path { stroke-width: 1px !important; stroke: rgba(255, 255, 255, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_317 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px; border: solid !important; border-width: 3px !important; border-color: rgba(203, 0, 1, 1.00) !important; background-image: url(../files/pop_image-317.jpg) !important; max-width: 60% !important; height: 65% !important; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px; background-size: cover !important; } #stacks_in_317 .extend_image_main_overlay { background: linear-gradient(135deg, rgba(203, 0, 1, 0.22), rgba(145, 0, 22, 1.00)) !important; display: block !important; } #stacks_in_317 .extend_image_main_grid { } #stacks_in_317 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_317 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 35% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_317 .inner_slice_content, #stacks_in_317 .inner_slice_content p, #stacks_in_317 .inner_slice_content span, #stacks_in_317 .inner_slice_content [class*="fa fa-"], #stacks_in_317 .inner_slice_content h1, #stacks_in_317 .inner_slice_content h2, #stacks_in_317 .inner_slice_content h3, #stacks_in_317 .inner_slice_content h4, #stacks_in_317 .inner_slice_content h5, #stacks_in_317 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#FFFFFF !important; } #stacks_in_317 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_317 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_317 .inner_slice_content a:link, #stacks_in_317 .inner_slice_content a { color:#CB0001 !important; } #stacks_in_317 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_317 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_317 .inner_slice_content a:hover { color:#FFFFFF !important; } /* hype elements */ #stacks_in_317 .viewport-morph-trigger { opacity: 0.45; margin-top: 450px !important; opacity: 1.0; } #stacks_in_317 .viewport-rotscal-trigger { opacity: 0.45; } #stacks_in_317 .viewport-line-trigger { opacity: 0.45; margin-top: 500px !important; opacity: 1.0; } #stacks_in_317 .setting_panel_slide { } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 1020px ) { #stacks_in_317 .anim-line { } #stacks_in_317 .inner_slice {max-width: 35% !important;} #stacks_in_317 .hype_box, #stacks_in_317 .wrapper-link { width: 65% !important; left: 35% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 590px; } #stacks_in_317 .left-box-over-bg-2 { margin-left: -15% !important; } #stacks_in_317 .extend_image { top: 17% !important; background-position: 50% 70% !important; /* below for desktop - 2 columns only- to use in one */ } #stacks_in_317 .setting_panel_slide { position: absolute !important; margin-left: -8% !important; } #stacks_in_317 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_317 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 1020px ) { /* line 2 col */ #stacks_in_317 .inner_slice { max-width: 100% !important; margin-top: 400px; top: 0px !important; } #stacks_in_317 .inner_slice_content { background-color: rgba(133, 135, 139, 0.94); border-top-style: solid !important; border-top-width: 3px !important; border-top-color: rgba(203, 0, 1, 1.00) !important; } #stacks_in_317 .hype_box, #stacks_in_317 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 400px; } #stacks_in_317 .hype_box { display: block !important; margin-top: 10px !important; } #stacks_in_317 .extend_image { top: 12% !important; max-width: 60% !important; height: 75% !important; background-position: 55% 50% !important; } #stacks_in_317 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 300px !important; height: 300px !important; margin-top: 45px !important; } #stacks_in_317 .HYPE_document { overflow: hidden !important; padding-top: 10px !important; margin-bottom: 0px !important; } /* link area */ #stacks_in_317 .element-link, #stacks_in_317 .wrapper-link, #stacks_in_317 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_317 .left-box-over-bg-2 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_317 .setting_panel_slide { position: absolute !important; margin-left: -25%; } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 460px) { #stacks_in_317 .extend_image { max-width: 70% !important; border-top-left-radius:0px; -webkit-border-top-left-radius:0px; -moz-border-radius-topleft:0px; border-top-right-radius:0px; -webkit-border-top-right-radius:0px; -moz-border-radius-topright:0px; border-bottom-left-radius:0px; -webkit-border-bottom-left-radius:0px; -moz-border-radius-bottomleft:0px; border-bottom-right-radius:0px; -webkit-border-bottom-right-radius:0px; -moz-border-radius-bottomright:0px; } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_317 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_317 .HYPE_document { } #stacks_in_317 .inner_slice_content { } #stacks_in_317 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_317 { margin: 0px 0px 10px 0px; } #stacks_in_320 { padding: 25px; } #stacks_in_337>.s3_row { margin: 0 -10px; } #stacks_in_337>.s3_row>.s3_column_left { width: 50.00%; } #stacks_in_337>.s3_row>.s3_column_right { width: 50.000000%; } #stacks_in_337>.s3_row>.s3_column { padding: 0 10px; } @media only screen and (max-width: 770px) { } @media only screen and (max-width: 400px) { #stacks_in_337>.s3_row { margin: -10px 0; } #stacks_in_337>.s3_row>.s3_column { padding: 10px 0; width:100%; } } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_340 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_340 .element-link, #stacks_in_340 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_340 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_340 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1519312934905-b0028e684acb?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 80% !important; opacity: 1 !important; } #stacks_in_340 .extend_image_main_colour { } #stacks_in_340 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_340 .left-box-over-bg-0 path, #stacks_in_340 .left-box-over-bg-1 path, #stacks_in_340 .left-box-over-bg-2 path, #stacks_in_340 .left-box-over-bg-3 path, #stacks_in_340 .left-box-over-bg-4 path, #stacks_in_340 .left-box-over-bg-5 path, #stacks_in_340 .left-box-over-bg-6 path, #stacks_in_340 .left-box-over-bg-7 path, #stacks_in_340 .left-box-over-bg-8 path, #stacks_in_340 .left-box-over-bg-9 path, #stacks_in_340 .left-box-over-bg-10 path { fill: rgba(26, 45, 75, 0.87) !important; } #stacks_in_340 .left-box-over-bg-10 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_340 .morph-shape-1, #stacks_in_340 .morph-shape-1 path, #stacks_in_340 .morph-shape-2, #stacks_in_340 .morph-shape-2 path, #stacks_in_340 .morph-shape-3, #stacks_in_340 .morph-shape-3 path { fill: rgba(37, 71, 124, 0.55) !important; stroke-dasharray: 100, 10; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_340 .morph-shape-2, #stacks_in_340 .morph-shape-2 path { } #stacks_in_340 .morph-shape-1, #stacks_in_340 .morph-shape-1 path { display: block !important; } #stacks_in_340 .morph-shape-3, #stacks_in_340 .morph-shape-3 path { } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_340 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 420px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_340 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 370px !important; height: 370px !important; } #stacks_in_340 .anim-line path { stroke-width: 3px !important; stroke: rgba(153, 167, 198, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_340 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background-image: url(../files/pop_image-340.jpg) !important; max-width: 300px !important; height: 300px !important; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background-size: cover !important; } #stacks_in_340 .extend_image_main_overlay { background-color: transparent !important; } #stacks_in_340 .extend_image_main_grid { } #stacks_in_340 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_340 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 40% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_340 .inner_slice_content, #stacks_in_340 .inner_slice_content p, #stacks_in_340 .inner_slice_content span, #stacks_in_340 .inner_slice_content [class*="fa fa-"], #stacks_in_340 .inner_slice_content h1, #stacks_in_340 .inner_slice_content h2, #stacks_in_340 .inner_slice_content h3, #stacks_in_340 .inner_slice_content h4, #stacks_in_340 .inner_slice_content h5, #stacks_in_340 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#CECECE !important; } #stacks_in_340 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_340 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_340 .inner_slice_content a:link, #stacks_in_340 .inner_slice_content a { color:#FC2409 !important; } #stacks_in_340 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_340 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_340 .inner_slice_content a:hover { color:#FFFFFF !important; } /* hype elements */ #stacks_in_340 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_340 .viewport-rotscal-trigger { opacity: 0.45; } #stacks_in_340 .viewport-line-trigger { opacity: 0.45; } #stacks_in_340 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_340 .anim-line { } #stacks_in_340 .inner_slice {max-width: 40% !important;} #stacks_in_340 .hype_box, #stacks_in_340 .wrapper-link { width: 60% !important; left: 40% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 420px; } #stacks_in_340 .left-box-over-bg-10 { margin-left: -10% !important; } #stacks_in_340 .extend_image { top: 5% !important; background-position: 65% 10% !important; /* below for desktop - 2 columns only- to use in one */ top: 10% !important; } #stacks_in_340 .setting_panel_slide { } #stacks_in_340 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_340 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_340 .inner_slice { max-width: 100% !important; margin-top: 330px; top: 0px !important; } #stacks_in_340 .inner_slice_content { background-color: rgba(26, 45, 75, 0.87); } #stacks_in_340 .hype_box, #stacks_in_340 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 330px; } #stacks_in_340 .hype_box { display: block !important; margin-top: 20px !important; } #stacks_in_340 .extend_image { top: 5% !important; max-width: 200px !important; height: 280px !important; background-position: 50% 50% !important; } #stacks_in_340 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 300px !important; height: 300px !important; margin-top: 10px !important; } #stacks_in_340 .HYPE_document { overflow: hidden !important; padding-top: 20px !important; margin-bottom: 0px !important; } /* link area */ #stacks_in_340 .element-link, #stacks_in_340 .wrapper-link, #stacks_in_340 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_340 .left-box-over-bg-10 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_340 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 560px) { #stacks_in_340 .extend_image { } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_340 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_340 .HYPE_document { } #stacks_in_340 .inner_slice_content { } #stacks_in_340 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_342 { padding: 25px; } /* ------------------ edit -- */ /* ------------------ edit END -- */ /* ------------------ 2 columns -- */ #stacks_in_344 .wrapper-link:hover { -webkit-animation: wrapper-link 1.5s linear forwards !important; -moz-animation: wrapper-link 1.5s linear forwards !important; animation: wrapper-link 1.5s linear forwards !important; background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(255, 255, 255, 0.00)), to(rgba(255, 255, 255, 0.15))); background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.00)); } @-webkit-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} @-moz-keyframes wrapper-link { 0%,100% { opacity: 0; } 30% { opacity: 1; }} #stacks_in_344 .element-link, #stacks_in_344 .wrapper-link { display: none !important; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2 !important; width: 100%; height: 100%; } /* ------- global ------ */ #stacks_in_344 *{ box-sizing: border-box !important; } /* ------- BG main ------ */ #stacks_in_344 .extend_image_main { background-image: url(https://images.unsplash.com/photo-1598312783990-92697964ec08?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1080&fit=max&ixid=eyJhcHBfaWQiOjEzMjQ5fQ) !important; background-size: cover !important; background-position: 50% 80% !important; opacity: 1 !important; } #stacks_in_344 .extend_image_main_colour { } #stacks_in_344 .extend_image_main_colour_border { } /* ------- Text BG left ------ */ #stacks_in_344 .left-box-over-bg-0 path, #stacks_in_344 .left-box-over-bg-1 path, #stacks_in_344 .left-box-over-bg-2 path, #stacks_in_344 .left-box-over-bg-3 path, #stacks_in_344 .left-box-over-bg-4 path, #stacks_in_344 .left-box-over-bg-5 path, #stacks_in_344 .left-box-over-bg-6 path, #stacks_in_344 .left-box-over-bg-7 path, #stacks_in_344 .left-box-over-bg-8 path, #stacks_in_344 .left-box-over-bg-9 path, #stacks_in_344 .left-box-over-bg-10 path { fill: rgba(26, 45, 75, 0.87) !important; } #stacks_in_344 .left-box-over-bg-10 { display: block !important; } /* ------- BG back shape ------ */ #stacks_in_344 .morph-shape-1, #stacks_in_344 .morph-shape-1 path, #stacks_in_344 .morph-shape-2, #stacks_in_344 .morph-shape-2 path, #stacks_in_344 .morph-shape-3, #stacks_in_344 .morph-shape-3 path { fill: rgba(37, 71, 124, 0.55) !important; } /* NOTE use the order 2 and 1 and 3 to fix consolid. css */ #stacks_in_344 .morph-shape-2, #stacks_in_344 .morph-shape-2 path { } #stacks_in_344 .morph-shape-1, #stacks_in_344 .morph-shape-1 path { } #stacks_in_344 .morph-shape-3, #stacks_in_344 .morph-shape-3 path { display: block !important; } /* foundation RTL theme - fix - direction:ltr */ #stacks_in_344 .HYPE_document { direction:ltr !important; margin:auto; position:relative; display: block; overflow: hidden; width: 100%; min-height: 420px; max-width: 1800px; } /* was important - fox edit mode UP */ /* ------- IMG LINE ------ */ #stacks_in_344 .anim-line { text-align: left !important; position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: 0 !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: auto !important; important; margin-top: auto !important; width: 370px !important; height: 370px !important; } #stacks_in_344 .anim-line path { stroke-width: 8px !important; stroke: rgba(153, 167, 198, 1.00) !important; } /* ------- IMG ------ */ /* removed below width: auto !important; bwlow to fix in IE11 */ #stacks_in_344 .extend_image { left: 0 !important; right: 0 !important; text-align: center !important; margin: auto !important; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background-image: url(../files/pop_image-344.png) !important; max-width: 310px !important; height: 330px !important; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background-size: cover !important; } #stacks_in_344 .extend_image_main_overlay { background-color: transparent !important; } #stacks_in_344 .extend_image_main_grid { background: url(../files/dots14.png) center center repeat !important; display: block !important; } #stacks_in_344 .hype_box { box-sizing: border-box !important; text-align: center !important; max-height: 95vh; margin: auto !important; width: auto; display: inline-table !important; right: 0 !important; left: 0 !important; border-style: none !important; top: 0; } /* fade-css to slice */ #stacks_in_344 .inner_slice { z-index: 2 !important; box-sizing: border-box !important; position: relative; max-width: 40% !important; -webkit-animation: fade-css 0.25s ease-in-out both; animation: fade-css 0.25s ease-in-out both; } @keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes fade-css { 0% {opacity: 0;} 100% {opacity: 1;} } #stacks_in_344 .inner_slice_content, #stacks_in_344 .inner_slice_content p, #stacks_in_344 .inner_slice_content span, #stacks_in_344 .inner_slice_content [class*="fa fa-"], #stacks_in_344 .inner_slice_content h1, #stacks_in_344 .inner_slice_content h2, #stacks_in_344 .inner_slice_content h3, #stacks_in_344 .inner_slice_content h4, #stacks_in_344 .inner_slice_content h5, #stacks_in_344 .inner_slice_content h6 {-webkit-font-smoothing: antialiased; color:#CECECE !important; } #stacks_in_344 .inner_slice_content a:link [class^="fa fa-"], #stacks_in_344 .inner_slice_content a:visited [class^="fa fa-"], #stacks_in_344 .inner_slice_content a:link, #stacks_in_344 .inner_slice_content a { color:#FC2409 !important; } #stacks_in_344 .inner_slice_content a:hover [class^="fa fa-"], #stacks_in_344 .inner_slice_content a:active [class^="fa fa-"], #stacks_in_344 .inner_slice_content a:hover { color:#FFFFFF !important; } /* hype elements */ #stacks_in_344 .viewport-morph-trigger { opacity: 0.45; } #stacks_in_344 .viewport-rotscal-trigger { opacity: 0.45; } #stacks_in_344 .viewport-line-trigger { opacity: 0.45; } #stacks_in_344 .setting_panel_slide { position: absolute !important; margin-left: -25%; } /* ------------------ 2 columns -- END */ /* ------------------------------- breakpoint min -------------------------------------- */ @media screen and (min-width: 9000px ) { #stacks_in_344 .anim-line { } #stacks_in_344 .inner_slice {max-width: 40% !important;} #stacks_in_344 .hype_box, #stacks_in_344 .wrapper-link { width: 60% !important; left: 40% !important; margin-top: 0 !important; margin-bottom: 10% !important; max-height: 420px; } #stacks_in_344 .left-box-over-bg-10 { margin-left: -10% !important; } #stacks_in_344 .extend_image { top: 5% !important; background-position: 50% 50% !important; /* below for desktop - 2 columns only- to use in one */ top: 10% !important; } #stacks_in_344 .setting_panel_slide { } #stacks_in_344 .inner_slice_content { padding-top: 0px; } } /* -------------------- breakpoint min -------------- END ---------- */ /* Hype element simulator centering in MAX */ #stacks_in_344 .setting_panel_slide { } /* -------------------- breakpoint MAX ----------------------- */ @media screen and (max-width: 9000px ) { /* line 2 col */ #stacks_in_344 .inner_slice { max-width: 100% !important; margin-top: 330px; top: 0px !important; } #stacks_in_344 .inner_slice_content { background-color: rgba(26, 45, 75, 0.87); } #stacks_in_344 .hype_box, #stacks_in_344 .wrapper-link {max-width: 100% !important; left: 0% !important; position: absolute !important; top: 0 !important; max-height: 330px; } #stacks_in_344 .hype_box { display: block !important; margin-top: 20px !important; } #stacks_in_344 .extend_image { top: 5% !important; max-width: 200px !important; height: 280px !important; background-position: 50% 50% !important; } #stacks_in_344 .anim-line { bottom: 0 !important; top: 0 !important; right: 0 !important; left: 0 !important; margin-right: auto !important; margin-left: auto !important; margin-bottom: auto !important; margin-top: auto !important; width: 300px !important; height: 300px !important; margin-top: 10px !important; } #stacks_in_344 .HYPE_document { overflow: hidden !important; padding-top: 20px !important; margin-bottom: 0px !important; } /* link area */ #stacks_in_344 .element-link, #stacks_in_344 .wrapper-link, #stacks_in_344 .wrapper-link:hover { display: none !important; } /* hide show text background */ #stacks_in_344 .left-box-over-bg-10 { display: none !important; } /* preview simulator centering in MAX */ #stacks_in_344 .setting_panel_slide { } } /* -------------------- breakpoint MAX ----------- END ------------ */ /* -------------------- breakpoint small devices ---- */ @media screen and (max-width: 560px) { #stacks_in_344 .extend_image { } } /* -------------------- breakpoint internal ---- */ @media screen and (max-width: 420px ) { #stacks_in_344 .anim-line { } } /* -------------- if edit mode list -------------- */ #stacks_in_344 .HYPE_document { } #stacks_in_344 .inner_slice_content { } #stacks_in_344 .inner_slice { } /* -- End EACH CSS Template -- */ #stacks_in_346 { padding: 25px; }