/* Theme Name: Footsteps Conversation Theme Theme URI: http://www.footstepconversations.co.uk Author: Andy Moyle Author URI: http://www.themoyles.co.uk Description: Version: 4.6.1 Text Domain: church-admin-theme */ /******************************************* * * Reset (https://github.com/hankchizljaw/modern-css-reset) * ********************************************/ *,::after,::before{box-sizing:border-box}ol[class],ul[class]{padding:0}blockquote,body,dd,dl,figure,h1,h2,h3,h4,ol[class],p,ul[class]{margin:0}html{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}ol[class],ul[class]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}article>*+*{margin-top:1em}button,input,select,textarea{font:inherit}@media (prefers-reduced-motion:reduce){*{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important;scroll-behavior:auto!important}} /*************************************************************** * * Basic * ****************************************************************/ .author-bio,.comments-wrap{margin:36px auto;max-width:720px;padding-left:16px;padding-right:16px}.site-header-image{display:block;margin:auto}.alignleft{float:left}.alignright{float:right}.aligncenter{clear:both;display:block}.author-bio .avatar{border:1px solid #dee2e6;border-radius:50%}.wp-block-cover-text p{padding:1.5em 16px}@media screen and (min-width:768px){.wp-block-cover-text p{padding:1.5em 0}}ul.wp-block-latest-posts.alignfull,ul.wp-block-latest-posts.alignwide,ul.wp-block-latest-posts.is-grid.alignwide{padding:0 16px}@media screen and (min-width:768px){.entry-content,.entry-header{font-size:calc(1rem + 0.375*(100vw - 768px)/432);font-weight:300;line-height:inherit}.entry-header h1{font-size:calc(2.5rem + 0.9375*(100vw - 768px)/432)}}@media screen and (min-width:1200px){.entry-content,.entry-header{font-size:1.375rem}.entry-header h1{font-size:3.4375rem}}.more-link{display:block}.wp-block-code{padding:.5em 1em;margin:0 0 1.5rem}.entry-content ol,.entry-content ul:not(.blocks-gallery-grid){margin:0 auto 1.5em;max-width:720px;list-style-position:outside}.entry-content li{margin-left:2.5em}.entry-content ol ol,.entry-content ol ul,.entry-content ul ol,.entry-content ul ul{margin:0 auto}.entry-content ol ol li,.entry-content ol ul li,.entry-content ul ol li,.entry-content ul ul li{margin-left:0}.wp-block-quote{margin-left:16px;margin-right:16px;padding:0}.wp-block-quote>*{margin-left:1rem}.wp-block-quote.is-large,.wp-block-quote.is-style-large{margin:36px auto;padding:0}.wp-block-quote.is-large cite,.wp-block-quote.is-large footer,.wp-block-quote.is-style-large cite,.wp-block-quote.is-style-large footer{font-size:13px;font-size:.8125rem}@media screen and (min-width:768px){.wp-block-quote{margin:48px auto}}.wp-block-pullquote>p:first-child{margin-top:0}.wp-block-pullquote.alignright{margin-left:2rem}.wp-block-pullquote.alignleft{margin-right:2rem} ul.dropdown-menu{columns:2} .nav-link a{color:#FFF} /*a.dropdown-item{color:#000;padding:0!important}*/ .entry-content>.alignfull>img{width:100vw}@media screen and (min-width:768px){.entry-content>*{padding-left:0;padding-right:0}}.wp-block-columns{padding-right:1rem;padding-left:1rem}.wp-block-separator{margin:3em auto;padding:0}.wp-block-group>.wp-block-group__inner-container>*{max-width:720px;margin-left:auto;margin-right:auto}.wp-block-group>.wp-block-group__inner-container>.alignwide{width:100vw;max-width:1100px;margin:1.5em 0 1.5em 50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.wp-block-group>.wp-block-group__inner-container>.alignfull{width:100vw;max-width:100vw;margin:1.5em 0 1.5em 50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.wp-block-group.has-background>.wp-block-group__inner-container>:first-child{margin-top:0}.wp-block-group.has-background>.wp-block-group__inner-container>.alignfull{width:calc(100% + 60px);max-width:calc(100% + 60px);position:relative;left:-30px}.size-auto,.size-full,.size-large,.size-medium,.size-thumbnail,img{max-width:100%;height:auto}.wp-block-image img{display:block}.wp-block-image.alignleft,.wp-block-image.alignright{width:100%}.wp-block-image.alignfull img{width:100vw}.wp-block-image .alignleft figcaption,.wp-block-image .alignleft img,.wp-block-image .alignright figcaption,.wp-block-image .alignright img{max-width:100%;width:100%}.wp-block-gallery.alignfull,.wp-block-image .alignfull{width:100vw}.wp-block-gallery.alignleft,.wp-block-gallery.alignright,.wp-block-image .alignleft,.wp-block-image .alignright{max-width:344px}.wp-block-gallery.alignright,.wp-block-image .alignright{margin-left:2rem}.wp-block-gallery.alignleft,.wp-block-image .alignleft{margin-right:2rem}.wp-block-embed.type-video>.wp-block-embed__wrapper{position:relative;width:100%;height:0;padding-top:56.25%}.wp-block-embed.type-video>.wp-block-embed__wrapper>iframe{position:absolute;width:100%;height:100%;top:0;left:0;bottom:0;right:0}.wp-block-video video{max-width:720px}.wp-block-table{overflow-x:auto;margin:1.5rem0}.wp-block-table table{border-collapse:collapse}.wp-block-table td,.wp-block-table th{padding:.5em}#comments,#reply-title{margin-top:1.5rem;margin-bottom:1rem}.commentlist,.commentlist ul{padding-left:0}.commentlist li{padding:1rem}.comment-meta{margin-bottom:1rem}.comment>.children{margin-top:1rem;margin-right:-.625rem;margin-bottom:-1.625rem}body{display:-webkit-box;display:flex;min-height:100vh;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}main{-webkit-box-flex:1;flex:1 0 auto}#site-footer{background-color:#f3f4f5} /*fix broken margins for content within .entry-content (collapsing margins)*/ .entry-content{padding:10px 0;} /*************************************************************** * * Base * ****************************************************************/ .author-bio,.comments-wrap{margin:36px auto;max-width:720px;padding-left:16px;padding-right:16px}.site-header-image{display:block;margin:auto}.alignleft{float:left}.alignright{float:right}.aligncenter{clear:both;display:block}.author-bio .avatar{border:1px solid #dee2e6;border-radius:50%}.wp-block-cover-text p{padding:1.5em 16px}@media screen and (min-width:768px){.wp-block-cover-text p{padding:1.5em 0}}ul.wp-block-latest-posts.alignfull,ul.wp-block-latest-posts.alignwide,ul.wp-block-latest-posts.is-grid.alignwide{padding:0 16px} .bg-purple{background-color:#5b2b51!important;} /*************************************************************** * * Base * ****************************************************************/ .purpleMenu{background-color:#56529C!important} /*************************************************************** * * Code * ****************************************************************/ .wp-block-code{padding: 0.5em 1em;margin: 0 0 1.5rem;} /*************************************************************** * * Comments * ****************************************************************/ #comments,#reply-title{margin-top:1.5rem;margin-bottom:1rem}.commentlist,.commentlist ul{padding-left:0}.commentlist li{padding:1rem}.comment-meta{margin-bottom:1rem}.comment>.children{margin-top:1rem;margin-right:-.625rem;margin-bottom:-1.625rem} /*************************************************************** * * Embeds * ****************************************************************/ .wp-block-embed.type-video>.wp-block-embed__wrapper{position:relative;width:100%;height:0;padding-top:56.25%}.wp-block-embed.type-video>.wp-block-embed__wrapper>iframe{position:absolute;width:100%;height:100%;top:0;left:0;bottom:0;right:0}.wp-block-video video{max-width:720px} /*************************************************************** * * Footer * ****************************************************************/ body{display:flex;min-height:100vh;flex-direction:column}main{flex:1 0 auto}#site-footer{background-color:#f3f4f5;color:#FFF;display:block; } .bottomline a{color:white;text-decoration:underline;} .dashicons-large{font-size:2em;width:auto;height:auto} .dashicons{text-decoration:none!important;} /*************************************************************** * * Groups * ****************************************************************/ .wp-block-group>.wp-block-group__inner-container>*{max-width:720px;margin-left:auto;margin-right:auto}.wp-block-group>.wp-block-group__inner-container>.alignwide{width:100vw;max-width:1100px;margin:1.5em 0 1.5em 50%;transform:translateX(-50%)}.wp-block-group>.wp-block-group__inner-container>.alignfull{width:100vw;max-width:100vw;margin:1.5em 0 1.5em 50%;transform:translateX(-50%)}.wp-block-group.has-background>.wp-block-group__inner-container>:first-child{margin-top:0}.wp-block-group.has-background>.wp-block-group__inner-container>.alignfull{width:calc(100% + 60px);max-width:calc(100% + 60px);position:relative;left:-30px} /*************************************************************** * * Images and galleries * ****************************************************************/ .size-auto,.size-full,.size-large,.size-medium,.size-thumbnail,img{max-width:100%;height:auto}.wp-block-image img{display:block}.wp-block-image.alignleft,.wp-block-image.alignright{width:100%}.wp-block-image.alignfull img{width:100vw}.wp-block-image .alignleft figcaption,.wp-block-image .alignleft img,.wp-block-image .alignright figcaption,.wp-block-image .alignright img{max-width:100%;width:100%}.wp-block-gallery.alignfull,.wp-block-image .alignfull{width:100%}.wp-block-gallery.alignleft,.wp-block-gallery.alignright,.wp-block-image .alignleft,.wp-block-image .alignright{max-width:calc((720px / 2) - 16px)}.wp-block-gallery.alignright,.wp-block-image .alignright{margin-left:2rem}.wp-block-gallery.alignleft,.wp-block-image .alignleft{margin-right:2rem} img.alignfull{object-fit:cover;} /*************************************************************** * * Layout * ****************************************************************/ /*.entry-content{margin:48px auto;max-width:1000px;padding-left:16px;padding-right:16px}*/ .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide), .tw-text-width-wide .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {width:60vw;max-width:1000px;margin:0px auto;} @media screen and (max-width:768px){ .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide), .tw-text-width-wide .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {width:80vw;margin:0px auto;} } .entry-content>.alignwide,.wp-block-gallery.alignwide,.wp-block-image.alignwide{width:100vw;max-width:1000px;margin:0 auto;} .entry-content>.alignfull>img{width:100vw}@media screen and (min-width:768px){.entry-content>*{padding-left:0;padding-right:0}} .wp-block-columns .alignfull{padding-right:5rem;padding-left:5rem} .wp-block-separator{margin:3em auto;padding:0} .wp-block-cover__inner-container{max-width:1000px; margin:0px auto;} .right-border{border-right:1px solid #CCC} .has-text-align-center{text-align: center!important;} /*************************************************************** * * Lists * ****************************************************************/ .entry-content ol,.entry-content ul:not(.blocks-gallery-grid){margin:0 auto 1.5em auto;max-width:720px;list-style-position:outside}.entry-content li{margin-left:2.5em}.entry-content ol ol,.entry-content ol ul,.entry-content ul ol,.entry-content ul ul{margin:0 auto}.entry-content ol ol li,.entry-content ol ul li,.entry-content ul ol li,.entry-content ul ul li{margin-left:0} #sidebar ul li{list-style-type:none;} #sidebar ul{padding-left:0;} /*************************************************************** * * Quotes * ****************************************************************/ .wp-block-quote{margin-left:16px;margin-right:16px;padding:0}.wp-block-quote>*{margin-left:1rem}.wp-block-quote.is-large,.wp-block-quote.is-style-large{margin:36px auto;padding:0}.wp-block-quote.is-large cite,.wp-block-quote.is-large footer,.wp-block-quote.is-style-large cite,.wp-block-quote.is-style-large footer{font-size:13px;font-size:.8125rem}@media screen and (min-width:768px){.wp-block-quote{margin:48px auto}}.wp-block-pullquote>p:first-child{margin-top:0}.wp-block-pullquote.alignright{margin-left:2rem}.wp-block-pullquote.alignleft{margin-right:2rem} /*************************************************************** * * Tables * ****************************************************************/ .wp-block-table{overflow-x:auto;margin:1.5rem0}.wp-block-table table{border-collapse:collapse}.wp-block-table td,.wp-block-table th{padding:.5em} /*************************************************************** * * Typography * ****************************************************************/ body{ font-size: 1.375rem;} @media screen and (min-width:768px){.entry-content,.entry-header{font-size:calc(1rem + (1.375 - 1) * ((100vw - 768px)/ (1200 - 768)));font-weight:300;line-height:inherit}.entry-header h1{font-size:calc(2.5rem + (3.4375 - 2.5) * ((100vw - 768px)/ (1200 - 768)))}}@media screen and (min-width:1200px){.entry-content,.entry-header{font-size:1.375rem}.entry-header h1{font-size:3.4375rem}} strong{font-weight: 700;} .entry-content p{margin:0 auto;text-align:left;overflow:hidden;text-overflow:ellipsis;padding-bottom:10px}.entry-content li{text-align:left;} h2,h3{text-align:left;padding-top:25px;} @media screen and (max-width:768px){ .has-huge-font-size, .has-larger-font-size {font-size: 1.375rem;} } /*************************************************************** * * Hero and Parallax * ****************************************************************/ .hero-image{width:100vw;height:calc(100vw/3);} .headerBG{width:100vw;height:calc(100vw/3)} .header-logo{position:relative;top:10%;margin:0 auto;height:75%;width:auto;z-index:9999;} .header-title{position:relative;top:10%;margin:0 auto;text-align:center;} .main-title{text-shadow: 2px 2px 7px rgba(154, 150, 150, 1);text-transform:uppercase;font-size:calc(4rem + 0.9375*(100vw - 768px)/432);margin:0 auto;position:relative;top:40%;text-align:center;color:#FFF;font-family: 'Varela Round','Helvetica Neue',Arial,sans-serif;} .sub-title{text-transform:uppercase;font-size:24px;margin:0 auto;position:relative;top:50%;text-align:center;color:#FFF;} /* Parallax for front page */ .parallax-header{ /* Set a specific height */ max-height: 600px; height:calc(100vw/3); width:100%;margin-top:60px; /* Create the parallax scrolling effect */ background-attachment: fixed; background-position: center top; background-repeat: no-repeat; background-size: contain; } .parallax{ /* Set a specific height */ height: 600px; width:100vw; /* Create the parallax scrolling effect */ background-attachment: fixed; background-repeat: no-repeat; background-size: cover; background-size: cover; background-position: 50%; } .parallax-section{padding:20px 0px;} /*************************************************************** * * Widgets * ****************************************************************/ .main-widget{border-radius:5px;margin:10px;padding:10px} .widget-transparent-container{ width:100%;list-style:none;padding:10px;color:#FFF;} .navbar { margin-bottom: 0; } .widget-container{ width:100%;background:rgba(255,255,255,0.1); border-radius:5px;list-style:none;padding:10px;color:#FFF;} .widget-container a,.widget-white-container a{color:#FFF;text-decoration:underline} @media (min-width:900px){.widget_categories ul{columns:3}} /*************************************************************** * * Blockquote * ****************************************************************/ blockquote{ padding: 1.25rem!important; margin: 1.25rem; border: 1px solid #eee; border-left-width: .25rem; border-radius: .25rem; font-style:italic } blockquote.info{border-left-color: #5bc0de;} blockquote.danger{border-left-color:#dc3545} blockquote.warning{border-left-color:#ffc107} blockquote.primary{border-left-color:#007bff} /*************************************************************** * * Click to Tweet * ****************************************************************/ .wp-block-church-admin-theme-click-to-tweet,.click-to-tweet{ position: relative; padding: 40px!important; margin: 1.25rem; border: 1px solid #CCCCCC; border-radius: .25rem; font-style:italic; background:#f5f8fa; } .wp-block-church-admin-theme-click-to-tweet-link a,.click-to-tweet-link a{color:#657786!important;} .wp-block-church-admin-theme-click-to-tweet-link span,.click-to-tweet-link span{color:#657786!important;} .wp-block-church-admin-theme-click-to-tweet-link,.click-to-tweet-link{ display: block; position: absolute; right:10px; bottom:10px; font-size:smaller } a.fa-twitter{color:rgb(29, 161, 242);} /*************************************************************** * * App demo * ****************************************************************/ .app-phone{border:40px solid #ddd;border-width:55px 7px;border-radius:40px;margin:50px auto;overflow:hidden;transition:all .5s ease}.app-phone iframe{border:0;width:100%;height:100%}.app-phone.view_1{transform:rotateX(50deg) rotateY(0) rotateZ(-50deg);box-shadow:-3px 3px 0 #bbb,-6px 6px 0 #bbb,-9px 9px 0 #bbb,-12px 12px 0 #bbb,-14px 10px 20px #666}.app-phone.view_2{transform:rotateX(0) rotateY(-60deg) rotateZ(0);box-shadow:5px 1px 0 #bbb,9px 2px 0 #bbb,12px 3px 0 #bbb,15px 4px 0 #bbb,0 7px 20px #999}.app-phone.view_3{transform:rotateX(0) rotateY(0) rotateZ(0);box-shadow:0 3px 0 #bbb,0 4px 0 #bbb,0 5px 0 #bbb,0 7px 0 #bbb,0 10px 20px #666}#app-controls{position:absolute;top:20px;left:20px;font-size:.9em;color:#333}#app-controls div{margin:10px}#app-controls div label{width:120px;display:block;float:left}#app-views button{width:198px;border:1px solid #bbb;background-color:#fff;height:40px;margin:10px 0;color:#666;transition:all .2s}#app-views button:hover{color:#444;background-color:#eee}@media (max-width:900px){#app-wrapper{transform:scale(.8,.8)}}@media (max-width:700px){#app-wrapper{transform:scale(.6,.6)}}@media (max-width:500px){#app-wrapper{transform:scale(.4,.4)}} /* Wave container */ .wp-block-church-admin-theme-wave-top-container{padding:0;} .wp-block-church-admin-theme-wave-top-container .wp-block-columns{max-width:1000px; margin:0 auto;} .church-admin-theme-wave-inner,.church-admin-theme-waves-inner{min-height:250px; margin:0 auto; padding:50px 0px;max-width:1000px;} /*************** * * Colours * ***************/ .danger-color{color:#FF4444} .danger-color-dark{color:#CC0000} .warning-color{color:#FFBB33} .warning-color-dark{color:#FF8800} .success-color{color:#00C851} .success-color-dark{color:#007E33} .info-color{color:#33B5E5} .info-color-dark{color:#0099CC} .text-white a{color:#FFFFFF;text-decoration:underline} .text-dark a{color:#000000;text-decoration:underline} .has-background-dim a{color:white;text-decoration:none;} /* Light blue to white */ .has-light-blue-to-white-gradient-background { background: linear-gradient(180deg, rgba(0,101,155,0.5) 0%, rgba(255,255,255,1) 100%); } /* Blue to white */ .has-blue-to-white-gradient-background { background: linear-gradient(180deg, rgba(0,101,155,1) 0%, rgba(255,255,255,1) 100%); } /* Dark blue to white */ .has-dark-blue-to-white-gradient-background { background: linear-gradient(180deg, rgba(0,101,155,1) 0%, rgba(255,255,255,1) 100%); } /* Blue to dark blue */ .has-blue-to-dark-blue-gradient-background { background: linear-gradient(180deg, rgba(0,101,155,1) 0%, rgba(29,39,53,1) 100%); } /* Light blue to black */ .has-light-blue-to-black-gradient-background { background: linear-gradient(180deg, rgba(0,101,155,0.5) 0%, rgba(0,0,0,1) 100%); } /* Blue to black */ .has-blue-to-black-gradient-background { background: linear-gradient(180deg,rgba(0,101,155,1) 0%,rgba(0,0,0,1) 100%); } .church-admin-cover-top:before { background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDBweCIgdmlld0JveD0iMCAwIDEyODAgMTQwIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGZpbGw9IiMwMDAwMDAiPjxwYXRoIGQ9Ik0xMjgwIDBMNjQwIDcwIDAgMHYxNDBsNjQwLTcwIDY0MCA3MFYweiIgZmlsbC1vcGFjaXR5PSIuNSIvPjxwYXRoIGQ9Ik0xMjgwIDBIMGw2NDAgNzAgNjQwLTcweiIvPjwvZz48L3N2Zz4=); background-size: 100% 100px; background-repeat:none; top: 0px; height: 100px; z-index: 1; } .church-admin-cover-bottom:after{ background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+Cjxzdmcgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEyODAgMTAwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zOnNlcmlmPSJodHRwOi8vd3d3LnNlcmlmLmNvbS8iIHN0eWxlPSJmaWxsLXJ1bGU6ZXZlbm9kZDtjbGlwLXJ1bGU6ZXZlbm9kZDtzdHJva2UtbGluZWpvaW46cm91bmQ7c3Ryb2tlLW1pdGVybGltaXQ6MjsiPgogICAgPGcgdHJhbnNmb3JtPSJtYXRyaXgoLTAuOTk5OTk3LDAuMDAyMzYyOTgsLTAuMDAyMzYyOTgsLTAuOTk5OTk3LDEyODAuMTIsOTguNDg3NikiPgogICAgICAgIDxwYXRoIGQ9Ik0xMjgwLDBMNjQwLDUwTDAsMEwwLDEwMEw2NDAsNTBMMTI4MCwxMDBMMTI4MCwwWiIgc3R5bGU9ImZpbGwtb3BhY2l0eTowLjU7ZmlsbC1ydWxlOm5vbnplcm87Ii8+CiAgICAgICAgPHBhdGggZD0iTTEyODAsMEwwLDBMNjQwLDUwTDEyODAsMFoiIHN0eWxlPSJmaWxsLXJ1bGU6bm9uemVybzsiLz4KICAgIDwvZz4KPC9zdmc+Cg==); background-size: 100% 100px; background-repeat:none; top: 0px; height: 100px; z-index: 1; } .church-admin-theme-waves{ position:relative;top:0;z-index:999; width: 100%; height:150px; margin-bottom:-7px; /*Fix for safari gap*/ min-height:100px; max-height:150px;} /* Animation */ .church-admin-theme-waves{background:#FFF} .church-admin-theme-wave-container{background:#00F;} .wave-parallax > use { animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite; } .wave-parallax > use:nth-child(1) { animation-delay: -2s; animation-duration: 7s; } .wave-parallax > use:nth-child(2) { animation-delay: -3s; animation-duration: 10s; } .wave-parallax > use:nth-child(3) { animation-delay: -4s; animation-duration: 13s; } .wave-parallax > use:nth-child(4) { animation-delay: -5s; animation-duration: 20s; } @keyframes move-forever { 0% { transform: translate3d(-90px,0,0); } 100% { transform: translate3d(85px,0,0); } } /**************************** * Card *****************************/ .church-admin-theme-card{ border-radius: 20px; text-align: center; transition: all 200ms cubic-bezier(0.33, 0, 0.19, 1); position: relative; overflow: hidden; margin-bottom: 3em; transform: scale3d(1,1,1) translateY(0); box-shadow: 0 0 11px rgba(33,33,33,.2); transform: translateX(0px); margin-top:50px; } .church-admin-theme-card:hover{box-shadow: 0 0 22px rgba(33,33,33,.2);transform: translateY(-5px); } .church-admin-theme-card .church-admin-theme-card-content{width: 100%; padding: 1em; height: 100%;} .church-admin-theme-card h2{padding-top:0;} .church-admin-theme-card .image img{ width: 100%;height: auto;} /*************************************************************** * * Menu * ****************************************************************/ .navbar-brand,.nav-item a{text-decoration:none!important;} .dropdown-menu a{color:#343a40;} .navbar-toggler-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");color:#FFF;} /*************************** * DARK MODE ***************************/ .church-admin-theme-dark-theme, .church-admin-theme-dark-theme #site-footer { background-color: #19191c !important; color: #e8eaed !important; } .church-admin-theme-dark-theme .church-admin-directory,.church-admin-theme-dark-theme .church-admin-register,.church-admin-theme-dark-theme .church-admin-attendance,.church-admin-theme-dark-theme .church-admin-birthdays,.church-admin-theme-dark-theme .church-admin-calendar,.church-admin-theme-dark-theme .church-admin-giving,.church-admin-theme-dark-theme .church-admin-graph,.church-admin-theme-dark-theme .church-admin-member-map,.church-admin-theme-dark-theme .church-admin-ministries,.church-admin-theme-dark-theme .church-admin-my-rota,.church-admin-theme-dark-theme .church-admin-pledges,.church-admin-theme-dark-theme .church-admin-recent,.church-admin-theme-dark-theme .church-admin-rota,.church-admin-theme-dark-theme .ca-podcast-left-column,.church-admin-theme-dark-theme .ca-podcast-list,.church-admin-theme-dark-theme .church-admin-volunteer,.church-admin-theme-dark-theme .church-admin-service-booking,.church-admin-theme-dark-theme .church-admin-sessions,.church-admin-theme-dark-theme .church-admin-smallgroups {background:#29292C;border:1px SOLID #29292C;} .church-admin-theme-dark-theme a {color:#e8eaed} .church-admin-theme-dark-theme .church-admin-directory,.church-admin-theme-dark-theme .church-admin-address-entry,.church-admin-theme-dark-theme .church-admin-address-entry a,.church-admin-theme-dark-theme .church-admin-letter .church-admin-item,.church-admin-theme-dark-theme .church-admin-directory-name {color:#D9E2E2} .church-admin-theme-dark-theme .church-admin-letters,.church-admin-theme-dark-theme .church-admin-address-entry,.church-admin-dark-mode-blue-grey .church-admin-birthdays td,.church-admin-dark-mode-blue-grey .church-admin-birthdays th{border:1px solid #D9E2E2!important} .church-admin-theme-dark-theme .church-admin-letter{border-top: 1px solid #8c98a4;border-bottom: 1px solid #8c98a4;background:#2E455B} .church-admin-theme-dark-theme .church-admin-letter .church-admin-highlighted{background:#19191c;} .church-admin-theme-dark-theme .church-admin-highlighted-name {background:#19191c;} .church-admin-theme-dark-theme .church-admin-address-title, .church-admin-theme-dark-theme .church-admin-register-title, .church-admin-theme-dark-theme .church-admin-birthdays th{background:#273E54;} .church-admin-theme-dark-theme .dropdown-menu{background:#8c98a4!important} .church-admin-theme-dark-theme .church-admin-address-search{padding-bottom:10px;} .church-admin-theme-dark-theme .ca-search-field{border:2px SOLID #e8eaed!important;background:#19191c!important;color:#D9E2E2!important;margin:0 0!important ;} .church-admin-theme-dark-theme .ca-search-field:placeholder{color:#D9E2E2!important} .church-admin-theme-dark-theme .ca-search-submit,.church-admin-theme-dark-theme .church-admin-register-button{background:#e8eaed!important;border-radius:15px;} .church-admin-theme-dark-theme .church-admin-register-button{margin:5px 10px;padding:10px} .church-admin-theme-dark-theme .church-admin-register .church-admin-register-title,.church-admin-theme-dark-theme p,.church-admin-theme-dark-theme h2,.church-admin-theme-dark-theme h3{padding:10px;} .church-admin-theme-dark-theme td,.church-admin-theme-dark-theme th{border:1px solid #19191c} .church-admin-theme-dark-theme input[type="text"],.church-admin-theme-dark-theme input[type="number"],.church-admin-theme-dark-theme input[type="email"],.church-admin-theme-dark-theme select{width:95%; margin:0 auto;border:2px SOLID #e8eaed!important;background:#3d3d45!important;color:#e8eaed!important} .church-admin-theme-dark-theme textarea{width:95%;height:200px; margin:0 auto;border:2px SOLID #e8eaed!important;background:#3d3d45!important;color:#e8eaed!important;margin: 0 2.5%!important} .church-admin-theme-dark-theme .sermon-search{width:60%!important;margin:5px 2.5%!important} .church-admin-theme-dark-theme label,.church-admin-theme-dark-theme .church-admin-form-check{padding-left:2.5%} .church-admin-theme-dark-theme .church-admin-form-checkbox{border:2px SOLID #e8eaed!important;background:#19191c!important;color:#D9E2E2;} .church-admin-theme-dark-theme input[type="submit"]{background:#8c98a4!important;border:#8c98a4;border-radius:15px;margin-left:2.5%} .church-admin-theme-dark-theme table,.church-admin-theme-dark-theme .ca-upload-area{width:95%;margin:10px 2.5%;} .church-admin-theme-dark-theme .ca-current{background:#e8eaed;} .church-admin-theme-dark-theme .ca-calendar-nav {padding:5px; background:#e8eaed!important} .church-admin-theme-dark-theme .ca-inactive{background:#19191c} .church-admin-theme-dark-theme .church-admin-calendar{padding:10px 2.5%;} .church-admin-theme-dark-theme .ca-tabs{background:#19191c;color:#D9E2E2;border:1px solid #19191c;} .church-admin-theme-dark-theme .ca-tab{border:1px solid #19191c;} .church-admin-theme-dark-theme .ca-active-tab{background:#e8eaed;;color:#000;} .church-admin-theme-dark-theme .ca-media-list-item:nth-child(even), .church-admin-theme-dark-theme .ca-series-list-item:nth-child(even) { background-color: #19191c; border-color: #19191c;} .church-admin-theme-dark-theme .church-admin-theme-card{background:#3d3d45;} .church-admin-theme-dark-theme .ca-donate-form-widget .ca-row{background:#6c757d;color:#D9E2E2} .author-bio-col{ box-shadow: 0 15px 25px -25px gray; padding-bottom:10px } .author-bio-col:hover{box-shadow:none;} .author-image-wrapper{ margin:0 auto; background: #d33a2c; border: solid 8px #D33B2C; border-radius: 10px; transform: scale(.84) translateX(15%) rotateZ(calc(-1 * (11 * 1deg))); transform-origin: 0 100%; overflow: hidden; width: 205px; height: 205px; transition: transform .2s ease-out; } .author-image-wrapper:hover{transform: scale(.84) translateX(0%) rotateZ(0);} .author-image-image:hover{transform: scale(1.2) translateX(0%) rotateZ(0);} .author-image-image{ width: 200px; height: 200px; object-fit: cover; display: block; transform: scale(1.2) rotateZ(calc(11 * 1deg)); transition: transform .2s ease-out; } /* Flip Box */ /* The flip box container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */ .ca-flip-box { background-color: transparent; width: 300px; height: 350px; perspective: 1000px; /* Remove this if you don't want the 3D effect */ } /* This container is needed to position the front and back side */ .ca-flip-box-inner { position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.8s; transform-style: preserve-3d; border-radius:10px } .ca-flip-box-inner .image{border-top-left-radius: 10px;border-top-right-radius: 10px;} /* Do an horizontal flip when you move the mouse over the flip box container */ .ca-flip-box:hover .ca-flip-box-inner { transform: rotateY(180deg); } /* Position the front and back side */ .ca-flip-box-front, .ca-flip-box-back { position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; /* Safari */ backface-visibility: hidden; border-radius:10px } /* Style the front side */ .ca-flip-box-front { background: #e6e6e6; color: black; } /* Style the back side */ .ca-flip-box-back { background-color: #5FBA2B;; color: white; transform: rotateY(180deg); } .ca-flip-box-content{padding:20px} .european-mission-feed-lists { list-style-type: none; display: grid; grid-template-columns:auto auto auto;/* repeat(auto-fit,minmax(132px, 1fr)); */ } .european-mission-feed-lists li { text-align: justified; padding-bottom: 20px; text-justify: inter-word; } .christmas-button { position: relative; border: 1px solid transparent; border-radius: 6px; padding: 8px 16px; min-width: 8em; text-align: center; color: #fff; background-image: linear-gradient(to bottom, #f12828, #a00332, #9f0f31), linear-gradient(to bottom, #ae0034, #6f094c); background-clip: padding-box, border-box; background-origin: padding-box, border-box; box-shadow: inset 0 1px rgb(255 255 255 / .25), inset 0 -1px rgb(0 0 0 / .1), 0 2px 4px rgb(0 0 0 / .25); transition: .2s; will-change: transform; &:active { transform: scale(.92); filter: brightness(.8); } } .christmas-button-hat { position: absolute; top: -15px; left: -17px; height: 44px; filter: drop-shadow(0 2px 1px rgb(0 0 0 / .25)); }