/* Theme Name: CustomizrTalesChild1 Version: 1.0 Description: A child theme of Customizr Template: customizr-pro Author: Deborah Shadovitz */ /* Your awesome customization starts here */ /* Left parens:
*/ /* Did I use
*/ /* CSS NOTE: When listed in one line 4px 12px; is top & bottom, right & left. That's top, right, bottom, left */ /*body color: #333333 (almost black) [headers #258585 turquoise] [gold #887721] [main menu item #006666] [menu drop down 006666 but I have none] [Footer background 008881] Originally I had 087d7d another turquoise as my body font color? Trying 005454 as my header for a darker look. */ /* opacity: 0.5; */ /* TOP OF PAGE */ /* tagline h2.site-description stopped working. It's an h2 so it should have taken on the color and other formatting. For some reason, it works where I also use .navbar-wrapper .navbar h2 first to do the full width effect and then the h2.site-description to format the smartphone size. So keep both. Font is gold color*/ .navbar-wrapper .navbar h2 { font-size: 15px ; color: #887721; } h2.site-description { font-size: 15px ; color: #887721;} /*Makes my social icons gold to match tagline*/ a.icon-facebook { color: #887721; } a.icon-twitter { color: #887721; } a.icon--linkedin { color: #887721; } /* end top of page */ /* MAIN MENU */ /*This is the main menu item. 887721 is gold. 006666 is blue. */ .navbar .nav > li > a { color: #006666; } .navbar .nav > li > a:hover { color: #887721; text-decoration: underline; } /*This is the menu's sub item*/ .dropdown-menu > li > a { color: #006666; text-decoration: none; } .dropdown-menu > li > a:hover { color: #887721; text-decoration: underline; } /* Control width of 3-bar (Responsive) menu. Code is from Customizr Navbar Guide 3.3 https://presscustomizr.com/customizr/customizr-navbar-guide/ I never got to try still want pull-left; */ /* The rgb=white; last value is transparancy; 1 is none */ @media screen and (max-width: 979px) { .navbar.resp .nav-collapse { width:45%; background: rgba(255,255,255,1); } } /* End Main Menu */ /* BODY & HEADERS */ /* The color is set here. It's a gray: #333333; */ /* https://www.google.com/fonts/specimen/Tenor+Sans#charset */ body { /*font: tenor sans; Not proper here. I've set it in the Customizer. */ color: #333333; font-size: 1.05em; line-height: 1.3em; } /*original blue was 087d7d*/ /* The font named here may be over-ridden in the font customizer, even though I didn't have it selected there. Was #258585 but changed it to #005454, the dark part of StickDeb on March 2017 */ h1, h2, h3, h4, h5, h6 { color: #005454; margin-top: 1em; margin-bottom: -.1em; line-height: -0.6em; font-family: Architects Daughter regular; } /*The headers ARE controlled here.*/ h1 { font-size: 1.8em; font-weight: bold; margin-bottom: -.15em; } h2 { font-size: 1.6em; font-weight: bold; } h3 { font-size: 1.6em; font-weight: bold; font-style: italic; } h4 { font-size: 1.4em; font-style: italic; } h5 { font-size: 1.3em; font-weight: bold; font-style: italic; } h6 { font-size: 1.3em; font-style: italic; } /*not doing anything */ h3 .head_sub { font-size: .9em; font-weight: normal; font-style: italic; color: #005454; } /*not doing anything */ h4 .head_sub { font-size: .9em; font-weight: normal; font-style: italic; color: #005454; } /*happ_sub for h3 { font-size: 1.6em; font-weight: bold; font-style: italic; */ /* change the tagline at top */ /* Maybe broke page: .navbar-wrapper .navbar h2 {font-size: .9em; color: #258585 ; }*/ /* The heading under each Featured page item on home page of the Free Version. This is the closest I could go to the images without the text being cut off at the top. NOT EFFECTIVE NOW */ .marketing h2{ margin-top: -.3em; font-size: 1.1em; font-weight: bold; } /* The heading that appears when a post is displayed individually -on a single post page. The CSS is almost the same as for .marketing h2 */ h1.entry-title { font-size: 1.6em; font-weight: bold; /* margin-top: 1em; margin-bottom: -.1em; line-height: -0.6em; */ } /* post title for page full of posts.*/ h2.entry-title { font-size: 1.6em; font-weight: bold; /* margin-top: 1em; margin-bottom: -.1em; line-height: -0.6em; */ } /* The text entered at the top of each widget. */ .widget-title { font-size: .9em; margin-top: 1em; margin-bottom: -.05em; } /* .widget-title {display:none;} */ /* font-family: Architects Daughter regular; */ /* FONT SIZES */ .fine { font-size: .8em } /* LINKS */ /* redish purple & gold, 2023 was 22B53, now brigher */ a { color: #8e2c74; } a:visited { color: #887721; text-decoration: none;} a:hover { color: #887721; text-decoration: underline; } a:active { color: #622B53; } /* end links*/ /* BUTTONS - ALL but there is more for some*/ /* color is the text color*/ /* Adding this will remove the mask so a color can be changed! But now WHERE is my color coming FROM? background-color: none; or fafafa (the theme background color) background-image: none; */ .btn { border-radius: 15px; -moz-border-radius: 15px; border-color: #1D5555; /*color: #ec008c ; PINK here and below for testing. */ /* Adding background-color does change the button color, but you also have to set the background image to none. */ /* DEFAULT BUTTON COLOR I thought per background-color: #099EB2 is now skyblue */ /* MARCH 8 2018 This background-color: #099EB2 was what put the blue in my hamburger menu. I am removing it. HOWEVER, the question is why doesn't this effect all of my buttons? It doesn't seem to. */ background-color: none; opacity: 0.5; font-size: 13px; line-height: 1em; border-width: 1px 2px 2px 1px; padding-left: 1.5em; padding-right: 1.5em; } /* BUTTON INFO */ /*This is the default button code. Button color, padding, height are not there. bkgnd is white F5F5F5 but doesn't do anything ?, gradient is a white #FFF to off-white #E6E6E6 **/ /*.btn { display: inline-block; x padding: 4px 12px; margin-bottom: 0px; x font-size: 14px; lx ine-height: 20px; text-align: center; vertical-align: middle; cursor: pointer; color: #333; text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.75); background-color: #F5F5F5; background-image: linear-gradient(to bottom, #FFF, #E6E6E6); background-repeat: repeat-x; x border-width: 1px; border-style: solid; x border-color: #CCC #CCC #B3B3B3; -moz-border-top-colors: none; -moz-border-right-colors: none; -moz-border-bottom-colors: none; -moz-border-left-colors: none; border-image: none; x border-radius: 4px; box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px rgba(0, 0, 0, 0.05); } */ /*end BUTTONS*/ /* FRONT PAGE */ /* front page: Makes round image mask into square but radius doesn't give me rounded corners. */ /* .round-div { border-radius: 10px; } */ /* Another option for this is to use: .widget-front .round-div { border-radius:10px; } */ /* Alternates round and square, each one separately. .fp-one for 1, 2,3 but .fp-4, .fp-5 for the rest*/ .fp-one .round-div { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10; } .fp-three .round-div { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10; } /* 5, 7, 9 are not working yet. */ .fp-5 .round-div { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10; } .fp-7 .round-div { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10; } .fp-9 .round-div { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10; } /* end front page */ /* SLIDER */ .carousel-image slider-full { border-radius: 0px; } .carousel-caption .btn { font-size: 14px; line-height: 10px; padding-top: 2px; padding-top: 3px; padding-left: 7px; padding-right: 7px; } /* END SLIDER */ /* FEATURED fp */ /* I DON'T seem to need this. It is all in the main btn definition: .btn.btn-primary.fp-button { border-radius: 15px; background-color: #CCCCCC; border-color: #1D5555; border-style: solid; border-width: 1px 2px 2px 1px; } */ /* END FEATURED fp */ /* Sidebars - Widgets */ /*Removes the screen reader word "search" because it doesn't match my text. But I think it is better to keep it and remove my own text.*/ /*#searchform label {display: none;}*/ /*Put space above the Search that is in the left sidebar widget. But also adds space above other places where it appears such as footer. */ #searchform label { padding-top: 10px ; margin-bottom: -1px ; } /* BODY CALLOUTS PAGE SECTIONS */ /* The default theme style: blockquote p { font-family: "Source Sans Pro", Arial, sans-serif; } */ blockquote { font-weight: normal; margin-top: 1.1em; margin-bottom: 1.2em; margin-left: 2em; margin-right: 4em; border-color: #258585; /*a darker turquoise */ border-width: .5em; /*line-height: 1.5em;*/ /*background-color:#ffffff;*/ padding-top: .9em; padding-right: 1em; padding-bottom: 1em; padding-left: 1em; border-radius: 10px; -moz-border-radius: 10px; } blockquote p { font-style: normal; color: #258585; font-size: 1em; } blockquote h2 { font-style: normal; font-weight: normal; color: #258585; font-size: 1.1em; } /* Text block with borders. CREATE one with less top padding for when content begins with an h tag */ /* Used on krakow-tarnow/ & Cocoa Floss */ /*
*/ .block2 { color: #258585; margin-top: 1.2em; margin-bottom: 1.3em; margin-left: 1em; padding-top: .7em; padding-right: 1em; padding-bottom: 1.1em; padding-left: 1em; border-left-width: .7px; border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-style: solid; border-color: #0c4c4c; border-radius: 10px; -moz-border-radius: 10px; } /* May need to TWEAK */ blockquote h2 { /* margin-top here because: 1.2 + margin-top: 1 = 2.2em, so make up for it with a negative */ margin-top: -1.5em; /* DOES THIS CHANGE THE FONT? WP DIDN'T LIKE THE WAY I HAD !important; */ /* font-family: Architects Daughter regular; !important; */ font-family: Architects Daughter regular; font-style: normal; margin-bottom: .1em } /* FOOTER */ /* Changes footer's background color to tourquoise. Sets font for the footer widgets text. Should overrides the Font Customizer. Started to FAIL Dec 2015. Fontsize is not changed here or maybe it is. To get the links to match I seem to need all 3 of these rules. */ footer#footer { background-color: #008881; text-align: left; font-size: .95em; } /* FOOTER LINK color worked but not font size */ footer#footer a { color: #f2edd5; font-size: .95em; } footer#footer .footer-widgets p { font-size: .95em; } /*footer#footer .footer-widgets a wssn't necessary after all */ /* WIDGETS */ /* Search button in footer */ /*using only color: is just the text color*/ #searchsubmit { margin-left: 0px; line-height: 14px; border-radius: 12px; -moz-border-radius: 12px; opacity: 0.7; border-color: #1D5555; border-style: solid; border-width: 1px 2px 2px 1px; padding-right: 6%; padding-left: 6%; padding-top: 1%; padding-bottom: 1%; } /* end widgets */ /* CONTACT */ .pushbutton-wide { margin-left: 0px; line-height: 14px; border-radius: 15px; -moz-border-radius: 15px; opacity: 0.6; border-color: #1D5555; border-style: solid; border-width: 1px 2px 2px 1px; padding-right: 4%; padding-left: 4%; padding-top: 0%; } /* end contact */ /* POSTS */ /* Post Comment button */ input#submit.submit { margin-left: 0px; line-height: 14px; border-radius: 15px; -moz-border-radius: 15px; opacity: 0.6; border-color: #1D5555; border-style: solid; border-width: 1px 2px 2px 1px; padding-right: 4%; padding-left: 4%; padding-top: 0%; } /* IMAGES */ /* body img doesn't remove the border from the header. */ img { border-radius: 10px; /* This part also works but I don't want it. It even adds to the logo and slider border: 1px solid #CCCCCC; padding: 3px;*/ } /* Per Rocco support, adds MARGIN BETWEEN TEXT & IMAGES whether images have a caption (first) or not (second). LOVE THIS */ div.alignright, img.alignright { margin-left: 1.5rem; margin-top: 1.5rem; margin-bottom: 1.5rem; } div.alignleft, img.alignleftt { margin-right: .7rem; margin-top: 1.5rem; margin-bottom: 1.5rem; } /* IMAGE CAPTIONS */ /* Per Rocco at: https://wordpress.org/support/topic/change-font-and-font-size-in-captions?replies=19 */ .wp-caption .wp-caption-text { color: #258585; text-align: center; font-size: .82em; padding-top: 5px; } /* end captions */ /* CLEAR */ /*
*/ .clearB { height: 0px; clear: both; } .clearL { height: 0px; clear: left; } .clearR { height: 0px; clear: right; } #mapRite { float: right; margin-left: 2em; margin-bottom: 2em; } /* For embedded videos */ /*
*/ .VidRite { float: right; width: 70%; margin-bottom: 2em; } .VidLeft { float: left; width: 70%; margin-bottom: 2em; } .VidCenter { width: 70%; margin-left: 20%; margin-right: 20%; margin-bottom: 2em; } /* */ #mapRite { float: right; margin-left: 2em; margin-bottom: 2em; } /* HOMEPAGE independent woman of limited means. */ /*
*/ .homequote { margin-top: 1.5em; margin-bottom: 1.5em; width: 40%; float: right; margin-left: 2em; padding-top: .8em; padding-right: .8em; padding-bottom: .8em; padding-left: .8em; border-width: 1px; border-style: inset; border-color: #258585; border-radius: 10px; -moz-border-radius: 10px; } /* 50% quote box centered */ /*
*/ /* DID I USE THIS ON THE SITE? IT'S NOT ON THE HOME PAGE CHANING 50 TO half to try to stop CSS error but then this won't be in effect on the site.*/ .halfCquote { margin-top: 1.5em; margin-bottom: 1.5em; width: 40%; float: right; margin-left: 2em; padding-top: .8em; padding-right: .8em; padding-bottom: .8em; padding-left: .8em; border-width: 1px; border-style: inset; border-color: #258585; border-radius: 10px; -moz-border-radius: 10px; }