Viewing 7 replies - 1 through 7 (of 7 total)
  • With CSS

    img:hover {
    	/* Declaration Here */
    }

    Use whatever css class you have for your images

    Thread Starter TommyLouis

    (@tommylouis)

    Thank you very much sir, i inserted it in my Style.CSS my theme only comes with one CSS i inserted your code but it didn’t work is there a certain place i am supposed to put it? here’s my code for you.

    /*
    Theme Name: Just Blog
    Theme URI: https://nextwpthemes.com/
    Description: Just Blog,
    Version: 1.0
    Author: nextWPthemes
    Author URI: https://nextwpthemes.com/
    */
    
    /*-------------------------------------------------*/
    /* =  Fonts
    /*-------------------------------------------------*/
    
    @font-face {
        font-family: 'BebasNeueRegular';
        src: url('font/bebasneue-webfont.eot');
        src: url('font/bebasneue-webfont.eot?#iefix') format('eot'),
             url('font/bebasneue-webfont.woff') format('woff'),
             url('font/bebasneue-webfont.ttf') format('truetype'),
             url('font/bebasneue-webfont.svg#webfontX0YNjQNl') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    
    @font-face {
        font-family: 'kreonregular';
        src: url('font/kreon-regular.eot');
        src: url('font/kreon-regular.eot?#iefix') format('embedded-opentype'),
             url('font/kreon-regular.woff') format('woff'),
             url('font/kreon-regular.ttf') format('truetype'),
             url('font/kreon-regular.svg#kreonregular') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    
    @font-face {
        font-family: 'kreonlight';
        src: url('font/kreon-light.eot');
        src: url('font/kreon-light.eot?#iefix') format('embedded-opentype'),
             url('font/kreon-light.woff') format('woff'),
             url('font/kreon-light.ttf') format('truetype'),
             url('font/kreon-light.svg#kreonlight') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    
    @font-face {
        font-family: 'kreonbold';
        src: url('font/kreon-bold.eot');
        src: url('font/kreon-bold.eot?#iefix') format('embedded-opentype'),
             url('font/kreon-bold.woff') format('woff'),
             url('font/kreon-bold.ttf') format('truetype'),
             url('font/kreon-bold.svg#kreonbold') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    
    /*-------------------------------------------------*/
    /* =  General
    /*-------------------------------------------------*/
    body {
    	background: url(images/bg.png);
    }
    
    .container {
    	margin-top: 15px;
    	max-width: 960px;
    }
    
    /*-------------------------------------------------*/
    /* =  Header
    /*-------------------------------------------------*/
    #logo {
    	padding: 27px 0;
    	text-align: center;
    }
    
    .nav {
    	border-top: 1px dashed #b3b7ba;
    	border-bottom: 1px dashed #b3b7ba;
    	padding: 13px 0px;
    	text-align: center;
    }
    
    .nav > ul {
    	margin: 0px;
    }
    
    .nav > ul > li {
    	display: inline-block;
    	margin-left: 30px;
    	line-height: normal;
    }
    
    .nav > ul > li:first-child {
    	margin-left: 0px;
    }
    
    .nav > ul > li a {
    	font-family: 'BebasNeueRegular';
    	font-size: 23px;
    	color: #979797;
    	text-decoration: none;
    
    	transition: all 0.3s linear;
    	-moz-transition: all 0.3s linear;
    	-webkit-transition: all 0.3s linear;
    	-o-transition: all 0.3s linear;
    }
    
    .nav > ul > li a.current_page_item {
    	color: #000;
    }
    
    /*-------------------------------------------------*/
    /* =  DropDown Menu = Superfish
    /*-------------------------------------------------*/
    .sf-menu {
    	line-height: 1.0;
    }
    
    .sf-menu ul {
    	position: absolute;
    	margin: 0;
    	padding: 0;
    	top: -999em;
    	width: 180px; /* left offset of submenus need to match (see below) */
    }
    
    .sf-menu ul li {
    	width: 100%;
    	border: 1px solid #e8e8e8;
    	border-top: none;
    	list-style: none;
    }
    
    .sf-menu ul li li:first-child {
    	border-top: 1px solid #e8e8e8;
    }
    
    .sf-menu li:hover {
    	visibility:		inherit; /* fixes IE7 'sticky bug' */
    }
    
    .sf-menu li {
    	position: relative;
    }
    
    .sf-menu a {
    	display: block;
    	position: relative;
    }
    
    .sf-menu li:hover ul,
    .sf-menu li.sfHover ul {
    	left: 0;
    	top: 40px; /* match top ul list item height */
    	z-index: 99;
    }
    
    ul.sf-menu li:hover li ul,
    ul.sf-menu li.sfHover li ul {
    	top: -999em;
    }
    
    ul.sf-menu li li:hover ul,
    ul.sf-menu li li.sfHover ul {
    	left: 180px; /* match ul width */
    	top: -1px;
    	/*margin-left: 2px;*/
    }
    
    ul.sf-menu li li:hover li ul,
    ul.sf-menu li li.sfHover li ul {
    	top: -999em;
    }
    
    ul.sf-menu li li li:hover ul,
    ul.sf-menu li li li.sfHover ul {
    	left: 180px; /* match ul width */
    	top: -1px;
    }
    
    .sf-menu li li {
    	background: rgba(255,255,255, 0.95);
    	background: #fff/;
    	padding-right: 0px;
    }
    
    .sf-menu li li li {
    	background: rgba(255,255,255, 0.95);
    	background: #fff/;
    	padding-right: 0px;
    }
    
    .sf-menu .sub-menu a {
    	padding: 11px 10px;
    	font-family: 'kreonlight';
    	font-size: 18px;
    	text-align: left;
    }
    
    .sf-menu li:hover, .sf-menu li.sfHover,
    .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
    	outline: 0;
    	color: #222;
    }
    
    /*-------------------------------------------------*/
    /* =  Content
    /*-------------------------------------------------*/
    
    #content {
    	margin-bottom: 80px;
    }
    
    .post {
    	background: #fff;
    	-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.1);
    	-moz-box-shadow: 0 0 5px rgba(0,0,0,0.1);
    	box-shadow: 0 0 5px rgba(0,0,0,0.1);
    	border: 1px solid #dedede/;
    	margin-bottom: 52px;
    }
    
    .post-header {
    	padding: 30px 20px;
    	text-align: center;
    	margin-bottom: 20px;
    	border-bottom: 1px dashed #b3b7ba;
    }
    
    .post-title {
    	font-family: 'BebasNeueRegular';
    	font-size: 38px;
    	color: #232323;
    	line-height: normal;
    	font-weight: normal;
    	margin: 0;
    }
    
    .post-title a {
    	text-decoration: none;
    	color: #232323;
    
    	transition: all 0.3s ease;
    	-moz-transition: all 0.3s ease;
    	-webkit-transition: all 0.3s ease;
    	-o-transition: all 0.3s ease;
    }
    
    .post-title a:hover {
    	color: #979797;
    }
    
    .post-meta {
    	margin-top: 10px;
    }
    
    .post-meta,
    .post-meta a {
    	font-family: 'Georgia';
    	font-size: 12px;
    	color: #969696;
    }
    
    .post-meta ul {
    	margin: 0;
    	padding: 0;
    }
    
    .post-meta ul li {
    	display: inline-block;
    	margin: 0 8px;
    	list-style: none;
    	padding-left: 18px;
    }
    
    .post-date {
    	background: url(images/date-icon.png) no-repeat left center;
    }
    
    .post-comment {
    	background: url(images/comment-icon.png) no-repeat left center;
    }
    
    .post-author {
    	background: url(images/author-icon.png) no-repeat left center;
    }
    
    .post-tag {
    	background: url(images/tag-icon.png) no-repeat left center;
    }
    
    .post-content {
    	padding: 20px 120px;
    }
    
    .post-content p {
    	font-family: 'kreonlight';
    	font-size: 17px;
    	line-height: 32px;
    	color: #232323;
    	margin-bottom: 20px;
    	text-align: left;
    }
    
    /* Format Video */
    .videoembed {
    	width: 100%;
    	height: 540px;
    }
    
    /* Format Chat */
    .format-chat .post-content p {
    	font-style: italic;
    }
    
    /* Format Link */
    .format-link .post-title {
    	margin: 0 0 -5px 0;
    }
    
    .format-link .post-content,
    .format-link .post-content p {
    	text-align: center;
    }
    
    h4.link a {
    	color: #969696;
    }
    
    h4.link a:after {
    	content: ' →';
    	color: #969696;
    }
    
    /* Format Quote */
    .format-quote .post-content {
    	text-align: center;
    }
    
    .format-quote blockquote {
    	font-family: 'BebasNeueRegular';
    	font-size: 38px;
    	color: #232323;
    	line-height: normal;
    	padding: 0;
    	margin: 40px 0 10px 0;
    	border: none;
    }
    
    .quote-author {
    	position: relative;
    	display: block;
    	font-family: 'Georgia';
    	font-family: 18px;
    	color: #232323;
    	margin-bottom: 20px;
    }
    
    .quote-author:before {
    	content: '— ';
    }
    
    .quote-author:after {
    	content: ' —';
    }
    
    /* Pagination */
    .pagination-new {
    	margin: 0 0 20px 0;
    	text-align: center;
    }
    
    .pagination-new ul {
    	margin: 0;
    	padding: 0;
    	list-style: none;
    }
    
    .pagination-new li {
    	display: inline-block;
    	-webkit-border-radius: 3px;
    	-moz-border-radius: 3px;
    	border-radius: 3px;
    	margin-right: 3px;
    	border: 1px solid #d7d7d7;
    	background: #fff;
    }
    
    .pagination-new li:last-child {
    	margin-right: 0;
    }
    
    .pagination-new li a {
    	display: block;
    	font-size: 11px;
    	padding: 4px 12px;
    	color: #535353;
    	text-align: center;
    	text-decoration: none;
    
    	transition: all 0.3s ease;
    	-moz-transition: all 0.3s ease;
    	-webkit-transition: all 0.3s ease;
    	-o-transition: all 0.3s ease;
    }
    
    .pagination-new li:hover {
    	opacity: 0.7;
    }
    
    .pagination-new li.active {
    	background: #535353;
    }
    
    .pagination-new li.active a {
    	color: #fff;
    }
    
    /* Read More & Submit Button */
    .read-more-container {
    	text-align: center !important;
    }
    
    .form-submit {
    	text-align: right !important;
    }
    
    .form-submit #send-button,
    .send-button,
    a.read-more {
    	display: inline-block;
    	font-family: 'Georgia';
    	font-size: 13px;
    	color: #fff;
    	text-decoration: none;
    	-webkit-border-radius: 5px;
    	-moz-border-radius: 5px;
    	border-radius: 5px;
    	padding: 12px 18px;
    	background: #f6cd10;
    
    	*zoom: 1;
    
    	transition: opacity 0.3s ease;
    	-moz-transition: opacity 0.3s ease;
    	-webkit-transition: opacity 0.3s ease;
    	-o-transition: opacity 0.3s ease;
    }
    
    .form-submit #send-button:before,
    .send-button:before,
    a.read-more:before,
    .form-submit #send-button:after,
    .send-button:after,
    a.read-more:after {
      display: table;
      line-height: 0;
      content: "";
    }
    
    .form-submit #send-button:after,
    .send-button:after,
    a.read-more:after {
      clear: both;
    }
    
    .send-button,
    .form-submit #send-button {
    	margin-top: 5px;
    	padding: 10px 30px;
    	border: none;
    }
    
    .send-button:hover,
    .form-submit #send-button:hover,
    a.read-more:hover {
    	opacity: 0.7;
    }
    
    /*-------------------------------------------------*/
    /* =  Archive
    /*-------------------------------------------------*/
    .archive {
    	font-family: 'kreonlight';
    	font-size: 17px;
    	color: #212121;
    	text-align: center;
    	padding: 40px 80px;
    }
    
    .archive h3 {
    	font-family: 'BebasNeueRegular';
    	font-size: 38px;
    	font-weight: normal;
    	color: #232323;
    	margin: 0 0 35px 0;
    }
    
    .archive ul {
    	margin: 0;
    	padding: 0 0 60px 0;
    }
    
    .archive ul li {
    	list-style: none;
    	padding: 14px 0 22px 0;
    	background: url(images/li-bg.png) no-repeat center bottom;
    }
    
    .archive ul li:first-child {
    	padding-top: 0;
    }
    
    .archive ul li:last-child {
    	padding: 15px 0 0 0;
    	background: none;
    }
    
    .archive ul li a {
    	color: #212121;
    }
    
    /*-------------------------------------------------*/
    /* =  Singe Post
    /*-------------------------------------------------*/
    .single blockquote {
    	font-family: 'Georgia';
    	font-size: 28px;
    	font-style: italic;
    	color: #000;
    	line-height: 38px;
    	padding: 0 35px;
    	border-left: 3px solid #e8e8e8;
    	border-right: 3px solid #e8e8e8;
    }
    
    .single blockquote p {
    	font-family: 'Georgia';
    	font-size: 28px;
    	font-style: italic;
    	color: #000;
    	line-height: 38px;
    }
    
    /*-------------------------------------------------*/
    /* =  Comments
    /*-------------------------------------------------*/
    .comment-number {
    	font-family: 'kreonlight';
    	font-size: 30px;
    	color: #000;
    	margin: 90px 0 0 0;
    	text-transform: uppercase;
    }
    
    #comments {
    	font-family: 'kreonregular';
    	margin: 0;
    	padding: 0;
    	margin-bottom: 60px;
    }
    
    #comments li {
    	display: block;
    	list-style: none;
    	line-height: normal;
    }
    
    #comments .comment-box {
    	padding-left: 15px;
    	border-left: 1px dashed #c6c6c6;
    }
    
    #comments .author-avatar {
    	margin: 50px 0 15px 0;
    }
    
    #comments > li:first-child > .author-avatar {
    	margin: 15px 0 15px 0;
    }
    
    #comments .author-avatar img {
    	width: 90px;
    	height: 90px;
    	-webkit-border-radius: 100%;
    	-moz-border-radius: 100%;
    	border-radius: 100%;
    }
    
    #comments .comment-author {
    	display: inline-block;
    	font-family: 'kreonbold';
    	font-size: 18px;
    	font-weight: bold;
    	color: #000;
    }
    
    #comments .comment-author a {
    	color: #000;
    }
    
    #comments .comment-date {
    	display: inline-block;
    	font-family: 'kreonregular';
    	font-size: 16px;
    	color: #a7a7a7;
    }
    
    #comments .comment-date:before {
    	content: ' / ';
    }
    
    #comments .comment-text {
    	font-size: 14px;
    	color: #252525;
    	margin: 5px 0 13px 0;
    }
    
    #comments .comment-text p {
    	line-height: normal;
    	font-size: 14px;
    	margin: 0;
    	text-align: left;
    }
    
    #comments .comment-reply a {
    	font-family: 'kreonlight';
    	font-size: 12px;
    	color: #fff;
    	-webkit-border-radius: 3px;
    	-moz-border-radius: 3px;
    	border-radius: 3px;
    	padding: 5px 10px;
    	background: #232323;
    	text-decoration: none;
    }
    
    #comments .comment-reply a:hover {
    	background: #f6cd10;
    
    	transition: all 0.3s ease;
    	-moz-transition: all 0.3s ease;
    	-webkit-transition: all 0.3s ease;
    	-o-transition: all 0.3s ease;
    }
    
    #comments ul.children {
    	margin: 0;
    	padding: 0;
    	padding-left: 60px;
    }
    
    /*-------------------------------------------------*/
    /* =  Map
    /*-------------------------------------------------*/
    #map {
    	position: relative;
    	width: 100%;
    	height: 469px;
    }
    
    /*-------------------------------------------------*/
    /* =  Contact Form
    /*-------------------------------------------------*/
    .comment-number + #respond,
    .comment-number + .contact-form {
    	margin-top: 0px;
    }
    
    #respond,
    .contact-form {
    	font-family: 'kreonlight';
    	font-size: 13px;
    	margin-top: 90px;
    }
    
    #respond h3,
    #respond h4,
    .contact-form h3,
    .contact-form h4 {
    	font-size: 30px;
    	font-weight: normal;
    	color: #000;
    	margin-bottom: 35px;
    	text-transform: uppercase;
    }
    
    #respond label,
    .contact-form label {
    	display: block;
    	width: 100%;
    	margin-bottom: 10px;
    }
    
    #respond input[type="text"],
    #respond textarea,
    .contact-form input[type="text"],
    .contact-form textarea {
    	width: 100%;
    	max-width: 100%;
    	font-family: 'Georgia';
    	font-size: 13px;
    	color: #000;
    	height: 46px;
    	line-height: 34px/;
    	padding: 5px 10px;
    	margin-bottom: 20px;
    	background: #e7e9d8;
    	-webkit-border-radius: 0;
    	-moz-border-radius: 0;
    	border-radius: 0;
    	box-sizing: border-box;
    	-moz-box-sizing: border-box;
    	-webkit-box-sizing: border-box;
    	-webkit-box-shadow: inset 1px 1px 3px rgba(0,0,0, 0.14);
    	-moz-box-shadow: inset 1px 1px 3px rgba(0,0,0, 0.14);
    	box-shadow: inset 1px 1px 3px rgba(0,0,0, 0.14);
    }
    
    #respond textarea,
    .contact-form textarea {
    	height: 220px;
    	min-height: 220px;
    }
    
    #respond input[type="text"]:focus,
    #respond textarea:focus,
    .contact-form input[type="text"]:focus,
    .contact-form textarea:focus {
    	border-color: rgba(0, 0, 0, 0.4);
    }
    
    /*-------------------------------------------------*/
    /* =  Footer
    /*-------------------------------------------------*/
    footer {
    	margin-bottom: 50px;
    }
    
    footer ul {
    	margin: 0;
    	padding: 0;
    }
    
    /*-------------------------------------------------*/
    /* =  Widgets
    /*-------------------------------------------------*/
    footer .widget:first-child {
    	margin-left: 0;
    }
    
    .widget {
    	list-style: none;
    	font-size: 13px;
    	color: #828282;
    	float: left;
    	width: 300px;
    	margin-left: 30px;
    }
    
    .widget-title {
    	font-family: 'kreonbold';
    	font-size: 20px;
    	line-height: 18px;
    	font-weight: bold;
    	color: #232323;
    	margin-bottom: 30px;
    }
    
    /* Popular Widget */
    .widget_popular li {
    	clear: both;
    	display: block;
    	margin-bottom: 20px;
    }
    
    .widget_popular li h3 {
    	font-family: arial;
    	font-size: 13px;
    	line-height: 18px;
    	font-weight: normal;
    	margin: 0 0 5px 0;
    	max-height: 36px;
    	overflow: hidden;
    }
    
    .widget_popular h3 a {
    	color: #828282;
    }
    
    .widget_popular .post-date {
    	display: inline-block;
    	font-size: 10px;
    	padding-left: 22px;
    	color: #828282;
    	height: 15px;
    	line-height: 15px;
    	background: url(images/date-icon1.png) no-repeat left center;
    }
    
    .widget_popular img {
    	float: left;
    	margin: 0 15px 15px 0;
    	width: 60px;
    	height: 60px;
    }
    
    /* Subsribe Widget */
    li.subscribe_widget form {
    	height: 30px;
    	overflow: hidden;
    	margin: 0;
    }
    
    li.subscribe_widget input[type="text"] {
    	float: left;
    	border: 1px solid #d8d8d8;
    	-webkit-border-radius: 0;
    	-moz-border-radius: 0;
    	border-radius: 0;
    	padding: 0 0 0 10px;
    	margin-bottom: 0;
    	font-size: 11px;
    	color: #6a6a6a;
    	width: 100%;
    	height: 30px;
    	line-height: 30px;
    	box-sizing: border-box;
    	-moz-box-sizing: border-box;
    	-webkit-box-sizing: border-box;
    }
    
    li.subscribe_widget input[type="submit"] {
    	float: right;
    	font-weight: bold;
    	background: #d91c03;
    	font-size: 12px;
    	color: #fff;
    	height: 30px;
    	width: 80px;
    	text-align: center;
    	line-height: 30px;
    	border: none;
    	position: relative;
    	top: -30px;
    }
    
    /* Social Media Widget */
    li.widget_social_media > ul > li {
    	float: left;
    	width: 143px;
    	height: 84px;
    	margin: 0 14px 14px 0;
    	list-style: none;
    }
    
    li.widget_social_media > ul > li:nth-child(2n) {
    	margin-right: 0;
    }
    
    li.widget_social_media > ul > li:nth-last-child(-n+2) {
    	margin-bottom: 0px;
    }
    
    li.widget_social_media div.button {
    	position: relative;
    	top: 54px;
    	left: 13px;
    }
    
    li.widget_social_media li.twitter {
    	background: url(images/twitter.png) no-repeat;
    }
    
    li.widget_social_media li.google_plus {
    	background: url(images/google_plus.png) no-repeat;
    }
    
    li.widget_social_media li.facebook {
    	background: url(images/facebook.png) no-repeat;
    }
    
    li.widget_social_media li.pinterest {
    	background: url(images/pinterest.png) no-repeat;
    }
    
    /* Text Widget */
    .textwidget p {
    	color: #232323;
    	font-size: 13px;
    	line-height: 20px;
    	margin-top: -5px;
    }
    
    .textwidget img {
    	float: left;
    	margin: 5px 15px 10px 0;
    }
    
    /* Ads Small Widget */
    #sidebar li.widget_ads_small {
    	margin-bottom: 18px !important;
    }
    
    li.widget_ads_small li {
    	float: left;
    	width: 142px;
    	height: 142px;
    	margin: 0 16px 16px 0;
    	overflow: hidden;
    }
    
    li.widget_ads_small li img {
    	width: 142px;
    	height: 142px;
    }
    
    li.widget_ads_small li:nth-child(2n) {
    	margin-right: 0px;
    }
    
    /* Ads Big Widget */
    li.widget_ads_big > div {
    	width: 100%;
    }
    
    li.widget_ads_big > div img {
    	max-width: 100%;
    }
    
    /* Facebook Box Widget */
    li.widget_facebook_box iframe {
    	background: #fff;
    	border: none;
    	overflow: hidden;
    	width: 100%;
    	height: 258px;
    }
    
    /* Google+ Box Widget */
    li.widget_google_plus > div {
    	width: 100%;
    }
    
    /* Video Widget */
    li.widget_video iframe {
    	width: 100%;
    }
    
    /* Archive Widget, Categories Widget & Pages Widget */
    li.widget_archive li,
    li.widget_categories li,
    li.widget_pages li,
    li.widget_recent_entries li,
    li.widget_recent_comments li {
    	display: block;
    	color: #999;
    	font-style: italic;
    	font-weight: bold;
    	font-size: 11px;
    	margin-bottom: 10px;
    }
    
    li.widget_recent_comments li {
    	font-style: normal;
    	margin-bottom: 10px;
    }
    
    li.widget_archive li:last-child,
    li.widget_categories li:last-child,
    li.widget_pages li:last-child,
    li.widget_recent_entries li:last-child,
    li.widget_recent_comments li:last-child {
    	margin-bottom: 0px;
    }
    
    li.widget_archive li a,
    li.widget_categories li a,
    li.widget_pages li a,
    li.widget_recent_entries li a,
    li.widget_recent_comments li a {
    	color: #232323;
    	font-size: 12px;
    	font-style: normal;
    	font-weight: normal;
    }
    
    li.widget_recent_comments li a {
    	line-height: 20px;
    }
    
    li.widget_recent_comments li a.url {
    	font-weight: bold;
    }
    
    li.widget_categories ul.children {
    	margin: 15px 0 0 20px;
    	/*display: none;*/
    }
    
    /* RSS Widget */
    li.widget_rss .widget-title > a:first-child {
    	display: none;
    }
    
    li.widget_rss li {
    	margin-bottom: 15px;
    }
    
    li.widget_rss .rsswidget {
    	display: block;
    	color: #232323;
    	font-size: 12px;
    	font-style: normal;
    	font-weight: bold;
    	line-height: 18px;
    	margin-bottom: 5px;
    }
    
    li.widget_rss .rss-date {
    	display: block;
    	color: #999;
    	font-size: 11px;
    	padding: 3px 0 8px 0;
    }
    
    li.widget_rss .rssSummary {
    	line-height: 20px;
    	color: #666;
    }
    
    /* Flicer Widget */
    .widget_flickr .flickr-widget a {
    	float: left;
    	margin: 0 9px 9px 0px;
    
    	transition: opacity 0.2s linear;
    	-moz-transition: opacity 0.2s linear;
    	-webkit-transition: opacity 0.2s linear;
    	-o-transition: opacity 0.2s linear;
    }
    
    .widget_flickr .flickr-widget a:hover {
    	opacity: 0.70;
    	-moz-opacity: 0.70;
    	filter:alpha(opacity=70);
    }
    
    .widget_flickr .flickr-widget a,
    .widget_flickr .flickr-widget a img {
    	width: 91px;
    	height: 68px;
    }
    
    /* Twitter Widget */
    .widget_twitter {
    	margin-top: -4px;
    }
    
    .widget_twitter li {
    	padding-left: 30px;
    	display: block;
    	margin-top: 15px;
    	background: url(images/twitter-icon.png) no-repeat left 7px;
    }
    
    .widget_twitter li:first-child {
    	margin-top: 0px;
    }
    
    .widget_twitter p {
    	color: #646464;
    	line-height: 22px;
    	margin: 0;
    }
    
    .widget_twitter a {
    	color: #5dadcf;
    }
    
    /* Tag Cloud Widget */
    li.widget_tag_cloud .tagcloud a {
    	font-family: 'Georgia';
    	float: left;
    	color: #fff;
    	font-size: 11px !important;
    	padding: 3px 8px;
    	background: #666;
    	margin: 0 6px 6px 0;
    	text-decoration: none;
    
    	transition: background 0.2s linear;
    	-moz-transition: background 0.2s linear;
    	-webkit-transition: background 0.2s linear;
    	-o-transition: background 0.2st linear;
    }
    
    li.widget_tag_cloud .tagcloud a:hover {
    	background: #afada2;
    }
    
    /*-------------------------------------------------*/
    /* =  Back to TOP
    /*-------------------------------------------------*/
    .pagination-new + #top {
    	margin: -161px -80px 0 0;
    }
    
    #top {
    	clear: both;
    	float: right;
    	margin: -111px -80px 0 0;
    	margin: -113px -80px 0 0/;
    	text-align: center;
    }
    
    #top a {
    	display: block;
    	width: 60px;
    	height: 60px;
    	-webkit-border-radius: 5px;
    	-moz-border-radius: 5px;
    	border-radius: 5px;
    	text-indent: -9999px;
    	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    	-moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    	box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    	border: 1px solid #dedede/;
    	background: #fff url(images/back-to-top.png) no-repeat center center;
    
    	transition: all 0.2s ease-in-out;
    	-moz-transition: all 0.2s ease-in-out;
    	-webkit-transition: all 0.2s ease-in-out;
    	-o-transition: all 0.2s ease-in-out;
    }
    
    #top a:hover {
    	opacity: 0.8;
    }
    
    /*-------------------------------------------------*/
    /* =  Gallery - Slider
    /*-------------------------------------------------*/
    .flexslider { position: relative; }
    .flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
    .loading .flex-viewport {max-height: 300px;}
    .flexslider .slides {zoom: 1; margin: 0; padding: 0;}
    
    .flexslider .slides > li { display: none; list-style: none; }
    
    .widget_popular img,
    .flexslider .slides > li a img,
    .gallery img {
    	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'https://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
        filter: gray; /* IE6-9 */
    	-webkit-filter: grayscale(100%);
    
    	transition: all 0.3s ease;
    	-moz-transition: all 0.3s ease;
    	-webkit-transition: all 0.3s ease;
    	-o-transition: all 0.3s ease;
    }
    
    .widget_popular li:hover img,
    .flexslider .slides:hover > li a img,
    .gallery a:hover img {
    	filter: none;
    	-webkit-filter: grayscale(0%);
    }
    
    .flexslider:hover .flex-control-nav,
    .flexslider:hover li.flex-nav-prev,
    .flexslider:hover li.flex-nav-next {
    	opacity: 1;
    
    	transition: all 0.5s ease-in-out;
    	-moz-transition: all 0.5s ease-in-out;
    	-webkit-transition: all 0.5s ease-in-out;
    	-o-transition: all 0.5s ease-in-out;
    }
    
    .carousel li { margin-right: 5px; }
    
    /* Direction Nav */
    li.flex-nav-prev { opacity: 0; position: absolute; left: 0px; bottom: 50%; margin-bottom: -26px; width: 49px; height: 53px; list-style: none; }
    li.flex-nav-next { opacity: 0; position: absolute; right: 0px; bottom: 50%; margin-bottom: -26px; width: 49px; height: 53px; list-style: none; }
    li.flex-direction-nav a { display: block; width: 49px; height: 53px; cursor: pointer; text-indent: -9999px; -webkit-transition: all .3s ease;}
    li.flex-nav-next a.flex-next { background: #e7e7e7 url(images/gallery-next.png) no-repeat center center; -webkit-border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-top-left-radius: 3px; -moz-border-bottom-left-radius: 3px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
    li.flex-nav-prev a.flex-prev { background: #e7e7e7 url(images/gallery-prev.png) no-repeat center center; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-top-right-radius: 3px; -moz-border-bottom-right-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; }
    li.flex-nav-next a.flex-next:hover { opacity: 0.8; }
    li.flex-nav-prev a.flex-prev:hover { opacity: 0.8; }
    
    /* Control Nav */
    .flex-control-nav { opacity: 0; position: absolute; top: 30px; right: 30px; text-align: center; padding: 0; margin: 0; }
    .flex-control-nav li { margin: 0 0 0 17px; display: inline-block; zoom: 1; *display: inline; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid #fff; }
    .flex-control-nav li:first-child { margin: 0; }
    .flex-control-nav li.flex-active { border-color: #888; }
    .flex-control-paging li a { width: 10px; height: 10px; display: block; background: transparent; background: #000/; background: #000\9; cursor: pointer; text-indent: -9999px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; }
    .flex-control-paging li a.flex-active { cursor: default; }
    
    /*-------------------------------------------------*/
    /* =  FancyBox - v2.0.6
    /*-------------------------------------------------*/
    
    img:hover {
    	/* Declaration Here */
    }
    
    .fancybox-tmp iframe, .fancybox-tmp object {
    	vertical-align: top;
    	padding: 0;
    	margin: 0;
    }
    
    .fancybox-wrap {
    	position: absolute;
    	top: 0;
    	left: 0;
    	z-index: 8020;
    }
    
    .fancybox-skin {
    	position: relative;
    	padding: 0;
    	margin: 0;
    	background: #f9f9f9;
    	color: #444;
    	text-shadow: none;
    	-webkit-border-radius: 4px;
    	   -moz-border-radius: 4px;
    	        border-radius: 4px;
    }
    
    .fancybox-opened {
    	z-index: 8030;
    }
    
    .fancybox-opened .fancybox-skin {
    	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    	   -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    	        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    }
    
    .fancybox-outer, .fancybox-inner {
    	padding: 0;
    	margin: 0;
    	position: relative;
    	outline: none;
    }
    
    .fancybox-inner {
    	overflow: hidden;
    }
    
    .fancybox-type-iframe .fancybox-inner {
    	-webkit-overflow-scrolling: touch;
    }
    
    .fancybox-error {
    	color: #444;
    	font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
    	margin: 0;
    	padding: 10px;
    }
    
    .fancybox-image, .fancybox-iframe {
    	display: block;
    	width: 100%;
    	height: 100%;
    	border: 0;
    	padding: 0;
    	margin: 0;
    	vertical-align: top;
    }
    
    .fancybox-image {
    	max-width: 100%;
    	max-height: 100%;
    }
    
    #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
    	background-image: url(images/fancybox/fancybox_sprite.png);
    }
    
    #fancybox-loading {
    	position: fixed;
    	top: 50%;
    	left: 50%;
    	margin-top: -22px;
    	margin-left: -22px;
    	background-position: 0 -108px;
    	opacity: 0.8;
    	cursor: pointer;
    	z-index: 8020;
    }
    
    #fancybox-loading div {
    	width: 44px;
    	height: 44px;
    	background: url(images/fancybox/fancybox_loading.gif) center center no-repeat;
    }
    
    .fancybox-close {
    	position: absolute;
    	top: -18px;
    	right: -18px;
    	width: 36px;
    	height: 36px;
    	cursor: pointer;
    	z-index: 8040;
    }
    
    .fancybox-nav {
    	position: absolute;
    	top: 0;
    	width: 40%;
    	height: 100%;
    	cursor: pointer;
    	background: transparent url(images/fancybox/blank.gif); /* helps IE */
    	-webkit-tap-highlight-color: rgba(0,0,0,0);
    	z-index: 8040;
    }
    
    .fancybox-prev {
    	left: 0;
    }
    
    .fancybox-next {
    	right: 0;
    }
    
    .fancybox-nav span {
    	position: absolute;
    	top: 50%;
    	width: 36px;
    	height: 34px;
    	margin-top: -18px;
    	cursor: pointer;
    	z-index: 8040;
    	visibility: hidden;
    }
    
    .fancybox-prev span {
    	left: 20px;
    	background-position: 0 -36px;
    }
    
    .fancybox-next span {
    	right: 20px;
    	background-position: 0 -72px;
    }
    
    .fancybox-nav:hover span {
    	visibility: visible;
    }
    
    .fancybox-tmp {
    	position: absolute;
    	top: -9999px;
    	left: -9999px;
    	padding: 0;
    	overflow: visible;
    	visibility: hidden;
    }
    
    /* Overlay helper */
    #fancybox-overlay {
    	position: absolute;
    	top: 0;
    	left: 0;
    	overflow: hidden;
    	display: none;
    	z-index: 8010;
    	background: #000;
    }
    
    #fancybox-overlay.overlay-fixed {
    	position: fixed;
    	bottom: 0;
    	right: 0;
    }
    
    /* Title helper */
    
    .fancybox-title {
    	visibility: hidden;
    	font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
    	position: relative;
    	text-shadow: none;
    	z-index: 8050;
    }
    
    .fancybox-opened .fancybox-title {
    	visibility: visible;
    }
    
    .fancybox-title-float-wrap {
    	position: absolute;
    	bottom: 0;
    	right: 50%;
    	margin-bottom: -35px;
    	z-index: 8030;
    	text-align: center;
    }
    
    .fancybox-title-float-wrap .child {
    	display: inline-block;
    	margin-right: -100%;
    	padding: 2px 20px;
    	background: transparent; /* Fallback for web browsers that doesn't support RGBa */
    	background: rgba(0, 0, 0, 0.8);
    	-webkit-border-radius: 15px;
    	   -moz-border-radius: 15px;
    	        border-radius: 15px;
    	text-shadow: 0 1px 2px #222;
    	color: #FFF;
    	font-weight: bold;
    	line-height: 24px;
    	white-space: nowrap;
    }
    
    .fancybox-title-outside-wrap {
    	position: relative;
    	margin-top: 10px;
    	color: #fff;
    }
    
    .fancybox-title-inside-wrap {
    	margin-top: 10px;
    }
    
    .fancybox-title-over-wrap {
    	position: absolute;
    	bottom: 0;
    	left: 0;
    	color: #fff;
    	padding: 10px;
    	background: #000;
    	background: rgba(0, 0, 0, .8);
    }
    
    /*-------------------------------------------------*/
    /* =  WordPress Core
    /*-------------------------------------------------*/
    .entry-content img {}
    .alignleft, img.alignleft {}
    .alignright, img.alignright {}
    .aligncenter, img.aligncenter {}
    .alignnone, img.alignnone {}
    
    .wp-caption {}
    .wp-caption img {}
    .wp-caption p.wp-caption-text {}
    
    .wp-smiley {}
    
    .gallery dl {}
    .gallery dt {}
    .gallery dd {}
    .gallery dl a {}
    .gallery dl img {}
    .gallery-caption {}
    
    .size-full {}
    .size-large {}
    .size-medium {}
    .size-thumbnail {}
    .sticky{}
    .bypostauthor{}
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Don’t edit your theme’s files.

    Use a Child Theme or a Custom CSS Manager plugin to hold your CSS changes.

    The code that @triptripper gave was an example. Look at this tutorial https://www.suburban-glory.com/blog?page=114

    Thread Starter TommyLouis

    (@tommylouis)

    Okay okay i see. i read the tutorial as well but what exactly and made a child theme i am still on a very beginner’s level tbh so i’m stuck at inserting the example in the style.css (child) how would i insert the code in the style.css to change the whole blog?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Try the Custom CSS Manager plugin.

    You enter the CSS into that plugin’s allocated section of the dashboard.

    To apply it to all images, use @triptripper’s example;

    img:hover {
     /* Declaration Here */
     -webkit-box-shadow:5px 5px 5px #999999;
     -moz-box-shadow: 5px 5px 5px #999999;
     box-shadow:5px 5px 5px #999999;
    }

    Thread Starter TommyLouis

    (@tommylouis)

    Thank you so much Andrew & Triptripper’s i really appreciate your time and help, Okay I downloaded the CSS plugin worked like a charm for my button’s which i was trying to do anyway. but the pictures on my blog didn’t change. it’s more of a picture blog here is an exact example of the theme i am using i figure maybe a code needs to be placed somewhere else?

    Example blog

    Thread Starter TommyLouis

    (@tommylouis)

    It works nvm! thank you guys

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘How to make pictures on Blog glow when Mouse Hover over?’ is closed to new replies.