.servicesTitle { padding: 60px 0px; background: #000; width: 100%; } .servicesTitle h1 { font-size: 68px; color: #fff; text-align: center; text-transform: capitalize; } .single-services .main-page-wrapper>.container, .single-listing .main-page-wrapper>.container { max-width: 100%; } .servicesTitle .breadcrumbs span, .servicesTitle .breadcrumbs a { color: #fff; font-size: 15px; } .singleServiceContent { text-align: left; } .row.single_serviceSection { align-items: center; } .services.type-services { padding: 60px 0px; } .singleServiceContent h3 { font-size: 40px; text-transform: capitalize; } .main-wrap.col-md-7 { margin: 0; } .wre-single.listing.row { align-items: center; padding: 60px 0px; } <?php get_header(); ?> <div class="servicesTitle"> <div class="container-fluid"> <h1 class="tilte"> <?php the_title(); ?> </h1> <div class="breadcrumbs"> <a href="<?php echo home_url(); ?>">Home</a> <span class="current"><?php the_title(); ?></span> </div> </div> </div> <div class="container"> <?php while (have_posts()) : the_post(); ?> <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <div class="row single_serviceSection"> <div class="col-md-6"> <div class="singleServiceContent"> <h3> <?php the_title(); ?> </h3> <?php the_content(); ?> </div> </div> <div class="col-md-6"> <div class="singleServiceThumbnail"> <?php the_post_thumbnail("full"); ?> </div> </div> </div> <?php endwhile; ?> </div> <?php get_footer(); ?>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter