/* Theme Name: Attitude HTML UI KIT Template Theme URI: https://wplook.com/ Author: WPlook Themes (Victor Tihai) Author URI: https://wplook.com/ Description: Attitude is HTML Template Version: 1.1.0 */ /* ========================================================================== /* ===== MIXIN Founctions ===== */ /*========================================================================== */ @keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } 50% { -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 0,7; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); opacity: 1; } 50% { -webkit-transform: scale(1.2); opacity: 0,7; } 100% { -webkit-transform: scale(1); opacity: 1; } } .docs-color-block { border: 0.0625rem solid #ccc; padding: 0.3125rem; border-radius: 0.1875rem; margin-bottom: 1.5625rem; } .docs-color-block p.variable { font-weight: normal; font-size: 0.875rem; text-align: center; padding: 0.625rem 0 0 0; margin: 0.3125rem 0; } .docs-color-block p.name { font-weight: bold; text-align: center; padding: 0.625rem 0 0 0; margin: 0.3125rem 0; } .docs-color-block .block-color { height: 3.125rem; border-radius: 0.1875rem; } .docs-color-block .block-color .white { color: #fff; text-align: center; padding-top: 0.9375rem; } .docs-color-block .block-color .black { color: #000; text-align: center; padding-top: 0.9375rem; } .docs-color-block .block-color.primary { background: #333333; border: 0.0625rem solid #1a1a1a; } .docs-color-block .block-color.secondary { background: #546e7a; border: 0.0625rem solid #526b77; } .docs-color-block .block-color.dentist { background: #267871; border: 0.0625rem solid #25746d; } .docs-color-block .block-color.textColor { background: #888888; border: 0.0625rem solid #858585; } .docs-color-block .block-color.whiteColor { background: #ffffff; border: 0.0625rem solid #fafafa; } .docs-color-block .block-color.blackColor { background: #000000; border: 0.0625rem solid black; } .docs-color-block .block-color.grayColor { background: #f0f4f7; border: 0.0625rem solid #e9eff3; } .docs-color-block .block-color.accentColorAA { background: #d70027; border: 0.0625rem solid #cd0025; } .docs-color-block .block-color.accentColorAB { background: #7300a5; border: 0.0625rem solid #6c009b; } .docs-color-block .block-color.accentColorBA { background: #2a0845; border: 0.0625rem solid #24073c; } .docs-color-block .block-color.accentColorBB { background: #6441a5; border: 0.0625rem solid #603e9e; } .docs-color-block .block-color.accentColorCA { background: #0c5b9c; border: 0.0625rem solid #0b5593; } .docs-color-block .block-color.accentColorCB { background: #249bd6; border: 0.0625rem solid #2395cd; } .docs-color-block .block-color.accentColorDA { background: #62045f; border: 0.0625rem solid #580456; } .docs-color-block .block-color.accentColorDB { background: #aa076b; border: 0.0625rem solid #a00765; } .docs-color-block .block-color.accentColorEA { background: #136a8a; border: 0.0625rem solid #126381; } .docs-color-block .block-color.accentColorEB { background: #267871; border: 0.0625rem solid #24706a; } .docs-color-block .block-color.accentColorFA { background: #6859de; border: 0.0625rem solid #6050dc; } .docs-color-block .block-color.accentColorFB { background: #f03774; border: 0.0625rem solid #ef2e6d; } .docs-color-block .block-color.accentColorGA { background: #fc4a1a; border: 0.0625rem solid #fc4210; } .docs-color-block .block-color.accentColorGB { background: #f7b733; border: 0.0625rem solid #f7b429; } .docs-color-block .block-color.accentColorHA { background: #d31027; border: 0.0625rem solid #ca0f25; } .docs-color-block .block-color.accentColorHB { background: #ea384d; border: 0.0625rem solid #e92f45; } .docs-color-block .block-color.accentColorIA { background: #16a085; border: 0.0625rem solid #15977e; } .docs-color-block .block-color.accentColorIB { background: #f4d03f; border: 0.0625rem solid #f3ce35; } .docs-color-block .block-color.accentColorJA { background: #000000; border: 0.0625rem solid black; } .docs-color-block .block-color.accentColorJB { background: #434343; border: 0.0625rem solid #3e3e3e; } .docs-color-block .block-color.borderColor { background: #ccc; border: 0.0625rem solid #c7c7c7; } .docs-color-block .block-color.borderColorLight { background: #f3f3f3; border: 0.0625rem solid #eeeeee; } /* Motion ui Transitions */ .slide-in-down.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .slide-in-down.mui-enter.mui-enter-active { -webkit-transform: translateY(0); transform: translateY(0); } .slide-in-left.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .slide-in-left.mui-enter.mui-enter-active { -webkit-transform: translateX(0); transform: translateX(0); } .slide-in-up.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .slide-in-up.mui-enter.mui-enter-active { -webkit-transform: translateY(0); transform: translateY(0); } .slide-in-right.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .slide-in-right.mui-enter.mui-enter-active { -webkit-transform: translateX(0); transform: translateX(0); } .slide-out-down.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .slide-out-down.mui-leave.mui-leave-active { -webkit-transform: translateY(100%); transform: translateY(100%); } .slide-out-right.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .slide-out-right.mui-leave.mui-leave-active { -webkit-transform: translateX(100%); transform: translateX(100%); } .slide-out-up.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .slide-out-up.mui-leave.mui-leave-active { -webkit-transform: translateY(-100%); transform: translateY(-100%); } .slide-out-left.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .slide-out-left.mui-leave.mui-leave-active { -webkit-transform: translateX(-100%); transform: translateX(-100%); } .fade-in.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; opacity: 0; -webkit-transition-property: opacity; transition-property: opacity; } .fade-in.mui-enter.mui-enter-active { opacity: 1; } .fade-out.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; opacity: 1; -webkit-transition-property: opacity; transition-property: opacity; } .fade-out.mui-leave.mui-leave-active { opacity: 0; } .hinge-in-from-top.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateX(-90deg); transform: perspective(2000px) rotateX(-90deg); -webkit-transform-origin: top; transform-origin: top; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .hinge-in-from-top.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); opacity: 1; } .hinge-in-from-right.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateY(-90deg); transform: perspective(2000px) rotateY(-90deg); -webkit-transform-origin: right; transform-origin: right; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .hinge-in-from-right.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); opacity: 1; } .hinge-in-from-bottom.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateX(90deg); transform: perspective(2000px) rotateX(90deg); -webkit-transform-origin: bottom; transform-origin: bottom; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .hinge-in-from-bottom.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); opacity: 1; } .hinge-in-from-left.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateY(90deg); transform: perspective(2000px) rotateY(90deg); -webkit-transform-origin: left; transform-origin: left; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .hinge-in-from-left.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); opacity: 1; } .hinge-in-from-middle-x.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateX(-90deg); transform: perspective(2000px) rotateX(-90deg); -webkit-transform-origin: center; transform-origin: center; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .hinge-in-from-middle-x.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); opacity: 1; } .hinge-in-from-middle-y.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateY(-90deg); transform: perspective(2000px) rotateY(-90deg); -webkit-transform-origin: center; transform-origin: center; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .hinge-in-from-middle-y.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); opacity: 1; } .hinge-out-from-top.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: top; transform-origin: top; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .hinge-out-from-top.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateX(90deg); transform: perspective(2000px) rotateX(90deg); opacity: 0; } .hinge-out-from-right.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: right; transform-origin: right; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .hinge-out-from-right.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateY(90deg); transform: perspective(2000px) rotateY(90deg); opacity: 0; } .hinge-out-from-bottom.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: bottom; transform-origin: bottom; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .hinge-out-from-bottom.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateX(-90deg); transform: perspective(2000px) rotateX(-90deg); opacity: 0; } .hinge-out-from-left.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: left; transform-origin: left; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .hinge-out-from-left.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateY(-90deg); transform: perspective(2000px) rotateY(-90deg); opacity: 0; } .hinge-out-from-middle-x.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: center; transform-origin: center; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .hinge-out-from-middle-x.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateX(90deg); transform: perspective(2000px) rotateX(90deg); opacity: 0; } .hinge-out-from-middle-y.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: center; transform-origin: center; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .hinge-out-from-middle-y.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateY(90deg); transform: perspective(2000px) rotateY(90deg); opacity: 0; } .scale-in-up.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .scale-in-up.mui-enter.mui-enter-active { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .scale-in-down.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: scale(1.5); transform: scale(1.5); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .scale-in-down.mui-enter.mui-enter-active { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .scale-out-up.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: scale(1); transform: scale(1); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .scale-out-up.mui-leave.mui-leave-active { -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0; } .scale-out-down.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: scale(1); transform: scale(1); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .scale-out-down.mui-leave.mui-leave-active { -webkit-transform: scale(0.5); transform: scale(0.5); opacity: 0; } .spin-in.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: rotate(-0.75turn); transform: rotate(-0.75turn); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .spin-in.mui-enter.mui-enter-active { -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } .spin-out.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: rotate(0); transform: rotate(0); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .spin-out.mui-leave.mui-leave-active { -webkit-transform: rotate(0.75turn); transform: rotate(0.75turn); opacity: 0; } .spin-in-ccw.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: rotate(0.75turn); transform: rotate(0.75turn); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } .spin-in-ccw.mui-enter.mui-enter-active { -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } .spin-out-ccw.mui-leave { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transform: rotate(0); transform: rotate(0); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 1; } .spin-out-ccw.mui-leave.mui-leave-active { -webkit-transform: rotate(-0.75turn); transform: rotate(-0.75turn); opacity: 0; } .slow { -webkit-transition-duration: 750ms !important; transition-duration: 750ms !important; } .fast { -webkit-transition-duration: 250ms !important; transition-duration: 250ms !important; } .linear { -webkit-transition-timing-function: linear !important; transition-timing-function: linear !important; } .ease { -webkit-transition-timing-function: ease !important; transition-timing-function: ease !important; } .ease-in { -webkit-transition-timing-function: ease-in !important; transition-timing-function: ease-in !important; } .ease-out { -webkit-transition-timing-function: ease-out !important; transition-timing-function: ease-out !important; } .ease-in-out { -webkit-transition-timing-function: ease-in-out !important; transition-timing-function: ease-in-out !important; } .bounce-in { -webkit-transition-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; transition-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; } .bounce-out { -webkit-transition-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; transition-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; } .bounce-in-out { -webkit-transition-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; transition-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; } .short-delay { -webkit-transition-delay: 300ms !important; transition-delay: 300ms !important; } .long-delay { -webkit-transition-delay: 700ms !important; transition-delay: 700ms !important; } /* Motion ui Animations */ .shake { -webkit-animation-name: shake-7; animation-name: shake-7; } @-webkit-keyframes shake-7 { 0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% { -webkit-transform: translateX(7%); transform: translateX(7%); } 5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% { -webkit-transform: translateX(-7%); transform: translateX(-7%); } } @keyframes shake-7 { 0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% { -webkit-transform: translateX(7%); transform: translateX(7%); } 5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% { -webkit-transform: translateX(-7%); transform: translateX(-7%); } } .spin-cw { -webkit-animation-name: spin-cw-1turn; animation-name: spin-cw-1turn; } @-webkit-keyframes spin-cw-1turn { 0% { -webkit-transform: rotate(-1turn); transform: rotate(-1turn); } 100% { -webkit-transform: rotate(0); transform: rotate(0); } } @keyframes spin-cw-1turn { 0% { -webkit-transform: rotate(-1turn); transform: rotate(-1turn); } 100% { -webkit-transform: rotate(0); transform: rotate(0); } } .spin-ccw { -webkit-animation-name: spin-ccw-1turn; animation-name: spin-ccw-1turn; } @-webkit-keyframes spin-ccw-1turn { 0% { -webkit-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(-1turn); transform: rotate(-1turn); } } @keyframes spin-ccw-1turn { 0% { -webkit-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(-1turn); transform: rotate(-1turn); } } .wiggle { -webkit-animation-name: wiggle-7deg; animation-name: wiggle-7deg; } @-webkit-keyframes wiggle-7deg { 40%, 50%, 60% { -webkit-transform: rotate(7deg); transform: rotate(7deg); } 35%, 45%, 55%, 65% { -webkit-transform: rotate(-7deg); transform: rotate(-7deg); } 0%, 30%, 70%, 100% { -webkit-transform: rotate(0); transform: rotate(0); } } @keyframes wiggle-7deg { 40%, 50%, 60% { -webkit-transform: rotate(7deg); transform: rotate(7deg); } 35%, 45%, 55%, 65% { -webkit-transform: rotate(-7deg); transform: rotate(-7deg); } 0%, 30%, 70%, 100% { -webkit-transform: rotate(0); transform: rotate(0); } } .shake, .spin-cw, .spin-ccw, .wiggle { -webkit-animation-duration: 500ms; animation-duration: 500ms; } .infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .slow { -webkit-animation-duration: 750ms !important; animation-duration: 750ms !important; } .fast { -webkit-animation-duration: 250ms !important; animation-duration: 250ms !important; } .linear { -webkit-animation-timing-function: linear !important; animation-timing-function: linear !important; } .ease { -webkit-animation-timing-function: ease !important; animation-timing-function: ease !important; } .ease-in { -webkit-animation-timing-function: ease-in !important; animation-timing-function: ease-in !important; } .ease-out { -webkit-animation-timing-function: ease-out !important; animation-timing-function: ease-out !important; } .ease-in-out { -webkit-animation-timing-function: ease-in-out !important; animation-timing-function: ease-in-out !important; } .bounce-in { -webkit-animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; } .bounce-out { -webkit-animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; } .bounce-in-out { -webkit-animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; } .short-delay { -webkit-animation-delay: 300ms !important; animation-delay: 300ms !important; } .long-delay { -webkit-animation-delay: 700ms !important; animation-delay: 700ms !important; } /* ========================================================================== /* ===== Boxed ===== */ /*========================================================================== */ .boxed-page-1280 { max-width: 80rem; margin: 0 auto; } .boxed-page-1400 { max-width: 87.5rem; margin: 0 auto; } .boxed-page-1600 { max-width: 100rem; margin: 0 auto; } .boxed-page-1920 { max-width: 120rem; margin: 0 auto; } /* ========================================================================== /* ===== Background Gradients ===== */ /*========================================================================== */ /* ===== gradient-a -> gradient-a-95 ===== */ .gradient-a-10 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.1), rgba(115, 0, 165, 0.1)); } .gradient-a-15 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.15), rgba(115, 0, 165, 0.15)); } .gradient-a-20 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.2), rgba(115, 0, 165, 0.2)); } .gradient-a-25 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.25), rgba(115, 0, 165, 0.25)); } .gradient-a-30 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.3), rgba(115, 0, 165, 0.3)); } .gradient-a-35 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.35), rgba(115, 0, 165, 0.35)); } .gradient-a-40 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.4), rgba(115, 0, 165, 0.4)); } .gradient-a-45 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.45), rgba(115, 0, 165, 0.45)); } .gradient-a-50 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.5), rgba(115, 0, 165, 0.5)); } .gradient-a-45 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.45), rgba(115, 0, 165, 0.45)); } .gradient-a-50 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.5), rgba(115, 0, 165, 0.5)); } .gradient-a-55 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.55), rgba(115, 0, 165, 0.55)); } .gradient-a-60 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.6), rgba(115, 0, 165, 0.6)); } .gradient-a-65 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.65), rgba(115, 0, 165, 0.65)); } .gradient-a-70 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.7), rgba(115, 0, 165, 0.7)); } .gradient-a-75 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.75), rgba(115, 0, 165, 0.75)); } .gradient-a-80 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.8), rgba(115, 0, 165, 0.8)); } .gradient-a-85 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.85), rgba(115, 0, 165, 0.85)); } .gradient-a-90 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.9), rgba(115, 0, 165, 0.9)); } .gradient-a-95 { background: linear-gradient(142deg, rgba(215, 0, 39, 0.95), rgba(115, 0, 165, 0.95)); } .gradient-a-100 { background: linear-gradient(142deg, #d70027, #7300a5); } /* ===== gradient-b -> gradient-b-95 ===== */ .gradient-b-10 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.1), rgba(100, 65, 165, 0.1)); } .gradient-b-15 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.15), rgba(100, 65, 165, 0.15)); } .gradient-b-20 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.2), rgba(100, 65, 165, 0.2)); } .gradient-b-25 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.25), rgba(100, 65, 165, 0.25)); } .gradient-b-30 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.3), rgba(100, 65, 165, 0.3)); } .gradient-b-35 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.35), rgba(100, 65, 165, 0.35)); } .gradient-b-40 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.4), rgba(100, 65, 165, 0.4)); } .gradient-b-45 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.45), rgba(100, 65, 165, 0.45)); } .gradient-b-50 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.5), rgba(100, 65, 165, 0.5)); } .gradient-b-55 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.55), rgba(100, 65, 165, 0.55)); } .gradient-b-60 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.6), rgba(100, 65, 165, 0.6)); } .gradient-b-65 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.65), rgba(100, 65, 165, 0.65)); } .gradient-b-70 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.7), rgba(100, 65, 165, 0.7)); } .gradient-b-75 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.75), rgba(100, 65, 165, 0.75)); } .gradient-b-80 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.8), rgba(100, 65, 165, 0.8)); } .gradient-b-85 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.85), rgba(100, 65, 165, 0.85)); } .gradient-b-90 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.9), rgba(100, 65, 165, 0.9)); } .gradient-b-95 { background: linear-gradient(142deg, rgba(42, 8, 69, 0.95), rgba(100, 65, 165, 0.95)); } .gradient-b-100 { background: linear-gradient(142deg, #2a0845, #6441a5); } /* ===== gradient-c -> gradient-c-95 ===== */ .gradient-c-10 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.1), rgba(36, 155, 214, 0.1)); } .gradient-c-15 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.15), rgba(36, 155, 214, 0.15)); } .gradient-c-20 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.2), rgba(36, 155, 214, 0.2)); } .gradient-c-25 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.25), rgba(36, 155, 214, 0.25)); } .gradient-c-30 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.3), rgba(36, 155, 214, 0.3)); } .gradient-c-35 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.35), rgba(36, 155, 214, 0.35)); } .gradient-c-40 { background: linear-gradient(90deg, rgba(79,129,178,0.4) 0%, rgba(0,77,184,0.4) 100%); } .gradient-c-45 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.45), rgba(36, 155, 214, 0.45)); } .gradient-c-50 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.5), rgba(36, 155, 214, 0.5)); } .gradient-c-55 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.55), rgba(36, 155, 214, 0.55)); } .gradient-c-60 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.6), rgba(36, 155, 214, 0.6)); } .gradient-c-65 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.65), rgba(36, 155, 214, 0.65)); } .gradient-c-70 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.7), rgba(36, 155, 214, 0.7)); } .gradient-c-75 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.75), rgba(36, 155, 214, 0.75)); } .gradient-c-80 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.8), rgba(36, 155, 214, 0.8)); } .gradient-c-85 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.85), rgba(36, 155, 214, 0.85)); } .gradient-c-90 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.9), rgba(36, 155, 214, 0.9)); } .gradient-c-95 { background: linear-gradient(142deg, rgba(12, 91, 156, 0.95), rgba(36, 155, 214, 0.95)); } .gradient-c-100 { background: linear-gradient(90deg, rgba(79,129,178,1) 0%, rgba(0,77,184,1) 100%); } /* ===== gradient-d -> gradient-d-95 ===== */ .gradient-d { background: linear-gradient(142deg, #62045f, #aa076b); } .gradient-d-10 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.1), rgba(170, 7, 107, 0.1)); } .gradient-d-15 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.15), rgba(170, 7, 107, 0.15)); } .gradient-d-20 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.2), rgba(170, 7, 107, 0.2)); } .gradient-d-25 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.25), rgba(170, 7, 107, 0.25)); } .gradient-d-30 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.3), rgba(170, 7, 107, 0.3)); } .gradient-d-35 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.35), rgba(170, 7, 107, 0.35)); } .gradient-d-40 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.4), rgba(170, 7, 107, 0.4)); } .gradient-d-45 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.45), rgba(170, 7, 107, 0.45)); } .gradient-d-50 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.5), rgba(170, 7, 107, 0.5)); } .gradient-d-55 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.55), rgba(170, 7, 107, 0.55)); } .gradient-d-60 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.6), rgba(170, 7, 107, 0.6)); } .gradient-d-65 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.65), rgba(170, 7, 107, 0.65)); } .gradient-d-70 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.7), rgba(170, 7, 107, 0.7)); } .gradient-d-75 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.75), rgba(170, 7, 107, 0.75)); } .gradient-d-80 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.8), rgba(170, 7, 107, 0.8)); } .gradient-d-85 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.85), rgba(170, 7, 107, 0.85)); } .gradient-d-90 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.9), rgba(170, 7, 107, 0.9)); } .gradient-d-95 { background: linear-gradient(142deg, rgba(98, 4, 95, 0.95), rgba(170, 7, 107, 0.95)); } .gradient-d-100 { background: linear-gradient(142deg, #62045f, #aa076b); } /* ===== gradient-e -> gradient-e-95 ===== */ .gradient-e { background: linear-gradient(142deg, #136a8a, #267871); } .gradient-e-10 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.1), rgba(38, 120, 113, 0.1)); } .gradient-e-15 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.15), rgba(38, 120, 113, 0.15)); } .gradient-e-20 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.2), rgba(38, 120, 113, 0.2)); } .gradient-e-25 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.25), rgba(38, 120, 113, 0.25)); } .gradient-e-30 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.3), rgba(38, 120, 113, 0.3)); } .gradient-e-35 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.35), rgba(38, 120, 113, 0.35)); } .gradient-e-40 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.4), rgba(38, 120, 113, 0.4)); } .gradient-e-45 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.45), rgba(38, 120, 113, 0.45)); } .gradient-e-50 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.5), rgba(38, 120, 113, 0.5)); } .gradient-e-55 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.55), rgba(38, 120, 113, 0.55)); } .gradient-e-60 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.6), rgba(38, 120, 113, 0.6)); } .gradient-e-65 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.65), rgba(38, 120, 113, 0.65)); } .gradient-e-70 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.7), rgba(38, 120, 113, 0.7)); } .gradient-e-75 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.75), rgba(38, 120, 113, 0.75)); } .gradient-e-80 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.8), rgba(38, 120, 113, 0.8)); } .gradient-e-85 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.85), rgba(38, 120, 113, 0.85)); } .gradient-e-90 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.9), rgba(38, 120, 113, 0.9)); } .gradient-e-95 { background: linear-gradient(142deg, rgba(19, 106, 138, 0.95), rgba(38, 120, 113, 0.95)); } .gradient-e-100 { background: linear-gradient(142deg, #136a8a, #267871); } /* ===== gradient-f -> gradient-f-95 ===== */ .gradient-f { background: linear-gradient(142deg, #6859de, #f03774); } .gradient-f-10 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.1), rgba(240, 55, 116, 0.1)); } .gradient-f-15 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.15), rgba(240, 55, 116, 0.15)); } .gradient-f-20 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.2), rgba(240, 55, 116, 0.2)); } .gradient-f-25 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.25), rgba(240, 55, 116, 0.25)); } .gradient-f-30 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.3), rgba(240, 55, 116, 0.3)); } .gradient-f-35 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.35), rgba(240, 55, 116, 0.35)); } .gradient-f-40 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.4), rgba(240, 55, 116, 0.4)); } .gradient-f-45 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.45), rgba(240, 55, 116, 0.45)); } .gradient-f-50 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.5), rgba(240, 55, 116, 0.5)); } .gradient-f-55 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.55), rgba(240, 55, 116, 0.55)); } .gradient-f-60 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.6), rgba(240, 55, 116, 0.6)); } .gradient-f-65 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.65), rgba(240, 55, 116, 0.65)); } .gradient-f-70 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.7), rgba(240, 55, 116, 0.7)); } .gradient-f-75 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.75), rgba(240, 55, 116, 0.75)); } .gradient-f-80 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.8), rgba(240, 55, 116, 0.8)); } .gradient-f-85 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.85), rgba(240, 55, 116, 0.85)); } .gradient-f-90 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.9), rgba(240, 55, 116, 0.9)); } .gradient-f-95 { background: linear-gradient(142deg, rgba(104, 89, 222, 0.95), rgba(240, 55, 116, 0.95)); } .gradient-f-100 { background: linear-gradient(142deg, #6859de, #f03774); } /* ===== gradient-g -> gradient-g-100 ===== */ .gradient-g { background: linear-gradient(142deg, #fc4a1a, #f7b733); } .gradient-g-10 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.1), rgba(247, 183, 51, 0.1)); } .gradient-g-15 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.15), rgba(247, 183, 51, 0.15)); } .gradient-g-20 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.2), rgba(247, 183, 51, 0.2)); } .gradient-g-25 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.25), rgba(247, 183, 51, 0.25)); } .gradient-g-30 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.3), rgba(247, 183, 51, 0.3)); } .gradient-g-35 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.35), rgba(247, 183, 51, 0.35)); } .gradient-g-40 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.4), rgba(247, 183, 51, 0.4)); } .gradient-g-45 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.45), rgba(247, 183, 51, 0.45)); } .gradient-g-50 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.5), rgba(247, 183, 51, 0.5)); } .gradient-g-55 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.55), rgba(247, 183, 51, 0.55)); } .gradient-g-60 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.6), rgba(247, 183, 51, 0.6)); } .gradient-g-65 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.65), rgba(247, 183, 51, 0.65)); } .gradient-g-70 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.7), rgba(247, 183, 51, 0.7)); } .gradient-g-75 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.75), rgba(247, 183, 51, 0.75)); } .gradient-g-80 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.8), rgba(247, 183, 51, 0.8)); } .gradient-g-85 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.85), rgba(247, 183, 51, 0.85)); } .gradient-g-90 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.9), rgba(247, 183, 51, 0.9)); } .gradient-g-95 { background: linear-gradient(142deg, rgba(252, 74, 26, 0.95), rgba(247, 183, 51, 0.95)); } .gradient-g-100 { background: linear-gradient(142deg, #fc4a1a, #f7b733); } /* ===== gradient-h -> gradient-h-100 ===== */ .gradient-h { background: linear-gradient(142deg, #d31027, #ea384d); } .gradient-h-10 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.1), rgba(234, 56, 77, 0.1)); } .gradient-h-15 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.15), rgba(234, 56, 77, 0.15)); } .gradient-h-20 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.2), rgba(234, 56, 77, 0.2)); } .gradient-h-25 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.25), rgba(234, 56, 77, 0.25)); } .gradient-h-30 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.3), rgba(234, 56, 77, 0.3)); } .gradient-h-35 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.35), rgba(234, 56, 77, 0.35)); } .gradient-h-40 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.4), rgba(234, 56, 77, 0.4)); } .gradient-h-45 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.45), rgba(234, 56, 77, 0.45)); } .gradient-h-50 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.5), rgba(234, 56, 77, 0.5)); } .gradient-h-55 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.55), rgba(234, 56, 77, 0.55)); } .gradient-h-60 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.6), rgba(234, 56, 77, 0.6)); } .gradient-h-65 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.65), rgba(234, 56, 77, 0.65)); } .gradient-h-70 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.7), rgba(234, 56, 77, 0.7)); } .gradient-h-75 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.75), rgba(234, 56, 77, 0.75)); } .gradient-h-80 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.8), rgba(234, 56, 77, 0.8)); } .gradient-h-85 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.85), rgba(234, 56, 77, 0.85)); } .gradient-h-90 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.9), rgba(234, 56, 77, 0.9)); } .gradient-h-95 { background: linear-gradient(142deg, rgba(211, 16, 39, 0.95), rgba(234, 56, 77, 0.95)); } .gradient-h-100 { background: linear-gradient(142deg, #d31027, #ea384d); } .gradient-h { background: #EA4C5F; } /* ===== gradient-i -> gradient-i-100 ===== */ .gradient-i { background: linear-gradient(142deg, #16a085, #f4d03f); } .gradient-i-10 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.1), rgba(244, 208, 63, 0.1)); } .gradient-i-15 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.15), rgba(244, 208, 63, 0.15)); } .gradient-i-20 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.2), rgba(244, 208, 63, 0.2)); } .gradient-i-25 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.25), rgba(244, 208, 63, 0.25)); } .gradient-i-30 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.3), rgba(244, 208, 63, 0.3)); } .gradient-i-35 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.35), rgba(244, 208, 63, 0.35)); } .gradient-i-40 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.4), rgba(244, 208, 63, 0.4)); } .gradient-i-45 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.45), rgba(244, 208, 63, 0.45)); } .gradient-i-50 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.5), rgba(244, 208, 63, 0.5)); } .gradient-i-55 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.55), rgba(244, 208, 63, 0.55)); } .gradient-i-60 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.6), rgba(244, 208, 63, 0.6)); } .gradient-i-65 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.65), rgba(244, 208, 63, 0.65)); } .gradient-i-70 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.7), rgba(244, 208, 63, 0.7)); } .gradient-i-75 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.75), rgba(244, 208, 63, 0.75)); } .gradient-i-80 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.8), rgba(244, 208, 63, 0.8)); } .gradient-i-85 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.85), rgba(244, 208, 63, 0.85)); } .gradient-i-90 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.9), rgba(244, 208, 63, 0.9)); } .gradient-i-95 { background: linear-gradient(142deg, rgba(22, 160, 133, 0.95), rgba(244, 208, 63, 0.95)); } .gradient-i-100 { background: linear-gradient(142deg, #16a085, #f4d03f); } /* ===== gradient-j -> gradient-j-100 ===== */ .gradient-j { background: linear-gradient(142deg, black, #434343); } .gradient-j-10 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.1), rgba(67, 67, 67, 0.1)); } .gradient-j-15 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.15), rgba(67, 67, 67, 0.15)); } .gradient-j-20 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.2), rgba(67, 67, 67, 0.2)); } .gradient-j-25 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.25), rgba(67, 67, 67, 0.25)); } .gradient-j-30 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.3), rgba(67, 67, 67, 0.3)); } .gradient-j-35 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.35), rgba(67, 67, 67, 0.35)); } .gradient-j-40 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.4), rgba(67, 67, 67, 0.4)); } .gradient-j-45 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.45), rgba(67, 67, 67, 0.45)); } .gradient-j-50 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.5), rgba(67, 67, 67, 0.5)); } .gradient-j-55 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.55), rgba(67, 67, 67, 0.55)); } .gradient-j-60 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.6), rgba(67, 67, 67, 0.6)); } .gradient-j-65 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.65), rgba(67, 67, 67, 0.65)); } .gradient-j-70 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.7), rgba(67, 67, 67, 0.7)); } .gradient-j-75 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.75), rgba(67, 67, 67, 0.75)); } .gradient-j-80 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.8), rgba(67, 67, 67, 0.8)); } .gradient-j-85 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.85), rgba(67, 67, 67, 0.85)); } .gradient-j-90 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.9), rgba(67, 67, 67, 0.9)); } .gradient-j-95 { background: linear-gradient(142deg, rgba(0, 0, 0, 0.95), rgba(67, 67, 67, 0.95)); } .gradient-j-100 { background: linear-gradient(142deg, black, #434343); } /* ========================================================================== /* ===== Text Gradients ===== */ /*========================================================================== */ .text-gradient-a { background: -webkit-linear-gradient(142deg, #d70027, #7300a5); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .text-gradient-b { background: -webkit-linear-gradient(142deg, #2a0845, #6441a5); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .text-gradient-c { background: -webkit-linear-gradient(142deg, #0c5b9c, #249bd6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .text-gradient-d { background: -webkit-linear-gradient(142deg, #62045f, #aa076b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .text-gradient-e { background: -webkit-linear-gradient(142deg, #136a8a, #267871); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .text-gradient-f { background: -webkit-linear-gradient(142deg, #6859de, #f03774); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .text-gradient-g { background: -webkit-linear-gradient(142deg, #fc4a1a, #f7b733); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .text-gradient-h { /*background: -webkit-linear-gradient(142deg, #d31027, #ea384d);*/ background: #EA4C5F; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .text-gradient-i { background: -webkit-linear-gradient(142deg, #16a085, #f4d03f); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } /* ========================================================================== /* ===== Border Gradients ===== */ /*========================================================================== */ .border-gradient-a { border-left: 0.0625rem solid #d70027; border-right: 0.0625rem solid #7300a5; background-image: -webkit-linear-gradient(142deg, #d70027, #7300a5), -webkit-linear-gradient(142deg, #d70027, #7300a5); background-size: 100% 0.0625rem; background-position: 0 100%, 0 0; background-repeat: no-repeat; background-clip: border-box; } /* ========================================================================== /* ===== Opacity ===== */ /*========================================================================== */ .opacity90 { opacity: 0.9; } /* ========================================================================== /* ===== Blur ===== */ /*========================================================================== */ .blur { -webkit-filter: blur(0.3125rem); filter: blur(0.3125rem); } /* ========================================================================== /* ===== Radius ===== */ /*========================================================================== */ .radius { border-radius: 0.25rem; } /* ========================================================================== /* ===== Shadow ===== */ /*========================================================================== */ .shadow { -webkit-box-shadow: 0 0 1.25rem 0.125rem rgba(0, 0, 0, 0.1); box-shadow: 0 0 1.25rem 0.125rem rgba(0, 0, 0, 0.1); background: #fff; } /* ========================================================================== /* ===== Edges ===== */ /*========================================================================== */ .angle-edge-top-right-bottom-right { position: relative; position: relative; padding: 3.75rem 0 5rem 0; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: 400; line-height: 1.4; /* color: #8a8a8a; */ color: #8B8DB9; } .angle-edge-top-right-bottom-right::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 35' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,0 100,0 0,35'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 35px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; top: 0; } .angle-edge-top-right-bottom-right::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 35' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,35 100,35 100,0'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 35px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; bottom: 0; } .angle-edge-top-left-bottom-left { position: relative; position: relative; padding: 3.75rem 0 5rem 0; } .angle-edge-top-left-bottom-left::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 35' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,0 100,35 100,0'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 35px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; top: 0; } .angle-edge-top-left-bottom-left::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 35' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,35 100,35 0,0'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 35px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; bottom: 0; } .angle-edge-top-right-bottom-left { position: relative; position: relative; padding: 3.75rem 0 5rem 0; } .angle-edge-top-right-bottom-left::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 35' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,0 100,0 0,35'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 35px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; top: 0; } .angle-edge-top-right-bottom-left::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 35' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,35 100,35 0,0'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 35px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; bottom: 0; } .angle-edge-top-left-bottom-right { position: relative; position: relative; padding: 3.75rem 0 5rem 0; } .angle-edge-top-left-bottom-right::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 35' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,0 100,35 100,0'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 35px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; top: 0; } .angle-edge-top-left-bottom-right::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 35' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,35 100,35 100,0'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 35px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; bottom: 0; } /* ========================================================================== /* ===== Typography ===== */ /*========================================================================== */ body { font-family: "Hind", sans-serif; } h1, h2, h3, h4, h5, h6 { font-family: "Poppins", sans-serif; } h1 { font-size: 1.875rem; } p { color: #8B8DB9; } ul, ol { color: #888888; } /* ========================================================================== /* ===== Accordion ===== */ /*========================================================================== */ ul.accordion.custom .accordion-title { font-size: 1rem; text-transform: uppercase; font-weight: bold; } ul.accordion.custom.minimal li.accordion-item { margin-bottom: 0.625rem; border: 0 solid #ccc; } ul.accordion.custom.minimal li.accordion-item .accordion-title { color: #333333; font-size: 1rem; border: 0.125rem solid #f3f3f3; font-family: "Poppins", sans-serif; font-weight: 400; } ul.accordion.custom.minimal li.accordion-item .accordion-title[aria-expanded='true'] { border-color: #333333; } ul.accordion.custom.minimal li.accordion-item .accordion-title:before { font-size: 1.5rem; } ul.accordion.custom.minimal li.accordion-item .accordion-title:hover { background: none; border-color: rgba(38, 120, 113, 0.45); } ul.accordion.custom.minimal li.accordion-item .accordion-content { border: 0; } ul.accordion.custom.minimal li.accordion-item .accordion-content p { margin-bottom: 0; } /* ========================================================================== /* ===== Breadcrumbs ===== */ /*========================================================================== */ .breadcrumb-element { margin: 1.25rem 0; } .breadcrumb-element .breadcrumbs { padding: 1.25rem 0; margin-bottom: 0; } .breadcrumb-element .breadcrumbs.caret li:not(:last-child)::after { content: '\f0da'; font-family: "Font Awesome 5 Free"; font-weight: 900; } .breadcrumb-element .breadcrumbs.chevron li:not(:last-child)::after { content: '\f054'; font-family: "Font Awesome 5 Free"; font-weight: 900; } .breadcrumb-element .white-color li { color: #cccccc; } .breadcrumb-element .white-color a { color: #ffffff; } .breadcrumb-element .gray { background: #f0f4f7; } /* ========================================================================== /* ===== Buttons ===== */ /*========================================================================== */ .button { /* ===== Action Button ===== */; } .button.action-button { border-radius: 1.25rem; color: #ffffff; border: 0 solid #ffffff; font-size: 0.9375rem; padding-left: 2.1875rem; padding-right: 2.1875rem; } .button.action-button.white { background: #ffffff; color: #333333; } .button.action-button.shadow { background: #ffffff; color: #333333; } .button.action-button.black { background: #333333; color: #ffffff; } .button.action-button.black:hover { background: #ffffff; color: #333333; } .button.action-button:hover { background: #333333; color: #ffffff; } .button.action-button.border-black { border: 0.0625rem solid #333333; } .button.action-button.border-white { border: 0.0625rem solid #ffffff; } /* ========================================================================== /* ===== Paginations ===== */ /*========================================================================== */ .pagination { padding: 2.5rem 0; margin: 0; } .pagination a { color: #546e7a; } .pagination.gray { background: #f0f4f7; } .pagination .current { background: #546e7a; } .pagination.white-color a { color: #ffffff; } .pagination.white-color a:hover { background: #000000; color: #ffffff; } .pagination.white-color .ellipsis:after { color: #ffffff; } .pagination.white-color .current { background: #ffffff; color: #546e7a; } /* ========================================================================== /* ===== Sliders ===== */ /*========================================================================== */ .slider .slider-handle { border-radius: 100%; border: 0.0625rem solid #ffffff; } /* ========================================================================== /* ===== Switches ===== */ /*========================================================================== */ .switch.tiny { width: 3rem; } .switch.small { width: 3.4375rem; } .switch.large { width: 5rem; } input:checked ~ .switch-paddle { background: transparent; } /* ========================================================================== /* ===== Blog Posts Section ===== */ /*========================================================================== */ section.blog-posts .section-body { padding: 0; } section.blog-posts article figure { position: relative; } section.blog-posts article figure img { width: 100%; height: auto; } section.blog-posts article figure .overlay { width: 100%; height: auto; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0; margin: 0; padding: 0; text-align: center; } section.blog-posts article figure .overlay .mask { display: none; margin-top: 25%; } section.blog-posts article figure .overlay:hover .mask { display: block; } section.blog-posts article figure .overlay:hover { background: rgba(0, 0, 0, 0); -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } section.blog-posts article figure .overlay:hover.mui-enter { -webkit-transition-duration: 500ms; transition-duration: 500ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: easeInOut; transition-timing-function: easeInOut; -webkit-transform: perspective(2000px) rotateY(90deg); transform: perspective(2000px) rotateY(90deg); -webkit-transform-origin: left; transform-origin: left; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; opacity: 0; } section.blog-posts article figure .overlay:hover.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); transform: perspective(2000px) rotate(0deg); opacity: 1; } section.blog-posts article figure.grayscale img { -webkit-filter: grayscale(0.9); filter: grayscale(0.9); } section.blog-posts article figure:hover img { -webkit-filter: grayscale(0); filter: grayscale(0); } section.blog-posts article .entry-meta { margin: 0.9375rem 0 0.625rem 0; } section.blog-posts article .entry-meta .category { font-size: 0.875rem; font-weight: 700; text-transform: uppercase; } section.blog-posts article .entry-meta .category-a a { color: #ea384d; } section.blog-posts article .entry-meta .category-b a { color: #f4d03f; } section.blog-posts article .entry-meta .category-c a { color: #0c5b9c; } section.blog-posts article .entry-meta .separator { color: #888888; margin: 0 0.3125rem; } section.blog-posts article .entry-meta .date { color: #888888; font-size: 0.875rem; } section.blog-posts article .entry-header { font-size: 1.125rem; font-weight: 600; } section.blog-posts article .entry-header a { color: #000000; } section.blog-posts article .description { color: #888888; font-size: 0.9375rem; } section.blog-posts .more-posts article { margin-bottom: 1.25rem; } section.blog-posts .more-posts article .entry-meta { margin: 0; } section.blog-posts .more-posts article h3 { font-size: 0.875rem; } section.blog-posts.gray { background: #f0f4f7; } /* ========================================================================== /* ===== Call to Action ===== */ /*========================================================================== */ section.action-bar .inner { padding: 3.125rem 0; } .section.projects-list-section { background-color: #F8F8FF; } section.action-bar h1, section.action-bar p { color: #ffffff; } section.action-bar.white h1 { color: #000000; margin: 0 0 0.625rem 0; } section.action-bar.white p { color: #004DB8; margin-top: 0.625rem; } /* ========================================================================== /* ===== Key Benefits Section ===== */ /*========================================================================== */ section.key-benefits .benefit { padding: 1.25rem; } section.key-benefits .benefit h3 { font-size: 0.9375rem; font-weight: 600; } section.key-benefits .benefit p { margin-bottom: 0; } section.key-benefits .benefit.white-color { color: #ffffff; } section.key-benefits .benefit.white-color p, section.key-benefits .benefit.white-color ul { color: #ffffff; } section.key-benefits.gray { background: #f0f4f7; } section.key-benefits ul.services { list-style: none; margin: 0; color: #546e7a; } section.key-benefits .button { margin: 0; } @media print, screen and (max-width: 63.99875em) { section.key-benefits .button { margin: 1.25rem 0 0 0; } } /* ========================================================================== /* ===== Sponsor Section ===== */ /*========================================================================== */ .no-js .owl-carousel.owl-carousel-sponsor { display: none; } section.sponsor .owl-carousel-sponsor figure { padding: 1.875rem; } section.sponsor .owl-carousel-sponsor .hidden { display: none; } /* ========================================================================== /* ===== Comments ===== */ /*========================================================================== */ section.comments.gray { background: #f0f4f7; } /* ========================================================================== /* ===== Donation Slider Section ===== */ /*========================================================================== */ .no-js .donate-slider { display: none; } section.donate-slider .top-negative { margin-top: -12.5rem; margin-bottom: 6.25rem; } section.donate-slider .stat { margin-top: 3.75rem; font-family: "Poppins", sans-serif; font-size: 1.875rem; color: #546e7a; } section.donate-slider .button { margin-bottom: 3.75rem; } section.donate-slider .slider { margin-bottom: 1.25rem; background: #d0dee8; } section.donate-slider #dot-0, section.donate-slider #dot-25, section.donate-slider #dot-50, section.donate-slider #dot-75, section.donate-slider #dot-100 { position: absolute; z-index: 9; top: -0.25rem; background: #ffffff; border: 0.1875rem solid #d0dee8; height: 0.9375rem; width: 0.9375rem; border-radius: 100%; } section.donate-slider #dot-0 { left: -0.125rem; } section.donate-slider #dot-0.full { border-color: #6859de; } section.donate-slider #dot-25 { left: 25%; -webkit-animation-name: fade-0-to-1; animation-name: fade-0-to-1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } @-webkit-keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } section.donate-slider #dot-25.full { border-color: #6441a5; -webkit-animation-name: fade-0-to-1; animation-name: fade-0-to-1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } @keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } section.donate-slider #dot-50 { left: 49%; -webkit-animation-name: fade-0-to-1; animation-name: fade-0-to-1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } @keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } section.donate-slider #dot-50.full { border-color: #a94da6; -webkit-animation-name: fade-0-to-1; animation-name: fade-0-to-1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } @keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } section.donate-slider #dot-75 { left: 74%; -webkit-animation-name: fade-0-to-1; animation-name: fade-0-to-1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } @keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } section.donate-slider #dot-75.full { border-color: #aa076b; -webkit-animation-name: fade-0-to-1; animation-name: fade-0-to-1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } @keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } section.donate-slider #dot-100 { right: -0.0625rem; -webkit-animation-name: fade-0-to-1; animation-name: fade-0-to-1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } @keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } section.donate-slider #dot-100.full { border-color: #f03774; -webkit-animation-name: fade-0-to-1; animation-name: fade-0-to-1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } @keyframes fade-0-to-1 { 0% { opacity: 0; } 100% { opacity: 1; } } section.donate-slider .slider-handle { border-radius: 100%; z-index: 99; background: linear-gradient(142deg, #d70027, #7300a5); border: 0.0625rem solid #ffffff; text-align: center; color: #f03774; font-size: 0.9rem; line-height: 1.45rem; } section.donate-slider .slider-handle:hover { color: #ffffff; } section.donate-slider .slider-fill { background: linear-gradient(142deg, #6859de, #f03774); } section.donate-slider .slider-number { font-size: 2rem; text-align: center; height: auto; } /* ========================================================================== /* ===== Event Agenda / Schedule Section ===== */ /*========================================================================== */ section.schedule .schedule-body .tabs { background: transparent; border: none; } section.schedule .tabs-title a { border: 0.0625rem solid rgba(0, 0, 0, 0.3); margin: 0.625rem 2.5rem 0.625rem 0; color: #000; font-size: 1.125rem; font-weight: 400; font-family: "Poppins", sans-serif; } section.schedule .tabs-title a:hover { background: transparent; border: 0.0625rem solid rgba(0, 0, 0, 0.9); } section.schedule .tabs-title a:focus, section.schedule .tabs-title a[aria-selected='true'] { /* classa pentru mobile tab*/ color: #000000; background: #F8F8FF; margin-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; } section.schedule .tabs-title a:focus .day-number, section.schedule .tabs-title a[aria-selected='true'] .day-number { color: #aa076b; } section.schedule .tabs-title a:focus .date, section.schedule .tabs-title a[aria-selected='true'] .date { color: #888888; } @media print, screen and (max-width: 63.99875em) { section.schedule .tabs-title a { margin: 0.625rem 0; } section.schedule .tabs-title a[aria-selected='true'] { /* classa pentru mobile tab*/ border-radius: 0; } } section.schedule .tabs-title .day-number { margin: 0 0.9375rem 0 0; padding: 0; font-size: 2.5rem; float: left; font-weight: 700; opacity: 0.9; } section.schedule .tabs-title .date { display: block; color: #ffffff; opacity: 0.65; font-size: 1rem; font-family: "Hind", sans-serif; margin-top: 0.3125rem; } section.schedule.gradient-a .tabs-title a[aria-selected='true'] .day-number { background: -webkit-linear-gradient(142deg, #d70027, #7300a5); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } section.schedule.gradient-b .tabs-title a[aria-selected='true'] .day-number { background: -webkit-linear-gradient(142deg, #2a0845, #6441a5); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } section.schedule.gradient-c .tabs-title a[aria-selected='true'] .day-number { background: -webkit-linear-gradient(142deg, #0c5b9c, #249bd6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } section.schedule.gradient-d .tabs-title a[aria-selected='true'] .day-number { background: -webkit-linear-gradient(142deg, #62045f, #aa076b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } section.schedule .horizontal-tabs .tabs-title a { margin: 0.625rem 0.625rem 0.625rem 0; } section.schedule .horizontal-tabs .tabs-title a[aria-selected='true'] { margin-right: 0.625rem; border-top-right-radius: 0.3125rem; border-bottom-right-radius: 0.3125rem; } @media print, screen and (max-width: 63.99875em) { section.schedule .horizontal-tabs .tabs-title a[aria-selected='true'] { border-radius: 0.3125rem; } } section.schedule .tabs-content { min-height: 25rem; z-index: 9999; } section.schedule .tabs-content .tabs-panel { margin: 0; padding: 2.5rem 3.75rem; } @media print, screen and (max-width: 63.99875em) { section.schedule .tabs-content .tabs-panel { padding: 2.5rem; } } section.schedule .accordion-item { border-bottom: 0.0625rem solid #ccc; /* ===== Accordeon Content ===== */; } section.schedule .accordion-item .accordion-title { border: none; margin: 0.625rem 0; padding: 0; background: transparent; } section.schedule .accordion-item .accordion-title:hover { background: #ffffff; } section.schedule .accordion-item .accordion-title:before { content: ""; } section.schedule .accordion-item .accordion-title .avatar { float: left; border: none; } section.schedule .accordion-item .accordion-title .avatar img { border-radius: 100%; width: 3rem; height: auto; margin-right: 1.25rem; border: 0.125rem solid #ccc; } section.schedule .accordion-item .accordion-title .time { margin-top: 0.9375rem; float: left; color: #888888; font-size: 1.125rem; } section.schedule .accordion-item .accordion-title .title { float: right; font-size: 1.125rem; line-height: normal; font-family: "Poppins", sans-serif; font-weight: 600; text-align: right; margin-top: 0.375rem; color: #888888; } @media print, screen and (max-width: 39.99875em) { section.schedule .accordion-item .accordion-title .title { width: 100%; text-align: left; } } section.schedule .accordion-item .accordion-title[aria-selected='true'] .title { color: #aa076b; } section.schedule .accordion-item .accordion-content { border: none; margin: 0 0 1.25rem 0; padding: 0; } section.schedule .accordion-item .accordion-content p { padding: 0; margin: 0; color: #888888; } section.schedule .accordion-item .accordion-content .avatar { border: none; margin-top: 1.25rem; margin-right: 1.25rem; } section.schedule .accordion-item .accordion-content .avatar img { width: 4rem; height: auto; border-radius: 4rem; border: 0.125rem solid #ccc; } @media print, screen and (max-width: 39.99875em) { section.schedule .accordion-item .accordion-content .avatar img { width: 3rem; } } section.schedule.gradient-a .accordion .accordion-title[aria-selected='true'] .title { background: -webkit-linear-gradient(142deg, #d70027, #7300a5); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } section.schedule.gradient-b .accordion .accordion-title[aria-selected='true'] .title { background: -webkit-linear-gradient(142deg, #2a0845, #6441a5); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } section.schedule.gradient-c .accordion .accordion-title[aria-selected='true'] .title { background: -webkit-linear-gradient(142deg, #0c5b9c, #249bd6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } section.schedule.gradient-d .accordion .accordion-title[aria-selected='true'] .title { background: -webkit-linear-gradient(142deg, #62045f, #aa076b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } /* =================================================================================== /* ===== Features Section ( 4 variations, gray, image-to-left, box-to-right ) ===== */ /*================================================================================= */ section.features.gray { background: #f0f4f7; } section.features .box-to-right .features-box { padding: 1.25rem; } section.features .box-to-right .features-box .section-head { padding: 0.625rem 0; } section.features .box-to-right .features-box p { margin-bottom: 0; } section.features .box-to-right .features-box ul li { list-style: none; color: #888888; font-size: 0.9375rem; } section.features .box-to-right .features-box i { background: transparent; padding: 0 0.625rem 0 0; font-size: 0.75rem; border: none; color: #7300a5; } section.features.image-to-left .section-body p { margin-bottom: 1.25rem; } section.features .section-body { padding: 0; } section.features .section-body h3 { font-size: 0.9375rem; font-weight: 600; } section.features .section-body p { color: #888888; font-size: 0.9375rem; margin-bottom: 2.5rem; } section.features .section-body i { background: #ffffff; border: 0.0625rem solid #7300a5; padding: 0.9375rem; border-radius: 100%; } section.features .section-body.white-color h3 { color: #ffffff; } section.features .section-body.white-color p { color: #ffffff; opacity: 0.75; } section.features .section-body.white-color i { background: #ffffff; opacity: 0.9; } section.features .main-image-right { position: relative; text-align: right; margin-bottom: 3.75rem; /* ===== Tablet ===== */ /* ===== Mobile ===== */; } @media print, screen and (max-width: 63.99875em) { section.features .main-image-right { margin-bottom: 2.5rem; } } section.features .main-image-right img:first-child { width: 75%; height: auto; } section.features .main-image-right img:last-child { position: absolute; bottom: -1.875rem; left: 6.25rem; max-width: 50%; height: auto; } @media print, screen and (max-width: 63.99875em) { section.features .main-image-right img:first-child { width: 90%; margin-top: 3.75rem; } section.features .main-image-right img:last-child { display: none; } } @media print, screen and (max-width: 39.99875em) { section.features .main-image-right img:first-child { width: 100%; margin-top: 1.25rem; } } section.features .main-image-left { position: relative; text-align: left; margin-bottom: 3.75rem; /* ===== Tablet ===== */ /* ===== Mobile ===== */; } @media print, screen and (max-width: 63.99875em) { section.features .main-image-left { margin-bottom: 2.5rem; } } section.features .main-image-left img:first-child { width: 75%; height: auto; } section.features .main-image-left img:last-child { position: absolute; bottom: -1.875rem; right: 6.25rem; max-width: 50%; height: auto; } @media print, screen and (max-width: 63.99875em) { section.features .main-image-left img:first-child { width: 90%; margin-top: 3.75rem; } section.features .main-image-left img:last-child { display: none; } } @media print, screen and (max-width: 39.99875em) { section.features .main-image-left img:first-child { width: 100%; margin-top: 1.25rem; } } section.features .last .main-image-right { margin-bottom: 2.5rem; } section.features .last .main-image-left { margin-bottom: 2.5rem; } section.features h3.title { font-size: 1.375rem; font-weight: normal; } @media print, screen and (max-width: 63.99875em) { section.features h3.title { font-size: 1rem; } } section.features .icon-holder i, section.features .icon-holder object { width: 4.6875rem; height: 4.6875rem; text-align: center; font-size: 2rem; padding-top: 1.5625rem; border: none; margin-bottom: 2.5rem; } @media print, screen and (max-width: 63.99875em) { section.features .icon-holder i { font-size: 1.25rem; width: 2.8125rem; height: 2.8125rem; padding-top: 0.9375rem; } } @media print, screen and (max-width: 63.99875em) { section.features .section-body i { margin-bottom: 1.25rem; } } /* ========================================================================== /* ===== Footer ===== */ /*========================================================================== */ .site-footer { padding-top: 3.75rem; padding-bottom: 3.75rem; color: #F8F8FF; /* ===== White color for text, used when the Footer is dark ===== */; } .site-footer .textwidget, .site-footer p { color: #F8F8FF; font-size: 0.875rem; } .site-footer.gray { background: #004DB8; } .site-footer.black { background: #000000; } .site-footer h4 { border-bottom: 0.0625rem solid #ccc; text-transform: uppercase; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 0.9375rem; margin-bottom: 1.25rem; padding-bottom: 1.25rem; } .site-footer .menu li { display: block; } .site-footer .menu li a { color: #F8F8FF; margin: 0 0 0.625rem 0; padding: 0; font-size: 0.9375rem; } .site-footer .menu li a.is-active { color: #000000; } .site-footer .menu li:hover { text-decoration: underline; } .site-footer .copy { margin-top: 1.25rem; } .site-footer.white-text-color h4, .site-footer.white-text-color li, .site-footer.white-text-color p, .site-footer.white-text-color .menu li a, .site-footer.white-text-color .textwidget, .site-footer.white-text-color a { color: #ffffff; } /* ========================================================================== /* ===== Forms ===== */ /*========================================================================== */ section .mailchimp-form .email { padding: 1.25rem 0.625rem !important; height: 3.5rem; } section .mailchimp-form button { height: 3.5rem; margin-bottom: 0; border-top-right-radius: 0.25rem !important; border-bottom-right-radius: 0.25rem !important; } section .mailchimp-form .input-group-label { border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } /* ========================================================================== /* ===== Book Appointment Section ===== */ /*========================================================================== */ section.book-appointment { padding-bottom: 2.5rem; } section.book-appointment .section-head { padding: 5rem 3.75rem 3.75rem 3.75rem; } section.book-appointment .section-body { margin: 0 auto; padding-bottom: 3.75rem; } @media print, screen and (max-width: 39.99875em) { section.book-appointment .section-body { padding-left: 2.5rem; padding-right: 2.5rem; } } section.book-appointment p { margin-bottom: 0.3125rem; } section.book-appointment input, section.book-appointment textarea, section.book-appointment select { font-size: 0.9375rem; color: #888888; background: #f9f9f9; } section.book-appointment.gray { background: #f0f4f7; } /* ========================================================================== /* ===== General Section Styles ===== */ /*========================================================================== */ section { margin: 0; padding: 0; } section .inner-padding { padding-top: 5rem; padding-bottom: 5rem; } @media print, screen and (max-width: 63.99875em) { section .inner-padding { padding-top: 2.5rem; padding-bottom: 2.5rem; } } section .inner-padding-top { padding-top: 5rem; } @media print, screen and (max-width: 63.99875em) { section .inner-padding-top { padding-top: 2.5rem; } } section .section-head { padding: 0 0 2.5rem 0; } section .section-head .section-title { margin-top: 0; color: #004DB8; } .section-head > h1 { color: #004DB8; } section .section-head.animate { -webkit-animation-name: scale-1-to-0; animation-name: scale-1-to-0; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; } @-webkit-keyframes scale-1-to-0 { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes scale-1-to-0 { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); } } section .section-body { padding: 0 4.6875rem; } section .section-footer { padding: 3.75rem 4.6875rem; } section.white-color .section-title, section .white-color .section-title { color: #ffffff; } section.white-color .section-head-actions, section .white-color .section-head-actions { color: #ffffff; opacity: 0.75; font-size: 1.125rem; } .section-head-actions { color: #8B8DB9; } section.white-color .section-head-actions p, section.white-color .section-head-actions h1, section.white-color .section-head-actions h2, section.white-color .section-head-actions h3, section.white-color .section-head-actions h4, section.white-color .section-head-actions h5, section.white-color .section-head-actions h6, section.white-color .section-head-actions strong, section .white-color .section-head-actions p, section .white-color .section-head-actions h1, section .white-color .section-head-actions h2, section .white-color .section-head-actions h3, section .white-color .section-head-actions h4, section .white-color .section-head-actions h5, section .white-color .section-head-actions h6, section .white-color .section-head-actions strong { color: #ffffff; opacity: 0.75; } section.white-color .section-body, section .white-color .section-body { color: #ffffff; opacity: 0.95; } section.white-color .section-body p, section.white-color .section-body i, section .white-color .section-body p, section .white-color .section-body i { color: #ffffff; opacity: 0.95; } section.white-color form p, section .white-color form p { color: #ffffff; opacity: 0.95; } section.gray { background: #F8F8FF; } section .margin-bottom { margin-bottom: 1.875rem; } section .docs_section { margin-bottom: 40px; padding-bottom: 20px; border-bottom: 1px solid #f3f3f3; } section .docs_section pre { -moz-tab-size: 1; -o-tab-size: 1; tab-size: 1; } section .docs_section .hljs { background: #f3f3f3; } section .docs_section pre small { color: #249bd6; } section .docs_section pre small a { text-decoration: underline; } /* ========================================================================== /* ===== Toolbar ===== */ /*========================================================================== */ #toolbar { margin: 0.625rem 0; } #toolbar p { margin: 0; color: #333333; } #toolbar a { font-size: 1.125rem; } @media print, screen and (max-width: 39.99875em) { #toolbar p { text-align: center; } } /* ========================================================================== /* ===== Header ===== */ /*========================================================================== */ section.teaser { background-size: cover; background-position: center; } section.teaser .teaser-content { color: #ffffff; } section.teaser .teaser-content h1 { font-size: 3.75rem; font-weight: 700; } section.teaser .teaser-content h2 { font-size: 1.25rem; } section.teaser .teaser-content h3 { font-size: 1.25rem; font-weight: 600; } @media print, screen and (max-width: 63.99875em) { section.teaser .teaser-content h1 { font-size: 1.75rem; font-weight: 700; } section.teaser .teaser-content h2 { font-size: 0.75rem; } } section.teaser .bottom-cell { background: #f0f4f7; } section.teaser .bottom-cell h1 { color: #000000; padding: 2.5rem 0 0.625rem 0; } section.teaser .bottom-cell i { font-size: 2rem; } @media print, screen and (max-width: 63.99875em) { section.teaser .bottom-cell h1 { font-size: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { section.teaser .bottom-cell h1 { font-size: 1rem; } } section.teaser #typed { text-decoration: underline; font-weight: 700; } .home-page-hero { position: relative; height: 100vh; min-height: 37.5rem; background-size: cover; background-position: center; color: white; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: distribute; justify-content: space-around; padding: 5rem 0.625rem 0 0.625rem; /* ===== Small Only ===== */; } .home-page-hero.bottom-edge { position: relative; } .home-page-hero.bottom-edge::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 65' fill='rgb(240,244,247)' fill-opacity='1'%3E%3Cpolygon points='0,65 100,65 100,0'%3E%3C/polygon%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; height: 65px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; bottom: 0; } .home-page-hero.video-bg { overflow: hidden; } .home-page-hero.video-bg .video-foreground, .home-page-hero.video-bg .video-background iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; } .home-page-hero.video-bg .vid-info a { display: block; color: #ffffff; text-decoration: none; background: rgba(0, 0, 0, 0.5); -webkit-transition: .6s background; transition: .6s background; border-bottom: none; margin: 1rem auto; text-align: center; } @media (min-aspect-ratio: 16 / 9) { .home-page-hero.video-bg .video-foreground { height: 300%; top: -100%; } } @media (max-aspect-ratio: 16 / 9) { .home-page-hero.video-bg .video-foreground { width: 300%; left: -100%; } } .home-page-hero .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .home-page-hero h1 { font-size: 2rem; } .home-page-hero .heading.twentyfiveHeight { padding-top: 20vh; } .home-page-hero .heading.fiftyHeight { padding-top: 35vh; } .home-page-hero .heading.seventyfiveHeight { padding-top: 55vh; } .home-page-hero .heading h1 { font-size: 3.75rem; font-weight: 700; } .home-page-hero .heading h2 { font-size: 1.25rem; } .home-page-hero .action { position: absolute; bottom: 7.5rem; left: 0; display: block; width: 100%; } .home-page-hero .action h3 { font-size: 1.25rem; font-weight: 600; } .home-page-hero .action P { color: #ffffff; } .home-page-hero .action .scroll-down { animation-name: pulse; -webkit-animation-name: pulse; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; cursor: pointer; font-size: 3rem; text-align: center; } .home-page-hero .action .scroll-down a { color: #ffffff; } @media print, screen and (max-width: 63.99875em) { .home-page-hero .heading h1 { font-size: 1.75rem; font-weight: 700; } .home-page-hero .heading h2 { font-size: 0.75rem; } .home-page-hero .action { bottom: 5rem; } .home-page-hero .action p { display: none; } .home-page-hero .action h3 { text-align: center; } } @media print, screen and (max-width: 39.99875em) { .home-page-hero .action h3 { font-size: 0.875rem; } } @media screen and (max-width: 63.99875em) and (orientation: landscape) { .home-page-hero { min-height: 28.125rem; } } /* ========================================================================== /* ===== Slider Intro ===== */ /*========================================================================== */ .no-js .slider-intro { display: none; } .slider-intro { position: relative; clear: both; } .slider-intro .slider-actions { position: absolute; z-index: 8; left: 0; top: 50%; width: 100%; } .slider-intro .owl-prev, .slider-intro .owl-next { position: absolute; top: -1.0625rem; width: 2.5rem; cursor: pointer; font-size: 1.5rem; color: #ffffff; text-align: center; } .slider-intro .owl-prev, .slider-intro .owl-next { -webkit-transition: color .2s ease-out; transition: color .2s ease-out; } .slider-intro .owl-prev:hover, .slider-intro .owl-next:hover { color: #f0f4f7; } .slider-intro .owl-prev { left: 1.875rem; } .slider-intro .owl-next { right: 1.875rem; } .slider-intro .slides { list-style: none outside none; margin: 0; padding: 0; } .slider-intro .slide-alt { position: relative; /*min-height: 80vh; */; } .slider-intro .slide-alt.fiftyHeight { padding-top: 50vh; } .slider-intro .slide-alt.seventyfiveHeight { /*padding-top: 75vh;*/ padding-top: 700px; } .slider-intro .slide-alt.fullHeight { padding-top: 100vh; } .slider-intro .slide-alt .slide-image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .slider-intro .slide-alt .slide-image .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; -webkit-transition: .5s ease; transition: .5s ease; z-index: 0; } .slider-intro .slide-alt .slide-content { position: absolute; left: 0; top: 50%; width: 100%; } .slider-intro .slide-alt .slide-content { -webkit-transform: translateY(-50%); transform: translateY(-50%); } .slider-intro .slide-alt .slide-content .slide-content-inner { max-width: 31.25rem; padding: 2.5rem; background: #ffffff; color: #ffffff; } .slider-intro .slide-alt .slide-content p { margin-bottom: 1.375rem; color: #888888; font-size: 1rem; } .slider-intro .slide-alt .slide-title { font-size: 1.75rem; font-weight: 600; color: #333333; line-height: 1.3; } .slider-intro .active .slide-alt .slide-content .slide-content-inner { -webkit-animation-name: slide-in-down-120; animation-name: slide-in-down-120; -webkit-animation-duration: 1s; animation-duration: 1s; } @-webkit-keyframes slide-in-down-120 { 0% { -webkit-transform: translateY(-120%); transform: translateY(-120%); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slide-in-down-120 { 0% { -webkit-transform: translateY(-120%); transform: translateY(-120%); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @media print, screen and (max-width: 63.99875em) { .slider-intro .slide-alt.fiftyHeight { padding-top: 20vh; } .slider-intro .slide-alt.seventyfiveHeight { padding-top: 35vh; } .slider-intro .slide-alt.fullHeight { padding-top: 100vh; } } @media screen and (orientation: landscape) and (min-width: 40em) { .slider-intro .slide-alt { min-height: 25rem; } .slider-intro .slide-alt .slide-content .slide-content-inner { margin: 0; } } @media print, screen and (max-width: 39.99875em) { .slider-intro .owl-prev { left: 0.625rem; width: auto; font-size: 1.125rem; } .slider-intro .owl-next { right: 0.625rem; width: auto; font-size: 1.125rem; } .slider-intro .slide-alt.fiftyHeight { padding-top: 20vh; } .slider-intro .slide-alt.seventyfiveHeight { padding-top: 35vh; } .slider-intro .slide-alt.fullHeight { padding-top: 100vh; } .slider-intro .slide-alt .slide-title { font-size: 1.125rem; } .slider-intro .slide-alt .slide-content p { font-size: 0.9375rem; } } /* ========================================================================== /* ===== Menus ===== */ /*========================================================================== */ svg * { fill: none; stroke: currentColor; } svg #Black path { stroke: #d31027 !important; } .no-js #masthead { display: none; } /* ===== Header menu ===== */ .position-absolute { position: absolute !important; z-index: 99; width: 100%; } .position-relative { z-index: 99; width: 100%; } #masthead.border-bottom-white { border-bottom: 0.0625rem solid rgba(255, 255, 255, 0.2); } #masthead #top-bar-attitude { padding-top: 1.25rem; } #masthead #top-bar-attitude .title-bars { cursor: pointer; } #masthead #top-bar-attitude h1 a { color: #ffffff; font-size: 1.75rem; } #masthead #top-bar-attitude .title-bars { margin-top: 0.625rem; margin-right: 0.625rem; } #masthead #top-bar-attitude .title-bars i { color: #ffffff; } #masthead #top-bar-attitude.border-bottom { border-bottom: 0.0625rem solid rgba(255, 255, 255, 0.3); } #masthead #top-bar-attitude .action-button { padding-left: 0.625rem; padding-right: 0.625rem; } #masthead #top-bar-attitude .social-links { margin-top: 0.625rem; } #masthead #top-bar-attitude .social-links > a { color: #ffffff; padding: 0 0.3125rem; } #masthead #top-bar-attitude .social-links > a:hover { color: #333333; } .primary { position: relative; } /* Normal Logo Navigation */ #top-main-menu { float: right; margin-top: 0.3125rem; } #top-main-menu.dropdown > li { position: relative; } #top-main-menu.dropdown > li > a { background: none; font-size: 1rem; color: #8B8DB9; } .site-header { background-color: #F8F8FF; box-shadow: 0 1px 2px 0 rgb(60 64 67 / 30%), 0 2px 6px 2px rgb(60 64 67 / 15%) !important; } #top-main-menu.dropdown > li > a:hover { color: #004DB8; cursor: pointer; } #top-main-menu.dropdown > li > a:after { border-top-color: #8B8DB9; right: 0.625rem; border-top-style: solid; border-top-width: 0.25rem; border-right-color: transparent; border-right-style: inset; border-right-width: 0.25rem; border-bottom-color: transparent; border-bottom-style: inset; border-bottom-width: 0; border-left-color: transparent; border-left-style: inset; border-left-width: 0.25rem; border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; } #top-main-menu.dropdown > li:hover > a:after, #top-main-menu.dropdown > li:focus > a:after { border-top-color: #004DB8; } #top-main-menu.dropdown > li > a:before { position: absolute; width: 1.5625rem; height: 0.125rem; background: #004DB8; content: ''; margin-top: -0.125rem; opacity: 0; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, transform 0.3s; transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s; -webkit-transform: translateY(-1.875rem); transform: translateY(-1.875rem); } #top-main-menu.dropdown > li > a.is-active { font-weight: bold; } #top-main-menu.dropdown > li:hover a:before, #top-main-menu.dropdown > li:focus a:before { opacity: 1; -webkit-transform: translateY(-0.625rem); transform: translateY(-0.625rem); } #top-main-menu.dropdown > li .is-dropdown-submenu { min-width: 13.75rem; padding: 1.5rem; border: none; } #top-main-menu.dropdown > li .is-dropdown-submenu li { padding: 0; } #top-main-menu.dropdown > li .is-dropdown-submenu li a { font-size: 0.9375rem; color: #8B8DB9; padding: 0.375rem 0; } #top-main-menu.dropdown > li .is-dropdown-submenu li a:hover { color: #004DB8 !important; } #top-main-menu.dropdown > li .is-dropdown-submenu li a.is-active { display: inline-block; color: #000000; border-bottom: 0.0625rem solid #000000; } #top-main-menu.dropdown > li .is-dropdown-submenu .is-active > a { background: none; } #top-main-menu.dropdown > li .is-dropdown-submenu .opens-right > a::after { border-top-color: transparent; border-top-style: inset; border-top-width: 0.25rem; border-right-color: transparent; border-right-style: inset; border-right-width: 0; border-bottom-color: transparent; border-bottom-style: inset; border-bottom-width: 0.25rem; border-left-color: #888888; border-left-style: solid; border-left-width: 0.25rem; border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; top: 1.125rem; } #top-main-menu.dropdown > li .is-dropdown-submenu .opens-left > a::after { border-color: transparent transparent transparent transparent; } #top-main-menu.accordion-menu { float: none; position: relative; padding: 0.9375rem; background: #ffffff; margin-bottom: 0.6875rem; border-radius: 0.25rem; } #top-main-menu.accordion-menu li a { padding: 0.3125rem 0; color: #888888; } #top-main-menu.accordion-menu li a.is-active { display: inline-block; color: #000000; border-bottom: 0.0625rem solid #000000; } #top-main-menu.accordion-menu li .is-accordion-submenu { background: none; padding-left: 0.625rem; } #top-main-menu.accordion-menu li .is-accordion-submenu.shadow { -webkit-box-shadow: none; box-shadow: none; } .docs_menu ul { margin: 0; padding: 0; } .docs_menu ul ul { margin-left: 1.0625rem; border-left: 1px solid #f03774; } .docs_menu ul li { list-style: none; } .docs_menu ul li a { font-size: 0.9375rem; color: #f03774; padding-top: 0.625rem; padding-bottom: 0.625rem; } .docs_menu ul li a.is-active { font-weight: bold; background: linear-gradient(142deg, #d70027, #7300a5); color: #ffffff; } /* ========================================================================== /* ===== Price Table ===== */ /*========================================================================== */ section.price .section-body { padding: 0; } section.price .section-body .footer { border-top: 0.0625rem solid #ccc; padding: 2.5rem 3.75rem; color: #888888; } section.price .section-body .footer .lead { color: #333333; } section.price .section-body .icon i { margin-bottom: 0.625rem; } section.price .pricing-table { text-align: center; list-style: none; padding: 1.5625rem 0; margin: 0; } section.price .pricing-table img { -webkit-filter: grayscale(1); filter: grayscale(1); } section.price .pricing-table:hover img { -webkit-filter: grayscale(0.1); filter: grayscale(0.1); cursor: pointer; } section.price .pricing-table.no-padding-top { padding-top: 0; } section.price .pricing-table.no-padding-top.popular { padding-bottom: 2.8125rem; } @media print, screen and (max-width: 63.99875em) { section.price .pricing-table.no-padding-top { margin-bottom: 2.5rem; } } section.price .pricing-table.right-shadow { -webkit-box-shadow: 0.0625rem 0 0 0 rgba(0, 0, 0, 0.1); box-shadow: 0.0625rem 0 0 0 rgba(0, 0, 0, 0.1); } section.price .pricing-table .price { font-size: 2.75rem; font-weight: 700; padding: 0; color: #333333; } section.price .pricing-table .price sup { font-size: 1.5rem; color: #333333; font-weight: normal; } section.price .pricing-table .price sub { font-size: 1rem; color: #333333; font-weight: normal; } section.price .pricing-table .title { text-transform: uppercase; color: #ffffff; padding: 1.25rem 0; font-weight: 700; font-size: 1.1875rem; } section.price .pricing-table .description { padding: 1.25rem; color: #888888; } section.price .pricing-table li { padding: 0 0 0.625rem 0; color: #888888; } section.price .popular { margin-top: -0.625rem; padding-top: 2.1875rem; border: none; margin-bottom: -0.625rem; padding-bottom: 2.1875rem; } /* ========================================================================== /* ===== Team Section ===== */ /*========================================================================== */ .no-js section.team { display: none; } section.team.gray { background: #f0f4f7; } .team-container .item { position: relative; /* Hover */; } .team-container .item a img { width: 100%; height: auto; } .team-container .item .no-image { width: 100%; min-height: 17.5rem; /*background: #f1f1f1;*/ } .team-container .item .info { position: absolute; bottom: 0; width: 100%; } .team-container .item .info .inner { margin: 0.3125rem; background: #ffffff; position: relative; } .team-container .item .info .inner .avatar { position: absolute; top: -1.875rem; width: 100%; } .team-container .item .info .inner .avatar .avatar-inner { width: 3.75rem; margin: 0 auto; position: relative; } .team-container .item .info .inner .avatar .avatar-inner img { border-radius: 100%; border: 0.0625rem solid #7300a5; } .team-container .item .info .inner .avatar .avatar-inner .icon { border-radius: 100%; border: 0.0625rem solid #ffffff; width: 3.75rem; height: 3.75rem; } .team-container .item .info .inner .avatar .avatar-inner .icon i { margin-top: 1.125rem; color: #ffffff; font-size: 1.25rem; } .team-container .item .info .inner .avatar .avatar-inner .overlay { display: none; } .team-container .item .info .inner .avatar .avatar-inner .overlay i { color: #ffffff; margin-top: 1rem; font-size: 1.75rem; } .team-container .item .info .inner .name { font-size: 1.125rem; font-weight: 500; padding-top: 3.125rem; margin-bottom: 0.3125rem; } .team-container .item .info .inner .name a { color: #000000; } .team-container .item .info .inner .name a:hover { text-decoration: underline; } .team-container .item .info .inner .name.no-icon { padding-top: 1.25rem; } .team-container .item .info .inner .location { font-size: 0.9375rem; margin-bottom: 1.25rem; color: #888888; } .team-container .item .info .inner .social-links { border-top: 0.0625rem solid #ccc; padding: 0.625rem 0; } .team-container .item .info .inner .social-links i { color: #888888; font-size: 1rem; margin: 0.3125rem; cursor: pointer; } .team-container .item .info .inner .social-links i.fa-facebook-square:hover { color: #3b5998; } .team-container .item .info .inner .social-links i.fa-twitter:hover { color: #1da1f2; } .team-container .item .info .inner .social-links i.fa-instagram:hover { color: #e1306c; } .team-container .item .info .inner .social-links i.fa-pinterest:hover { color: #bd081c; } .team-container .item .info .inner .social-links i.fa-linkedin:hover { color: #0077b5; } .team-container .item:hover img { /*cursor: ew-resize;*/; } .team-container .item:hover .info .avatar .avatar-inner .overlay { display: block; position: absolute; top: 0; left: 0; border-radius: 3.75rem; width: 100%; height: 100%; } /* ========================================================================== /* ===== Testimonials Section ===== */ /*========================================================================== */ section.testimonials .owl-carousel-testimonials .item { margin: 0.9375rem; } section.testimonials .owl-carousel-testimonials .item .testimonial-inner { padding: 1.25rem 0.9375rem; } section.testimonials .owl-carousel-testimonials .item .testimonial-inner img { width: 75%; max-width: 3.75rem; height: auto; border: 0.0625rem solid #7300a5; border-radius: 100%; } section.testimonials .owl-carousel-testimonials .item .testimonial-inner .testimonial-body { width: 75%; padding-left: 1.25rem; } section.testimonials .owl-carousel-testimonials .item .testimonial-inner .testimonial-body .client { font-size: 0.9375rem; font-weight: 600; font-family: "Poppins", sans-serif; } section.testimonials .owl-carousel-testimonials .item .testimonial-inner .testimonial-body .testimonial p { color: #888888; font-size: 0.9375rem; padding: 0; margin: 0; } section.testimonials .owl-carousel-testimonials .item:hover .testimonial-inner { -webkit-box-shadow: 0 0 1.25rem 0.125rem rgba(0, 0, 0, 0.1); box-shadow: 0 0 1.25rem 0.125rem rgba(0, 0, 0, 0.1); background: #ffffff; cursor: ew-resize; } section.testimonials .owl-carousel-testimonials.white-color .item .testimonial-inner .testimonial-body .client { color: #ffffff; } section.testimonials .owl-carousel-testimonials.white-color .item .testimonial-inner .testimonial-body .testimonial p { color: #ffffff; opacity: 0.75; } section.testimonials .owl-carousel-testimonials.white-color .item:hover .testimonial-inner .testimonial-body .client { color: #000000; } section.testimonials .owl-carousel-testimonials.white-color .item:hover .testimonial-inner .testimonial-body .testimonial p { color: #888888; } section.testimonials.gray { background: #f0f4f7; } /* =================================================================================== /* ===== Venue Section ===== */ /*================================================================================= */ section.venue .section-body { padding: 0; } section.venue .section-body .venue-address, section.venue .section-body .venue-phone, section.venue .section-body .venue-transport, section.venue .section-body .venue-social { text-transform: uppercase; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 0.8125rem; color: #004db8; } section.venue .section-body p { text-align: right; } @media print, screen and (max-width: 63.99875em) { section.venue .section-body p { text-align: left; } } section.venue .section-body i.fa-circle { color: rgba(255, 255, 255, 0.2); } section.venue .section-body i.fa-facebook-square:hover { color: #3b5998; } section.venue .section-body i.fa-twitter:hover { color: #1da1f2; } section.venue .section-body i.fa-pinterest:hover { color: #bd081c; } section.venue .section-body i.fa-instagram:hover { color: #e1306c; } @media print, screen and (max-width: 63.99875em) { section.venue .section-body .map { margin-top: 1.25rem; } } section.venue .section-body.white-color .venue-address, section.venue .section-body.white-color .venue-phone, section.venue .section-body.white-color .venue-transport, section.venue .section-body.white-color .venue-social { color: #ffffff; } section.venue .section-body.white-color p { color: #ffffff; } section.venue .section-body.white-color p a { color: #ffffff; text-decoration: underline; } /* ========================================================================== /* ===== Welcome Section ===== */ /*========================================================================== */ section.welcome { z-index: 1; position: relative; background: #f0f4f7; padding-top: 6.25rem; /* ===== Small only ===== */; } section.welcome .top-negative { margin-top: -12.5rem; margin-bottom: 2.25rem; } section.welcome .section-head { padding: 3.75rem 4.375rem; } section.welcome .section-head .section-head-actions { margin-top: 1.25rem; font-size: 1.125rem; color: #888888; } section.welcome .section-head .section-head-actions .project-details { margin-top: 3.75rem; } @media print, screen and (max-width: 63.99875em) { section.welcome .section-head { padding: 3.75rem 2.5rem; } section.welcome .section-head .section-head-actions { font-size: 1rem; } } section.welcome .section-body h4 { font-size: 7.9375rem; font-weight: 600; } section.welcome .section-body p { color: #888888; font-size: 1.5em; } @media print, screen and (max-width: 63.99875em) { section.welcome .section-body { padding: 0 2.5rem; } } section.welcome .section-footer p { color: #888888; } @media print, screen and (max-width: 63.99875em) { section.welcome .section-footer { padding: 0 2.5rem 2.5rem 2.5rem; } } section.welcome hr { margin: 3.75rem 4.6875rem 0 4.6875rem; } @media print, screen and (max-width: 63.99875em) { section.welcome hr { margin: 2.5rem; } } @media print, screen and (max-width: 39.99875em) { section.welcome .radius.shadow { margin-top: -3.75rem; } } /* ========================================================================== /* ===== Welcome Style one ===== */ /*========================================================================== */ section.welcome-style-one { background: #ffffff; padding-top: 10rem; padding-bottom: 5.75rem; /* ===== Accordeon ===== */; } section.welcome-style-one .section-head { padding: 5rem 3.75rem 3.75rem 3.75rem; } section.welcome-style-one .section-body { margin-bottom: 3.75rem; } @media print, screen and (max-width: 63.99875em) { section.welcome-style-one .section-body { padding: 2.5rem; } section.welcome-style-one .section-body .team-container { margin-bottom: 2.5rem; } } section.welcome-style-one .accordion li.accordion-item { margin-bottom: 0.625rem; border: 0 solid #ccc; } section.welcome-style-one .accordion li.accordion-item .accordion-title { color: #004db8; font-size: 1rem; border: 0.125rem solid #f3f3f3; font-family: "Poppins", sans-serif; font-weight: 400; } section.welcome-style-one .accordion li.accordion-item .accordion-title[aria-expanded='true'] { border-color: #004db8; } section.welcome-style-one .accordion li.accordion-item .accordion-title:before { font-size: 1.5rem; } section.welcome-style-one .accordion li.accordion-item .accordion-title:hover { background: none; border-color: #8B8DB9; } section.welcome-style-one .accordion li.accordion-item .accordion-title:focus { background: none; } section.welcome-style-one .accordion li.accordion-item .accordion-content { border: 0; } section.welcome-style-one .accordion li.accordion-item .accordion-content p { margin-bottom: 0; } section.welcome-style-one.gray { background: #F8F8FF; } /* ========================================================================== /* ===== Blog Posts ===== */ /*========================================================================== */ .blog-list-section { /* ===== When the post elements are Vertically aligned ===== */; } .blog-list-section.gray { background: #f0f4f7; } .blog-list-section .owl-carousel-post article { margin: 0.9375rem; } .blog-list-section .blog-list { margin: 6.25rem 0 0 0; } .blog-list-section article { background: #ffffff; margin-bottom: 1.875rem; } .blog-list-section .post-image img { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .blog-list-section .post-body { margin: 1.25rem; } .blog-list-section .post-body .post-title { font-size: 1.125rem; } .blog-list-section .post-meta { padding-bottom: 0.0625rem; padding-left: 1.25rem; padding-right: 1.25rem; } .blog-list-section .post-meta ul { margin-left: 0; } .blog-list-section .post-meta li { font-size: 0.875rem; display: inline-block; color: #546e7a; } .blog-list-section .format-quote { min-height: 18.75rem; position: relative; } .blog-list-section .format-quote.gray { background: #f0f4f7; } .blog-list-section .format-quote.black { background: #333333; } .blog-list-section .format-quote blockquote { position: absolute; bottom: 0; border: 0; font-size: 1.375rem; margin: 0 10% 10% 10%; } .blog-list-section .format-image { background-size: cover; background-position: 0 0; position: relative; min-height: 18.75rem; } .blog-list-section .format-image p, .blog-list-section .format-image a { color: #ffffff; } .blog-list-section .format-image .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .blog-list-section .format-image .post-body { position: absolute; bottom: 1.25rem; } .blog-list-section .format-image .post-meta { position: absolute; bottom: 0; } .blog-list-section .format-image .post-meta li { font-size: 0.875rem; display: inline-block; color: #ffffff; } .blog-list-section .format-image .post-meta li i { margin-right: 0.3125rem; } .blog-list-section.vertical-post .post-image img { border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0.3125rem; } @media print, screen and (max-width: 63.99875em) { .blog-list-section.vertical-post .post-image img { border-top-right-radius: 0.3125rem; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } } .blog-list-section.vertical-post .responsive-embed { margin-bottom: 0; } .blog-list-section.vertical-post .large-order-2 .post-image img { border-top-right-radius: 0.3125rem; border-top-left-radius: 0; border-bottom-right-radius: 0.3125rem; border-bottom-left-radius: 0; } @media print, screen and (max-width: 63.99875em) { .blog-list-section.vertical-post .large-order-2 .post-image img { border-top-right-radius: 0.3125rem; border-bottom-right-radius: 0; border-top-left-radius: 0.3125rem; } } /* ========================================================================== /* ===== Single Post ===== */ /*========================================================================== */ article.single-post-article { /* ===== Article body ===== */; } article.single-post-article .publication-date { color: #ffffff; } article.single-post-article h3.category { text-transform: uppercase; font-size: 0.875rem; } article.single-post-article .author { margin-top: 1.5625rem; } article.single-post-article .author img { border-radius: 100%; width: 3.4375rem; height: auto; } article.single-post-article .author span { border-bottom: none; } article.single-post-article .share-buttons { text-align: center; margin: 2.5rem 0; } article.single-post-article .share-buttons ul { margin: 0; } article.single-post-article .share-buttons li { list-style: none; display: inline-block; margin: 0 0.625rem; font-size: 1.125rem; } article.single-post-article .share-buttons li > a { color: #ffffff; } article.single-post-article .share-buttons li > a:hover { color: #333333; } article.single-post-article .article-body { color: #333333; margin: 6.25rem 0; } article.single-post-article .article-body blockquote { font-size: 1.125rem; font-style: italic; } /* ===== Article Sidebar ===== */ .widget-area { color: #333333; margin-top: 6.25rem; margin-bottom: 6.25rem; } /* ========================================================================== /* ===== Widgets ===== */ /*========================================================================== */ .widget-area .widget_text .textwidget, .widget-area .widget_text p { color: #546e7a; } .widget-area .widget-title { text-transform: uppercase; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 0.9375rem; margin-top: 2.5rem; } .widget-area ul { margin: 0; padding: 0; } .widget-area ul li { list-style: none; } .widget-area ul li > a { border-bottom: 0.0625rem solid #ccc; display: block; margin-bottom: 0.3125rem; padding-bottom: 0.3125rem; padding-left: 0.3125rem; } .widget-area ul li > ul { margin-left: 0.625rem; } /* ===== Social Widget ===== */ .social_widget .social-links > a { font-size: 1.375rem; color: #F8F8FF; padding: 0 0.3125rem; -webkit-transition: .2s ease-in-out; transition: .2s ease-in-out; } .social_widget .social-links > a:hover, .social_widget .social-links > a:focus { color: #fff; transform: scale(1.2); } .designby > a { color: #EA4C5F; } .designby > a:hover, .designby > a:focus { color: #BE002A; } .white-text-color .social_widget .social-links > a { color: #ffffff; padding: 0 0.3125rem; } .white-text-color .social_widget .social-links > a:hover { color: #333333; } /* ========================================================================== /* ===== Projects List ===== */ /*========================================================================== */ .project-item { /* ========================================================================== /* ===== Projects Section ===== */ /*========================================================================== */; } .project-item.margin-bottom { margin-bottom: 1.875rem; } .project-item figure.effect-project { position: relative; overflow: hidden; } .project-item figure.effect-project img { max-width: 100%; -webkit-transition: all 0.3s; transition: all 0.3s; } .project-item figcaption { opacity: 0; position: absolute; top: 0; width: 100%; height: 100%; -webkit-transition: all 0.2s ease-in-out 0.1s; transition: all 0.2s ease-in-out 0.1s; -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); } .project-item:hover figcaption, .project-item:focus figcaption, .project-item:active figcaption { opacity: 0.98; -webkit-transform: translateZ(12.5rem); transform: translateZ(12.5rem); } .project-item:hover img { -webkit-transform: scale(1.1); transform: scale(1.1); } .project-item .description { background: #ffffff; padding: 1.25rem; margin-bottom: 1.25rem; } .project-item h2 { font-size: 1.25rem; } .project-item p { margin: 0; } .project-item .gradient-a h2 { color: #d70027; } .project-item .gradient-b h2 { color: #2a0845; } .project-item .gradient-c h2 { color: #0c5b9c; } .project-item .gradient-d h2 { color: #62045f; } .project-item .gradient-e h2 { color: #136a8a; } .project-item .gradient-f h2 { color: #6859de; } .project-item .gradient-g h2 { color: #fc4a1a; } .project-item .gradient-h h2 { color: #d31027; } .project-item .gradient-i h2 { color: #16a085; } .project-item .gradient-j h2 { color: black; } /* ========================================================================== /* ===== Single Project ===== */ /*========================================================================== */ .single-project { margin: 6.25rem 0; } .single-project .fresco img { margin-bottom: 2.5rem; } /* ========================================================================== /* ===== Fresco ===== */ /*========================================================================== */ .fr-window, .fr-window [class^="fr-"], .fr-overlay, .fr-overlay [class^="fr-"], .fr-spinner, .fr-spinner [class^="fr-"] { -webkit-box-sizing: border-box; box-sizing: border-box; } .fr-window { position: fixed; width: 100%; height: 100%; top: 0; left: 0; font: 13px/20px "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, sans-serif; /* Chrome hack, this fixes a visual glitch when quickly toggling a video */ -webkit-transform: translateZ(0px); transform: translateZ(0px); } /* z-index */ .fr-overlay { z-index: 99998; } .fr-window { z-index: 99999; } .fr-spinner { z-index: 100000; } /* overlay */ .fr-overlay { position: fixed; top: 0; left: 0; height: 100%; width: 100%; } .fr-overlay-background { float: left; width: 100%; height: 100%; background: #000; opacity: .9; filter: alpha(opacity=90); } .fr-overlay-ui-fullclick .fr-overlay-background { background: #292929; opacity: 1; filter: alpha(opacity=100); } /* mobile touch has position:absolute to allow zooming */ .fr-window.fr-mobile-touch, .fr-overlay.fr-mobile-touch { position: absolute; overflow: visible; } /* some properties on the window are used to toggle things * like margin and the fullclick mode, * we reset those properties after measuring them */ .fr-measured { margin: 0 !important; min-width: 0 !important; min-height: 0 !important; } .fr-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .fr-pages { position: absolute; width: 100%; height: 100%; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fr-page { position: absolute; width: 100%; height: 100%; } .fr-container { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: 0; padding: 0; text-align: center; } .fr-hovering-clickable .fr-container { cursor: pointer; } /* padding: youtube & vimeo always have buttons on the outside side button = 72 = 54 + (2 * 9 margin) close button = 48 */ /* padding ui:inside */ .fr-ui-inside .fr-container { padding: 20px 20px; } .fr-ui-inside.fr-no-sides .fr-container { padding: 20px; } /* padding ui:outside */ .fr-ui-outside .fr-container { padding: 20px 82px; } .fr-ui-outside.fr-no-sides .fr-container { padding: 20px 48px; } /* reduce padding on smaller screens */ @media all and (max-width: 700px) and (orientation: portrait), all and (orientation: landscape) and (max-height: 700px) { /* padding ui:inside */ .fr-ui-inside .fr-container { padding: 12px 12px; } .fr-ui-inside.fr-no-sides .fr-container { padding: 12px; } /* padding ui:outside */ .fr-ui-outside .fr-container { padding: 12px 72px; } .fr-ui-outside.fr-no-sides .fr-container { padding: 12px 48px; } } @media all and (max-width: 500px) and (orientation: portrait), all and (orientation: landscape) and (max-height: 500px) { /* padding ui:inside */ .fr-ui-inside .fr-container { padding: 0px 0px; } .fr-ui-inside.fr-no-sides .fr-container { padding: 0px; } /* padding ui:outside */ .fr-ui-outside .fr-container { padding: 0px 72px; } .fr-ui-outside.fr-no-sides .fr-container { padding: 0px 48px; } } /* padding ui:fullclick */ .fr-ui-fullclick .fr-container { padding: 0; } .fr-ui-fullclick.fr-no-sides .fr-container { padding: 0; } /* video fullclick */ .fr-ui-fullclick.fr-type-video .fr-container { padding: 0px 62px; } .fr-ui-fullclick.fr-no-sides.fr-type-video .fr-container { padding: 48px 0px; } /* overflow-y should always have 0 padding top and bottom */ .fr-overflow-y .fr-container { padding-top: 0 !important; padding-bottom: 0 !important; } .fr-content, .fr-content-background { position: absolute; top: 50%; left: 50%; /* IE11 has a 1px blur bug on the edges of the caption (ui:inside) during animation with overflow:hidden */ overflow: visible; } /* img/iframe/error */ .fr-content-element { float: left; width: 100%; height: 100%; } .fr-content-background { background: #101010; } .fr-info { position: absolute; top: 0; left: 0; width: 100%; color: #efefef; font-size: 13px; line-height: 20px; text-align: left; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } .fr-info-background { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: #000; line-height: 1%; -webkit-filter: none; filter: none; opacity: 1; } .fr-ui-inside .fr-info-background { filter: alpha(opacity=80); opacity: .8; zoom: 1; } /* ui:outside has a slightly lighter info background to break up from black page backgrounds */ .fr-ui-outside .fr-info-background { background: #0d0d0d; } /* info at the bottom for ui:inside */ .fr-content .fr-info { top: auto; bottom: 0; } .fr-info-padder { display: block; overflow: hidden; padding: 12px; position: relative; width: auto; } .fr-caption { width: auto; display: inline; } .fr-position { color: #b3b3b3; float: right; line-height: 21px; opacity: 0.99; position: relative; text-align: right; margin-left: 15px; white-space: nowrap; } /* positions not within the info bar for ui:outside/inside */ .fr-position-outside, .fr-position-inside { position: absolute; bottom: 0; right: 0; margin: 12px; width: auto; padding: 2px 8px; border-radius: 10px; font-size: 11px; line-height: 20px; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4); display: none; overflow: hidden; white-space: nowrap; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } .fr-position-inside { border: 0; } .fr-position-background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #0d0d0d; filter: alpha(opacity=80); opacity: .8; zoom: 1; /* oldIE */; } .fr-position-text { color: #b3b3b3; } .fr-position-outside .fr-position-text, .fr-position-inside .fr-position-text { float: left; position: relative; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3); opacity: 1; } /* display it for the outside ui, hide the caption inside */ .fr-ui-outside .fr-position-outside { display: block; } .fr-ui-outside .fr-info .fr-position { display: none; } .fr-ui-inside.fr-no-caption .fr-position-inside { display: block; } /* links */ .fr-info a, .fr-info a:hover { color: #ccc; border: 0; background: none; text-decoration: underline; } .fr-info a:hover { color: #eee; } /* no-caption */ .fr-ui-outside.fr-no-caption .fr-info { display: none; } .fr-ui-inside.fr-no-caption .fr-caption { display: none; } /* --- stroke */ .fr-stroke { position: absolute; top: 0; left: 0; width: 100%; height: 1px; } .fr-stroke-vertical { width: 1px; height: 100%; } .fr-stroke-horizontal { padding: 0 1px; } .fr-stroke-right { left: auto; right: 0; } .fr-stroke-bottom { top: auto; bottom: 0; } .fr-stroke-color { float: left; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.08); } /* the stroke is brighter inside the info box */ .fr-info .fr-stroke-color { background: rgba(80, 80, 80, 0.3); } /* remove the stroke when outside ui has a caption */ .fr-ui-outside.fr-has-caption .fr-content .fr-stroke-bottom { display: none; } /* remove stroke and shadow when ui:fullclick */ .fr-ui-fullclick .fr-stroke { display: none; } .fr-ui-fullclick .fr-content-background { -webkit-box-shadow: none; box-shadow: none; } /* the info box never bas a top stroke */ .fr-info .fr-stroke-top { display: none; } /* < > */ .fr-side { position: absolute; top: 50%; width: 54px; height: 72px; margin: 0 9px; margin-top: -36px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; zoom: 1; } .fr-side-previous { left: 0; } .fr-side-next { right: 0; left: auto; } .fr-side-disabled { cursor: default; } .fr-side-hidden { display: none !important; } .fr-side-button { float: left; width: 100%; height: 100%; margin: 0; padding: 0; } .fr-side-button-background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #101010; } .fr-side-button-icon { float: left; position: relative; height: 100%; width: 100%; zoom: 1; background-position: 50% 50%; background-repeat: no-repeat; } /* smaller side buttons */ @media all and (max-width: 500px) and (orientation: portrait), all and (orientation: landscape) and (max-height: 414px) { .fr-side { width: 54px; height: 60px; margin: 0; margin-top: -30px; } .fr-side-button { width: 48px; height: 60px; margin: 0 3px; } } /* X */ .fr-close { position: absolute; width: 48px; height: 48px; top: 0; right: 0; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fr-close-background, .fr-close-icon { position: absolute; top: 12px; left: 12px; height: 26px; width: 26px; background-position: 50% 50%; background-repeat: no-repeat; } .fr-close-background { background-color: #000; } /* Thumbnails */ .fr-thumbnails { position: absolute; overflow: hidden; } .fr-thumbnails-disabled .fr-thumbnails { display: none !important; } .fr-thumbnails-horizontal .fr-thumbnails { width: 100%; height: 12%; min-height: 74px; max-height: 160px; bottom: 0; } .fr-thumbnails-vertical .fr-thumbnails { height: 100%; width: 10%; min-width: 74px; max-width: 160px; left: 0; } .fr-thumbnails, .fr-thumbnails * { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fr-thumbnails-wrapper { position: absolute; top: 0; left: 50%; height: 100%; } .fr-thumbnails-vertical .fr-thumbnails-wrapper { top: 50%; left: 0; } .fr-thumbnails-slider { position: relative; width: 100%; height: 100%; float: left; zoom: 1; } .fr-thumbnails-slider-slide { position: absolute; top: 0; left: 0; height: 100%; } .fr-thumbnails-thumbs { float: left; height: 100%; overflow: hidden; position: relative; top: 0; left: 0; } .fr-thumbnails-slide { position: absolute; top: 0; height: 100%; width: 100%; } .fr-thumbnail-frame { position: absolute; zoom: 1; overflow: hidden; } .fr-thumbnail { position: absolute; width: 30px; height: 100%; left: 50%; top: 50%; zoom: 1; cursor: pointer; margin: 0 10px; } .fr-ltIE9 .fr-thumbnail * { overflow: hidden; /* IE6(7) */ z-index: 1; zoom: 1; } .fr-thumbnail-wrapper { position: relative; background: #161616; width: 100%; height: 100%; float: left; overflow: hidden; display: inline; /* IE6(7) */ z-index: 0; /* IE8 */; } .fr-thumbnail-overlay { cursor: pointer; } .fr-thumbnail-active .fr-thumbnail-overlay { cursor: default; } .fr-thumbnail-overlay, .fr-thumbnail-overlay-background, .fr-thumbnail-overlay-border { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-width: 0; overflow: hidden; border-style: solid; border-color: transparent; } .fr-ltIE9 .fr-thumbnail-overlay-border { border-width: 0 !important; } .fr-thumbnail .fr-thumbnail-image { position: absolute; filter: alpha(opacity=85); opacity: .85; max-width: none; } .fr-thumbnail:hover .fr-thumbnail-image, .fr-thumbnail-active:hover .fr-thumbnail-image { filter: alpha(opacity=99); opacity: .99; } .fr-thumbnail-active .fr-thumbnail-image, .fr-thumbnail-active:hover .fr-thumbnail-image { filter: alpha(opacity=35); opacity: .35; } .fr-thumbnail-active { cursor: default; } /* Thumbnails loading */ .fr-thumbnail-loading, .fr-thumbnail-loading-background, .fr-thumbnail-loading-icon { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .fr-thumbnail-loading-background { background-color: #161616; background-position: 50% 50%; background-repeat: no-repeat; opacity: .8; position: relative; float: left; } /* this element is there as an alternative to putting the loading image on the background */ .fr-thumbnail-loading-icon { display: none; } /* error on thumbnail */ .fr-thumbnail-error .fr-thumbnail-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #202020; } /* Thumbnail < > */ .fr-thumbnails-side { float: left; height: 100%; width: 28px; margin: 0 5px; position: relative; overflow: hidden; } .fr-thumbnails-side-previous { margin-left: 12px; } .fr-thumbnails-side-next { margin-right: 12px; } .fr-thumbnails-vertical .fr-thumbnails-side { height: 28px; width: 100%; margin: 10px 0; } .fr-thumbnails-vertical .fr-thumbnails-side-previous { margin-top: 20px; } .fr-thumbnails-vertical .fr-thumbnails-side-next { margin-bottom: 20px; } .fr-thumbnails-side-button { position: absolute; top: 50%; left: 50%; margin-top: -14px; margin-left: -14px; width: 28px; height: 28px; cursor: pointer; } .fr-thumbnails-side-button-background { position: absolute; top: 0; left: 0; height: 100%; width: 100%; filter: alpha(opacity=80); opacity: .8; -webkit-transition: background-color .2s ease-in; transition: background-color .2s ease-in; background-color: #333; cursor: pointer; border-radius: 4px; } .fr-thumbnails-side-button:hover .fr-thumbnails-side-button-background { background-color: #3b3b3b; } .fr-thumbnails-side-button-disabled * { cursor: default; } .fr-thumbnails-side-button-disabled:hover .fr-thumbnails-side-button-background { background-color: #333; } .fr-thumbnails-side-button-icon { height: 42px; width: 42px; position: absolute; /*top: -7px; left: -7px;*/ top: 0; left: 0; width: 100%; height: 100%; } /* vertical thumbnails */ .fr-thumbnails-vertical .fr-thumbnails-side, .fr-thumbnails-vertical .fr-thumbnails-thumbs, .fr-thumbnails-vertical .fr-thumbnail-frame { clear: both; } /* ui:fullclick has a dark thumbnail background */ .fr-window-ui-fullclick .fr-thumbnails { background: #090909; } /* put a stroke on the connecting caption*/ .fr-window-ui-fullclick.fr-thumbnails-enabled.fr-thumbnails-horizontal .fr-info .fr-stroke-bottom { display: block !important; } /*({ box-shadow: inset 0 -1px 0 rgba(255,255,255,.1); } */ .fr-window-ui-fullclick.fr-thumbnails-enabled.fr-thumbnails-vertical .fr-info .fr-stroke-left { display: block !important; } /* thumbnail spacing */ .fr-thumbnails-horizontal .fr-thumbnails-thumbs { padding: 12px 5px; } .fr-thumbnails-vertical .fr-thumbnails-thumbs { padding: 5px 12px; } .fr-thumbnails-measured .fr-thumbnails-thumbs { padding: 0 !important; } /* horizontal */ @media all and (min-height: 700px) { .fr-thumbnails-horizontal .fr-thumbnails-thumbs { padding: 16px 8px; } .fr-thumbnails-horizontal .fr-thumbnails-side { margin: 0 8px; } .fr-thumbnails-horizontal .fr-thumbnails-side-previous { margin-left: 16px; } .fr-thumbnails-horizontal .fr-thumbnails-side-next { margin-right: 16px; } } @media all and (min-height: 980px) { .fr-thumbnails-horizontal .fr-thumbnails-thumbs { padding: 20px 10px; } .fr-thumbnails-horizontal .fr-thumbnails-side { margin: 0 10px; } .fr-thumbnails-horizontal .fr-thumbnails-side-previous { margin-left: 20px; } .fr-thumbnails-horizontal .fr-thumbnails-side-next { margin-right: 20px; } } /* vertical */ @media all and (min-width: 1200px) { .fr-thumbnails-vertical .fr-thumbnails-thumbs { padding: 8px 16px; } .fr-thumbnails-vertical .fr-thumbnails-side { margin: 0 8px; } .fr-thumbnails-vertical .fr-thumbnails-side-previous { margin-top: 16px; } .fr-thumbnails-vertical .fr-thumbnails-side-next { margin-bottom: 16px; } } @media all and (min-width: 1800px) { .fr-thumbnails-vertical .fr-thumbnails-thumbs { padding: 10px 20px; } .fr-thumbnails-vertical .fr-thumbnails-side { margin: 10px 0; } .fr-thumbnails-vertical .fr-thumbnails-side-previous { margin-top: 20px; } .fr-thumbnails-vertical .fr-thumbnails-side-next { margin-bottom: 20px; } } /* hide thumbnails on smaller screens the js always hides them on touch based devices */ @media all and (max-width: 500px) and (orientation: portrait), all and (orientation: landscape) and (max-height: 500px) { .fr-thumbnails-horizontal .fr-thumbnails { display: none !important; } } @media all and (max-width: 700px) and (orientation: portrait), all and (orientation: landscape) and (max-height: 414px) { .fr-thumbnails-vertical .fr-thumbnails { display: none !important; } } /* force fullClick: true and force overflow: false */ @media all and (max-width: 500px) and (orientation: portrait), all and (orientation: landscape) and (max-height: 414px) { .fr-page { min-width: 100%; } /* fullclick */ .fr-page { min-height: 100%; } /* overflow: false */; } /* switch between ui modes we force everything not in the current UI mode to hide */ .fr-window-ui-fullclick .fr-side-next-outside, .fr-window-ui-fullclick .fr-side-previous-outside, .fr-window-ui-fullclick .fr-close-outside, .fr-window-ui-fullclick .fr-content .fr-side-next, .fr-window-ui-fullclick .fr-content .fr-side-previous, .fr-window-ui-fullclick .fr-content .fr-close, .fr-window-ui-fullclick .fr-content .fr-info, .fr-window-ui-outside .fr-side-next-fullclick, .fr-window-ui-outside .fr-side-previous-fullclick, .fr-window-ui-outside .fr-close-fullclick, .fr-window-ui-outside .fr-content .fr-side-next, .fr-window-ui-outside .fr-content .fr-side-previous, .fr-window-ui-outside .fr-content .fr-close, .fr-window-ui-outside .fr-content .fr-info, .fr-window-ui-inside .fr-page > .fr-info, .fr-window-ui-inside .fr-side-next-fullclick, .fr-window-ui-inside .fr-side-previous-fullclick, .fr-window-ui-inside .fr-close-fullclick, .fr-window-ui-inside .fr-side-next-outside, .fr-window-ui-inside .fr-side-previous-outside, .fr-window-ui-inside .fr-close-outside { display: none !important; } /* some ui elements can be toggled on mousemove. filter:alpha(opacity) is bugged so we use display in oldIE */ .fr-toggle-ui { opacity: 0; -webkit-transition: opacity .3s; transition: opacity .3s; } .fr-visible-fullclick-ui .fr-box > .fr-toggle-ui, .fr-visible-inside-ui .fr-ui-inside .fr-toggle-ui { opacity: 1; } .fr-hidden-fullclick-ui .fr-box > .fr-toggle-ui, .fr-hidden-inside-ui .fr-ui-inside .fr-toggle-ui { -webkit-transition: opacity .3s; transition: opacity .3s; } .fr-ltIE9.fr-hidden-fullclick-ui .fr-box > .fr-toggle-ui, .fr-ltIE9.fr-hidden-inside-ui .fr-ui-inside .fr-toggle-ui { display: none; } /* Spinner */ .fr-spinner { position: fixed; width: 52px; height: 52px; background: #101010; background: rgba(16, 16, 16, 0.85); border-radius: 5px; } .fr-spinner div { position: absolute; top: 0; left: 0; height: 64%; width: 64%; margin-left: 18%; margin-top: 18%; opacity: 1; -webkit-animation: fresco-12 1.2s infinite ease-in-out; animation: fresco-12 1.2s infinite ease-in-out; } .fr-spinner div:after { content: ''; position: absolute; top: 0; left: 50%; width: 2px; height: 8px; margin-left: -1px; background: #fff; -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); /* fixes rendering in Firefox */; } .fr-spinner div.fr-spin-1 { -webkit-transform: rotate(30deg); transform: rotate(30deg); -webkit-animation-delay: -1.1s; animation-delay: -1.1s; } .fr-spinner div.fr-spin-2 { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-animation-delay: -1.0s; animation-delay: -1.0s; } .fr-spinner div.fr-spin-3 { -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } .fr-spinner div.fr-spin-4 { -webkit-transform: rotate(120deg); transform: rotate(120deg); -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } .fr-spinner div.fr-spin-5 { -webkit-transform: rotate(150deg); transform: rotate(150deg); -webkit-animation-delay: -0.7s; animation-delay: -0.7s; } .fr-spinner div.fr-spin-6 { -webkit-transform: rotate(180deg); transform: rotate(180deg); -webkit-animation-delay: -0.6s; animation-delay: -0.6s; } .fr-spinner div.fr-spin-6 { -webkit-transform: rotate(180deg); transform: rotate(180deg); -webkit-animation-delay: -0.6s; animation-delay: -0.6s; } .fr-spinner div.fr-spin-7 { -webkit-transform: rotate(210deg); transform: rotate(210deg); -webkit-animation-delay: -0.5s; animation-delay: -0.5s; } .fr-spinner div.fr-spin-8 { -webkit-transform: rotate(240deg); transform: rotate(240deg); -webkit-animation-delay: -0.4s; animation-delay: -0.4s; } .fr-spinner div.fr-spin-9 { -webkit-transform: rotate(270deg); transform: rotate(270deg); -webkit-animation-delay: -0.3s; animation-delay: -0.3s; } .fr-spinner div.fr-spin-10 { -webkit-transform: rotate(300deg); transform: rotate(300deg); -webkit-animation-delay: -0.2s; animation-delay: -0.2s; } .fr-spinner div.fr-spin-11 { -webkit-transform: rotate(330deg); transform: rotate(330deg); -webkit-animation-delay: -0.1s; animation-delay: -0.1s; } .fr-spinner div.fr-spin-12 { -webkit-transform: rotate(360deg); transform: rotate(360deg); -webkit-animation-delay: 0s; animation-delay: 0s; } @-webkit-keyframes fresco-12 { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fresco-12 { 0% { opacity: 1; } 100% { opacity: 0; } } /* Thumbnail spinner */ .fr-thumbnail-spinner { position: absolute; top: 50%; left: 50%; margin-top: -20px; margin-left: -20px; width: 40px; height: 40px; } .fr-thumbnail-spinner-spin { position: relative; float: left; margin: 8px 0 0 8px; text-indent: -9999em; border-top: 2px solid rgba(255, 255, 255, 0.2); border-right: 2px solid rgba(255, 255, 255, 0.2); border-bottom: 2px solid rgba(255, 255, 255, 0.2); border-left: 2px solid #fff; -webkit-animation: fr-thumbnail-spin 1.1s infinite linear; animation: fr-thumbnail-spin 1.1s infinite linear; } .fr-thumbnail-spinner-spin, .fr-thumbnail-spinner-spin:after { border-radius: 50%; width: 24px; height: 24px; } @-webkit-keyframes fr-thumbnail-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes fr-thumbnail-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* Error */ .fr-error { float: left; position: relative; background-color: #ca3434; width: 160px; height: 160px; } .fr-error-icon { position: absolute; width: 42px; height: 42px; top: 50%; left: 50%; margin-left: -21px; margin-top: -21px; } /* skin: 'fresco' */ /* Sprite */ .fr-window-skin-fresco .fr-side-button-icon, .fr-window-skin-fresco .fr-close-icon, .fr-window-skin-fresco .fr-thumbnails-side-button-icon, .fr-window-skin-fresco .fr-error-icon { background-image: url("../images/fresco/sprite.svg"); } /* fallback png sprite */ .fr-window-skin-fresco.fr-no-svg .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-close-icon, .fr-window-skin-fresco.fr-no-svg .fr-thumbnails-side-button-icon, .fr-window-skin-fresco .fr-error-icon { background-image: url("../images/fresco/sprite.png"); } .fr-window-skin-fresco .fr-error-icon { background-position: -160px -126px; } .fr-window-skin-fresco .fr-content-background { background: #101010; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); } .fr-window-skin-fresco.fr-window-ui-fullclick .fr-content-background { -webkit-box-shadow: none; box-shadow: none; } /* thumbnail shadow */ .fr-window-skin-fresco .fr-thumbnail-wrapper { -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); } .fr-window-skin-fresco .fr-thumbnail-active .fr-thumbnail-wrapper { -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.1); box-shadow: 0 0 1px rgba(0, 0, 0, 0.1); } /* < > */ .fr-window-skin-fresco .fr-side-button-background { background-color: transparent; } .fr-window-skin-fresco .fr-side-previous .fr-side-button-icon { background-position: -13px -14px; } .fr-window-skin-fresco .fr-side-next .fr-side-button-icon { background-position: -93px -14px; } .fr-window-skin-fresco .fr-side-previous:hover .fr-side-button-icon { background-position: -13px -114px; } .fr-window-skin-fresco .fr-side-next:hover .fr-side-button-icon { background-position: -93px -114px; } /* transition (png) */ .fr-window-skin-fresco.fr-no-svg .fr-hovering-previous .fr-side-previous .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg.fr-mobile-touch .fr-side-previous .fr-side-button-icon { background-position: -13px -114px; } .fr-window-skin-fresco.fr-no-svg .fr-hovering-next .fr-side-next .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg.fr-mobile-touch .fr-side-next .fr-side-button-icon { background-position: -93px -114px; } /* disabled state (png) */ .fr-window-skin-fresco.fr-no-svg .fr-side-previous.fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-hovering-previous .fr-side-previous.fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-side-previous.fr-side-disabled:hover .fr-side-button-icon { background-position: -13px -214px; } .fr-window-skin-fresco.fr-no-svg .fr-side-next.fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-hovering-next .fr-side-next.fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-side-next.fr-side-disabled:hover .fr-side-button-icon { background-position: -93px -214px; } /* transition (svg) */ .fr-window-skin-fresco.fr-svg .fr-side-previous .fr-side-button-icon { background-position: -13px -114px; } .fr-window-skin-fresco.fr-svg .fr-side-next .fr-side-button-icon { background-position: -93px -114px; } .fr-window-skin-fresco.fr-svg .fr-side-button-icon { opacity: .5; } .fr-window-skin-fresco.fr-svg .fr-side:hover .fr-side-button-icon, .fr-window-skin-fresco.fr-svg .fr-hovering-previous .fr-side-previous .fr-side-button-icon, .fr-window-skin-fresco.fr-svg .fr-hovering-next .fr-side-next .fr-side-button-icon { opacity: 1; } .fr-window-skin-fresco.fr-svg.fr-mobile-touch .fr-side .fr-side-button-icon { opacity: .8; } /* touch always active but at lower opacity */ /* disabled (svg) */ .fr-window-skin-fresco.fr-svg .fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-svg .fr-hovering-previous .fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-svg .fr-hovering-next .fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-svg .fr-side-disabled:hover .fr-side-button-icon, .fr-window-skin-fresco.fr-svg.fr-mobile-touch .fr-side-disabled .fr-side-button-icon { opacity: .2; } /* TODO: make sure this works */ /* hide for ui:inside/fullclick, only for the image type */ .fr-window-skin-fresco.fr-window-ui-inside .fr-type-image .fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-window-ui-fullclick.fr-showing-type-image .fr-side-disabled .fr-side-button-icon { background-image: none; } /* < > responsive */ @media all and (max-width: 500px) and (orientation: portrait), all and (orientation: landscape) and (max-height: 414px) { .fr-window-skin-fresco .fr-side-previous .fr-side-button-icon { background-position: 0px -300px; } .fr-window-skin-fresco .fr-side-next .fr-side-button-icon { background-position: -48px -300px; } .fr-window-skin-fresco .fr-side-previous:hover .fr-side-button-icon { background-position: 0px -360px; } .fr-window-skin-fresco .fr-side-next:hover .fr-side-button-icon { background-position: -48px -360px; } /* transition (png) */ .fr-window-skin-fresco.fr-no-svg .fr-hovering-previous .fr-side-previous .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg.fr-mobile-touch .fr-side-previous .fr-side-button-icon { background-position: 0px -360px; } .fr-window-skin-fresco.fr-no-svg .fr-hovering-next .fr-side-next .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg.fr-mobile-touch .fr-side-next .fr-side-button-icon { background-position: -48px -360px; } /* transition (svg) */ .fr-window-skin-fresco.fr-svg .fr-side-previous .fr-side-button-icon { background-position: 0px -360px; } .fr-window-skin-fresco.fr-svg .fr-side-next .fr-side-button-icon { background-position: -48px -360px; } /* disabled state (png) */ .fr-window-skin-fresco.fr-no-svg .fr-side-previous.fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-hovering-previous .fr-side-previous.fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-side-previous.fr-side-disabled:hover .fr-side-button-icon { background-position: 0px -420px; } .fr-window-skin-fresco.fr-no-svg .fr-side-next.fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-hovering-next .fr-side-next.fr-side-disabled .fr-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-side-next.fr-side-disabled:hover .fr-side-button-icon { background-position: -48px -420px; } } /* X */ /* colors */ .fr-window-skin-fresco.fr-window-ui-outside .fr-close-background { background-color: #363636; } .fr-window-skin-fresco.fr-window-ui-outside .fr-close:hover .fr-close-background { background-color: #434343; } .fr-window-skin-fresco.fr-window-ui-inside .fr-close-background, .fr-window-skin-fresco.fr-window-ui-fullclick .fr-close-background { background-color: #131313; filter: alpha(opacity=80); opacity: .8; } .fr-window-skin-fresco.fr-window-ui-inside .fr-close:hover .fr-close-background, .fr-window-skin-fresco.fr-window-ui-fullclick .fr-close:hover .fr-close-background { background-color: #191919; } /* - image */ .fr-window-skin-fresco .fr-close .fr-close-icon { background-position: -168px -8px; } .fr-window-skin-fresco .fr-close:hover .fr-close-icon { background-position: -210px -8px; } /* - transition */ .fr-window-skin-fresco.fr-svg .fr-close .fr-close-icon { background-position: -210px -8px; opacity: .8; } .fr-window-skin-fresco .fr-close:hover .fr-close-icon { opacity: 1; } /* iOS 8.4.1 bug: when opacity changes it'll require 2 taps force a single opacity to fix this */ .fr-window-skin-fresco.fr-svg.fr-mobile-touch .fr-close .fr-close-icon, .fr-window-skin-fresco.fr-mobile-touch .fr-close:hover .fr-close-icon { opacity: 1; } /* Thumbnails */ .fr-window-skin-fresco .fr-thumbnail-wrapper { border-color: transparent; border-style: solid; border-width: 0; } .fr-window-skin-fresco .fr-thumbnail-wrapper { -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); } .fr-window-skin-fresco .fr-thumbnail-active .fr-thumbnail-wrapper { -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.1); box-shadow: 0 0 1px rgba(0, 0, 0, 0.1); } .fr-window-skin-fresco .fr-thumbnail-wrapper { -webkit-box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.3); box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.3); } .fr-window-skin-fresco .fr-thumbnail-overlay-border { border-width: 1px; border-color: rgba(255, 255, 255, 0.08); /* should remain rgba */ } /* no inner border on active thumbnail */ .fr-window-skin-fresco .fr-thumbnail-active .fr-thumbnail-overlay-border, .fr-window-skin-fresco .fr-thumbnail-active:hover .fr-thumbnail-overlay-border { border: 0px; } /* Thumbnails < > */ .fr-window-skin-fresco .fr-thumbnails-side-previous .fr-thumbnails-side-button-icon { background-position: -167px -49px; } .fr-window-skin-fresco .fr-thumbnails-side-previous:hover .fr-thumbnails-side-button-icon { background-position: -209px -49px; } .fr-window-skin-fresco .fr-thumbnails-side-next .fr-thumbnails-side-button-icon { background-position: -167px -91px; } .fr-window-skin-fresco .fr-thumbnails-side-next:hover .fr-thumbnails-side-button-icon { background-position: -209px -91px; } /* vertical ^ (up/down) adjustments */ .fr-window-skin-fresco.fr-thumbnails-vertical .fr-thumbnails-side-previous .fr-thumbnails-side-button-icon { background-position: -293px -49px; } .fr-window-skin-fresco.fr-thumbnails-vertical .fr-thumbnails-side-previous:hover .fr-thumbnails-side-button-icon { background-position: -335px -49px; } .fr-window-skin-fresco.fr-thumbnails-vertical .fr-thumbnails-side-next .fr-thumbnails-side-button-icon { background-position: -293px -91px; } .fr-window-skin-fresco.fr-thumbnails-vertical .fr-thumbnails-side-next:hover .fr-thumbnails-side-button-icon { background-position: -335px -91px; } /* Thumbnails < > transition */ .fr-window-skin-fresco.fr-svg .fr-thumbnails-side .fr-thumbnails-side-button-icon { -webkit-transition: opacity .2s ease-in; transition: opacity .2s ease-in; opacity: .8; } .fr-window-skin-fresco.fr-svg .fr-thumbnails-side-previous .fr-thumbnails-side-button-icon, .fr-window-skin-fresco.fr-svg .fr-thumbnails-side-previous .fr-thumbnails-side-button-disabled { background-position: -167px -49px; } .fr-window-skin-fresco.fr-svg .fr-thumbnails-side-next .fr-thumbnails-side-button-icon, .fr-window-skin-fresco.fr-svg .fr-thumbnails-side-next .fr-thumbnails-side-button-disabled { background-position: -209px -91px; } .fr-window-skin-fresco.fr-svg .fr-thumbnails-side:hover .fr-thumbnails-side-button-icon { opacity: 1; } /* vertical ^ (up/down) adjustments */ .fr-window-skin-fresco.fr-svg.fr-thumbnails-vertical .fr-thumbnails-side-previous .fr-thumbnails-side-button-icon, .fr-window-skin-fresco.fr-svg.fr-thumbnails-vertical .fr-thumbnails-side-previous .fr-thumbnails-side-button-disabled { background-position: -293px -49px; } .fr-window-skin-fresco.fr-svg.fr-thumbnails-vertical .fr-thumbnails-side-next .fr-thumbnails-side-button-icon, .fr-window-skin-fresco.fr-svg.fr-thumbnails-vertical .fr-thumbnails-side-next .fr-thumbnails-side-button-disabled { background-position: -335px -91px; } /* lower opacity on disabled states */ .fr-window-skin-fresco.fr-svg .fr-thumbnails-side .fr-thumbnails-side-button-disabled, .fr-window-skin-fresco.fr-svg .fr-thumbnails-side:hover .fr-thumbnails-side-button-disabled { opacity: .5; } /* lower opacity IE < 9 using images */ .fr-window-skin-fresco.fr-no-svg .fr-thumbnails-side-previous .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-thumbnails-side-previous:hover .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon { background-position: -251px -49px; } .fr-window-skin-fresco.fr-no-svg .fr-thumbnails-side-next .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon, .fr-window-skin-fresco.fr-no-svg .fr-thumbnails-side-next:hover .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon { background-position: -251px -91px; } .fr-window-skin-fresco.fr-no-svg .fr-thumbnails-side .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-background, .fr-window-skin-fresco.fr-no-svg .fr-thumbnails-side:hover .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-background { filter: alpha(opacity=50); } /* vertical ^ (up/down) adjustments */ .fr-window-skin-fresco.fr-no-svg.fr-thumbnails-vertical .fr-thumbnails-side-previous .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon, .fr-window-skin-fresco.fr-no-svg.fr-thumbnails-vertical .fr-thumbnails-side-previous:hover .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon { background-position: -377px -49px; } .fr-window-skin-fresco.fr-no-svg.fr-thumbnails-vertical .fr-thumbnails-side-next .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon, .fr-window-skin-fresco.fr-no-svg.fr-thumbnails-vertical .fr-thumbnails-side-next:hover .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon { background-position: -377px -91px; } /* ========================================================================== /* ===== Owl Carousel v2.2.1 ===== */ /*========================================================================== */ .owl-carousel, .owl-carousel .owl-item { -webkit-tap-highlight-color: transparent; position: relative; } .owl-carousel { display: none; width: 100%; z-index: 1; } .owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; -moz-backface-visibility: hidden; } .owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .owl-carousel .owl-stage-outer { position: relative; overflow: hidden; -webkit-transform: translate3d(#000000); } .owl-carousel .owl-item, .owl-carousel .owl-wrapper { -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translate3d(#000000); transform: translate3d(#000000); } .owl-carousel .owl-item { min-height: 1px; float: left; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-touch-callout: none; } .owl-carousel .owl-item img { display: block; width: 100%; height: 100%; object-fit: cover; max-width: initial; object-position: center center; } .owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled { display: none; } .no-js .owl-carousel, .owl-carousel.owl-loaded { display: block; } .owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev { cursor: pointer; cursor: hand; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-loading { opacity: 0; display: block; } .owl-carousel.owl-hidden { opacity: 0; } .owl-carousel.owl-refresh .owl-item { visibility: hidden; } .owl-carousel.owl-drag .owl-item { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-grab { cursor: move; cursor: -webkit-grab; cursor: grab; } .owl-carousel.owl-rtl { direction: rtl; } .owl-carousel.owl-rtl .owl-item { float: right; } .owl-carousel .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .owl-carousel .owl-animated-in { z-index: 0; } .owl-carousel .owl-animated-out { z-index: 1; } .owl-carousel .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .owl-height { -webkit-transition: height .5s ease-in-out; transition: height .5s ease-in-out; } .owl-carousel .owl-item .owl-lazy { opacity: 0; -webkit-transition: opacity .4s ease; transition: opacity .4s ease; } .owl-carousel .owl-item img.owl-lazy { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; } .owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url(owl.video.play.png) no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform .1s ease; transition: -webkit-transform .1s ease; transition: transform .1s ease; transition: transform .1s ease, -webkit-transform .1s ease; } .owl-carousel .owl-video-play-icon:hover { -webkit-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-play-icon, .owl-carousel .owl-video-playing .owl-video-tn { display: none; } .owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; -webkit-transition: opacity .4s ease; transition: opacity .4s ease; } .owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; } .owl-theme .owl-nav { margin-top: 10px; text-align: center; -webkit-tap-highlight-color: transparent; } .owl-theme .owl-nav [class*='owl-'] { color: #FFF; font-size: 14px; margin: 5px; padding: 4px 7px; background: #D6D6D6; display: inline-block; cursor: pointer; border-radius: 3px; } .owl-theme .owl-nav [class*='owl-']:hover { background: #869791; color: #FFF; text-decoration: none; } .owl-theme .owl-nav .disabled { opacity: 0.5; cursor: default; } .owl-theme .owl-nav.disabled + .owl-dots { margin-top: 10px; } .owl-theme .owl-dots { text-align: center; -webkit-tap-highlight-color: transparent; } .owl-theme .owl-dots .owl-dot { display: inline-block; zoom: 1; *display: inline; } .owl-theme .owl-dots .owl-dot span { width: 10px; height: 10px; margin: 5px 7px; background: #D6D6D6; display: block; -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-transition: opacity 200ms ease; transition: opacity 200ms ease; border-radius: 30px; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #869791; } .tabs { background-color: #F8F8FF; } .md-tabs > .mobile-nav-bar { background-color: #1779BA; margin-bottom: 15px; } .md-tabs > .mobile-nav-bar .title-bar-text { font-size: 26px; } .md-tabs > .mobile-nav-bar a { color: #fefefe; } .md-tabs > .tabs { margin: 0; border: 0; /*background: #1779BA;*/ list-style-type: none; display: table; width: 100%; } .tabs-title>a { display: block; /*padding: 1.25rem 1.5rem 0 1.5rem;*/ font-size: .75rem; line-height: 1; color: #1779ba; } .md-tabs > .tabs > .tabs-title { display: table-cell; width: 16.66%; text-align: center; display: inline-block; } .md-tabs > .tabs > .tabs-title.is-active > a { color: #000; background-color: transparent; outline: none; } .md-tabs > .tabs > .tabs-title.is-active > h3 { color: #000; background-color: transparent; outline: none; } .md-tabs > .tabs > .tabs-title.is-active:nth-of-type(1) ~ .slide { left: calc((100% / 6) * 0); } .md-tabs > .tabs > .tabs-title.is-active:nth-of-type(2) ~ .slide { left: calc((100% / 6) * 1); } .md-tabs > .tabs > .tabs-title.is-active:nth-of-type(3) ~ .slide { left: calc((100% / 6) * 2); } .md-tabs > .tabs > .tabs-title.is-active:nth-of-type(4) ~ .slide { left: calc((100% / 6) * 3); } .md-tabs > .tabs > .tabs-title.is-active:nth-of-type(5) ~ .slide { left: calc((100% / 6) * 4); } .md-tabs > .tabs > .tabs-title.is-active:nth-of-type(6) ~ .slide { left: calc((100% / 6) * 5); } .md-tabs > .tabs > .tabs-title > a { color: #fefefe; font-size: 16px; } .md-tabs > .tabs > .tabs-title > a:hover, .md-tabs > .tabs > .tabs-title > a:focus { background: transparent; } .slide { background: #000; width: calc(100% / 6); height: 4px; position: relative; left: 0; /*top: 52px;*/ transition: left 0.3s ease-out; } .tabs-content-section { /* border: 1px solid #e6e6e6; */ border-top: 0; background: #fefefe; color: #0a0a0a; -webkit-transition: all .5s ease; transition: all .5s ease; } .tabs-title h3 { cursor: pointer; padding-bottom: 1.25rem; } .md-tabs > .tabs > .tabs-title > a { padding: 1.25rem 1.5rem 0 1.5rem; border: 0; } li.tabs-title:hover, li.tabs-title:focus{ background-color: #dfdfe6; } @media screen and (max-width: 39.9375em) { .slide { width: 0; height: 0; } .md-tabs > .accordion { margin-left: 0; list-style-type: none; } .md-tabs > .accordion > .accordion-item > .accordion-title { position: relative; display: flex; padding: 1.25rem 1.5rem 1.25rem 1.5rem; border: 0; font-size: 1.375rem; line-height: 1; background: #F8F8FF; color: #000; } .md-tabs > .accordion > .accordion-item > .accordion-title:hover { background-color: #dfdfe6; color: #000; outline: none; } .md-tabs > .accordion > .is-active.accordion-item > a.accordion-title { border-bottom: 4px solid #000; } .md-tabs > .accordion > .accordion-item > .accordion-content { display: none; padding: 1rem; border-top: 0px; background-color: #fefefe; color: #0a0a0a; } > .accordion > .accordion-item > .accordion-title:focus { background-color: #1779BA; color: #000; outline: none; } .accordion-content{ border: 0; } .accordion-title::before { position: absolute; top: 45%; right: 1rem; margin-top: -0.5rem; content: "+"; } section.key-benefits .benefit h3 { font-size: 0.9375rem; font-weight: 600; margin: auto 0; padding-left: 15px; } } .tabs-content { border: 0; } .service-svg { display: inline-block; background-size: cover; } .service-consulting:hover, .service-consulting:focus { filter: invert(27%) sepia(51%) saturate(2878%) hue-rotate(346deg) brightness(104%) contrast(97%); } .tabs-content-section .tabs-panel .services i { background: transparent; padding: 0 0.625rem 0 0; font-size: 0.75rem; border: none; color: #004DB8; } #logo img { width: 6.5rem; -webkit-transition: .2s ease-in-out; transition: .2s ease-in-out; } #logo:hover img { transform: scale(1.1); } @media print, screen and (min-width: 40em){ section.schedule .accordion-item .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -1rem; content: "+"; font-size: 1.9375rem; } } @media print, screen and (max-width: 40em){ section.schedule .accordion-item .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -1rem; content: "+"; font-size: 1.1875rem; } } section.schedule .is-active>.accordion-title::before { content: "–"; } @media print, screen and (max-width: 40em){ section.welcome .section-head { padding: 0; padding-top: 2.5rem; padding-bottom: 2.5rem; } } .title-bar { padding: 0.5rem; background: #f8f8ff; color: #fefefe; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .dropdown.menu>li>a { background: #f8f8ff; padding: 0.7rem 1rem; } .sticky-shrinknav-menu { position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: 0; height: 4rem; /* line-height: 3.75rem; */ width: 100%; background-color: rgba(248, 248, 255, 1); transition: all 0.5s ease; } .sticky-shrinknav-menu a { color: #8b8db9; display: block; font-weight: 500; text-transform: uppercase; line-height: 1; font-size: 0.9em; } .sticky-shrinknav-menu a:hover span { color: #004db8; } .sticky-shrinknav-header-title { transition: all 0.3s ease; position: relative; -webkit-transform: translateY(-1.875rem); -ms-transform: translateY(-1.875rem); transform: translateY(-1.875rem); margin-bottom: 0; color: #fefefe; } .sticky-shrinknav-header { width: 100%; height: 100px; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; background-color: #004ab8; text-align: center; position: fixed; top: 0; left: 0; overflow: hidden; transition: all 0.5s ease; z-index: 10; } body.sticky-shrinknav-wrapper { padding-top: 100px; } body.sticky-shrinknav-wrapper .sticky-shrinknav-header { height: 4rem; background-color: rgba(0, 77, 184, 0.9); } body.sticky-shrinknav-wrapper .sticky-shrinknav-header .sticky-shrinknav-header-title { -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); transition: all 0.3s ease; } .header-shadow { box-shadow: 0 1px 2px 0 rgb(60 64 67 / 30%), 0 2px 6px 2px rgb(60 64 67 / 15%) !important; } body { padding-top: 100px; } .itemi { padding:15px; } .top_nav { background: #ffcb0f none repeat scroll 0 0; overflow: hidden; padding: 10px 0; } .list-inline.info { float: left; margin: 0; } .list-inline.info > li { padding: 0 20px 0 0; } .list-inline.info a,.list-inline.social_icon a { color: #222; font-family: 'futura_ltbook', sans-serif; } .list-inline.info a:hover,.list-inline.social_icon a:hover { color: #555; } .list-inline.info a .fa,.list-inline.social_icon a .fa { font-size: 20px; vertical-align: text-top; } .list-inline.social_icon { float: right; margin: 0; } .topnav-links { color: #ffffff; transition: .2s ease-in-out; } .topnav-links:hover { color: #ffffff; transform: scale(1.2); -webkit-text-stroke: 0.2px #FDD007; } .topnav-links:visited, .topnav-links:active, .topnav-links:link { color: #ffffff; } .topnav-button { margin: 0; padding: 0.6em 2.5em; } .toppnav { margin-right: auto; margin-left: auto; max-width: 75rem; } .languageicon img { margin-top:3px; width:52px; -webkit-transition: .2s ease-in-out; transition: .2s ease-in-out; } .languageicon:hover img{ transform: scale(1.1); } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; -webkit-transition: opacity 0.5s ease, visibility 0.5s ease; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; height: 100%; -webkit-transition: -webkit-transform 0.5s ease; transition: -webkit-transform 0.5s ease; transition: transform 0.5s ease; transition: transform 0.5s ease, -webkit-transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #f8f8ff; /*#e6e6e6*/ } .off-canvas h5 { padding: 0.6875rem 1rem; margin: 0; color: #f8f8ff; background-color: #004db8; font-size: 1.25em; font-weight:normal; } .off-canvas ul.menu li a { padding: 0.5rem 0.75rem; /*background-color: red !important; */ color: #004db8; } .off-canvas .menu li a:hover { background-color: #dfdfe6 !important;/*f5f5f5*/ color: #004db8; } .off-canvas ul.menu li a i { color: #004db8; } .off-canvas .menu li a:hover i { color: #004db8; -webkit-text-stroke: 0.2px #004db8; -webkit-transform: scale(1.25, 1.25); -ms-transform: scale(1.25, 1.25); transform: scale(1.25, 1.25); -webkit-transition: .2s ease-in-out; transition: .2s ease-in-out; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { -webkit-box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; -webkit-transition: -webkit-transform 0.5s ease; transition: -webkit-transform 0.5s ease; transition: transform 0.5s ease; transition: transform 0.5s ease, -webkit-transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { -webkit-box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -webkit-transform: translateX(-250px); -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -webkit-transform: translateX(-250px); -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -webkit-transform: translateX(250px); -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { -webkit-box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -webkit-transform: translateX(250px); -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -webkit-transform: translateX(250px); -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -webkit-transform: translateX(-250px); -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { -webkit-box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -webkit-transform: translateY(-250px); -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -webkit-transform: translateY(-250px); -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -webkit-transform: translateY(250px); -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { -webkit-box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -webkit-transform: translateY(250px); -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -webkit-transform: translateY(250px); -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -webkit-transform: translateY(-250px); -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { -webkit-box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { -webkit-transition: -webkit-transform 0.5s ease; transition: -webkit-transform 0.5s ease; transition: transform 0.5s ease; transition: transform 0.5s ease, -webkit-transform 0.5s ease; } .off-canvas-content.has-transition-push { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -webkit-transform: none; -ms-transform: none; transform: none; z-index: 12; -webkit-transition: none; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -webkit-transform: none; -ms-transform: none; transform: none; z-index: 12; -webkit-transition: none; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -webkit-transform: none; -ms-transform: none; transform: none; z-index: 12; -webkit-transition: none; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -webkit-transform: none; -ms-transform: none; transform: none; z-index: 12; -webkit-transition: none; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64em) { .position-left.reveal-for-large { -webkit-transform: none; -ms-transform: none; transform: none; z-index: 12; -webkit-transition: none; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -webkit-transform: none; -ms-transform: none; transform: none; z-index: 12; -webkit-transition: none; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -webkit-transform: none; -ms-transform: none; transform: none; z-index: 12; -webkit-transition: none; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -webkit-transform: none; -ms-transform: none; transform: none; z-index: 12; -webkit-transition: none; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; -webkit-transition: none; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { -webkit-box-shadow: none; box-shadow: none; -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 64em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; -webkit-transition: none; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { -webkit-box-shadow: none; box-shadow: none; -webkit-transform: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } .close-button { position: absolute; z-index: 10; color: #f8f8ff; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 1; } .close-button:hover, .close-button:focus { color: #8a8a8a; } /*#8a8a8a*/ .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .off-canvas .menu li { outline: none; }