/* Theme Name: Pin WP Child Description: A Child Theme for the Pin Wordpress Theme. If you plan to do a lot of file modifications we recommend to use this Theme instead of the original Theme. Updating wil be much easier then. Version: 3.4 Template: pin-wp Author: An-Themes Author URI: https://themeforest.net/user/an-themes/portfolio Tags: black, white, red License: GNU General Public License version 3.0 License URI: http://www.gnu.org/licenses/gpl-3.0.html */ /* =Theme customization starts here -------------------------------------------------------------- */ /**/ .nav-btn { position: absolute; top: 50%; transform: translateY(-50%); background-color: rgba(255, 255, 255, 0.5); /* semi-transparent */ border: none; color: #333; font-size: 22px; font-weight: bold; border-radius: 50%; width: 42px; height: 42px; cursor: pointer; display: flex; align-items: center; justify-content: center; z-index: 5; box-shadow: 0 2px 5px rgba(0,0,0,0.25); transition: background-color 0.2s ease, transform 0.2s ease; } .nav-btn:hover { background-color: rgba(255, 255, 255, 0.8); /* more visible on hover */ transform: translateY(-50%) scale(1.05); } .entry_div { background-color: #f5f5f5; /* very light grey */ border-bottom: 1px solid #e0e0e0; /* subtle border */ padding: 35px 15px 12.5px 15px; /* inner spacing */ margin-bottom: 35px; /* spacing between posts */ } #prevBtn { left: 8px; } #nextBtn { right: 8px; } .ct-size{ margin-top:10px;} .entry_div{text-align:center;} .ct-size, #entry_right_side{ padding: 0 100px; } .software-compatibility p a, .overview p a, .license p a { background-color: transparent !important; /* remove any background */ color: #000 !important; /* optional, custom link color */ font-size: 15px !important; } .software-compatibility, .license { margin-bottom: 20px; text-align:left; font-size: 14px; color: #555; } .software-compatibility h3, .license h3 { margin-top: 20px !important; font-size: 16px; font-weight: 600; } .software-compatibility a, .license a { color: #0066cc; text-decoration: underline; display: inline-block; /* ensures link is on its own line */ } .software-compatibility p, .license p { padding: 0px !important; } .overview h2 { font-size: 20px; font-weight: 600; } .overview, .filetype, .features, .download-instructions { margin-bottom: 20px; text-align:left; font-size: 16px; color: #555; margin-top: 0; /* removes extra spacing if needed */ } .filetype h3, .features h3, .download-instructions h3 { font-size: 16px; font-weight: 600; } .overview p, .filetype p, .features p, .download-instructions p { line-height: 1.5; padding: 0px !important; } .download-instructions strong { font-weight: 700; } .entry .features ul, .entry .filetype ul { margin: 0px 40px; } /*----------------------------------------------------------------------------- ----------------------------- 0 - CSS Reset ----------------------------------- -----------------------------------------------------------------------------*/ html,body,h1,h2,h3,h4,h5,h6,form,li,ul,ol,p,input,select,legend,textarea,fieldset { margin:0; padding:0;} ul, ol { list-style-type: none; } :focus { outline: 0;} ins { text-decoration: none; } del { text-decoration: line-through; } img { border:none;} h1,h2,h3,h4,h5,h6 { line-height:26px;} h1 { font-size: 26px; } h2 { font-size: 24px; } h3 { font-size: 22px; } h4 { font-size: 20px; } h5 { font-size: 18px; } h6 { font-size: 16px; } code, pre { background: url(images/bg_pre.png); font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: bold; line-height: 20px; font-size: 12px; display: block; margin: 14px 0; overflow:hidden; padding: 21px 18px 18px 18px; } code:hover, pre:hover { overflow:scroll;} strong { font-weight: bold;} fieldset { border: none;} .clear { clear:both; display:block;} .sleft { float:left;} .sright { float:right;} iframe { border: 0 !important;} input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"] { -webkit-appearance: none; } /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ * { margin: 0; padding: 0; } html body { font: 14px/22px "Ruda", Helvetica, Arial, sans-serif; font-weight: 400; -webkit-text-size-adjust: none; overflow-x:hidden; } /* - Header - */ header { width: 100%; height: auto; margin: 0 auto; } .main-header { width: 100%; margin: 0 auto; } .bar-header { width: 100%; height: 45px; margin: 0 auto; } .wrap-center { width: 1280px; height: auto; margin: 0 auto; } /* - Layout content - */ .home-fullwidth { width: 100%; height: auto; margin: 0 auto 0 auto; padding: 0 0px; overflow: hidden;} .wrap-fullwidth { width: 1280px; height: auto; margin: 30px auto; padding: 0 0px;} .wrap-fullwidth-bg { width: 1280px; height: auto; margin: 40px auto; padding: 10px 0px 30px 0;} .wrap-fullwidth-bg .entry { width: auto; padding-left: 115px; padding-right: 115px;} .home-fullwidth-vc { width: 100%; min-height: 600px; margin: 0 auto 0 auto; padding: 0 0px; background-color: #FFF;} /* - page-content - */ .wrap-content { width: auto; height: auto; margin: 25px 0 40px 300px; z-index: 1; } .single-content { width: 950px; float: left; padding: 0 0 25px 0;} .sidebar { width: 300px; float: left; margin-left: 30px; padding-top: 30px;} .sidebar-left { width: 300px; height: auto; float: left; z-index:2; margin: 0 0 -20000px 0; padding: 15px 0 20000px 0; } /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /* -- Top Header Menu -- ##################### */ /*-- Logo -- Custom*/ .logo {height:60px; width:100px; margin-left:25px; float:left;} picture.logo img{height:60px; width:100px;} .jquerycssmenu { font-size: 16px; font-weight: 700; float: left; padding-top: 8px; margin: 0 0 0 15px; position: relative;} .jquerycssmenu ul li { position: relative; display: inline; float: left; padding: 0; } .jquerycssmenu ul li i { padding: 0 2px; font-size: 16px; margin-top: 5px;} .jquerycssmenu ul li span { display: block; margin-top: -20px; font-size: 12px; font-weight: normal; } /*Top level menu link items style*/ .jquerycssmenu ul li a {display: block; padding: 4px 8px 0px 8px !important; margin-right: 15px; line-height: 38px; } .jquerycssmenu ul li.current_page_item a { border-radius: 3px;} .jquerycssmenu ul li.current-menu-ancestor a { border-radius: 3px;} .jquerycssmenu ul li:hover a { border-radius: 3px } .jquerycssmenu ul li.current-menu-item a { border-radius: 3px;} .jquerycssmenu ul li.current-post-parent a { border-radius: 3px;} /* ######### CSS classes applied to down and right arrow images ######### */ .downarrowclass { position: absolute; top: 52px; left: 40%; } .rightarrowclass { position: absolute; top: 14px; right: 18px; } /* -- Sticky Header -- */ header .stickytop { position: fixed; width: 100%; left: 0; top: 0; z-index: 999999 !important; border-top: 0; } header .stickytop.sticky-on { width: 100%; height: 60px; margin: 0 auto; -webkit-transition: 1.5s; -moz-transition: 1.5s; transition: 1.5s; } header .stickytop .logo { height: 60px; } header .stickytop .jquerycssmenu { margin-top: -8px; font-size: 13px;} header .stickytop .jquerycssmenu ul li span { display: none;} header .stickytop .jquerycssmenu ul li ul { margin-top: -22px;} header .stickytop .jquerycssmenu ul li ul li ul { margin:-14px 0 0 -1px; } header .stickytop .downarrowclass { top: 32px;} header .stickytop #searchform2 { margin-top: 14px;} header .stickytop #searchform2 #s { height: 30px;} header .stickytop #searchform2 .buttonicon { width: 32px; height: 32px; background:url(images/btn_search.png) 8px 9px no-repeat;} header .stickytop #s:focus { width: 178px; overflow: hidden;} header .stickytop .jquerycssmenu ul li a:hover { opacity: 0.6;} header .stickytop div.uploadbtn { margin: 5px 25px 0 5px;} header .stickytop div.uploadbtn .simplebtn { padding: 2px 8px 1px 8px; font-size: 14px; } /* -- Sticky Posts style -- */ #infinite-articles .sticky { z-index: 101 !important;} #responsive-menu-button { z-index: 999999 !important; } /* -- Responsive Menu -- */ ul#responsive-menu li a span { display: none !important;} #rmp-menu-wrap, .rmp-menu { width: 76% !important; } .rmp-submenu { width: 95% !important; } .rmp_menu_trigger:hover { cursor: pointer;} /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ##### Big Search ##### */ .front-overlay-content { width: 100%; height: 400px; background-size: cover !important; background-position: center !important; position: relative; margin: 0 auto; } .front-overlay-wrap { width: 100%; height: 400px; text-align: center;} .front-overlay-wrap h1 { width: 600px; margin: 0 auto; padding-top: 100px; font-weight: 700; font-size: 24px; line-height: 36px; word-spacing:7px; } .welcome-disable { width: 100%; height: 1px; padding-top: 72px;} /* -- Sub Header Search -- */ .front-overlay-content #searchform1 { width: 796px; height: auto; margin: 0px auto 5px auto; padding-top:20px;} .front-overlay-content #searchform1 #q { width: 520px; font-weight: bold; height: 50px; font-family: 'Ruda', sans-serif; float: left; border: none; padding: 0 20px; font-size: 13px;} .front-overlay-content #searchform1 .buttonicon { width: 120px; height: 50px; float: right; border: none; text-align: center; text-transform: uppercase; background-color: #dd3333 !important; font-family: 'Ruda', sans-serif; font-weight: 700; font-size: 17px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; background-color:;} .front-overlay-content #searchform1 .buttonicon:hover { cursor: pointer; opacity:.95; } .front-overlay-content #searchform1 input[type="submit"] { -webkit-appearance: none !important; border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; } .front-overlay-content #searchform1 .buttonicon { margin-left: -4px;} /* Big Search Selection -- Custom*/ select#posType{ width: 120px; float: left; height: 50px; padding: 0 0 0 10px; border: none; color: #333; font-family: 'Ruda', sans-serif; font-weight: 700; font-size: 14px; text-align: center; border-top-left-radius: 10px; border-bottom-left-radius: 10px; text-transform: uppercase; border-right: outset; } select option { font-weight: 500; font-size: 14px;} /* -- Sub Header Search ( Popular Words ) -- */ .popular-words-search { width: 796px; height: 30px; margin: 0 auto; text-align: left;} .popular-words-search a { font-weight: bold; margin-left: 7px; font-size: 14px !important;} /*-- Popular Words -- Custom*/ .popular-words-search a span.tagcount{display:none;} /*Popular Words Div*/ .archive.tax-laser_cut .front-overlay-wrap h1, .archive.tax-silhouette_art .front-overlay-wrap h1, .search .front-overlay-wrap h1, .single .front-overlay-wrap h1 {padding-top: 1px !important;} .archive.tax-laser_cut .front-overlay-content, .archive.tax-silhouette_art .front-overlay-content, .search .front-overlay-content, .single .front-overlay-content {height: 135px;} .archive.tax-laser_cut .front-overlay-wrap, .archive.tax-silhouette_art .front-overlay-wrap, .search .front-overlay-wrap, .single .front-overlay-wrap {height: 135px;} /*-- Tags Page Heading -- Custom*/ .archive-header{text-align:center;} /*Taxonomy Description -- Custom*/ div.grey{font-size:1.2em; color:black; padding:10px 0px; } /* AUTOCOMPLETE STYLING */ /*the container must be positioned relative:*/ .autocomplete {position: relative; display: inline-block;} .autocomplete-items {position: absolute; text-align: left; border: 1px solid #d4d4d4; border-bottom: none; border-top: none; z-index: 99; /*position the autocomplete items to be the same width as the container:*/ top: 100%; left: 0; right: 0;} .autocomplete-items div {padding: 10px 20px; cursor: pointer; background-color: #fff; border-bottom: 1px solid #d4d4d4;} /*when hovering an item:*/ .autocomplete-items div:hover {background-color: #e9e9e9;} /*when navigating through the items using the arrow keys:*/ .autocomplete-active {background-color: #e9e9e9 !important; } /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list { width: auto; height: auto; } ul.masonry_list li { width: 290px; height: auto; float: left; margin: 0 0 25px 25px; } ul.masonry_list li img { width: 100%; object-fit: cover; float: left; margin-bottom: 0px; border-top-left-radius: 2px; border-top-right-radius: 2px; height:290px;} ul.masonry_list li h3 { font-size: 13px; line-height: 18px; } ul.masonry_list li p { font-size: 13px; padding: 10px 0 0 0; } ul.masonry_list .small-content { padding: 0 15px 10px;} ul.masonry_list .an-widget-title h2 { overflow-wrap: break-word; word-wrap: break-word; font-size: 16px; line-height: 22px; margin-top: 10px; margin-bottom: 3px;} ul.masonry_list .review-box-nr { font-size: 12px;} ul.masonry_list .an-widget-title i { font-size: 12px; padding-left: 2px;} ul.masonry_list .an-widget-title span { font-size: 11px; } ul.masonry_list .an-widget-title span a { background-color: transparent !important;} /* - Home ADS -*/ ul.masonry_list li.homeimg, ul.masonry_list li.homeimg script, ul.masonry_list li.homeimg iframe, ul.masonry_list li.homeimg embed, ul.masonry_list li.homeimg object, ul.masonry_list li.homeimg img { width: 290px; background-color: inherit; background-color: transparent !important; -moz-box-shadow: 0 1px 5px rgba(0,0,0,0); -webkit-box-shadow: 0 1px 5px rgba(0,0,0,0); box-shadow: 1px 1px 10px 5px rgb(0 0 0 / 10%); } ul.masonry_list li.homeimg span { color: #444; text-align: center !important; display: block; font-size: 10px; text-transform: uppercase;} ul.masonry_list li div.iframe-embed { overflow:hidden; padding-bottom:56.25%; position:relative; height:0; } ul.masonry_list li div.iframe-embed iframe { left:0; top:0; height:100%; width:100%; position:absolute; } /* -- Pagination -- */ .wp-pagenavi { float: none; width: 100%; text-align: center; padding: 20px 0; font-size: 15px; } .wp-pagenavi a, .wp-pagenavi span { display: inline-block; padding:5px 13px; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; list-style: none; margin: 0; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; margin-right:1px; font-size:12px; font-weight:bold; } .wp-pagenavi a:hover { border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } .wp-pagenavi span.current { border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px;} /* -- Default pagination numbers -- */ .defaultpag { } .defaultpag .sright { float: right; margin: 0 100px 0 0;} .defaultpag .sleft { float: left; margin: 0 0 0 100px;} /*----------------------------------------------------------------------------- ----------------------------- 4 - Entry Content ------------------------------- -----------------------------------------------------------------------------*/ /* -- Home content -- */ .home-content { padding: 25px;} /* -- Bottom banner 728x90 -- */ .single-728 { width: 100%; height: auto; margin: 20px auto 0px auto; } .img728 {} /* - Top entry banner / meta date - */ .single-box { width: 950px; height: 150px; float: left; } .single-money { width: 728px; height: 90px; margin: 30px auto;} .meta-wrap { width: 100%; height: 30px; } .single-content .single-meta { width: 720px; height: 30px; margin: 0 auto; } .single-content .an-display-time { float: left; font-size: 11px; padding: 5px 15px 0 0; } .single-content .an-display-view { float: left; font-size: 11px; padding: 5px 15px 0 0} /* -- Entry Top -- */ .entry-top { width: 720px; height: auto; margin: 0 auto; padding: 30px 0; text-align: center;} .entry-top i { font-size: 12px; padding-left: 2px;} .entry-top span { font-size: 12px; } /* - title - */ h1.article-title { font-size: 36px; font-weight: 600; line-height: 44px; } .entry h1.page-title { font-size: 36px; font-weight: 600; line-height: 44px; text-align: center; padding-bottom: 10px; margin-bottom: 20px; text-decoration: none;} /* -- Entry excerpt -- */ div.entry-excerpt h3 { text-decoration: none; } div.entry-excerpt p {font-size: 19px; font-weight: normal; line-height: 30px;} div.entry-excerpt:after { display: block; content: ""; width: 30px; height: 2px; margin-top: 5px; margin-bottom: 10px;} /* -- Entry Banner -- */ .entry-img-300 { width: 300px; float: right; margin: 20px -80px 20px 20px; position: relative; } /* -- Entry bottom -- */ .entry-bottom { width: 720px; height: auto; margin: 20px auto 10px auto;} .single-content h3.title { font-weight: normal; text-align: center; font-size: 13px; text-transform: uppercase; padding: 2px 10px 1px 10px; margin: 5px 0 20px 0; border-radius: 2px;} .single-content h3.title span { opacity: 0.8; border-bottom: 1px solid #FFF;} /*-- Entry button -- */ .entry-btn { font-size: 12px; display: inline-block; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; font-weight: bold; padding: 1px 10px; text-align: center; margin: 5px 5px 0 0; } .ct-size a { font-weight: bold;} /* -- Entry content style -- */ .home-fullwidth-vc .entry { width: 100%;} .entry { width: 100%; height: auto;} .entry p a { font-size: 13px; border-radius: 2px; padding: 1px 3px 0px 3px;} .entry p a:hover { text-decoration: underline;} .entry p { padding: 10px 0; font-size: 16px; line-height: 26px; } .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 { margin-top: 30px; text-decoration: underline; } .entry strong { font-weight: bold; } .entry .simplebtn { border-radius: 4px !important; padding: 4px 20px !important; } /* -- blockquote -- */ blockquote { text-align: center; font-weight: normal; margin:40px; background:url(images/quotes.png) no-repeat top left; padding:0 0 0 35px;} blockquote p { font-size: 20px !important; line-height: 30px !important; padding-right: 25px !important; background:url(images/quotes.png) no-repeat bottom right; font-style: italic; } /* -- Responsive Images -- */ .entry img, .wp-caption {border-radius: 3px; } .entry img, img[class*="align"], img[class*="wp-image-"], img[class*="attachment-"] { height: auto; } img.size-full, img.size-large, .wp-post-image, .post-thumbnail img { height: auto; max-width: 100%; } img.alignleft, .alignleft img { width: inherit !important;} img.alignright, .alignright img { width: inherit !important;} .alignleft { float: left; margin: 20px 20px 10px -80px; } .alignright { float: right; margin: 20px -80px 10px 20px; } .aligncenter { display: block; margin: 30px auto 10px auto;} .wp-caption img[class*="wp-image-"] { display: block; margin: 0; } .wp-caption-text { font-size: 12px !important; margin-top: -7px; padding: 0 10px 0 10px; text-align: center; } p.wp-caption-text a { background: transparent !important; } p > a.wp-img-bg-off { background: none !important; /* for images manually added */} /* -- End res. img -- */ /* -- Lists -- */ .entry th { padding: 0; margin-right: 2px; } .entry li { padding:3px 0 3px 5px; } .entry ul { margin:20px 40px; list-style-type: square;} .entry ol { margin:20px 40px; list-style-type: decimal;} /* -- Pagination entry articles -- */ .my-paginated-posts { text-align: center; font-size:10px; margin-bottom: 30px; } .my-paginated-posts span { padding: 3px 6px 3px 6px; border-radius: 3px;} .my-paginated-posts p { font-size:1.4em; } .my-paginated-posts p a { border-radius: 3px; font-weight: bold; padding: 6px 10px; text-decoration:none; margin: 0 1px; } .my-paginated-posts a:hover { opacity: 0.8; } /* -- Single Share -- */ #single-share { width:auto; height: auto; text-align: center; float: none; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 15px 0;} #single-share a span { color: #FFF;} #single-share a:hover { opacity: 0.8;} #single-share a.fbbutton { float: none; padding:4px 15px 2px 15px; margin-right: 10px; font-size: 13px; text-transform: uppercase; border-radius: 2px; display: inline-block; background-color: #3b5998; color: #FFF !important;} #single-share a.twbutton { float: none; padding:4px 15px 2px 15px; margin-right: 10px; font-size: 13px; text-transform: uppercase; border-radius: 2px; display: inline-block; background-color: #00aced; color: #FFF !important;} #single-share a.pinbutton { float: none; padding:4px 15px 2px 15px; margin-right: 10px; font-size: 13px; text-transform: uppercase; border-radius: 2px; display: inline-block; background-color: #ca212a; color: #FFF !important;} #single-share a.googlebutton{ float: none; padding:4px 15px 2px 15px; margin-right: 10px; font-size: 13px; text-transform: uppercase; border-radius: 2px; display: inline-block; background-color: #eb4026; color: #FFF !important;} #single-share a.emailbutton { float: none; padding:4px 15px 2px 15px; margin-right: 10px; font-size: 13px; text-transform: uppercase; border-radius: 2px; display: inline-block; background-color: #00688a; color: #FFF !important;} #single-share a.whatsappbutton { float: none; padding:4px 15px 2px 15px; margin-right: 10px; font-size: 13px; text-transform: uppercase; border-radius: 2px; display: inline-block; background-color: #0dc143; color: #FFF !important;} #single-share a.emailbutton i { font-size: 14px; margin-right: 5px;} #single-share .googlebutton i, #single-share .pinbutton i, #single-share .fbbutton i, #single-share .twbutton i, #single-share a.whatsappbutton i { font-size: 16px; margin-right: 5px; } /* -- Chrome CSS -- */ @media screen and (-webkit-min-device-pixel-ratio:0) { #single-share i { } } /*Custom Setting*/ #img_div{width:100%; height:auto;} #img_div_size{ position: relative; /* important for absolute positioning inside */ margin-bottom: 12.5px; height: 540px; max-width: 100%; overflow: hidden; display: flex; justify-content: center; align-items: center; min-height: 540px; max-height: 540px; width: auto; } #myImg{ height: 100%; width: auto; display: block; margin: 0 auto; /* centers the image */ object-fit: contain;} picture#myImg source{max-width: 60%; height:auto;} #my_title{text-decoration:none; font-size: 22px; text-align:center;} #single_table{border-collapse: collapse; width: 100%;} #single_table th, td {text-align: left; padding: 10px 0;} #single_table th{width:30%;} h3.title{line-height: 40px;} /*----------------------------------------------------------------------------- ----------------------------- 5 - Sidebar & Widgets --------------------------- -----------------------------------------------------------------------------*/ /* -- Sidebar -- */ .sidebar .widget h3.title, .sidebar-left .widget h3.title, h3.top-title { margin-bottom: 5px; text-transform: uppercase; line-height: 1; font-size: 14px;} .sidebar .widget, .sidebar-left .widget { width: 250px; padding: 0 25px 20px 25px; margin-bottom: 10px;} h3.top-title { padding-left: 25px;} .widget h3.title:after, h3.top-title:after { display: block; content: ""; width: 30px; height: 2px; margin-top: 5px; margin-bottom: 15px; } /* -- Banner widget 300px -- */ .img-300 { width: 300px; height: auto; margin:0 0 0 -25px; padding: 0px;} /* -- Custom Text -- */ .widget-text { } .widget_text img { max-width: 100% !important;} .widget_text select { width: 100%; padding: 10px 20px;} .widget_text option { padding: 0 10px;} /* -- Default Tags -- */ div.widget_tag_cloud { display: inline-block; margin-bottom: 10px;} div.tagcloud span { font-weight: bold; } div.tagcloud a { float: left; display: inline-block; padding:3px 10px; list-style: none; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; margin:0 4px 4px 0; font-size:13px !important; font-weight:400;} /* -- Mode default widgets -- */ .sticky {} .gallery-caption {} .bypostauthor {} /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } /*----------------------------------------------------------------------------- ----------------------------- 8 - Custom Pages -------------------------------- -----------------------------------------------------------------------------*/ /* -- Tag & Category Index -- */ #mcTagMap .tagindex h4, #sc_mcTagMap .tagindex h4 { font-size: 14px; font-weight: bold; } #mcTagMap .tagindex ul li span.mctagmap_count { float: right !important; opacity: 0.5;} #mcTagMap .tagindex ul li, #sc_mcTagMap .tagindex ul li { font-size: 14px; } #mcTagMap .holdleft, #sc_mcTagMap .holdleft { width: 163px !important; } /* -- Login & Register -- */ .lrm-nice-checkbox__indicator { width: 16px; height: 16px; } .lrm-font-svg .lrm-form .hide-password, .lrm-font-svg .lrm-form .lrm-ficon-eye { padding: 11px 11px; } @media only screen and (min-width: 600px){ .lrm-col { padding: 0 1% 0 !important; } .lrm-col-half-width, .lrm-col-1-2 { width: 48% !important; } } /*----------------------------------------------------------------------------- ------------------------------ 9 - Footer ------------------------------------- -----------------------------------------------------------------------------*/ footer { width: 100%; height: auto; bottom: 0;} .social-section { width: 100%; height: 75px; text-align: center;} .wrap-footer { width: 100%; height: auto; margin: 0 auto; } /* -- Copyright -- */ .copyright { width: 980px; height: auto; margin: 0 auto; padding: 20px 0 20px 0; text-align: -webkit-center; } /* -- Footer Social Icons -- */ ul.footer-social { margin-left: auto; margin-right: auto; } ul.footer-social li { height: 40px; font-size: 24px; display: inline-block; margin: 27px 5px 0 5px; } ul.footer-social li a { text-align: center; padding: 5px 10px; } /* -- Back to Top -- */ #back-top { position: fixed; bottom: 10px; right: 10px; z-index:999999; } #back-top a { width: 40px; display: block; } #back-top span { width: 40px; height: 40px; display: block; background: url(/images/top.png) -5px -5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; } /*----------------------------------------------------------------------------- ----------------------------- 10 - Shortcodes ------------------------------------- -----------------------------------------------------------------------------*/ /* -- Buttons -- */ .simplebtn, .smallbtn { display: inline-block; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; font-weight: bold; padding: 6px 20px; text-align: center; margin: 10px 10px 0 0; } .smallbtn { padding: 0px 10px; font-weight: 600; } .smallbtn a { color: #FFF !important; } .smallbtn a:hover { background: inherit !important; text-decoration: underline;} .simplebtn:hover { opacity:.85; text-decoration: none !important; } .simplebtn i { padding-right: 5px;} a.simplebtn.blue:hover { background-color: #0099cc !important; color: #FFF !important;} a.simplebtn.green:hover { background-color: #7dc34d !important; color: #FFF !important;} a.simplebtn.green2:hover { background-color: #0fbe7c !important; color: #FFF !important;} a.simplebtn.orange:hover{ background-color: #e76b33 !important; color: #FFF !important;} a.simplebtn.gold:hover { background-color: #ffd62c !important; color: #FFF !important;} a.simplebtn.red:hover { background-color: #cc3333 !important; color: #FFF !important;} a.simplebtn.pink:hover { background-color: #d63f72 !important; color: #FFF !important; } a.simplebtn.black:hover { background-color: #3b3b3b !important; color: #FFF !important; } .simplebtn.blue { background-color: #0099cc !important; border: 1px solid #0099cc !important; color: #FFF !important; text-shadow: 0 -1px 0 #0099cc;} .simplebtn.green { background-color: #7dc34d !important; border: 1px solid #7dc34d !important; color: #FFF !important; text-shadow: 0 -1px 0 #7dc34d;} .simplebtn.green2 { background-color: #0fbe7c !important; border: 1px solid #0fbe7c !important; color: #FFF !important; text-shadow: 0 -1px 0 #0fbe7c;} .simplebtn.orange { background-color: #e76b33 !important; border: 1px solid #e76b33 !important; color: #FFF !important; text-shadow: 0 -1px 0 #e76b33;} .simplebtn.gold { background-color: #ffd62c !important; border: 1px solid #ffd62c !important; color: #FFF !important; text-shadow: 0 -1px 0 #ffd62c;} .simplebtn.red { background-color: #cc3333 !important; border: 1px solid #cc3333 !important; color: #FFF !important; text-shadow: 0 -1px 0 #cc3333;} .simplebtn.pink { background-color: #d63f72 !important; border: 1px solid #d63f72 !important; color: #FFF !important; text-shadow: 0 -1px 0 #d63f72;} .simplebtn.black { background-color: #3b3b3b !important; border: 1px solid #3b3b3b; color: #FFF !important; text-shadow: 0 -1px 0 #3b3b3b;} /* -- Columns -- */ .one_half, .one_half_last { float:left;width:48%; margin-bottom:10px; margin-right:4%; } .one_half_last { margin-right:0;} .one_third, .one_third_last { float:left; width:30%; margin-bottom:10px; margin-right:5%; } .one_third_last { margin-right:0;} .one_fourth, .one_fourth_last { float:left; width:23.5%; margin-bottom:10px; margin-right:2%; } .one_fourth_last { margin-right:0;} /* -- Boxes info -- */ .boxinfo { box-shadow: 0px 0px 1px #fafafa, 0 2px 2px #fafafa inset; background:#ddecf5; color:#99b1c1; border:1px solid #c3d9e5; padding:15px; margin:15px 0; -moz-border-radius:2px; border-radius:2px; font-weight: bold; text-align: center;} .boxsucces { box-shadow: 0px 0px 1px #fafafa, 0 2px 2px #fafafa inset; background:#e9f6e3; color:#93c088; border:1px solid #ceedc4; padding:15px; margin:15px 0; -moz-border-radius:2px; border-radius:2px; font-weight: bold; text-align: center;} .boxerror { box-shadow: 0px 0px 1px #fafafa, 0 2px 2px #fafafa inset; background:#ffe3e3; color:#cf9494; border:1px solid #fdcdcd; padding:15px; margin:15px 0; -moz-border-radius:2px; border-radius:2px; font-weight: bold; text-align: center;} .boxnotice { box-shadow: 0px 0px 1px #fafafa, 0 2px 2px #fafafa inset; background:#fcf9da; color:#b3ad77; border:1px solid #ebe7bc; padding:15px; margin:15px 0; -moz-border-radius:2px; border-radius:2px; font-weight: bold; text-align: center;} .boxinfo, .boxsucces, .boxerror, .boxnotice { max-width: 100% !important; display: inline-block !important; } /* -- List styles – ul -- */ ul.simplelist li { padding:3px 0 3px 15px; background: url(images/li_arrow.png) no-repeat 0px center; font-weight: 600; } ul.simplelist { margin:20px 40px; list-style-type: none;} ul.minus-blue-list li { padding:3px 0 3px 17px; background: url(images/li_minus_blue.png) no-repeat 0px center; font-weight: 600; } ul.minus-blue-list { margin:20px 40px; list-style-type: none;} ul.minus-green-list li { padding:3px 0 3px 17px; background: url(images/li_minus_green.png) no-repeat 0px center; font-weight: 600; } ul.minus-green-list { margin:20px 40px; list-style-type: none;} ul.minus-orange-list li { padding:3px 0 3px 17px; background: url(images/li_minus_orange.png) no-repeat 0px center; font-weight: 600; } ul.minus-orange-list { margin:20px 40px; list-style-type: none;} ul.minus-gold-list li { padding:3px 0 3px 17px; background: url(images/li_minus_gold.png) no-repeat 0px center; font-weight: 600; } ul.minus-gold-list { margin:20px 40px; list-style-type: none;} ul.minus-black-list li { padding:3px 0 3px 17px; background: url(images/li_minus_black.png) no-repeat 0px center; font-weight: 600; } ul.minus-black-list { margin:20px 40px; list-style-type: none;} /* Style Pin ( default color ) ------------------------------------------- -----------------------------------------------------------------------------*/ h1,h2,h3,h4,h5,h6 { color: #333;} code, pre { border: 1px solid #eae9e9; background-color: #FFF; -moz-box-shadow: 0 1px 10px rgba(0,0,0,0.1); -webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.1); box-shadow: 0 1px 10px rgba(0,0,0,0.1);} /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ a:link, a:visited { color: #000; text-decoration: none; } a:hover { color: #dd3333; /* red color */ } ::-moz-selection { background:#000; color: #fff; text-shadow: none; } ::selection { background:#000; color: #fff; text-shadow: none; } /* -- Header -- */ html body { color: #414141; background-color: #ffffff !important;} header, .sticky { background-color: #000; } .bar-header { background-color: #dd3333; } /* - Layout content - */ .wrap-fullwidth-bg { background-color: #FFF; -moz-box-shadow: 0 1px 5px rgba(0,0,0,0.1); -webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.1); box-shadow: 0 1px 5px rgba(0,0,0,0.1);} .single-content { background-color: #FFF; box-shadow: 1px 1px 5px 5px rgb(0 0 0 / 10%);} /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /* -- Top Header Menu -- */ .jquerycssmenu ul li span { color: #5a5a5b; } .jquerycssmenu ul li:hover span { color: #999 !important;} .jquerycssmenu ul li.current_page_item > a, .jquerycssmenu ul li.current-menu-ancestor > a, .jquerycssmenu ul li.current-menu-item > a, .jquerycssmenu ul li.current-menu-parent > a { color: #FFF; } /*Top level menu link items style*/ .jquerycssmenu ul li a { color: #FFF; } /* -- Sticky Header -- */ header .stickytop { background-color: #000;} /* -- Sticky Posts style -- */ ul#infinite-articles li.sticky { background-color: #fcf9da !important; } /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ##### Big Search ##### ######################### */ /* -- Sub Header -- */ .front-overlay-wrap { background-color: rgba(000, 0, 0, 0.5); } .front-overlay-wrap h1 { color: #fff;} /* -- Sub Header Search -- */ .front-overlay-content #searchform1 .buttonicon { background-color: #ffc600; color: #FFF; } .front-overlay-content #searchform1 #q { background-color: #FFF; color: #000;} /* -- Sub Header Search ( Popular Words ) -- */ .popular-words-search { color: #FFF; } .popular-words-search a { color: #FFF !important; border-bottom: 1px dotted #666; } .popular-words-search a:hover { border-bottom: 1px solid #FFF;} /* -- Front-end Submission Form -- */ input.ap-form-submit-button{ background-color: #ee9622; color: #FFF; } /* -- Blog Article -- */ .article-category a:hover { color: #FFF !important;} /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list li { background-color: #FFF; -moz-box-shadow: 0 1px 5px rgba(0,0,0,0.1); -webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.1); box-shadow: 1px 1px 10px 5px rgb(0 0 0 / 10%); } ul.masonry_list li:hover { box-shadow: 1px 1px 1px 10px rgb(0 0 0 / 20%)} ul.masonry_list li p { color: #94979c;} ul.masonry_list .an-widget-title i { color: #dd3333; } ul.masonry_list .an-widget-title span { color: #94979c;} /* - Meta - */ ul.masonry_list .an-widget-title span a { border-bottom: 1px solid #dd3333; background-color: #f5f5f5; } /* -- Pagination -- */ .wp-pagenavi a, .wp-pagenavi span { background-color: #000; color: #fff !important;} .wp-pagenavi a:hover { color: #fff !important; background-color: #dd3333;} .wp-pagenavi span.current { background-color: #dd3333; color: #fff !important; } /*----------------------------------------------------------------------------- ----------------------------- 4 - Entry Content ------------------------------- -----------------------------------------------------------------------------*/ /* -- Archive-header -- */ .archive-header h3 { color: #222; } .archive-header h3:after { background: none repeat scroll 0% 0% #dd3333; } /* -- Bottom banner 728x90 -- */ .single-728 { background-color: #f9f9f9;} /* -- Related articles -- */ .arrow-down-related { border-top: 10px solid #000; } /* - Top entry banner / meta date - */ .single-box { background-color: #f1f1f1; } .meta-wrap { background-color: #f5f5f5; } .single-content .single-meta { border-top: 1px solid #f1f1f1; } .single-content .an-display-time { color: #686e76;} .single-content .an-display-time i { color: #686e76; } .single-content .an-display-view { color: #686e76;} .single-content .an-display-view i { color: #686e76; } /* -- Entry Top / Featured Image / Videos -- */ .entry-top span { color: #94979c;} .entry-top span a { border-bottom: 1px solid #dd3333; } /* - title - */ h1.article-title { color: #000; } h1.page-title { color: #000; border-bottom: 5px solid #f2f2f2; } /* -- Entry excerpt -- */ div.entry-excerpt:after { background: none repeat scroll 0% 0% #dd3333; } /* -- Entry bottom -- */ .single-content h3.title { color: #FFF !important; background-color: #000; } .single-content h3.title i { border-color: #000 transparent #000 #000; } /*-- Entry button -- */ .entry-btn { background-color: #dd3333; color: #FFF !important; } /* -- Entry content style -- */ .entry p a { color: #FFF; background-color: #dd3333;} .entry p a:hover { color: #000 !important; background-color: #eee !important;} /* -- blockquote -- */ blockquote p { color: #222; } /* -- Responsive Images -- */ .wp-caption-text { color: #888;} .entry .wp-caption-text a { color: #000 !important; } .wp-caption-text a:hover { color: #000 !important; } /* -- Pagination entry articles -- */ .my-paginated-posts span { background-color: #dd3333; color: #FFF;} .my-paginated-posts p a { background-color: #000; color:#fff;} /*----------------------------------------------------------------------------- ----------------------------- 5 - Sidebar & Widgets --------------------------- -----------------------------------------------------------------------------*/ /* -- Sidebar -- */ .sidebar, .sidebar-left { background-color: #FFF; } .sidebar-left, .sidebar { box-shadow: 1px 1px 5px 5px rgb(0 0 0 / 10%); } .widget h3.title:after, h3.top-title:after { background: none repeat scroll 0% 0% #dd3333; } /* -- Categories in two columns -- */ .widget_anthemes_categories li { color: #dd3333; } /* -- Default Tags -- */ div.tagcloud a:hover { } div.tagcloud a { background: #f5f5f5 !important; } div.tagcloud span { color: #dd3333; } div.widget_archive select, div.widget_categories select { border-radius: 3px; border:1px solid #d5d6d8; color:#999; } /* -- Archives in two columns -- */ .widget_archive li { color: #dd3333; } /* -- Meta in two columns -- */ .widget_meta li { color: #dd3333;} /*----------------------------------------------------------------------------- ----------------------------- 8 - Custom Pages -------------------------------- -----------------------------------------------------------------------------*/ /* -- Tag & Category Index -- */ #mcTagMap .tagindex h4, #sc_mcTagMap .tagindex h4 { color: #dd3333; } #mcTagMap .tagindex ul li, #sc_mcTagMap .tagindex ul li { border-bottom: 1px solid #f0eee9; } /*----------------------------------------------------------------------------- ------------------------------ 9 - Footer ------------------------------------- -----------------------------------------------------------------------------*/ footer { background-color: #000;} .social-section { background-color: #000;} .wrap-footer { background-color: #000;} /* -- Copyright -- */ .copyright { color: #999; } .copyright a { color: #FFF; border-bottom: 1px solid #dd3333; margin-right: 10px;} /* -- Footer Social Icons -- */ ul.footer-social li a { color: #FFF; } ul.footer-social li a:hover { opacity: 0.7; color: #FFF !important;} /* -- Back to Top -- */ #back-top span { background-color: #dd3333;} #back-top a:hover { opacity: 0.7; } /* 1350px (devices and browsers) */ @media only screen and (min-width: 1260px) and (max-width: 1300px) { /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ /* - Layout content - */ .wrap-fullwidth { width: 1230px; } .wrap-fullwidth-bg { width: 1230px; } /* .page-content */ .single-content { width: 900px;} /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /*Top level menu link items style*/ .jquerycssmenu ul li a { margin-right: 3px; } /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list li { width: 290px; } /* - Home ADS -*/ ul.masonry_list li.homeimg, ul.masonry_list li.homeimg iframe, ul.masonry_list li.homeimg embed, ul.masonry_list li.homeimg object, ul.masonry_list li.homeimg img { width: 290px; } /*----------------------------------------------------------------------------- ----------------------------- 4 - Entry Content ------------------------------- -----------------------------------------------------------------------------*/ /* - Top entry - */ .single-box { width: 900px; } /* -- Entry Banner -- */ .entry-img-300 { margin: 20px -40px 20px 20px; } /* -- Responsive Images -- */ .alignleft { margin: 20px 20px 10px -40px; } .alignright { margin: 20px -40px 10px 20px; } } /* ----------- Custom Setting ----------- */ @media only screen and (min-width: 1231px) and (max-width: 1260px) { /* - Layout content - */ .wrap-fullwidth { width: 1220px; } .wrap-fullwidth-bg { width: 1220px; } /* .page-content */ .single-content { width: 890px;} } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 1004px) and (max-width: 1230px) { /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ /* - Header - */ .wrap-center { width: 980px; } /* - Layout content - */ .wrap-fullwidth { width: 980px; } .wrap-fullwidth-bg { width: 980px; } /* .page-content */ .single-content { width: 950px; float: none; margin-left: auto; margin-right: auto;} /* - sidebar - */ .sidebar { width: 950px; float: left; margin-left: 16px; margin-top: 30px;} .sidebar .widget { width: 240px; display: block; float: left; margin-right: 20px;} /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /* -- Top Header Menu -- */ .jquerycssmenu ul li span { display: none;} .jquerycssmenu ul li ul { margin-top: 0px;} .jquerycssmenu ul li ul li ul { margin:-14px 0 0 -1px; } .downarrowclass { top: 32px;} .jquerycssmenu ul li a:hover { opacity: 0.6;} /* -- Sticky Header -- */ header .stickytop .jquerycssmenu { margin-top: 8px; padding-top: 0;} header .stickytop .jquerycssmenu ul li ul { margin-top: -4px;} /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list li { width: 290px; } /* - Home ADS -*/ ul.masonry_list li.homeimg, ul.masonry_list li.homeimg script, ul.masonry_list li.homeimg iframe, ul.masonry_list li.homeimg embed, ul.masonry_list li.homeimg object, ul.masonry_list li.homeimg img { width: 290px; } #img_div_size { height: 450px; min-height: 450px; max-height: 450px; } } /* ----------- Custom Setting ----------- */ @media only screen and (min-width: 1001px) and (max-width: 1004px) { /* - Header - */ .wrap-center { width: 980px; } /* - Layout content - */ .wrap-fullwidth { width: 980px; } .wrap-fullwidth-bg { width: 980px; } /* .page-content */ .single-content { width: 950px; float: none; margin-left: auto; margin-right: auto;} /* - sidebar - */ .sidebar { width: 950px; float: left; margin-left: 16px; margin-top: 30px;} .sidebar .widget { width: 240px; display: block; float: left; margin-right: 20px;} #img_div_size { height: 450px; min-height: 450px; max-height: 450px; } } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 760px) and (max-width: 1000px) { /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ /* - Header - */ .wrap-center { width: 750px; } .bar-header { display: none;} /* - Layout content - */ .wrap-fullwidth { width: 750px; } .wrap-fullwidth-bg { width: 750px; } .wrap-fullwidth-bg .entry { width: auto; padding-left: 15px; padding-right: 15px;} /* .page-content */ .wrap-content { width: 710px; margin: 25px auto 40px auto !important;} .single-content { width: 750px; float: none; margin-left: auto; margin-right: auto;} /* - sidebar - */ .sidebar { width: 750px; float: left; margin-top: 30px; margin-left: 0px;} .sidebar .widget { width: 700px; display: block; float: left; margin-right: 25px;} /* - sidebar left - */ .sidebar-left { display: none;} /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /* -- Top Header Menu -- ##################### */ /* -- Sticky Header -- */ header .stickytop { display: none;} /* -- Responsive menu -- */ #click-menu { top: 28px !important;} /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ######Big Search - Custom ###### */ .front-overlay-content #searchform1 #q {width: 414px; } .front-overlay-content #searchform1 {width: 690px;} select option {font-weight: 500; font-size: 14px;} .popular-words-search {width: 690px !important;} /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list { margin-left: -25px;} ul.masonry_list li { width: 290px; } ul.masonry_list .small-content { padding: 0 10px 0 10px;} /* - Home ADS -*/ ul.masonry_list li.homeimg, ul.masonry_list li.homeimg script, ul.masonry_list li.homeimg iframe, ul.masonry_list li.homeimg embed, ul.masonry_list li.homeimg object, ul.masonry_list li.homeimg img { width: 290px; height: auto; } ul.masonry_list .an-widget-title h2{margin-bottom:10px;} /*---------------------------------------------------------------------------- ----------------------------- 4 - Entry Content ------------------------------- -----------------------------------------------------------------------------*/ /* -- Entry Banner -- */ .entry-img-300 { margin: 20px 0 20px 20px; } /* -- Responsive Images -- */ .alignleft { margin-left: 0px;} .alignright { margin-right: 0px;} /* - Top entry - */ .single-box { width: 750px; } .ct-size, #entry_right_side { padding: 0 80px; } #img_div_size { height: 450px; min-height: 450px; max-height: 450px; } /* -- Single Share -- */ #single-share a.whatsappbutton { display: inline-block !important; } /*----------------------------------------------------------------------------- ----------------------------- 9 - Footer ------------------------------------- -----------------------------------------------------------------------------*/ /* -- Copyright -- */ .copyright { width: 750px; } } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 580px) and (max-width: 760px) { /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ /* - Header - */ .wrap-center { width: 570px; } .bar-header { display: none;} /* - Layout content - */ .wrap-fullwidth { width: 570px; } .wrap-fullwidth-bg { width: 570px; } .wrap-fullwidth-bg .entry { width: auto; padding-left: 15px; padding-right: 15px;} /* .page-content */ .wrap-content { width: 540px; margin: 25px auto 40px auto !important; } .single-content { width: 570px; float: none; margin-left: auto; margin-right: auto;} /* - sidebar - */ .sidebar { width: 570px; float: left; margin-top: 30px; margin-left: 0px;} .sidebar .widget { width: 520px; padding: 0 15px 20px 15px; display: block; float: left; margin-right: 10px;} /* - sidebar left - */ .sidebar-left { display: none;} /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /* -- Top Header Menu -- ##################### */ /* -- Sticky Header -- */ header .stickytop { display: none;} /* -- Responsive menu -- */ #click-menu { top: 28px !important;} /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ##### Big Search ##### */ .front-overlay-content { width: 100%; height: 400px; } .front-overlay-wrap { width: 100%; height: 400px; } .front-overlay-wrap h1 { width: 470px; margin: 0 auto; padding-top: 100px; font-weight: 700; font-size: 20px; line-height: 36px; word-spacing:2px; } /* -- Sub Header Search -- */ .front-overlay-content #searchform1 { width: 470px; height: auto; margin: 0px auto 5px auto; padding-top:20px;} .front-overlay-content #searchform1 #q { width: 234px; font-weight: bold; height: 50px; font-family: 'Ruda', sans-serif; border: none; padding: 0 20px; font-size: 13px; } .front-overlay-content #searchform1 .buttonicon { width: 100px; height: 50px; float: right; border: none; text-align: center; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-size: 14px;} /* -- Sub Header Search ( Popular Words ) -- */ .popular-words-search { width: 470px; height: 30px; } /* ##### Select Option -- Custom ##### */ select#posType {width: 100px ; font-size: 12px ; padding: 0 0 0 6px;} /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list { margin-left: -25px;} ul.masonry_list li { width: 255px; } ul.masonry_list .small-content { padding: 0 10px 0 10px;} /* - Home ADS -*/ ul.masonry_list li.homeimg, ul.masonry_list li.homeimg iframe, ul.masonry_list li.homeimg embed, ul.masonry_list li.homeimg object, ul.masonry_list li img { height: 255px; } ul.masonry_list li.homeimg img { width: 255px; height: auto;} ul.masonry_list .an-widget-title h2{margin-bottom:10px;} /*---------------------------------------------------------------------------- ----------------------------- 4 - Entry Content ------------------------------- -----------------------------------------------------------------------------*/ /* -- Entry Banner -- */ .entry-img-300 { margin: 20px 0 20px 20px; } /* -- Bottom banner 728x90 -- */ .img728, .img728 img, .img728 iframe, .img728 script { max-width: 98%; height: auto; margin: 10px 0 5px 5px;} /* -- Responsive Images -- */ .alignleft { margin-left: 0px;} .alignright { margin-right: 0px;} /* - Top entry - */ .single-box { width: 570px; height: auto; } .single-box .single-money { width: 100%; height: auto; margin: 15px auto 10px auto;} .single-box .single-money img, .single-box .single-money iframe, .single-box .single-money script { width: 98%; height: auto; margin: 10px 0 5px 5px;} .single-content .single-meta { width: 550px; } .entry-top { width: 550px;} .single-gallery { width: 550px;} iframe.single_iframe { width: 100%; height: 350px;} /* -- Related articles -- */ .related-box { width: 540px; height: auto; margin: -5px auto 50px auto;} /* -- Entry content style -- */ .ct-size, #entry_right_side { padding: 0 60px; } #img_div_size { height: 340px; min-height: 340px; max-height: 340px; } /* -- Single Share -- */ #single-share a.emailbutton { display: none !important;} #single-share a.whatsappbutton { display: inline-block !important; } /*----------------------------------------------------------------------------- ----------------------------- 5 - Sidebar & Widgets --------------------------- -----------------------------------------------------------------------------*/ /* -- Banner widget 300px -- */ .widget .img-300 { width: 250px; height: auto; margin:0; } .widget .img-300 img, .widget .img-300 iframe, .widget .img-300 script { width: 250px; } .widget .img-300 img { height: auto; } /*----------------------------------------------------------------------------- ----------------------------- 8 - Custom Pages -------------------------------- -----------------------------------------------------------------------------*/ /* -- Tag & Category Index -- */ #mcTagMap .holdleft, #sc_mcTagMap .holdleft { width: 160px !important; } /*----------------------------------------------------------------------------- ----------------------------- 9 - Footer ------------------------------------- -----------------------------------------------------------------------------*/ /* -- Copyright -- */ .copyright { width: 570px; } /* -- Footer Social Icons -- */ ul.footer-social li { margin: 27px 5px 0 5px; } ul.footer-social li a { text-align: center; padding: 5px 5px; } } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 580px) { /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ /* - Header - */ .main-header { width: 460px; } .wrap-center { width: 460px; } .bar-header { display: none;} /* - Layout content - */ .wrap-fullwidth { width: 460px; } .wrap-fullwidth-bg { width: 460px; } .wrap-fullwidth-bg .entry { width: auto; padding-left: 15px; padding-right: 15px;} /* .page-content */ .wrap-content { width: 415px; margin: 25px auto 40px auto !important; } .single-content { width: 460px; float: none; margin-left: auto; margin-right: auto;} /* - sidebar - */ .sidebar { width: 460px; float: left; margin-top: 30px; margin-left: 0px;} .sidebar .widget { width: 420px; display: block; float: left; margin-right: 0px;} /* - sidebar left - */ .sidebar-left { display: none; } /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /* -- Top Header Menu -- ##################### */ /* -- Sticky Header -- */ header .stickytop { display: none;} /* -- Responsive menu -- */ #click-menu { top: 28px !important;} /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ##### Big Search ##### */ .front-overlay-content { width: 100%; height: 400px; } .front-overlay-wrap { width: 100%; height: 400px; } .front-overlay-wrap h1 { width: 450px; margin: 0 auto; padding-top: 100px; font-weight: 700; font-size: 19px; line-height: 30px; word-spacing:2px; } /* -- Sub Header Search -- */ .front-overlay-content #searchform1 { width: 450px; height: auto; margin: 0px auto 5px auto; padding-top:20px;} .front-overlay-content #searchform1 #q { width: 214px; font-weight: bold; height: 50px; font-family: 'Ruda', sans-serif; border: none; padding: 0 20px; font-size: 13px;} .front-overlay-content #searchform1 .buttonicon { width: 100px; height: 50px; float: right; border: none; text-align: center; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-size: 13px; } /* -- Sub Header Search ( Popular Words ) -- */ .popular-words-search { width: 450px; height: 30px; } .popular-words-search a { font-weight: bold; margin-left: 5px; font-size: 14px !important;} /* ##### Select Option - Custom ##### */ select#posType {width: 100px !important; font-size: 12px !important; padding: 0 0 0 6px; } /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list { margin-left: -25px;} ul.masonry_list li { width: 195px; } ul.masonry_list .small-content { padding: 0 10px 0 10px;} /* - Home ADS -*/ ul.masonry_list li.homeimg, ul.masonry_list li.homeimg script, ul.masonry_list li.homeimg iframe, ul.masonry_list li.homeimg embed, ul.masonry_list li.homeimg object, ul.masonry_list li img { height: 195px; } ul.masonry_list li.homeimg img { width: 195px; height: auto; } ul.masonry_list .an-widget-title h2{margin-bottom:10px;} /* -- Single Share -- */ #single-share a { font-size: 11px !important; padding:4px 10px 2px 10px !important; margin-right: 3px !important;} #single-share a.emailbutton i { font-size: 11px; margin-right: 2px;} #single-share .googlebutton i, #single-share .pinbutton i, #single-share .fbbutton i, #single-share .twbutton i, #single-share a.whatsappbutton i { font-size: 12px; margin-right: 2px; } /* -- Single Share -- */ #single-share a.emailbutton { display: none !important;} #single-share a.whatsappbutton { display: inline-block !important; } /*---------------------------------------------------------------------------- ----------------------------- 4 - Entry Content ------------------------------- -----------------------------------------------------------------------------*/ /* -- Entry Banner -- */ .entry-img-300 { margin: 20px 0 20px 20px; } .entry-img-300, .entry-img-300 img, .entry-img-300 iframe, .entry-img-300 script { width: 200px; } .entry-img-300 img { height: auto;} /* -- Bottom banner 728x90 -- */ .img728, .img728 img, .img728 iframe, .img728 script { max-width: 98%; height: auto; margin: 10px 0 5px 5px;} /* -- Responsive Images -- */ .alignleft { margin-left: 0px;} .alignright { margin-right: 0px;} /* - Top entry - */ .single-box { width: 460px; height: auto; } .single-box .single-money { width: 100%; height: auto; margin: 15px auto 10px auto;} .single-box .single-money img, .single-box .single-money iframe, .single-box .single-money script { max-width: 98%; height: auto; margin: 10px 0 5px 5px;} .single-content .single-meta { width: 430px; } .entry-top { width: 430px;} .single-gallery { width: 430px;} iframe.single_iframe { width: 100%; height: 280px;} .single-gallery img { width: 143px; height: 143px;} /* -- Related articles -- */ .related-box { width: 430px; height: auto; margin: -5px auto 50px auto;} /* -- Entry content style -- */ .ct-size, #entry_right_side { padding: 0 60px; } #img_div_size { height: 340px; min-height: 340px; max-height: 340px; } /*----------------------------------------------------------------------------- ----------------------------- 5 - Sidebar & Widgets --------------------------- -----------------------------------------------------------------------------*/ /* -- Banner widget 300px -- */ .widget .img-300 { width: 200px; height: auto; margin:0; } .widget .img-300 img, .widget .img-300 iframe, .widget .img-300 script { width: 200px; } .widget .img-300 img { height: auto; } /*----------------------------------------------------------------------------- ----------------------------- 8 - Custom Pages -------------------------------- -----------------------------------------------------------------------------*/ /* -- Tag & Category Index -- */ #mcTagMap .holdleft, #sc_mcTagMap .holdleft { width: 195px !important; } /*----------------------------------------------------------------------------- ----------------------------- 9 - Footer ------------------------------------- -----------------------------------------------------------------------------*/ /* -- Copyright -- */ .copyright { width: 460px; } /* -- Footer Social Icons -- */ ul.footer-social li { margin: 27px 5px 0 5px; } ul.footer-social li a { text-align: center; padding: 5px 4px; } } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 410px) and (max-width: 479px) { /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ /* - Header - */ .main-header { width: 390px; } .wrap-center { width: 390px; } .bar-header { display: none;} /* - Layout content - */ .wrap-fullwidth { width: 390px; } .wrap-fullwidth-bg { width: 390px; } .wrap-fullwidth-bg .entry { width: auto; padding-left: 15px; padding-right: 15px;} /* .page-content */ .wrap-content { width: 415px; margin: 25px auto 40px auto !important; } .single-content { width: 390px; float: none; margin-left: auto; margin-right: auto;} /* - sidebar - */ .sidebar { width: 100%; height: auto; display: block; float: none; padding: 45px 0 20px; margin-top: 0; margin-left: auto; margin-right: auto;} .sidebar .widget { width: 350px; display: block; float: none; margin-top: 0; margin-left: auto; margin-right: auto;} /* - sidebar left - */ .sidebar-left { display: none; } /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /* -- Top Header Menu -- ##################### */ /* -- Sticky Header -- */ header .stickytop { display: none;} /* -- Responsive menu -- */ #click-menu { top: 28px !important;} /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ##### Big Search ##### */ .front-overlay-content { width: 100%; height: 400px; } .front-overlay-wrap { width: 100%; height: 400px; } .front-overlay-wrap h1 { width: 380px; margin: 0 auto; padding-top: 100px; font-weight: 700; font-size: 19px; line-height: 30px; word-spacing:2px; } /* -- Sub Header Search -- */ .front-overlay-content #searchform1 { width: 390px; height: auto; margin: 0px auto 5px auto; padding-top:20px;} .front-overlay-content #searchform1 #q { width: 184px; font-weight: bold; height: 50px; font-family: 'Ruda', sans-serif; border: none; padding: 0 20px; font-size: 13px; } .front-overlay-content #searchform1 .buttonicon { width: 80px; height: 50px; float: right; border: none; text-align: center; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-size: 12px;} /* -- Sub Header Search ( Popular Words ) -- */ .popular-words-search { width: 380px} /* ##### Select Option ##### */ select#posType {width: 90px !important; font-weight: 700; font-size: 11px !important; padding: 0 0 0 3px;} /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list { margin-left: -7.5px;} ul.masonry_list li { width: 190px; margin: 0 0 15px 15px; } ul.masonry_list .small-content { padding: 0 10px 0 10px;} /* - Home ADS -*/ ul.masonry_list li.homeimg, ul.masonry_list li.homeimg script, ul.masonry_list li.homeimg iframe, ul.masonry_list li.homeimg embed, ul.masonry_list li.homeimg object, ul.masonry_list li img { height: 190px; } ul.masonry_list li.homeimg img { width: 190px; height: auto; } ul.masonry_list .an-widget-title h2{margin-bottom:10px;} /* -- Single Share -- */ #single-share a { font-size: 11px !important; padding:4px 10px 2px 10px !important; margin-right: 3px !important;} #single-share a.emailbutton i { font-size: 11px; margin-right: 2px;} #single-share .googlebutton i, #single-share .pinbutton i, #single-share .fbbutton i, #single-share .twbutton i, #single-share a.whatsappbutton i { font-size: 12px; margin-right: 2px; } /* -- Single Share -- */ #single-share a.emailbutton { display: none !important;} #single-share a.whatsappbutton { display: inline-block !important; } /*---------------------------------------------------------------------------- ----------------------------- 4 - Entry Content ------------------------------- -----------------------------------------------------------------------------*/ /* -- Entry Banner -- */ .entry-img-300 { margin: 20px 0 20px 20px; } .entry-img-300, .entry-img-300 img, .entry-img-300 iframe, .entry-img-300 script { width: 200px; } .entry-img-300 img { height: auto;} /* -- Bottom banner 728x90 -- */ .img728, .img728 img, .img728 iframe, .img728 script { max-width: 98%; height: auto; margin: 10px 0 5px 5px;} /* -- Responsive Images -- */ .alignleft { margin-left: 0px;} .alignright { margin-right: 0px;} /* - Top entry - */ .single-box { width: 390px; height: auto; } .single-box .single-money { width: 100%; height: auto; margin: 15px auto 10px auto;} .single-box .single-money img, .single-box .single-money iframe, .single-box .single-money script { max-width: 98%; height: auto; margin: 10px 0 5px 5px;} .single-content .single-meta { width: 360px; } .entry-top { width: 360px;} .single-gallery { width: 360px;} iframe.single_iframe { width: 100%; height: 280px;} .single-gallery img { width: 143px; height: 143px;} /* -- Related articles -- */ .related-box { width: 360px; height: auto; margin: -5px auto 50px auto;} /* -- Entry content style -- */ .ct-size, #entry_right_side { padding: 0 50px; } #img_div_size { height: 340px; min-height: 340px; max-height: 340px; } /*----------------------------------------------------------------------------- ----------------------------- 5 - Sidebar & Widgets --------------------------- -----------------------------------------------------------------------------*/ /* -- Banner widget 300px -- */ .widget .img-300 { width: 300px; height: auto; margin:0; margin-left: -25px; } .widget .img-300 img, .widget .img-300 iframe, .widget .img-300 script { width: 300px; } .widget .img-300 img { height: auto; } /*----------------------------------------------------------------------------- ----------------------------- 8 - Custom Pages -------------------------------- -----------------------------------------------------------------------------*/ /* -- Tag & Category Index -- */ #mcTagMap .holdleft, #sc_mcTagMap .holdleft { width: 195px !important; } /*----------------------------------------------------------------------------- ----------------------------- 9 - Footer ------------------------------------- -----------------------------------------------------------------------------*/ /* -- Copyright -- */ .copyright { width: 390px; } /* -- Footer Social Icons -- */ ul.footer-social li { margin: 27px 5px 0 5px; } ul.footer-social li a { text-align: center; padding: 5px 4px; } } /* All Mobile Size (devices) */ @media only screen and (max-width: 409px) { /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ /* - Header - */ .wrap-center { width: 320px; } .bar-header { display: none;} /* - Layout content - */ .wrap-fullwidth { width: 100%; } .wrap-fullwidth-bg { width: 320px; } .wrap-fullwidth-bg .entry { width: auto; padding-left: 15px; padding-right: 15px;} /* .page-content */ .wrap-content { width: 320px; margin: 25px auto 40px auto !important; } .single-content { width: 100%; float: none; margin-left: auto; margin-right: auto;} /* - sidebar - */ .sidebar { width: 100%; height: auto; display: block; float: none; padding: 45px 0 20px; margin-top: 0; margin-left: auto; margin-right: auto;} .sidebar .widget { width: 280px; display: block; float: none; margin-top: 0; margin-left: auto; margin-right: auto;} /* - sidebar left - */ .sidebar-left { display: none;} /*----------------------------------------------------------------------------- ----------------------------- 2 - Header -------------------------------------- -----------------------------------------------------------------------------*/ /* -- Top Header Menu -- ##################### */ /* -- Sticky Header -- */ header .stickytop { display: none;} /* -- Responsive menu -- */ #click-menu { top: 28px !important;} /*----------------------------------------------------------------------------- ----------------------------- 3 - Home Content -------------------------------- -----------------------------------------------------------------------------*/ /* ##### Big Search ##### */ .front-overlay-content { width: 100%; height: 240px; } .front-overlay-wrap { width: 100%; height: 240px; } .front-overlay-wrap h1 { width: 305px; margin: 0 auto; padding-top: 50px; font-weight: 500; font-size: 15px; line-height: 28px; word-spacing:0px; } /* -- Sub Header Search -- */ .front-overlay-content #searchform1 { width: 305px; height: auto; margin: 0px auto 5px auto; padding-top:20px;} .front-overlay-content #searchform1 #q { width: 165px; font-weight: bold; height: 50px; font-family: 'Ruda', sans-serif; border: none; padding: 0 20px; font-size: 13px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .front-overlay-content #searchform1 .buttonicon { width: 100px; height: 50px; float: right; border: none; text-align: center; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-weight: 500; font-size: 15px; } /* -- Sub Header Search ( Popular Words ) -- */ .popular-words-search { display: none; } /* ##### Select Option ##### */ select#posType {display: none;} /* ###### Blog Masonry style ###### #################################### */ ul.masonry_list li { width: 320px; margin: 0 0 25px 0;} ul.masonry_list .small-content { padding: 0 10px 0 10px;} /* - Home ADS -*/ ul.masonry_list li.homeimg, ul.masonry_list li.homeimg script, ul.masonry_list li.homeimg iframe, ul.masonry_list li.homeimg embed, ul.masonry_list li.homeimg object, ul.masonry_list li.homeimg img { width: 300px; } ul.masonry_list li.homeimg img { width: 300px; height: 250px; } /* -- Single Share -- */ #single-share a span { display: none;} #single-share a { font-size: 11px !important; padding:4px 10px 2px 10px !important; margin-right: 3px !important;} #single-share a.emailbutton i { font-size: 14px; margin-right: 2px;} #single-share .googlebutton i, #single-share .pinbutton i, #single-share .fbbutton i, #single-share .twbutton i { font-size: 14px; margin-right: 2px; } /*---------------------------------------------------------------------------- ----------------------------- 4 - Entry Content ------------------------------- -----------------------------------------------------------------------------*/ /* -- Entry Banner -- */ .entry-img-300 { margin: 20px auto 20px auto; float: none; display: block; } .entry-img-300, .entry-img-300 img, .entry-img-300 iframe, .entry-img-300 script { width: 300px; min-height: 250px !important; } .entry-img-300 img { min-height: 250px !important;} /* -- Bottom banner 728x90 -- */ .img728, .img728 img, .img728 iframe, .img728 script { max-width: 97%; min-height: 37px !important; margin: 10px 0 5px 5px;} /* -- Bottom banner 728x90 -- */ .single-728 { width: 100%; height: auto; margin: 45px auto 45px auto; } .img728 { width: 100%; height: auto; margin: 0 auto;} /* -- Responsive Images -- */ .alignleft { margin-left: 0px;} .alignright { margin-right: 0px;} h1.article-title { font-size: 26px; font-weight: 600; line-height: 34px; } .entry h1.page-title { font-size: 26px; } /* - Top entry - */ .single-box { width: 100%; height: auto; } .single-box .single-money { width: 100%; height: auto; margin: 15px auto 10px auto;} .single-box .single-money img, .single-box .single-money iframe, .single-box .single-money script { max-width: 97%; height: auto; margin: 10px 0 5px 5px;} .single-content .single-meta { width: 290px; } .single-content .single-meta .single-data { float: left; margin: 20px 0 -20px 100px; } .entry-top { width: 320px;} .single-gallery { width: 320px;} iframe.single_iframe { width: 100%; height: 180px;} .entry p iframe { width: 100%; height: 180px;} .single-gallery img { width: 160px; height: 160px;} /* -- Related articles -- */ .related-box { width: 290px; height: auto; margin: -5px auto 50px auto;} .related-box .one_half, .related-box .one_half_last { float:left; width:100%; margin-right:0%; } .related-box .one_half_last{ margin-right:0;} /* -- Entry content style -- */ /* -- Single Share -- */ #single-share a.emailbutton { display: none !important; } #single-share a.whatsappbutton { display: inline-block !important; margin-right: 0px; padding-right: 5px !important;} /*single post image size -- Custom*/ .ct-size, #entry_right_side { padding: 0 40px; } #img_div_size { height: 340px; min-height: 340px; max-height: 340px; } /*----------------------------------------------------------------------------- ----------------------------- 8 - Custom Pages -------------------------------- -----------------------------------------------------------------------------*/ /* -- Tag & Category Index -- */ #mcTagMap .holdleft, #sc_mcTagMap .holdleft { width: 280px !important; } /*----------------------------------------------------------------------------- ----------------------------- 10 - Footer ------------------------------------- -----------------------------------------------------------------------------*/ .social-section { height: auto;} /* -- Copyright -- */ .copyright { width: 320px;} /* -- Footer Social Icons -- */ ul.footer-social li { margin: 15px 5px 0 5px; } ul.footer-social li a { text-align: center; padding: 5px 4px; } /* -- Columns -- */ .one_half, .one_half_last { float:left;width:100%; margin-bottom:10px; margin-right:0; } .one_half_last { margin-right:0;} .one_third, .one_third_last { float:left; width:100%; margin-bottom:10px; margin-right:0; } .one_third_last { margin-right:0;} .one_fourth, .one_fourth_last { float:left; width:100%; margin-bottom:10px; margin-right:0; } .one_fourth_last { margin-right:0;} } /* ---- Custom Setting ---- */ @media only screen and (max-width: 320px) { .front-overlay-content #searchform1 {width: 223px;} .front-overlay-content #searchform1 #q {width: 107px;} .front-overlay-content #searchform1 .buttonicon {width: 80px;} .entry-top {width: 80%;} .ct-size {width: 70%;} .sidebar .widget {width: 200px;} #myImg{max-width: 80%; max-height:80%;} } /**/ #myImg { cursor: zoom-in; } .thumbs img:hover { cursor: pointer; } .fs-modal { display: none; position: fixed; z-index: 999999; inset: 0; background: rgba(0,0,0,0.9); text-align: center; } .fs-img { max-width: 90%; max-height: 90vh; margin-top: 5vh; } .fs-close { position: absolute; top: 15px; right: 25px; font-size: 35px; color: white; cursor: pointer; } .fs-nav { position: absolute; top: 50%; font-size: 40px; color: white; padding: 10px; cursor: pointer; user-select: none; } .fs-prev { left: 30px; } .fs-next { right: 30px; } /**/ /**/ /* Thumbnail Grid */ .thumbs { display: grid; grid-template-columns: repeat(auto-fit, minmax(70px, 70px)); /* fixed thumb size */ gap: 6px; justify-content: center; /* align center */ } /* Thumbnails */ .thumbs img { width: 70px; height: 55px; object-fit: cover; border-radius: 4px; cursor: pointer; transition: opacity 0.25s ease, transform 0.25s ease; } /* Hover effect */ .thumbs img:hover { opacity: 0.75; transform: scale(1.03); } /* Selected and unselected */ .thumbs img.selected { opacity: 1; } .thumbs img:not(.selected) { opacity: 0.4; } /* Fade animation */ @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fade-in { opacity: 0; animation: fadeIn 0.5s ease-in forwards; } /* Text style */ p { text-align: justify; padding-right: 10px !important; } /**/ /**/ /* Wrapper around table block */ .download-table-wrapper { padding: 18px; border-radius: 10px; background: #fff; box-shadow: rgba(0, 0, 0, 0.05) 0px 4px 10px; border: 1px solid #e8e8e8; margin: 35px 30px 0; } /* Download button */ .table-download-btn { display: inline-flex; align-items: center; justify-content: center; width: calc(100% - 20px); /* prevents touching border */ gap: 6px; background: #f7f7f9; color: #222; padding: 9px 14px; border-radius: 50px; font-size: 14px; font-weight: 600; border: 1px solid #dadada; transition: 0.2s ease; text-decoration: none !important; margin: auto; } .table-download-btn:hover { background: #ececef; } .table-download-btn svg { width: 16px; height: 16px; } /* Table base */ .file-table { width: 100%; border-collapse: separate; border-spacing: 0 12px; font-size: 15px; background: transparent !important; } /* No bold header strip — clean look */ .file-table thead { background: transparent; border-bottom: none; font-weight: 600; } .file-table th, .file-table td { text-align: center !important; padding: 14px 14px; } /* Each row looks like a bordered card */ .file-table tbody tr { background: #fff; border: 1px solid #e1e1e1; border-radius: 10px; transition: 0.15s ease; } /* Hover highlight */ .file-table tbody tr:hover { border-color: #cfcfcf; box-shadow: rgba(0,0,0,0.06) 0px 3px 8px; } /* File type icons */ .file-icon { width: 20px; height: 20px; margin-right: 6px; vertical-align: middle; } /* Mobile style */ @media (max-width: 600px) { .file-table thead { display: none; } .file-table { border-spacing: 0 14px; } .file-table tr { display: block; padding: 14px 10px; } .file-table td { display: flex; justify-content: space-between; padding: 9px 4px; font-size: 14px; text-align: right !important; } .file-table td::before { content: attr(data-label); font-weight: 600; color: #000; text-align: left; } .table-download-btn { width: 50%; } } /**/ /**/ .related_title{margin: 30px 0 10px 0;} div.relatedposts { display: flex; justify-content: center; margin-bottom: 20px; } ul.masonry-container { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; list-style: none; padding: 0; margin: 0; } li.masonry-item { background: #fff; box-shadow: 1px 1px 10px 5px rgb(0 0 0 / 10%); border-radius: 4px; overflow: hidden; transition: box-shadow .3s; } li.masonry-item:hover { box-shadow: 1px 1px 5px 8px rgb(0 0 0 / 20%); } .masonry-item img { display:block; width: 100%; height: auto; object-fit: cover; } h4.article-title { background-color: #fff; padding: 15px 25px; font-size: 16px; line-height: 22px; margin: 0; } @media only screen and (min-width: 1001px) and (max-width: 1230px) { ul.masonry-container { grid-template-columns: repeat(3, 1fr); } .related_title, div.relatedposts{ width: 950px; float: none; margin-left: auto; margin-right: auto; } } @media only screen and (min-width: 760px) and (max-width: 1000px){ ul.masonry-container { grid-template-columns: repeat(3, 1fr); } } @media only screen and (min-width: 480px) and (max-width: 760px) { ul.masonry-container { grid-template-columns: repeat(2, 1fr); } } @media only screen and (max-width: 479px) { ul.masonry-container { grid-template-columns: repeat(1, 1fr); } } /**/ /**/ .explore-more-container { text-align: center; background-color: #e9ecef; /* Slightly darker background color */ padding: 10px; /* Adjust padding as needed */ border-radius: 10px; /* Rounded corners */ margin: 32px auto auto auto; /* Center horizontally */ } .explore-more-link { color: #343a40; /* Darker text color */ font-size: 16px; text-decoration: none; font-weight: bold; /* Make text bold */ } /**/ /**/