Make a free wordpress theme with Easy steps.

625

WordPress

It is a free open-source content management system. WordPress written in PHP and paired with a MySQL or MariaDB database.

Theme

Design WordPress website more beautiful and attractive with Custom theme. You will customize custom theme with these files.

so let’s learn how to make website theme

  • first of all go to your cpanel and go to theme folder in public html, then make a new folder for custom theme’s code (example – spltheme).
  • create some important file in created theme folder (example – spltheme) –
    1 – index.php
    2 – header.php
    3 – footer.php
    4 – single.php
    5 – functions.php
    6 – page.php
    7 – search.php
    8 – searchform.php
    9 – style.css
  • then start to pasting given codes in these files.

1 – index.php

<?php

get_header();

?>

<?php
// This is only for desktop
?>
<div class="maincolumnbg">
<div class ="content-container">
<div class="main-column-index"><!-- main-column -->
<?php if ( have_posts() ) :
?>
<?php
while ( have_posts() ) : the_post(); ?>

<article class="indexpost" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<a href="<?php the_permalink() ?>">
<?php if ( has_post_thumbnail() ) { ?>
<div class="index-thumbnail">
<?php the_post_thumbnail( 'small-thumbnail' ); ?>
</div>
<?php } ?>
<header class="entry-header">
<h1 class="entry-title" itemprop="headline">
<a itemprop="url" href="<?php the_permalink() ?>" title="<?php the_title_attribute() ?>"><?php the_title() ?></a> </h1>
</header><!-- .entry-header -->
<div class="indexexcerpt" itemprop="text">
<?php echo get_the_excerpt() ?>
</div>
</a>
</article>

<?php endwhile;

else :
echo '<p>There are no posts!</p>';

endif;

?>
</div><!-- main-column -->

<div class="sidebar-column"><!-- sidebar-column -->
<div style="clear: both;"></div>
<?php dynamic_sidebar( 'rightsidebar' ) ?>
</div><!-- sidebar-column -->

<div style="clear:both;"></div>
<?php pagination_nav(); ?>
</div>

<div style="clear:both;">
</div>
</div>

<?php

get_footer();

?>

2 – header.php

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<link rel="profile" href="https://gmpg.org/xfn/11">
<meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">

<title><?php wp_title('&raquo;','true','right'); ?></title>

<meta name="description" content="<?php if ( is_single() ) {
the_excerpt();
} else {
bloginfo('name'); echo " - "; bloginfo('description');
}
?>" />

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>"
type="text/css" media="screen" />
<link ref="stylesheet" href="style.css"/>

<link rel="shortcut icon" href="<?php echo THEME_DIR; ?>/path/favicon.ico" />
<meta name="google-site-verification" content="mtiuTTv3PWduOtjhWWF7EvYErZ-38uQZcHkVoVjU06Q" />
<link href='https://fonts.googleapis.com/css2?family=Cantarell' rel='stylesheet'/>
<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>
<link href='https://fonts.googleapis.com/css?family=Play' rel='stylesheet'/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

<?php wp_head() ?>
</head>

<body <?php body_class(); ?>>

<header class="site-header">
<div class="after-header">
<div class="desktopheader">
<div class="logoimg">
<a href="<?php echo get_option('home'); ?>" itemprop="url"><img align="left" src="http://thekroyaard.com/wp-content/uploads/2021/03/03-2018.png" alt="TKSPL" class="desktopheaderimg" /> </a>
</div>
<div class="linebrake"></div>
<div class="headerad1">
<!-- paste ad code -->
</div>
<div class="linebrake"></div>
<div class="mobileheadersearch">
<form action="http://thekroyaard.com/search-result" id="tkspl-searchbox" method="get">
<span class="tksplmobile-buttonwrap"><button class="tksplmobile-submit" value="" type="submit"></button></span>
<input type="text" name="q" id="tksplmobile-input" placeholder="Search..." />
</form>
</div>
<div class="linebrake"></div>
<div class="headerad2">
<!-- paste ad code for mobile-->
</div>
</div>
</div>

<div class="menubarbg">
<div class="menubarspl">
<span class="menubarleftspan">

<div id="navigation">
<?php
//if wp_nav_menu() function exists, meaning if you are using WordPress >=3.0
if (function_exists('wp_nav_menu')) //If you are using WP version >= 3.0
{
//Display the navigation menu created in the (Appearance -> Menus) panel.
//If there is NO menu created in the Admin area, use the fallback function bac_wp_page_menu().
//http://codex.wordpress.org/Function_Reference/wp_nav_menu
wp_nav_menu(array('container_class' => 'menu', 'fallback_cb' => 'bac_wp_page_menu'));
}
//Else, if you are using WP version < 3.0, use the fallback function bac_wp_page_menu()
else {
bac_wp_page_menu();
}
//Fallback function:
//1. In case you are using WorPress version >=3.0 AND you did not create a Menu in the Admin area.
//2. OR if you are using WP version < 3.0
function bac_wp_page_menu() {
//http://codex.wordpress.org/Function_Reference/wp_page_menu
wp_page_menu('show_home=1&menu_class=menu&depth=1');
}
?>
</div>

</span>

<span class="menubarrightspan">
<form action="http://thekroyaard.com/search-result" id="tkspl-searchbox" method="get" style="border: 0px solid black; color: white; border-radius: 20px; width: 300px;">
<span class="tkspl-buttonwrap"><button class="tkspl-submit" value="" type="submit"></button></span>
<input type="text" name="q" id="tkspl-input" placeholder=" Enter Text Here . . ." />
</form>
</span>
</div>
</div>

</header>

3 – footer.php

<footer class="site-footer">
<?php if ( is_active_sidebar( 'footer' ) ) { ?>
<div class="footer-widget"><!-- footer-widget -->
<?php dynamic_sidebar( 'footer' ) ?>
</div><!-- footer-widget -->
<?php } ?>

<div id='footerdesign' style='background: black; height: 30px;' class="desktopfooter">
<div style='text-align:center; color:white; font-family: verdana; font-size: 16px; background-image: url(&quot;https://1.bp.blogspot.com/-Od0Av3Fn474/XJsgO8ouSDI/AAAAAAAADSI/sa1oI38u7Qg6xKzk31qRNcoEWxssACNngCLcBGAs/s1600/200.jpg&quot; ) ; padding-bottom: 10px; padding-top: 30px; height: 30px; '>
<span style='float:left; font-weight: bold; padding-left: 20px;'>

<a class='footerpadding' href='http://thekroyaardproductions.business.site/' style='color:white; font-family: verdana; font-size: 16px; background: transparant;'>Headquarters</a> | <a class='footerpadding' href='http://thekroyaard.com/p/dmca-policy.html' style='color:white; font-family: verdana; font-size: 16px; background: transparant;'>DMCA</a> | &#169; 2014-2020</span>

<span style='float:center; background: black; padding-top: 30px; height: 50px; color: black; background-image: url(&quot;https://1.bp.blogspot.com/-Od0Av3Fn474/XJsgO8ouSDI/AAAAAAAADSI/sa1oI38u7Qg6xKzk31qRNcoEWxssACNngCLcBGAs/s1600/200.jpg&quot; ) ;'> .
</span>

<span style='float:right; background: transparant ; color:white; padding-right: 20px; font-weight: bold; '> <a class='footerpadding' href='http://thekroyaard.com/p/disclaimer.html' style=' font-weight: bold; color:white; font-family: verdana; font-size: 16px'>Disclaimer</a> | <a class='footerpadding' href='http://thekroyaard.com/contact-us' style=' font-weight: bold; color:white; font-family: verdana; font-size: 16px'>ContactUS</a> | <a class='footerpadding' href='http://thekroyaard.com/about/' style='color:white;font-family: verdana; font-size: 16px;; font-weight: bold;'>AboutUS</a></span>

</div>
</div>

<div class='footerdesignmobile' style='background: black; '>
<div style='text-align:center; color:white; background-image: url(&quot;https://1.bp.blogspot.com/-Od0Av3Fn474/XJsgO8ouSDI/AAAAAAAADSI/sa1oI38u7Qg6xKzk31qRNcoEWxssACNngCLcBGAs/s1600/200.jpg&quot; ) ; padding-bottom: 10px; font-size: 15px;'>
<a class='footerpadding' href='https://thekroyaardproductions.business.site/' style='font-weight: bold; color:white; background: transparant;'>Headquarters</a> <br/> <a class='footerpadding' href='http://thekroyaard.com/p/dmca-policy.html' style='font-weight: bold; color:white; background: transparant;'>DMCA</a>
<br/>
<a class='footerpadding' href='http://thekroyaard.com/p/disclaimer.html' style=' font-weight: bold; color:white;'>Disclaimer</a> <br/> <a class='footerpadding' href='http://thekroyaard.com/contact-us' style=' font-weight: bold; color:white;'>ContactUS</a> <br/> <a class='footerpadding' href='http://thekroyaard.com/about/' style='color:white; font-weight: bold;'>AboutUS</a>
</div>
</div>
</footer>
</div> <!-- closes <div class=container"> -->

<?php wp_footer() ?>
</body>
</html>

4 – single.php

<?php

get_header();

?>

<div class="maincolumnbg">
<div class ="content-container">
<div class="main-column"><!-- main-column -->
<?php if ( have_posts() ) :
while ( have_posts() ) : the_post(); ?>
<article itemscope itemtype="http://schema.org/BlogPosting" itemprop="blogPost" class="post" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="beforetitle">
<span class="postview"> <?php echo getPostViews(get_the_ID()); ?> </span>
<span class="postdate"><i class="fa fa-clock-o"></i> <?php the_time( 'j F, Y' ); ?> </span>
</div>
<header class="entry-header">
<h3 class="entry-title-post">
<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute() ?>">
<?php the_title() ?>
</a>
</h3>
</header>

<?php setPostViews(get_the_ID()); ?>

<?php the_content(); ?>

<?php endwhile;
else :
echo '<p>There are no posts!</p>';
endif;
?>

<div class="containercustomsharebutton">

<?php include("customsharebutton.php"); ?>

</div>

<div class="relateditemdesktop">
<div class="relatedads">
<!-- paste ad code -->
</div>
</div>

<div class="relateditemmobile">
<div style="margin-top: 20px;">
<!-- paste ad code -->
</div>
</div><!-- main-column -->

</article>
<div class="sidebar-column"><!-- sidebar-column -->
<?php dynamic_sidebar( 'rightsidebar' ) ?>

</div><!-- sidebar-column -->
</div>
</div><!-- main-content -->
</div>

<?php

get_footer();

?>

5 – functions.php

<?php

//Enqueue The css
function thekroyaard_wp_style() {
wp_enqueue_style('TkSPL',get_template_directory_uri().'/style.css',
array(), '1.0.0','all');
}

add_action('wp_enqueue_scripts','thekroyaard_wp_style');


function get_the_top_ancestor_id() {
global $post;
if ( $post->post_parent ) {
$ancestors = array_reverse( get_post_ancestors( $post->ID ) );
return $ancestors[0];
} else {
return $post->ID;
}
}

/* sets the excerpt length */
function customize_the_excerpt_length() {
return 100;
}
add_filter('excerpt_length','customize_the_excerpt_length');


/* Add Featured Image Support To Your WordPress Theme */
function add_featured_image_support_to_your_wordpress_theme() {
add_theme_support( 'post-thumbnails' );
add_image_size( 'small-thumbnail', 230, 129, true );
add_image_size( 'single-post-image', 230, 129, true );
add_theme_support( 'post-formats', [
'aside',
'gallery',
'link',
'image',
'quote',
'status',
'video',
'audio',
'chat',
'standard'
] );
}

add_action( 'after_setup_theme', 'add_featured_image_support_to_your_wordpress_theme' );

function initialize_widgets() {
register_sidebar( [
'name' => 'Right Sidebar',
'id' => 'rightsidebar',
'before_widget' => '<div class="widget-item">',
'after_widget' => '</div>'
] );

register_sidebar( [
'name' => 'Footer',
'id' => 'footer',
'before_widget' => '<div class="widget-item">',
'after_widget' => '</div>'
] );
}

add_action( 'widgets_init', 'initialize_widgets' );

function pagination_nav() {
global $wp_query;

if ( $wp_query->max_num_pages > 1 ) { ?>
<nav class="pagination" role="navigation">
<div class="nav-next" style="float: left; left: 0;"><?php previous_posts_link( '&larr;' ); ?></div>
<div class="nav-previous" style="float:right; right: 0;"><?php next_posts_link( '&rarr;' ); ?></div>
</nav>
<?php }
}

function collectiveray_load_js_script() {
if( is_page(ID) ) {
wp_enqueue_script('js-file', 'PATH_TO_JS_FILE', array('jquery'), '', false);
//or use the version below if you know exactly where the file is
//wp_enqueue_script( 'js-file', get_template_directory_uri() . '/js/myscript.js');
}
}

function myprefix_enqueue_scripts() {
wp_enqueue_script(
'my-script',
get_stylesheet_directory_uri() . '/jquery/script.js',
array('jquery'),
'1.0.0',
true );
}

add_action( 'wp_enqueue_scripts', 'myprefix_enqueue_scripts' );

// Add to a column in WP-Admin
add_filter('manage_posts_columns', 'posts_column_views');
add_action('manage_posts_custom_column', 'posts_custom_column_views',5,2);
function posts_column_views($defaults){
$defaults['post_views'] = __('Views');
return $defaults;
}

function posts_custom_column_views($column_name, $id){
if($column_name === 'post_views'){
echo getPostViews(get_the_ID());
}
}

function getPostViews($postID){
$count_key = 'post_views_count';
$count = get_post_meta($postID, $count_key, true);
if($count==''){
delete_post_meta($postID, $count_key);
add_post_meta($postID, $count_key, '0');
return "0 View";
}
return '<i class="fa fa-eye"></i> '.$count;
}
function setPostViews($postID) {
$count_key = 'post_views_count';
$count = get_post_meta($postID, $count_key, true);
if($count==''){
$count = 0;
delete_post_meta($postID, $count_key);
add_post_meta($postID, $count_key, '0');
}else{
$count++;
update_post_meta($postID, $count_key, $count);
}
}

// Remove issues with prefetching adding extra views
remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);

function html_schema()
{
$schema = 'http://schema.org/';

// Is single post
if(is_single())
{
$type = "Article";
}
// Is blog home, archive or category
else if(is_home()||is_archive()||is_category())
{
$type = "Blog";
}
// Is static front page
else if(is_front_page())
{
$type = "Website";
}
// Is a general page
else
{
$type = 'WebPage';
}

echo 'itemscope="itemscope" itemtype="' . $schema . $type . '"';
}

6 – page.php

<?php

get_header();

?>

<div class="maincolumnbg">
<div class ="content-container">
<div class="main-column"><!-- main-column -->
<?php if ( have_posts() ) :
while ( have_posts() ) : the_post(); ?>

<article class="page-layout">
<?php $args = [
'child_of' => get_the_top_ancestor_id(),
'title_li' => '',
];
wp_list_pages( $args ); ?>
<h2><?php the_title() ?></h2>
<?php the_content() ?>
</article>

<?php endwhile;

else :
echo '<p>There are no pages!</p>';
endif;

?>

</div><!-- main-column -->

<div class="sidebar-column"><!-- sidebar-column -->
<?php dynamic_sidebar( 'rightsidebar' ) ?>

</div><!-- sidebar-column -->
</div>

<?php

get_footer();

?>

7 – search.php

<?php

get_header();

?>

<div class="maincolumnbg">
<div class ="content-container">
<div class="main-column-index"><!-- main-column -->
<?php if ( have_posts() ) :
?>
<div class="archiveheading">
Search results: "<?php the_search_query(); ?>"
</div>
<?php
while ( have_posts() ) : the_post(); ?>

<article class="indexpost-search" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<a href="<?php the_permalink() ?>">
<?php if ( has_post_thumbnail() ) { ?>
<div class="index-thumbnail-search">
<?php the_post_thumbnail( 'small-thumbnail' ); ?>
</div>
<?php } ?>
<header class="entry-header-search">
<h1 class="entry-title-search" itemprop="headline">
<a itemprop="url" href="<?php the_permalink() ?>" title="<?php the_title_attribute() ?>"><?php the_title() ?></a> </h1>
</header><!-- .entry-header -->
<div class="indexexcerpt-search" itemprop="text">
<?php echo get_the_excerpt() ?>
</div>
</a>
</article>

<?php endwhile;

else :
echo '<p>No search results found!</p>';

endif;
?>

</div><!-- main-column -->

<div class="sidebar-column"><!-- sidebar-column -->

<?php dynamic_sidebar( 'rightsidebar' ) ?>

</div><!-- sidebar-column -->

<div style="clear:both;">
</div>

<?php pagination_nav(); ?>
</div>

<div style="clear:both;">
</div>
</div>

<?php

get_footer();

?>

8 – searchform.php

<form class="tksearch" role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<input value="<?php the_search_query(); ?>" name="s" autocomplete="off" type="text" class="tksearchTerm " placeholder="Enter Title Name" />
<input class="tksearchButton" type="submit" value="➩" />
</form>

9 – style.css

/*
Theme Name: TheKroyaard
Author: Sunil Patel
Author URI: http://thekroyaard.com
Version: 1.0
*/

@media (min-width: 1000px) {

body {
font-family: verdana, sans-serif;
color: #545454;
width: 100%;
height: 100%;
background-color: white;
}

.menubarbg{
background: black;
width: 100%;
}

#navigation{
border-left: 8px solid #AFA69C;
clear:both;
float:left;
margin-top: 1px;
margin-left: 0px;
margin-right: 0px;
}
#navigation ul, #navigation li {
display: inline;
/*z-index is for IE7, so that the pulldown menu displays in front of the image.*/
z-index: 99999;
}
#navigation li {
display: inline;
}
#navigation a {
color: white;
border-bottom: 8px solid black;
float: left;
font-size:100%;
padding: 13px 3px 5px 3px;
margin-top: 0px;
margin-left: 18px;
margin-right: 10px;
text-align: left;
text-decoration: none;
transition: 0.5s;
}
#navigation a:hover {
border-bottom-color: #b50000;
border-bottom-width: 4px;
color:white;
background: none;
opacity: 3;
display: block;
padding: 13px 3px 9px 3px;
margin-top: 0px;
margin-left: 18px;
margin-right: 10px;
font-weight: bold;
transition: 0.5s;
text-shadow: 0px 4px 6px red, 1px 1px 10px red; color: white;
}

#navigation ul li:first-child{
border-left: 0px solid #AFA69C;
}
#navigation ul ul {
font-size: 13px;
background: red;
width: ;
display:none;
overflow: hidden;
position:absolute;
top:30px;
}
#navigation ul ul li:first-child{
border-left: 10px solid black;
}
#navigation ul ul ul {
left:100%;
top:0;
border-left:0;
border-right: 0;
}
#navigation ul ul ul li:first-child{
border-left: 0;
}
#navigation ul ul a {
height:auto;
padding:4px 8px;
width:100px;
}
#navigation li:hover > a, #navigation ul ul :hover > a {
color:white;
font-weight: bold;
}
#navigation ul li:hover > ul {
display:block;
}
div.menu ul {
list-style: none;
}
div.menu li {
float:left;
position: relative;
margin: 0;
}

a:link, a:visited {
color: #4285f4;
}
a:hover {
text-decoration-color: red;
}

.post h2 {
border-bottom: 8px solid black;
border-left: 0px solid black;
text-decoration: none;
margin-top: 25px;
margin-bottom: 10px;
margin-left: -30px;
padding-left: 38px;
padding-bottom: 16px;
font-size: 26px;
font-weight: bold;
line-height: 46px;
width: auto;
}

.post h1 {
font-size: 18px;
padding-bottom: 5px;
padding-right: 15px;
border-bottom: 5px double black;
width: fit-content;
text-decoration: none;
color: black;
}
.post h3 {
font-size: 18px;
padding-bottom: 5px;
padding-right: 15px;
border-bottom: 5px double black;
text-decoration: none;
width: fit-content;
margin-top: 30px;
}

.post h4 {
font-size: 18px;
border-left: 0px solid #1b3b66;
text-decoration: none;
color: black;
padding: 8px 0px 8px 0px;
margin-top: 30px;
border-radius: 0px;
border-top: 4px solid #828282;
border-bottom: 4px solid #828282;
}

.post h5 {
color: black;
border-left: 0px;
font-size: 18px;
padding-bottom: 5px;
padding-right: 15px;
padding-left: 0px;
border-bottom: 5px double red;
text-decoration: none;
width: fit-content;
margin-top: 30px;
margin: 0px;
}

.post h6 {
font-size: 100%;
line-height: 1.7em;
font-weight: inherit;
margin-top: 17px;
margin-bottom: 17px;
}

.indexpost {
border-radius: 0px;
padding: 16px;
position: relative;
margin-left: 20px;
margin-right: 0px;
margin-bottom: 30px;
width: 42.3%;
float: left;
height: 200px;
overflow: hidden;
-webkit-box-shadow: 0px 0px 10px 2px black; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: 0px 0px 10px 2px black; /* Firefox 3.5 - 3.6 */
box-shadow: 0px 0px 5px 1px black; /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
transition: 0.9s;
}

article.post:last-of-type {
border-bottom: none;
}

.site-header {
border-bottom: 0px solid #ecf0f1;
}

.after-header {
overflow: hidden;
margin-left: auto;
margin-right: auto;
width: 100%;
max-width: 1160px;
border-bottom: 0px solid #ecf0f1;
}

.site-footer {
border-top: 0px solid #ecf0f1;
margin-top: 10px;
}

.desktopheader{
height: 152px;
width: 110%;
max-width: 1160px;
}

.desktopheaderimg{
width: 90%;
overflow: hidden;
}

.logoimg {
margin-top: 60px;
padding-left: 10px;
float: left;
width:25%;
height: auto;
transition: 0.8s;
}

.logoimg:hover {
padding-left: 15px;
transition: 0.8s;
}

.headerad1 {
max-width: 728px;
max-height: 90px;
overflow: hidden;
float: right;
margin-top: 33px;
}

.mobileheadersearch{
display: none;
}

.headerad2 {
display: none;
}

.index-thumbnail {
text-align: left;
height: 220px;
}

.index-thumbnail img {
clear: both;
position: absolute;
left: 0;
right: 0;
height: 220px;
width: auto;
margin-left: auto;
margin-right: auto;
margin-top: -18px;
border-radius: 0px;
border: 0px;
}

.single-post-image img {
margin-top: 30px;
height: 192px;
width: auto;
max-width: 340px;
border-radius: 5px;
position: absolute;
right: 24px;
}

#searchsubmit {
background-color: #00a0d2;
color: white;
padding: 5px 8px;
font-size: 15px;
line-height: 1.3;
border-radius: 6px;
cursor: pointer;
}

#s {
height: 18px;
padding: 5px 8px;
font-size: 15px;
line-height: 1.1;
border-radius: 6px;
}

.content-container {
background: white;
width: 100%;
max-width: 1160px;
overflow: hidden;
padding: 0px;
margin-left: auto;
margin-right: auto;
margin-top: 0px;
-webkit-box-shadow: -30px 0px 20px -24px black; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: -30px 0px 20px -24px black; /* Firefox 3.5 - 3.6 */
box-shadow: 0px 0px 0px 0px black; /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */

}

.sidebar-column {
font-size: 90%;
right: 0;
width: 27%;
float: right;
margin-right: 12px;
}

.sidebar-column .widgettitle{
font-weight: bold;
font-size: 18px;
text-align: right;
height: 20px;
padding: 10px;
margin-top: 40px;
border-bottom: 2px solid black;
border-right: 10px solid black;
}

.main-column {
color: black;
font-size: 100%;
padding: 15px;
border-right: 12px solid #f0f0f0;
float: left;
width: 67%;
overflow: hidden;
margin: 0px;
}

.main-column-index {
padding: 0px;
border-right: 12px solid #f0f0f0;
float: left;
width: 69.58%;
overflow: hidden;
margin: 0px;
}

.maincolumnbg{
background: #f0f0f0;
margin-bottom: -10px;
}

#tkspl-searchbox {
height: 27px;
margin: 4px auto;
position: relative;
min-width: 250px;
max-width: 300px;
border-bottom: 0px solid #cc0000; outline: none;
}

.tkspl-buttonwrap { display:block;
margin-right: 0px; outline: none;
border: black;
width: 14%;
height: 28px;
display: block;
position: absolute;
top: 0;
right: 0;
background: white;
cursor: pointer;
margin-top: 0px;
border-radius: 0px 20px 20px 0px;
}

.tkspl-buttonwrap:hover {
background: white;

border-radius: 0px 20px 20px 0px;
}

.tkspl-submit { display:block;
width: 35px;
height: 25px;
background: white;
cursor: pointer;
position: absolute;
right: 50%;
top: 72%;
margin-top: -18px;
margin-right: -17.5px;
border: black; outline: none;

border-radius: 0px 20px 20px 0px;
}

.tkspl-submit:after {
content: '';
position: absolute;
width: 8px;
height: 8px;
border: 2px solid black;
border-radius: 50%;
left: 10px;
top: 4px;
box-sizing: content-box; outline: none;
}

.tkspl-submit:before {
content: '';
position: absolute;
height: 8px;
width: 2px;
background: black;
transform: rotate(-35deg);
top: 14px;
left: 21px; outline: none;
border-radius: 0px 20px 20px 0px;
}

#tkspl-input {
width: 257px;
border: 0px solid black;
border-right: none;
height: 27px;
border-radius: 5px 0 0 5px;
outline: none;
color: black; padding-top: 0px;
padding-left: 5px; border-radius: 20px 0px 0px 20px;
}
.menubarleftspan{
font-weight:bold;
color: white;
padding-top: 0px;
padding-bottom: 0px;
width: 65%; float: left; background: black;
}

.menubarrightspan{
float: right;
margin-right: 5px; background: black;
border: 5px solid black; border-radius: 20px;
}

.bgcolorspl{background: black; margin:10px; transition: 0.2s;}
.bgcolorspl:hover{transition: 0.2s;
text-shadow: 0px 5px 4px red, 1px 9px 8px red; color: white;}
.bgcolorspl a{
font-weight:bold; font-size: 17px; color: white; text-decoration: none;
}

.fluid-width-video-wrapper iframe, .fluid-width-video-wrapper object, .fluid-width-video-wrapper embed { height: 300px; width: 100%;
overflow: hidden;}

iframe.__youtube_prefs__ {
border-width: 0;
width: 100%;
overflow: hidden;
}
pre {
width: auto;;
font-size: 15px;
line-height: 22px;
font-weight: bold;
color: black;
overflow: auto;
background: #ebebeb;
display: block;
font-family: monospace;
white-space: pre;
margin: 0px;
padding: 5px;
}
.post p {
line-height: 1.7em;
}

.post ul {
display: block;
list-style-type: disc;
}

.post li {
line-height: 1.7em;
display: list-item;
text-align: -webkit-match-parent;
}

.button {
background-color: #4CAF50;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}

.beforetitle{
width: 100%;
margin-top: 10px;
margin-bottom: 20px;
overflow: hidden;
}
.postview{
padding: 0px;
float: left;
width: 31%;
height: 20px;
overflow: hidden;
padding-left: 2px;
}
.fa-eye{
padding-right: 3px;
}
.postdate{
text-align: right;
float: right ;
width: 40%;
height: 20px;
overflow: hidden;
}
.fa-clock-o{
padding-right: 2px;
}

.post .entry-header {
background: white;
color: black;
position: relative;
bottom: 0px;
left: 0;
overflow: none;
width: 100%;
border-bottom: 0px solid white;
transition: 0.9s;
}

.post .entry-title-post {
border-radius: 0px ;
border-top: 4px solid #b50000;
border-bottom: 4px solid #b50000;
overflow: hidden;
margin-top: 20px;
margin-bottom: 20px;
margin-left: 0px;
margin-right: 0px;
padding-top: 8px;
padding-bottom: 8px;
padding-left: 0px;
padding-right: 0px;
width: auto;
text-decoration: none;
font-size: 22px;
font-weight: bold;
line-height: 36px;
color: black;
text-align: left;
}

.post .entry-title-post a{
pointer-events: none;
cursor: default;
color: black;
text-decoration: none;
}

.entry-header {
color: black;
position: absolute;
bottom: 0px;
left: 0;
width: 100%;
border-bottom: 10px solid white;
transition: 0.9s;
}

.entry-title {
text-align: center;
line-height: 29px;
padding: 0px;
min-height: 40px;
max-height: 72px;
width: 100%;
background: black;
border-radius: 0px 0px 0px 0px; font-size: 16px;
font-weight: bold;
margin-bottom: -10px;
transition: 0.9s;
-webkit-box-shadow: 0px 0px 10px 3px #d4d4d4; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: 0px 0px 10px 3px #d4d4d4; /* Firefox 3.5 - 3.6 */
box-shadow: 0px 0px 10px 3px #d4d4d4; /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

.entry-title:hover {
display: block;
background: #b50000;
transition: 0.9s;
}
.entry-title a{
padding: 0px 10px 8px 10px;
display: block;
color:white;
text-decoration: none;
transition: 0.9s;
}

.footerpadding{ text-decoration: none;}
.footerpadding:hover{
text-shadow: 0px 5px 4px red, 1px 10px 20px red; color: white;}

img.alignright {float:right;
margin-left: 10px;
margin-top: 10px;
margin-bottom: 10px;
max-width: 600px; max-height: 500px;}
img.alignleft {float:left;
margin-right: 10px;
margin-top: 10px;
margin-bottom: 10px
max-width: 600px; max-height: 500px;}
img.aligncenter {display: block; margin-left: auto; margin-right: auto;
margin-top: 10px;
margin-bottom: 10px;
max-width: 600px;
max-height: 500px;}
a img.alignright {float:right; margin-left: 10px;
margin-top: 10px;
margin-bottom: 10px;}
a img.alignleft {float:left; margin-right: 10px;
margin-top: 10px;
margin-bottom: 10px;}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

.indexpostdesktop{
text-align: center;
background: #f5f5f5;
position: relative;
width: 94%;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
margin-bottom: 20px;
padding-right: 10px;
padding-top: 0px;
padding-bottom: 00px;
}

.indexexcerpt{
font-size: 14px;
line-height: 24px; margin-top: 0px;
}

.menubarspl {
width: 100%;
max-width: 1160px;
background-color: black; height: 50px;
padding-top: 4px;
margin-left: auto; margin-right: auto;
}
.mobileheader {
display: none;
}
.indexpostmobile {display: none;}

.relateditemmobile{display: none;}

.footerdesignmobile {
display: none;
}

.archiveheading {
font-size: 22px; border-bottom: 0px solid #5c5c5c; width: fit-content; padding: 0px;

padding-left: 2%;margin-left: 0px;
margin-top: 20px;
margin-bottom: 20px;
}

.nav-previous a, .nav-next a{
text-decoration: none;
color: white;
padding: 10px;
}
.nav-previous , .nav-next {
z-index: 111111;
overflow: hidden;
overflow-x: hidden;
background: #b50000;
color: white;
height: 30px;
line-height: 28px;
margin: 15px 15px 20px 35px;
-webkit-box-shadow: 0px 0px 5px 5px #d4d4d4; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: 0px 0px 5px 5px #d4d4d4; /* Firefox 3.5 - 3.6 */
box-shadow: 0px 0px 5px 5px #d4d4d4; /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

.nav-previous :hover , .nav-next :hover {
background: red;
border-radius: 10px;
line-height: 27px;
}

.pagination{
margin-left: -20px;
height: 60px;
}

td {
font-size: 95%;
padding: 2px 5px 2px 5px;
border: 1px solid #d9d9d9;
width: 90%;
}
.td_btn{
overflow: hidden;
padding: 0px;
border-radius: 20px;
background: red;
}

.td_btn a{
overflow: hidden;
padding: 5px 10px 5px 10px;
border-radius: 5px;
background: #a10b00;
}

.td_btn a:hover{
overflow: hidden;
padding: 5px 10px 5px 10px;
background: red;
}

.singlerandomepost img {
float: left;
margin-right: 14px;
height: 43px;
width: 43px;
border-radius: 6px;
}
.singlerandomepost{

margin-top: 15px;
margin-bottom: 15px;
max-height: 53px;
overflow: hidden;
}
.singlerandomepost a{
height: 53px;
line-height: 22px;
background: #f7f7f7;
display: block;
color: black;
transition: 0.5s;
text-decoration: none;
padding: 5px;
border-radius: 6px;
}
.singlerandomepost a:hover{
color: black;
background: #f0f0f0;
transition: 0.5s;
}

/* Style the sidenav links and the dropdown button */
.sidenav a, .dropdown-spl {
font-size: 15px;
padding: 10px 8px 10px 14px;
margin: 8px 0px -5px 0px;
text-decoration: none;
color: #818181;
display: block;
border: none;
background: none;
width: 100%;
text-align: left;
cursor: pointer;
outline: none;
transition: 0.4s;
}
.dropdown-spl:hover {
background: #a30c0c;
color: white;
transition: 0.4s;
}

/* On mouse-over */
.sidenav a:hover, .dropdown-btn:hover {
color: #f1f1f1;
}

.dropdown-container a {
font-size: 14px;
display: none;
background-color: #262626;
padding-left: 21px;
color: white;
}

.dropdown-container a:hover {
border-left: 8px solid white;

}


/* Add an active class to the active dropdown button */
.active {
background-color: #a30c0c;
color: white;
}

/* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
.dropdown-container {
display: none;
background-color: #262626;
padding: 0px;
}

/* Optional: Style the caret down icon */
.fa-caret-down {
float: right;
padding-right: 8px;
}

/* Some media queries for responsiveness */


.sidebarmobilemenu {
height: 100%;
width: 0;
position: fixed;
z-index: 111111;
top: 0;
left: 0;
background-color: black;
overflow-x: hidden;
transition: 0.5s;
}

.sidebarmobilemenu a {text-align: left;
font-size: 14px;
padding: 10px;
margin: 4px;
text-decoration: none;
color: #818181;
display: block;
transition: 0.3s;
border: 0px solid white;
}

.sidebarmobilemenu a:hover {
color: #f1f1f1;
}

.sidebarmobilemenu .closemobilemenu {
position: relative;
margin-bottom: -50px;
top: 30px;
left: 200px;
width: fit-content; color: white; font-size: 30px;
}

.openmobilemenu {
font-size: 20px;
width: 50px;
cursor: pointer;
background-color: black;
color: white;
padding-top: 8px;
padding-bottom: 5px;
border: none;
outline: none;
}

.openmobilemenu:hover {
background-color: black;
}

.tksearch {
width: 90%;
position: relative;
display: flex;
left: 5%; right: 5%;
}

.tksearchButton {

border: 1px solid white;
background: white;
text-align: center;
color: red;
border-radius: 0 5px 5px 0;
cursor: pointer;
font-size: 20px;
}

.tksearchTerm {
width: 100%;
border: 3px solid white;
border-right: none;
padding: 5px;
height: 20px;
border-radius: 5px 0 0 5px;
outline: none;
color: black;
}

.gsc-thumbnail {
display: none;
}
.gs-title a { font-family: verdana; font-size: 15px;
font-weight: bold;
}
.gs-snippet{
font-family: verdana;
}
.containercustomsharebutton{
border-top: 4px solid #828282;
border-bottom: 4px solid #828282;
padding: 9px 5px 5px 0px;
margin-left: 0px;
margin-top: 40px;
border-radius: 0px;

}
.customsearchbutton {
width: 23px;
height: 30x;
padding-left: 0px;
padding-right: 10px;
transition: 0.5s;
}
.customsearchbutton:hover {
opacity: 0.5;
transition: 0.5s;
width: 23px;
height: 30x;
}
.shareicon{
height:20px;
display: none;
}
.emailicon{
padding-left: 0px;
height:23px;
transition: 0.5s;
}
.emailicon:hover{
padding-left: 0px;
height:23px;
opacity: 0.5;
transition: 0.5s;
}

.afterheadermobilemenu{
display: none;
}

blockquote {
font-size: 14px;
font-weight: bold;
font-style: italic;
margin: 0px;
padding: 1px 1px 1px 15px;
width: auto;
background-color: #f5f5f5;
}

}

/*less_1280*/
@media (max-width: 1157px) {
.indexpost {
background: white ;
border-radius: 6px;
padding: 16px;
position: relative;
margin-left: 15px;
margin-right: 15px;
margin-bottom: 30px;
width: auto;
float: left;
height: 200px;
overflow: hidden;
-webkit-box-shadow: 0px 0px 10px 2px black; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: 0px 0px 10px 2px black; /* Firefox 3.5 - 3.6 */
box-shadow: 0px 0px 5px 1px black; /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
transition: 0.9s;
}
}

/*splmobile vide*/
@media (max-width: 1000px) {
body {
font-family: Arial, sans-serif;
color: #545454;
height: 100%;
margin: 0px;
padding: 0px;
background-color: white;
}


a:link, a:visited {
color: #4285f4;
}

p {
line-height: 1.7em;
}

div.container {
max-width: 100%;
margin: 0 auto;
}

.post h1 {
font-size: 18px;
padding-bottom: 5px;
padding-right: 15px;
border-bottom: 5px double black;
width: fit-content;
text-decoration: none;
color: black;
}
.post h2 {
padding-bottom: 16px;
padding-top: 4px;
padding-left: 4px;
padding-right: 4px;
border-bottom: 5px solid black;
margin-top: 15px;
margin-bottom: 10px;
font-size: 26px;
font-weight: bold;
line-height: 36px;
}
.post h3 {
font-size: 18px;
padding-bottom: 5px;
padding-right: 15px;
border-bottom: 5px double black;
width: fit-content;
text-decoration: none;
color: black;
}

.post h6 {
font-size: 100%;
line-height: 26px;
font-weight: inherit;
margin: 15px 0px 15px 0px;
}

.content-container {
width: 100%;
overflow: ;
}

.indexexcerpt{
font-size: 14px;
line-height: 20px;
margin-top: 0px;
border-bottom: 5px solid white;
}

.indexpost {
border: 2px solid black;
width: auto;
float: none;
padding: 5px;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
margin-bottom: 20px;
height: 88px;
overflow: hidden;
-webkit-box-shadow: 0px 0px 5px 5px #d4d4d4; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: 0px 0px 5px 5px #d4d4d4; /* Firefox 3.5 - 3.6 */
box-shadow: 0px 0px 5px 5px #d4d4d4; /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

.indexpostreadmore{
display: none;
}

.main-column-index {
padding: 0px;
float: none;
width: 96%;
overflow: hidden;
margin: 0px;
margin-left: auto;
margin-right: auto;
}

.beforetitle{
width: 100%;
margin-top: -5px;
margin-bottom: 15px;
overflow: hidden;
}
.postview{
padding: 0px;
float: left;
width: 33%;
height: 20px;
overflow: hidden;
padding-left: 0px;
}
.fa-eye{
padding-right: 3px;
}
.postdate{
text-align: right;
float: right ;
width: 64%;
height: 20px;
overflow: hidden;
}

.fa-clock-o{
padding-right: 2px;
}

.post .entry-header {
background: white;
color: black;
position: relative;
bottom: 0px;
left: 0;
overflow: none;
width: 100%;
border-bottom: 0px solid white;
transition: 0.9s;
}

.post .entry-title-post {
border-radius: 0px ;
border-top: 4px solid #b50000;
border-bottom: 4px solid #b50000;
overflow: hidden;
margin-top: 20px;
margin-bottom: 20px;
margin-left: -10px;
margin-right: -10px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 10px;
padding-right: 10px;
width: auto;
text-decoration: none;
font-size: 18px;
font-weight: bold;
line-height: 26px;
color: white;
background: #b50000;
text-align: left;
}

.post .entry-title-post a{
pointer-events: none;
cursor: default;
color: white;
text-decoration: none;
}

.entry-title {
border-bottom: 1px solid black;
font-size: 15px;
color: black;
font-weight: bold;
display: block;
text-decoration: none;
padding-bottom: 3px;
margin-right: 5px;
margin-bottom: 5px;
margin-top: 0px;
height: auto;
max-height:42px;
line-height: 21px;
overflow: hidden;
}

.entry-title a {
color: black;
text-decoration: none;
display: block;
}
.site-header {
border-bottom: 0px solid #ecf0f1;
}

.after-header {
margin-left: auto; margin-right: auto;
width: 100%;
border-bottom: 0px solid #ecf0f1;
}


p.post-meta a:link, p.post-meta a:visited {
color:#888;
}

.index-thumbnail img {
border: 0px solid black;
height: 45px;
width: auto;
float: left;
margin-left: 5px;
margin-right: 10px;
margin-top: 5px;
margin-bottom: 5px;
}

.single-post-image img {
float: left;
margin: 10px 12px 10px 0px;
height: 45px;
width: auto;
}

.main-column {
padding: 10px;
width: auto;
margin-left: auto;
margin-right: auto;
}

.sidebar-column {
right: 0;
width: 30%;
float: right;
display: none;
}

.sidebar-column .widgettitle{
text-align: right;
height: 20px;
padding: 10px;
border-bottom: 3px solid black;
border-right: 10px solid black;
}

.bgcolorspl{background: black; margin:10px; transition: 0.2s;}
.bgcolorspl:hover{transition: 0.2s;
text-shadow: 0px 5px 4px red, 1px 9px 8px red; color: white;}

.fluid-width-video-wrapper iframe, .fluid-width-video-wrapper object, .fluid-width-video-wrapper embed { height: 300px; width: 100%; overflow: hidden;}

.fluid-width-video-wrapper{
overflow: hidden;
margin-bottom: 10px;
}

iframe.__youtube_prefs__ {
border-width: 0;
width: 100%;
overflow: hidden;
}

pre {
width: auto;;
font-size: 13px;
line-height: 22px;
font-weight: bold;
color: black;
overflow: auto;
background: #ebebeb;
display: block;
font-family: monospace;
white-space: pre;
margin: 0px;
padding: 5px;
}

.button {
background-color: #4CAF50;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}


.footerpadding{ text-decoration: none;}
.footerpadding:hover{
text-shadow: 0px 5px 4px red, 1px 10px 20px red; color: white;}

img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

.menubarspl {
display: none;
}

.headerwithsearch{
display: none;
}

.indexpostdesktop{
display: none;
}

.relateditemdesktop{display: none;}



#footerdesign {
display: none;
}

.archiveheading {
font-size: 20px; border-bottom: 4px solid #5c5c5c; width: fit-content; padding: 10px 10px 10px 35px; margin-left: -20px; margin-bottom: 20px;
}
td {
padding: 2px 5px 2px 5px;
border: 1px solid #d9d9d9;
}

.nav-previous a, .nav-next a{
text-decoration: none;
color: white;
padding: 10px;
}
.nav-previous , .nav-next {
overflow: hidden;
background: red;
color: white;
height: 30px;
line-height: 28px;
margin: 15px 0px 20px 0px;
-webkit-box-shadow: 0px 0px 5px 5px #d4d4d4; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: 0px 0px 5px 5px #d4d4d4; /* Firefox 3.5 - 3.6 */
box-shadow: 0px 0px 5px 5px #d4d4d4; /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

.nav-previous :hover , .nav-next :hover {
font-size: 26px;
border-radius: 10px;
line-height: 27px;
}

.pagination{
margin-left: 0px;
height: 60px;
}


td {
padding: 2px 5px 2px 5px;
border: 1px solid #d9d9d9;
width: 90%;
}

.td_btn{
overflow: hidden;
padding: 0px;
border-radius: 20px;
background: red;
}

.td_btn a{
overflow: hidden;
padding: 5px 10px 5px 10px;
border-radius: 5px;
background: #a10b00;
}

.td_btn a:hover{
overflow: hidden;
padding: 5px 10px 5px 10px;
background: red;
}

#tkspl-searchbox {
height: 27px;
margin: 4px auto;
position: relative;
min-width: 250px;
max-width: 300px;
border-bottom: 0px solid #cc0000; outline: none;
}

.tksplmobile-buttonwrap {
border: none;
width: 14%;
height: 35px;
display: block;
position: absolute;
top: 0;
right: 0;
background: #cc0000;
cursor: pointer;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}

.tksplmobile-buttonwrap:hover {
background: red;
}

.tksplmobile-submit {
width: 35px;
height: 35px;
background: transparent;
cursor: pointer;
position: absolute;
right: 50%;
top: 50%;
margin-top: -17.5px;
margin-right: -17.5px;
border: none;
}

.tksplmobile-submit:after {
content: '';
position: absolute;
width: 8px;
height: 8px;
border: 2px solid white;
border-radius: 50%;
left: 10px;
top: 9px;
box-sizing: content-box;
}

.tksplmobile-submit:before {
content: '';
position: absolute;
height: 8px;
width: 2px;
background: white;
transform: rotate(-35deg);
top: 19px;
left: 21px;
}

#tksplmobile-input {
height: 35px;
width: 82%;
padding: 0px;
padding-left: 4%;
border: none;
outline: none;
position: absolute;
right: 14%;

border-bottom: 1px solid #cc0000;

border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
transition: all 0.5s;
}

/* Style the sidenav links and the dropdown button */
.sidenav a, .dropdown-spl {
font-size: 14px;
padding: 8px; padding-left: 22px;
text-decoration: none;
color: #818181;
display: block;
border: none;
background: none;
width: 100%;
text-align: left;
cursor: pointer;
outline: none;
}

/* On mouse-over */
.sidenav a:hover, .dropdown-btn:hover {
color: #f1f1f1;
}




/* Add an active class to the active dropdown button */
.active {
background-color: #a30c0c;
color: white;
}

/* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
.dropdown-container {
display: none;
background-color: #262626;
padding-left: 21px;
}

/* Optional: Style the caret down icon */
.fa-caret-down {
float: right;
padding-right: 15px;
}

/* Some media queries for responsiveness */


.sidebarmobilemenu {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
left: 0;
background-color: black;
overflow-x: hidden;
transition: 0.5s;

}

.sidebarmobilemenu a {text-align: left;
padding: 8px; padding-left: 22px;
text-decoration: none;
color: #818181;
display: block;
transition: 0.3s;
}

.sidebarmobilemenu a:hover {
color: #f1f1f1;
}

.sidebarmobilemenu .closemobilemenu {
position: relative; margin-bottom: -50px;
left: 190px; width: 10%; color: white; font-size: 36px;

}

.openmobilemenu {
font-size: 20px;
cursor: pointer;
background-color: black;
color: white;
padding-top: 7px;
padding-bottom: 5px;
border: none;
outline: none;
}

.openmobilemenu:hover {
background-color: black;
}


.tksearch {
width: 90%;
position: relative;
display: flex;
left: 5%; right: 5%;
}

.tksearchButton {

border: 1px solid white;
background: white;
text-align: center;
color: red;
border-radius: 0 5px 5px 0;
cursor: pointer;
font-size: 20px;
}

.tksearchTerm {
width: 100%;
border: 3px solid white;
border-right: none;
padding: 5px;
height: 20px;
border-radius: 5px 0 0 5px;
outline: none;
color: black;
}

.gsc-thumbnail {
display: none;
}
.gs-title a { font-family: verdana; font-size: 15px;
font-weight: bold;
}
.gs-snippet{
font-family: verdana;
}
.containercustomsharebutton{
border-bottom: 0px solid #000263;
border-top: 0px solid #000263;
background: black;
padding: 9px 5px 5px 8px;
margin-left: -10px;
margin-right: -10px;
margin-top: 40px;
border-radius: 0px;
}
.customsearchbutton {
width: 20px;
height: 20x;
padding-left: 5px;
padding-right: 5px;
}

.adsmobiledesign{
color: white;
background: black;
border-bottom: 0px solid black;
border-top: 0px solid black;
padding: 10px 10px 10px 10px;
margin-left: -10px;
margin-right: -10px;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 0px;
font-size: 18px;
font-weight: bold;
}

.clear2 {
background: #b50000;
color: white;
padding: 10px 10px 10px 10px;;
margin-left: -10px; margin-right: -10px;
margin-top: 20px; margin-bottom: 20px;
border-top: 0px solid #b50000;
border-bottom: 0px solid #b50000;
height: auto;
font-weight: bold;
font-size: 18px;
}

.shareicon{
display: none;
height:20px;
}
.emailicon{
padding-left: 5px;
height:20px;
}

.afterheadermobilemenu{
color: white;
text-align: center;
font-size: 100%;
max-width: 100%;
padding-top: 0px;
padding-bottom: 0px;
background: black;
margin-top: 10px;
margin-bottom: 16px;
}
.material-icons {
font-size: 120%;
width: 10%;
color: white;
padding: 1%;
margin-top: 1.2%;
margin-bottom: 1.2%;
margin-left: 0.7%;
margin-right: 0.7%;
border: 1px solid #e1e1e1;
border-radius: 2px;
}

blockquote {
font-size: 14px;
font-weight: bold;
font-style: italic;
margin: 0px;
padding: 1px 1px 1px 15px;
width: auto;
background-color: #f5f5f5;
}


.desktopheaderimg {
width: 50%;
padding: 0px;
margin-left: 25%;
margin-top: 4%;
border: 0px solid black;
}

.linebrake{
clear: both;
padding-top: 5px;
padding-bottom: 5px;
}
.logoimg {
margin-left: auto;
margin-right: auto;
width: 100%;
clear: both;
}

.headerad1 {
display: none;
}
.headerad2 {
display: block;
margin-top: 10px;
margin-left: auto;
margin-right: auto;
width: 100%;
}
}
Note –

if these codes not work in your custom theme’s folder (example – spltheme). so contact me from contact section.

You May Also Like

  1. How to See Report for Copyright Content
  2. How to Delete Instagram’s Uploaded Reels
  3. How-to-Record-Internal-Audio-Thumbnail-23442
    How to Record Internal Audio of Computer
  4. How to Recover IRCTS’s Login Password