I need to know the custom CSS to input to effect the Title and Subtitle on masonry portfolio images (hover) on home page. Scroll down to "Case Studies" where the masonry gallery begins. Currently its font-family: Old Standard TT; font-size: 48px; line-height: 64px; and font-family; Ubuntu; font-size: 18px; font-weight: 400. I want to be able to change these.
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
.portfolio-items .col .work-item.style-2 h3 {
font-family: Old Standard TT;
letter-spacing: 0;
font-weight: 400;
}
Thank you. This addresses Part of what I wanted to effect, the portfolio (or the page title). I still want to be able to control the text that appears under the portfolio or page title, the Project Excerpt. What is the CSS that is specific to this?
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
Works perfect, thank you for your help! One other question, what CSS could I use to effect the type styling of the portfolio page title (at the very top of the page)? http://bystromdesign.com/portfolio/att/
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
I'm using Fancy Box, using the Bottom Color Bar Hover Effect. I wanted to be able to control the color overlay before there is any hover or click. What would the CSS for that be? I'm trying to make the color overlay the same as the video background at the top of the home page.
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
This is affecting the correct item, I needed it to change the opacity of the color overlay, rather than change the color of the overlay. I'm trying to achieve the same value as the video background at the top of the page below the primary nav. I believe what needs the opacity changed would be the image before hover. On hover the image becomes opacity: 1; (or 100%). What CSS could I use to target the image opacity?
This is the value right now . Adjust the "0.5" opacity in it as per your liking .
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
HI, thank you again. The 4 fancy box areas are still not matching the video background above them just under the main navigation. How can I make the off state before hover or click appear the same as the video background in opacity and darkness?
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
This achieves the look I was hoping for on mouse off. On mouse over, is it still possible to display the image without any color overlay and the image is at full color?
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
I need to know the custom CSS to input to effect the Title and Subtitle on masonry portfolio images (hover) on home page. Scroll down to "Case Studies" where the masonry gallery begins. Currently its font-family: Old Standard TT; font-size: 48px; line-height: 64px; and font-family; Ubuntu; font-size: 18px; font-weight: 400. I want to be able to change these.
BystromDesign.com
Or where the setting for this exist.
Thank you.
Hey B,
Change the values as per your liking.
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
.portfolio-items .col .work-item.style-2 h3 { font-family: Old Standard TT; letter-spacing: 0; font-weight: 400; }Thanks
ThemeNectar Support Team
Thank you. This addresses Part of what I wanted to effect, the portfolio (or the page title). I still want to be able to control the text that appears under the portfolio or page title, the Project Excerpt. What is the CSS that is specific to this?
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
.portfolio-items .col .work-info .vert-center p { font-family: 'Roboto'; font-size: 35px; line-height: 45px; color: #ffffff; } }Thanks
ThemeNectar Support Team
Works perfect, thank you for your help! One other question, what CSS could I use to effect the type styling of the portfolio page title (at the very top of the page)? http://bystromdesign.com/portfolio/att/
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
.single-portfolio .row .col.section-title h1 { font-size: 28px !important; }Thanks
ThemeNectar Support Team
Thank you again.
I'm using Fancy Box, using the Bottom Color Bar Hover Effect. I wanted to be able to control the color overlay before there is any hover or click. What would the CSS for that be? I'm trying to make the color overlay the same as the video background at the top of the home page.
http://bystromdesign.com/
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
.nectar-fancy-box .box-bg:after { background-color: #8b411e7a !important; }Thanks
ThemeNectar Support Team
This is affecting the correct item, I needed it to change the opacity of the color overlay, rather than change the color of the overlay. I'm trying to achieve the same value as the video background at the top of the page below the primary nav. I believe what needs the opacity changed would be the image before hover. On hover the image becomes opacity: 1; (or 100%). What CSS could I use to target the image opacity?
This is the value right now . Adjust the "0.5" opacity in it as per your liking .
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
.nectar-fancy-box .box-bg:after { background-color: rgba(51,51,51,0.5) !important; }Thanks
ThemeNectar Support Team
HI, thank you again. The 4 fancy box areas are still not matching the video background above them just under the main navigation. How can I make the off state before hover or click appear the same as the video background in opacity and darkness?
ITs set to 0.7 opacity :
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
.nectar-fancy-box .box-bg:after { background-color: rgba(0,0,0,0.7) !important; }Thanks
ThemeNectar Support Team
This achieves the look I was hoping for on mouse off. On mouse over, is it still possible to display the image without any color overlay and the image is at full color?
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
.nectar-fancy-box:hover .box-bg:after { background-color: rgba(51,51,51,0) !important; }Thanks
ThemeNectar Support Team
Your support has been the best, accurate, and more importantly quickest support with the best theme I've ever experienced. Thank you again.