element
CSS rule to apply only if element has BOTH classes
http://stackoverflow.com/questions/5796654/css-rule-to-apply-only-if-element-has-both-classes
...
.abc.xyz {
}
*/
/* fonts management: include the font of your choice from https://fonts.google.com/ */
/*
@import url("https://fonts.googleapis.com/css?family=Tangerine");
body {
font-family: 'Tangerine', serif;
font-size: 48px;
}
.section-title {
font-family: 'Tangerine', serif;
font-size: 88px;
}
.small-title {
font-family: 'Tangerine', serif;
font-size: 68px;
}
*/
/* there could be more font classes that need tackling! */
/* Start Customize Social Sharing USM Premium */
div.sfsi_plus_widget.sfsi_plus_shortcode_container {
padding-top: 10px;
}
/* End Customize Social Sharing */
/* CustomizeWidget Area */
.widget-area .widget {
padding:5px;
margin-bottom:5px;
}
/* Customize Visual Composer buttons */
.actionbutton {
font-weight: bold;
}
/* Customize Social Warefare Share buttons */
.sw-facebook {
width:50px !important;
font-size:20px !important;
}
.sw-twitter {
width:50px !important;
font-size:20px !important;
}
.sw-google-plus {
width:50px !important;
font-size:20px !important;
}
.sw-pinterest {
width:50px !important;
font-size:20px !important;
}
.swp_share {
width: 50px !important;
}
.nc_tweetContainer {
height:50px !important;
width: 50px !important;
}
.spaceManWilly {
height:60px !important;
}
/* End Social Warefare Share */
/* Force page background color */
div#page.hfeed.site {
background-color:white !important;
}
/* Formating Verse of the Day */
.verseoftheday {
font-size:25px;
line-height:1.2;
font-family: "Roboto";
color:#ffffff;
background-image: url("/wp-content/themes/plain-child/images/verse.png");
background-size:cover;
height:auto;
padding-top:15px;
padding-bottom:15px;
padding-left:35px;
padding-right:35px;
background-repeat:no-repeat;
text-align:center;
}
.verseofthedayplain {
font-size:25px;
line-height:1.2;
background-color:#dddddd;
background-size:cover;
height:auto;
padding-top:5px;
padding-bottom:15px;
padding-left:20px;
padding-right:20px;
text-align:left;
border-radius: 2px;
border:1px solid;
border-color: #aaaaaa;
}
/* End Formating Verse of the Day */
/* Formating Tabs Shortcode */
.tabclass1 {
font-size:17px !important;
}
.su-tabs-current {
background-color:#ffffff !important;
}
/* End Formating Tabs Shortcode */
/* Formating sidnav brand */
.sidenav {
background: #373737;
}
.sidenav-brand {
background: #373737;
border-bottom: 1px solid #049604;
}
.sidenav-header {
background: #009688;
border-bottom: 1px solid #009688;
padding-top: 10px;
padding-bottom: 9px;
}
.sidenav-menu a:hover {
background:#751515;
}
.sidenav-menu li {
padding-left: 1px;
}
.sidenav-menu a {
padding: 10px 32px;
}
/* End Formating sidnav brand */
/* Formating the filters */
.filter-filters {
font-size: 16px;
padding-right: 10px;
list-style: none; /*added by mhk on dec-19-2022 */
}
/* End Formating the filters */
/* Formating the cellcell owl */
.cell-cell-owl {
padding-top:10px;
padding-right:10px;
padding-bottom:15px;
}
.zoom-effect:hover img {
transform: scale(1.1);
transition: transform 2s;
}
.zoom-effect img {
transform: scale(1.0);
transition: transform 3s;
}
.cellcellby {
font-size: 0.7em;
color: #aaaaaa;
}
.cellcellsource {
font-size: 0.7em;
color: #aaaaaa;
}
.cellcellby a {
color: #888888 !important;
}
.cellcellsource a {
color: #888888 !important;
}
.cellcellbigtitle {
font-size:1.3em;
line-height:1.1em;
font-weight:bold;
}
.cellcelltitle {
/* font-size:20px; */
/* line-height:1em; */
font-size:1em;
line-height:1.1em;
text-align:left;
padding-top:5px !important;
padding-left:5px !important;
padding-right:5px !important;
padding-bottom: 20px !important;
color: #000000;
font-weight:bold;
}
.cellcelltitle a {
color: #000000;
}
.cellcelltopic {
margin-top: -15px;
padding-left: 0px;
font-size: 14px;
text-align: left;
}
div#cellcelltopic a {
b ackground:white;
padding-left: 2px;
padding-right: 4px;
}
@media only screen and (min-width: 765px) and (max-width: 1400px) {
.cellcellbigtitle {
font-size:1.3em;
line-height:1.1em;
}
.cellcelltitle {
padding-top:5px !important;
padding-left:5px !important;
padding-right:5px !important;
padding-bottom: 20px !important;
/* font-size:1.5vw; */
/* line-height:1.6vw; */
font-size:1em;
line-height:1.1em;
text-align:left;
}
.cellcelltopic {
margin-top: -13px;
padding-left: 0px;
font-size: 1vw;
text-align: left;
}
}
@media only screen and (max-width: 764px) {
.verseofthedayplain {
font-size:23px;
}
.verseoftheday {
font-size:23px;
}
.cellcellbigtitle {
font-size:1.3em;
line-height:1.1em;
}
.cellcelltitle {
padding-top:5px !important;
padding-left:5px !important;
padding-right:5px !important;
padding-bottom: 10px !important;
/* font-size:25px; */
/* line-height:1em; */
font-size:1.3em;
line-height:1.1em;
text-align:left;
}
.cellcelltopic {
margin-top: -13px;
padding-left: 0px;
font-size: 14px;
text-align: left;
}
}
/* End Formating the cellcell Owl */
/* Start Font Adjustment */
body {
font-size: 19px;
}
b,strong {
font-weight: 600;
color: rgb(40, 40, 40);
}
p {
color: rgb(20, 20, 20);
font-weight:300;
line-height: 1.58;
}
.joyride-info {
color: white; /* this fixes the tool tips info going black after the above p being black. */
}
li {
color: rgb(20, 20, 20);
font-weight: 300;
line-height: 1.58;
}
/* End Font Adjustment */
/* set the styles at the bismillah-row, including the hijri/greg date area
#roof {
background-color:whitesmoke;
color:black;
}
*/
/* date scripts color and css - this is a combination of roof>contact and the header-top-dae-script's span class */
.greg-date, .hijri-date {
color:gray;
}
#roof .quick-contacts span {
padding: 0 0px;
line-height: 30px;
letter-spacing: 0px;
font-family:helvetica;
font-size:10px;
}
#roof {
background: whitesmoke;
}
/* overwrite main.css clients scroller images being black and white and being 0.5 */
.clients-scroller img {
opacity: 0.9; /* used to be 0.5 */
filter: grayscale(10%); /* used to be 100 */
-webkit-filter: grayscale(10%);
filter: gray;
-webkit-transition: all .6s ease;
}
/* footer - make the final footer thinner */
footer#footer #copyright .row {
padding: 5px 0;
}/* this 5px used to be 40px */
/* fixes the ridiculous 75px gap between sections */
.site-row > .vc_row,
.site-row > .container > .vc_row {
margin-bottom: 0;
padding-top: 0px;
padding-bottom: 10px;
background: #fff;
}
/* this makes the highlights ( cell-team) article titles font smaller */
#team-block-2 .team-member .member-info h3 {
font-size: 23px;
}
/*make the search box like that of cc.com */
.full-search {
display: none;
position: absolute;
top: -45px; /* if you make it 0px, then you see menu bar from the top */
left: 0;
width: 100%;
background: #0a0a0a;
padding: 15px 0 12px;
padding-top: 50px; /* this is what pushes the search box */
z-index: 999;
height: 1500px;
opacity: 0.95;
}
/* make sure that team boxes ( regardless of the title being 1 or 2 lines ) always come at the same min height */
#team-block-2 .team-member {
padding-bottom: 15px;
border-bottom: 5px solid transparent;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
transition: all 0.2s linear;
background: #666;
border-bottom: 4px solid transparent;
min-height: 350px;
}
/* makes the titles in the team ( highlights ) bigger
#team-block-2 .team-member .member-info .desc {
font-size: 23px;
line-height: 1.3;
}
/* set the pge background color */
body.custom-background {
background-color: whitesmoke;
}
/* this is an attempt to pulse donate arrow */
/*Start: Moving arrow design*/
.moving-arrow {
height:18px;
width:24px;
z-index:99;
margin-top:-5px;
margin-left:3px;
-webkit-animation: pulsate 5s ease-out;
-moz-animation: pulsate 5s ease-out;
animation: pulsate 5s ease-out;
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
animation-iteration-count: infinite;
opacity: 0.2;
}
@-webkit-keyframes pulsate {
50% {-webkit-transform: scale(1.0, 1.0); opacity: 0.2;}
50% {opacity: 1.0;}
100% {-webkit-transform: scale(1.0, 1.0); opacity: 0.2;}
}
@-moz-keyframes pulsate {
50% {-webkit-transform: scale(1.0, 1.0); opacity: 0.2;}
50% {opacity: 1.0;}
100% {-webkit-transform: scale(1.0, 1.0); opacity: 0.2;}
}
@keyframes pulsate {
50% {-webkit-transform: scale(1.0, 1.0); opacity: 0.2;}
50% {opacity: 1.0;}
100% {-webkit-transform: scale(1.0, 1.0); opacity: 0.2;}
}
/*
.moving-arrow {
-webkit-animation: pulsate 3s ease-out;
-moz-animation: pulsate 3s ease-out;
animation: pulsate 3s ease-out;
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
animation-iteration-count: infinite;
opacity: 0.0;
}
@-webkit-keyframes pulsate {
0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
50% {opacity: 1.0;}
100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}
@-moz-keyframes pulsate {
0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
50% {opacity: 1.0;}
100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}
@keyframes pulsate {
0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
50% {opacity: 1.0;}
100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}
*/
/*End : Moving arrow design*/
/* takes care of the 5-10px gap between the nav bar and big image */
.navbar-plain.plain-nav-fixed {
background: #ffffff;
height: 25px;
line-height: 25px;
transition: 0.2s; /* this creates an effect as this class being applied. make it 2s and see it safari. */
}
/* this stops certain text ( such as news area ) to go uppercase*/
h1, h2, h3, h4 {
font-family: 'Roboto', sans-serif;
color: rgb(40, 40, 40);
}
/* remove the owl-carousel's controls 10px gap below the carousel images */
.owl-theme .owl-controls {
margin-top: 0px;
}
/*fixes the images appearing with less opacity in the blp-display-faith-like diy shortcode */
.service-item h2 {
opacity: 1; /* used to be 0.7 */
}
/* AMR BEGIN */
/* menu items */
.navbar-plain .navbar-nav > li > a {
margin: 20px 20px;
font-weight: 700;
font-size: 22px;
color: #947645;
}
@media only screen and (min-width: 1200px) and (max-width: 1400px) {
.navbar-plain .navbar-nav > li > a {
font-size: 1.7vw;
}
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
.navbar-plain .navbar-nav > li > a {
font-size: 1.3vw;
}
}
#menu-main-menu {
/*background-color: whitesmoke; */
}
/* AMR END */
/* takes care of the 5-10px gap between the nav bar and big image */
.navbar-plain {
background: #ffffff;
height: 70px; /* this left a small gap between the first item and the nav bar when it had 75px value. */
line-height: 70px;
}
/*no show for iphones*/
/*if you put a div with this calls in it, whatever in that div is a no-show below 764px - blp_wrap-> $do_not_show_for_smartphones='1'; which is 0 ( means 'show' ) by default */
@media (max-width: 764px) {
.no-show-smartphones{
display:none;
}
}
/*no show for iphones*/
/*if you put a div with this calls in it, whatever in that div is a no-show below 764px - blp_wrap-> $do_not_show_for_smartphones='1'; which is 0 ( means 'show' ) by default */
@media (max-width: 764px) {
.no-show-for-mobile{
display:none;
}
}
/* Start Section Title */
/* moved how tthe section title css is manged from functions.php to here -- wrap vars no longer pass title_css, they only pass $title_color='' which makes it a element based inline style that adds color to this intruction here */
@media (min-width: 768px) {
.section-title{
border-style: solid;
border-left: none;
border-top: none;
border-right: none;
border-bottom: none;
border-bottom-width: 1px;
width:100%;
text-align: left;
font-size: 30px !important;
padding-top:50px !important;
padding-bottom:1px !important; /* this seperates the green line from the bottom of the title*/
margin-top:0px !important;
margin-bottom: 13px !important; /* we use this instead of the padding-bottom because of the green line issue*/
color:#333333;
line-height: 1 !important;
/*color can be ovewritten by the $title_color wrap_variable for each blp shortcode */
/*note that section title styles here cannot be overwritten from the blp-wrap. these are global! */
}
}
@media (min-width: 768px) {
.section-title-with-underline {
border-bottom : thin solid;
}
}
@media (max-width: 767px) {
.section-title {
width:100%;
text-align: center;
font-size: 30px !important;
padding-top:40px !important;
padding-bottom:5px !important; /* this seperates the green line from the bottom of the title*/
margin-top:0px !important;
margin-bottom: 3px !important; /* we use this instead of the padding-bottom because of the green line issue*/
color:#333333;
line-height:1.0;
/*background: #aaaaaa;*/
}
}
/* End Section Title */
/* Start Team Cell */
@media (min-width: 1201px) {
.teamcelltitle {
font-size:24px;
line-height:26px;
color: white;
}
.teamcellauthor {
font-size:16px;
color: pink;
}
.teamcellviewcount {
font-size:16px;
color: white;
}
}
@media (min-width: 768px) and (max-width: 1200px) {
.teamcelltitle {
font-size:1.6vw;
line-height:1.7vw;
color: white;
}
.teamcellauthor {
font-size:1.3vw;
color: pink;
}
.teamcellviewcount {
font-size:1.3vw;
color: white;
}
}
@media (max-width: 767px) {
.teamcelltitle {
font-size:24px;
line-height:26px;
color: white;
}
.teamcellauthor {
font-size:15px;
color: pink;
}
.teamcellviewcount {
font-size:15px;
color: white;
}
}
/* End Team Cell */
/* reset the bootstraps main container an row classes to 0 like this so that container line is respected by all. when row div is used inside row ( and wrap does it like that ), row -15 was casing the content to go out of its container line! this fixes it. */
.container {
padding-left:0px;
padding-right:0px;
}
@media (max-width: 767px) {
.container {
padding-left:10px;
padding-right:10px;
}
}
.row {
margin-right: 0px;
margin-left: 0px;
}
/* this fixes the horizontal scroll bar when iphone slider is in use */
.vc_row {
margin-left: 0px !important;
margin-right: 0px !important;
}
/* this was added to overwrite the col-lg-X padding, like in cell_team. this must be added towards the end of the class list */
.no_side_padding {
padding-left:3px !important;
padding-right:3px !important;
margin-left:-1px; /* without this you get 1px border in response to certain brosser widths */
}
/*these instructions take care of the unexplainable gaps between col-lg based divs as it happened on the cell_team highlights rows=2,2,3 and resize window */
/* these did not help. I HAD TO EDIT THE MAIN.CSS IN THE PARENT THEME. look for n+5 there. */
/*
@media screen and (min-width: 1200px)
#team div:nth-child(n+5) {
padding-top: 0px !important;
}
@media (max-width: 1024px) and (min-width: 768px)
.team-item {
margin-bottom: 0px !important;
}
*/
/* these make the cover'flow's next/prev arrows more vsible */
.mightyslider_carouselCoverFlow_skin .mSButtons {
opacity: 1;
}
.mightyslider_carouselCoverFlow_skin .mSButtons {
position: absolute;
background: no-repeat 50% url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAACOCAYAAAAfFF6TAAAAGXRFW…PzBUKAQAn5mWuqRTXWNtgBzeRRi+qrLq5/Y0e5+a8AAwAF/XATBMytmwAAAABJRU5ErkJggg==);
background-size: 200px 71px;
width: 100px;
height: 100%;
margin: auto;
cursor: pointer;
/* opacity: 0; */
z-index: 1000;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
/* fixes the logo being so close to the nv bar bottom when in fixed mode*/
.navbar-plain.plain-nav-fixed {
height: 60px; /*used to be little less*/
}
/*removes the green line : issue 38 */
.section-title:before {
position: absolute;
content: " ";
width: 50px;
bottom: 15px;
margin-left: 0;
margin-right: 0;
border-bottom: 0px solid; /*used to be 3px*/
}
/* fixes the small device view of the navbar being too close*/
.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {
margin-right: 0px;
margin-left: 0px;
}
/* manages the display and not display of the search and login links on the hamburger menu / nav menu */
.navbar-plain .navbar-nav > li.search > a:before {
display: none;
}
.login {
display: none !important;
}
/* @media (max-width: 767px) {.navbar-plain .navbar-nav > li.search{display: none}} */
@media (max-width: 767px) {.navbar-plain .navbar-nav > li.search{display: block}}
@media (max-width: 767px) {
.login {
display: block !important;
}
}
/* Modify the hr to make it more visible */
hr {
background-color: #ccc;
border: 0;
height: 1px;
margin-bottom: 1.5em;
}
/* Reduce space obove title */
.blog-title {
font-size: 30px;
position: relative;
padding:5px 5px 15px 0px !important; /* top right bottom left */
margin-top: 0;
}
/*stop the spinning of the video/link icons when mouse overed on woodwork */
.mightyslider_carouselModern_skin .mSVideo:after,
.mightyslider_carouselModern_skin .mSFlash:after,
.mightyslider_carouselModern_skin .mSIframe:after,
.mightyslider_carouselModern_skin .mSLink:after {
opacity:0; /* this was not there, I added to make it not show. */
}
/*adjust the pure-drawer location, circle size */
.pure-toggle-label[data-toggle-label='left'] {
left: 35px;
right: auto;
width: 43px;
height: 38px;
top: 60px;
padding-left:4px;
font-size:13px;
}
/* removes the boxing around menu and allows the icon./image to appear withour borders */
.pure-toggle-label[data-toggle-label='left'] {
border: 0px solid #5d809d;
}
/* set logo height */
#logo {
height:41px;
}
/* Padding and adjutments for Logo and single page content */
/* desktop */
@media (min-width: 768px) and (max-width: 5000px) { /* if the width is greater than 767 and less than 5000, do this */
#logo {
margin-left: 60px !important;
/* width: 131px; */
margin-top:-20px; /*after removing the
li > a {
font-size: 25px; /* used to be 17px*/
line-height:1.2;
}
#logo {
margin-left: 50px !important;
margin-top: -30px; /* added on nav 16, after logo anchor is removed from the header.php */
}
*/ Amr 02-12-2021 */
main#main.site-main {
/* padding-left:10px;*/
/* padding-right:10px;*/
}
/*
#menu-icon {
display:none;
}
*/
}
/* TagCloud Styling */
.tag-cloud-star {
font-size:10px;
color:#c8c8c8;
}
/* Padding and adjutments for the archive titles */
.archive-page-title {
/*font-size:38px;*/
font-size:30px;
line-height: 0.9em;
}
h1.section-title.page-title {
/*padding-left: 55px;*/
/*padding-top: 14px !important;*/
padding-top: 8px !important;
display: inline-block;
vertical-align: middle;
line-height: 97%;
text-align:center;
}
@media (max-width: 767px) {
.archive-page-title {
/*font-size:31px;*/
font-size:20px;
line-height: 0.9em;
}
h1.section-title.page-title {
font-size:30px !important;
/*padding-top: 20px !important;*/
padding-top: 8px !important;
padding-left: 30px;
padding-right: 12px;
}
}
/* Added on 02-8-2021 */
.page-header {
min-height: 78px !important;
line-height: 78px !important;
/* background-color: #607966 !important; */
background-color: #929191 !important;
}
/* Joyride Style Override */
.joyride-tip-guide {
z-index: 10000 !important;
}
@media (min-width: 767px) {
.navbar-nav {
margin-top: 8px;
}
}
/* these styles were added after we remove the slidebars menu ( our second attempt of hamburger menus ) */
.navbar-plain.plain-nav-fixed {
height: 69px; /* used to be 60 */
}
.navbar-plain {
background: #ffffff;
height: 77px; /*used to be 60 */
}
/* this fixes the unnecessary gap right after the menu which became noticeable on November 16 */
.plain-logo-wrapper {
margin-bottom: -8px;
}
.full-search input[type="text"] {
width: 94%; /* this allows the X fo search closer to be at the same position as its opener */
}
/*fixes the orange topic index going underneath wen the menu comes on and scrolling takes place. */
.sidenav {
z-index: 10000;
}
/* meta data line-height adjustment and Font Size*/
.entry-meta {
line-height: 15px !important;
padding-bottom:8px;
font-size: 10px;
padding-right: 10px;
text-transform: uppercase;
letter-spacing: 2px;
}
@media ( max-width:991px ) {
#secondary {
display:none;
}
}
/*this styles the image-captn custo fieldoutput that may be viisble on single.php's below the image/video area */
.imagecaption {
background: rgba(66, 63, 63, 0.1);
margin-top: -40px;
font-size: 12px;
font-family: roboto;
color: darkgray;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 0px;
padding-left: 10px;
}
/* this used to be in the content-template that styled the single.php (content.php) output */
.taxonomypostcontent {
background-color: #ffffff;
padding: 10px;
margin: 0px;
border: 1px solid navy;
border-color:#dddddd;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
line-height: 25px;
font-size:80%;
}
.thumbnailpostcontent {
border-radius:2px !important;
}
.sidebar-fixed{
position:fixed;
top:70px;
/*width:100%;*/
}
i.mce-i-icon {
font: normal 20px/1 'dashicons';
padding: 0;
vertical-align: top;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-left: -2px;
padding-right: 2px;
}
/* NOT IN USE - after I switch the order on dec 24. makes the facet titles on terms-to-terms archives */
.terms-to-terms-facet {
font-size:80%;
font-style: italic;
}
/* makes the focus titles on terms-to-terms archives */
.terms-to-terms-focus {
font-size:80%;
font-style: italic;
}
/* effects the archive page's archive title header area. it takes that greenish overlay over the background */
.plain-bg-primary .upb_row_bg .upb_bg_overlay,
.page-header .page-header-inner:before{
opacity: 0.0; /* used to be 0.2 */
}
/*********************************************************************************************************/
/* OWL */
.owl-large { /* used in big slide show on the home page */
max-width:1400px !important;
}
/* could be used anywhere, for example: in owl-related or in most-popular */
/*
.owl-medium {
max-width:500px !important;
height:281px !important;
}
*/
.owl-medium-p { /* notice the medium-p 's hight matches the medium's height! */
max-width:156px !important;
height:281px !important;
}
.owl-small { /* could be used anywhere, for example: in owl-related or in most-popular */
max-width:250px !important;
height:140px !important;
}
/* https://css-tricks.com/snippets/css/media-queries-for-standard-devices/ */
@media only screen
and (min-width: 375px)
and (max-width: 667px)
and (-webkit-min-device-pixel-ratio: 2) {
.owl-large { /* used in big slide show on the home page */
max-width:700px !important;
}
/* could be used anywhere, for example: in owl-related or in most-popular */
/*
.owl-medium {
max-width:250px !important;
height:140px !important;
}
*/
.owl-medium-p { /* notice the medium-p 's hight matches the medium's height! */
max-width:78px !important;
height:140px !important;
}
}
/* this class is used by the single.php ( content.php ) the bottom carousels in a cell-cell-owl-related.php */
.owl-related {
width:300px;
height:221px;
}
/* style view all area on cell-owl.php, cell-rows.php... */
/* > */
.see-view-all {
}
.see-view-all-link {
}
#team .team-item figure .info {
position: absolute;
bottom: 0;
color: white;
font-size: 16px;
width: 100%;
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 100%);
/* background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0))); */
/* background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 100%); */
background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 100%);
background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 100%);
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
/* padding-left: 5px; Removed pay Amr*/
padding: 15px;
padding-bottom: 3px;
}
.sidebar-filters {
margin-bottom: 5px;
font-size: 11px; /*dec-19-2022 was 12.*/
line-height: 1.3em; /*dec-19-2022 was 1em*/
cursor: pointer;
}
.filter-active{
font-size:1.3rem;
margin-top:5px;
margin-bottom:5px;
background-color:#6c8202;
color:white;
padding:2px;
}
.filter-header{
font-weight:bold;
margin-bottom:7px;
}
/* fiterizr css files: this used to be at cell_filter.php */
/* temporarily I took these to cell_filter.php Feb 1, 2017 */
.archive-category {
font-size:60%;
margin-bottom:10px;
}
.archive-category-by{
color:#00a84c;
}
.archive-category-source{
color:#8fffa8;
}
.archive-category-channel{
color:#f4173d;
}
.archive-category-value{
color:#b5d7e9;
}
.archive-category-for{
color:#b401ab;
}
.archive-category-section{
color:#c40000;
}
.archive-category-region{
color:#b4520f;
}
.archive-category-topic{
color:#ffb911;
}
.archive-category-mutual-topic{
color:#009dd6;
}
/*dec-19-2022 haluk*/
.filters-values {
/*
font-weight:bold;
color:#795548;
*/
}
.unclaimed {
opacity:0.2;
}
.hh1 {
font-family:'Cedarville Cursive', cursive;
font-weight: normal;
font-size: 2.5em;
line-height:1.2em;
}
.hh2 {
font-family:'Cedarville Cursive', cursive;
font-weight: normal;
font-size: 2em;
line-height:1.2em;
}
.dheart{
position: relative;
width: 100px;
height: 90px;
float: left;
z-index:99999999;
}
.dheart:before,
.dheart:after{
position: absolute;
content: "";
left: 50px;
top: 0;
width: 50px;
height: 80px;
background: #fc2e5a;
-moz-border-radius: 50px 50px 0 0;
border-radius: 50px 50px 0 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
-o-transform-origin: 0 100%;
transform-origin: 0 100%;
}
.dheart:after{
left: 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: 100% 100%;
-moz-transform-origin: 100% 100%;
-ms-transform-origin: 100% 100%;
-o-transform-origin: 100% 100%;
transform-origin :100% 100%;
}
/* for life time members only */
.dheartx{
position: relative;
width: 100px;
height: 90px;
float: left;
z-index:99999999;
}
.dheartx:before,
.dheartx:after{
position: absolute;
content: "";
left: 50px;
top: 0;
width: 50px;
height: 80px;
background: purple;
-moz-border-radius: 50px 50px 0 0;
border-radius: 50px 50px 0 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
-o-transform-origin: 0 100%;
transform-origin: 0 100%;
}
.dheartx:after{
left: 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: 100% 100%;
-moz-transform-origin: 100% 100%;
-ms-transform-origin: 100% 100%;
-o-transform-origin: 100% 100%;
transform-origin :100% 100%;
}
.unclaimed:hover{
opacity:0.4;
}
.donors-page-title{
font-family:'helvetica';
text-align:center;
}
/*vector set*/
.heart_red {
/**************/
position: relative;
width:120px;
height:120px;
right:0px;
margin-top:18px;
/**************/
z-index: 900;
/*max-height: 31px; */
fill: #f53950; /*#d41e34;*/ /* red heart*/
animation: pulse 2s ease infinite;
}
.heart_purple {
/**************/
position: relative;
width:120px;
height:120px;
right:0px;
margin-top:18px;
/**************/
z-index: 900;
/*max-height: 31px; */
fill: #560d56; /* purple-hearr */
animation: pulse 3s ease infinite;
}
@keyframes pulse {
0% {
transform: scale(1);
}
50% {
transform: scale(1);
}
110% {
transform: scale(1);
}
}
.pulsating-heart-text-at-mobile-header {
/**************/
position: absolute;
margin-top: -92px;
width:120px;
/**************/
font-size: 10px;
text-decoration: none;
color: white; /*#6c8202*/
z-index: 450;
font-family:verdana;
z-index: 900;
text-align:center;
line-height:1.3;
}
.pulsing-hearts{
float:left;
margin-right:5px
}
.vector-hearts {
max-width:1000px;
}
.scroll-top {
bottom: 80px;
}
/* Page Builder Image Slider*/
.sow-slider-base .sow-slider-pagination {
text-align:center !important;
bottom: 5px !important;
}
/* announcements-weirdo -- enable this when ann is on. ( also see overwrting-scripts.js). when done with ann, disable these back */
/*
@media only screen and (max-width: 765px) {
#menu-icon {
z-index: 0;
cursor: pointer;
position: fixed;
display: block;
top: 65px !important;
left: 5px !important;
}
}
*/
@media only screen and (max-device-width : 765px) {
#menu-icon {
/*top: 64px !important;*/ /*mustafa mar 27,2020*/
}
}
@media only screen and (min-width: 766px) {
#menu-icon {
z-index: 0;
cursor: pointer;
position: fixed;
/*display: block;*/
top: 110px; /* new notes: ##mustaf mar 27,2020 aold notes: changed this on jan 1 2019 from 30px after ending 2028 year end drive. after this, you must visit global static asp footer for versioning */
left: unset !important;
display:none;
}
}
/*
remove the 64px's !important when done with announcement
*/
/* Added on 12-12-2022*/
figure {
margin: 0 !important;
}
.postbody figure {
clear: both !important;
display: block !important;
margin-left: auto !important;
margin-right: auto !important;
} /* for this to take effect alignleft alignright classes after the wp-caption must be broken. see index.php rep string operations. */
.watupro-progress-container {
background-color: #e3e3e3;
} /* takes care of the quiz page progrss bar */
.question-choices {
padding-left: 17%;
} /* takes care of the quiz page options */
#hjri-date-results{
color:#759b06;
}
@media only screen and (min-width: 768px) {
.postbody ul {
padding-left: 17%;
padding-right: 28%;
margin-bottom: 40px !important;
margin-top: 20px;
}
.postbody ol {
padding-left: 17%;
padding-right: 28%;
margin-bottom: 40px !important;
margin-top: 20px;
}
.displayVerse {
padding-left: 17% !important;
padding-right: 28% !important;
margin-bottom: 40px !important;
margin-top: 20px !important;
}
.postbody table {
padding-left: 17%;
padding-right: 28%;
margin-bottom: 40px !important;
margin-top: 20px;
}
}
/* remove the irritating underline that comes on on hover on menu items like faith society etc */
.navbar-plain .navbar-nav > li > a:before {
height: 0px !important;
}
.new-search-box{
width: 291px;
margin-top: 12px;
opacity: 1;
height: 42px;
border-width: 0px;
cursor:pointer;
z-index:90000000000000000000000000;
}
@media only screen and (max-width: 400px) {
.postbody h2, h3, h4 {
padding-left: initial !important;
}
.postbody {
padding-right: 30px !important;
}
.new-search-box{
width: 200px;
margin-top: 17px;
margin-right: -12px;
height:49.49px;
cursor:pointer;
}
}
@media only screen and (max-width: 768px) {
.postbody h2, h3, h4 {
padding-left: initial !important;
}
.postbody {
padding-right: 30px !important;
}
.new-search-box{
width: 200px;
margin-top: 17px;
margin-right: -12px;
height:49.49px;
cursor:pointer;
}
}
/* this is the islamicity quran shortcode styles... the globally shared script uses /global/shred/quran.css! not the ones below! */
#q-script{
border-color:gray;
border-width:1px;
background-color:#ededed;
padding:10px;
border-radius:20px;
}
.q-ref {
font-weight:bold;
}
.q-translation {
color:#106ca5;
display:initial;
}
.q-translator {
color:#106ca557;
font-size:60%;
}
.q-arabic{
font-size:1.3em;
font-family:amiri;
line-height:2em;
text-align: right;
}
.servicesLinks {
font-size:18px;
color:black;
}
.servicesLinks2 {
font-size: 19px;
color: color(srgb 0.92 0.96 0.93);
background-color: red;
border-radius: 2px;
padding: 3px padding-left: 5px;
padding-right: 5px;
padding-left: 31px;
}