{"id":5165,"date":"2015-10-16T15:45:33","date_gmt":"2015-10-16T13:45:33","guid":{"rendered":"http:\/\/hb-themes.com\/themes\/highend_wp\/?page_id=5165"},"modified":"2015-10-16T15:45:33","modified_gmt":"2015-10-16T13:45:33","slug":"flip-boxes","status":"publish","type":"page","link":"https:\/\/turnkeylawfirm.com\/demo\/flip-boxes\/","title":{"rendered":"Flip Boxes"},"content":{"rendered":"<div class=\"wpb-content-wrapper\">[vc_row fullwidth=&#8221;yes&#8221; top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445011776967{margin-top: -80px !important;margin-bottom: -10px !important;padding-top: 80px !important;padding-bottom: 10px !important;}&#8221; background_color=&#8221;#ffffff&#8221;][vc_column]<div class=\"shortcode-wrapper shortcode-title clearfix\"><h4 class=\"modern aligncenter\">With Simple Icon<span class=\"bottom-line\"><\/span><\/h4><\/div>[\/vc_column][\/vc_row][vc_row fullwidth=&#8221;yes&#8221; top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445007393286{padding-top: 70px !important;padding-bottom: 80px !important;}&#8221; background_color=&#8221;#ffffff&#8221;][vc_column width=&#8221;1\/3&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-horizontal\" style=\"height:1px; height:350px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-color: #bf5d52;\" > <div class=\"hb-flipbox-content\"> <div class=\"front-icon\"><i class=\"hb-moon-trophy\" style=\"font-size:64px; color:#eaeaea;\"><\/i><\/div>       <h4 class=\"modern\" style=\"font-size:28px; color:#eaeaea;\">Award Winning<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:inherit;\"><\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #5b6c7d;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:18px; color:#eaeaea;\">Best design of 2016<\/h4>        <div class=\"back-desc\" style=\"font-size:inherit; color:#eaeaea; \">Fusce id erat et massa rutrum tempus sit amet vel mauris. Mauris ullamcorper orci at erat cursus blandit. Vivamus maximus orci tristique.<\/div><a href=\"#\" class=\"hb-button no-three-d hb-second-light\" target=\"_self\">View Project<\/a>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-horizontal\" style=\"height:1px; height:350px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-color: #bf5d52;\" > <div class=\"hb-flipbox-content\"> <div class=\"front-icon\"><i class=\"hb-moon-heart-2\" style=\"font-size:64px; color:#eaeaea;\"><\/i><\/div>       <h4 class=\"modern\" style=\"font-size:28px; color:#eaeaea;\">Instant love<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:inherit;\"><\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #5b6c7d;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:18px; color:#eaeaea;\">Love at first sight<\/h4>        <div class=\"back-desc\" style=\"font-size:inherit; color:#eaeaea; \">Fusce id erat et massa rutrum tempus sit amet vel mauris. Mauris ullamcorper orci at erat cursus blandit. Vivamus maximus orci tristique.<\/div><a href=\"#\" class=\"hb-button no-three-d hb-second-light\" target=\"_self\">See More<\/a>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-horizontal\" style=\"height:1px; height:350px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-color: #bf5d52;\" > <div class=\"hb-flipbox-content\"> <div class=\"front-icon\"><i class=\"hb-moon-busy-4\" style=\"font-size:56px; color:#eaeaea;\"><\/i><\/div>       <h4 class=\"modern\" style=\"font-size:28px; color:#eaeaea;\">Built to last<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:inherit;\"><\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #5b6c7d;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:18px; color:#eaeaea;\">Coded to perfection<\/h4>        <div class=\"back-desc\" style=\"font-size:inherit; color:#eaeaea; \">Fusce id erat et massa rutrum tempus sit amet vel mauris. Mauris ullamcorper orci at erat cursus blandit. Vivamus maximus orci tristique.<\/div><a href=\"#\" class=\"hb-button no-three-d hb-second-light\" target=\"_self\">Find out why<\/a>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][\/vc_row][vc_row top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445007498078{padding-top: 40px !important;}&#8221;][vc_column]<div class=\"shortcode-wrapper shortcode-title clearfix\"><h4 class=\"modern aligncenter\">Use custom image<span class=\"bottom-line\"><\/span><\/h4><\/div>[\/vc_column][\/vc_row][vc_row top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445011932061{padding-top: 60px !important;padding-bottom: 60px !important;}&#8221;][vc_column width=&#8221;1\/4&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-vertical\" style=\"height:1px; height:400px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-color: #2980b9;\" > <div class=\"hb-flipbox-content\"><div class=\"front-icon\"><img decoding=\"async\" src=\"\" alt=\"Mobile Ready\" \/><\/div>       <h4 class=\"modern\" style=\"font-size:16px; color:#ffffff;\">Mobile Ready<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:#ffffff;\">Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br \/>\nDuis porta lacinia ullamcorper. Nulla eleifend, elit eu laoreet.<\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #333333;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:14px; color:#ffffff;\">Mauris ullamcorper<\/h4>        <div class=\"back-desc\" style=\"font-size:inherit; color:#ffffff; \">Sed sodales sapien in enim facilisis pharetra. Aenean sed diam diam. Sed venenatis quam id euismod. <\/div><a href=\"#\" class=\"hb-button no-three-d hb-wisteria\" target=\"_self\">View More<\/a>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][vc_column width=&#8221;1\/4&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-vertical\" style=\"height:1px; height:400px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-color: #16a085;\" > <div class=\"hb-flipbox-content\"><div class=\"front-icon\"><img decoding=\"async\" src=\"\" alt=\"Incredibly easy\" \/><\/div>       <h4 class=\"modern\" style=\"font-size:16px; color:#ffffff;\">Incredibly easy<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:#ffffff;\">Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br \/>\nDuis porta lacinia ullamcorper. Nulla eleifend, elit eu laoreet.<\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #333333;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:14px; color:#ffffff;\">Mauris ullamcorper<\/h4>        <div class=\"back-desc\" style=\"font-size:inherit; color:#ffffff; \">Sed sodales sapien in enim facilisis pharetra. Aenean sed diam diam. Sed venenatis quam id euismod. <\/div><a href=\"#\" class=\"hb-button no-three-d hb-wisteria\" target=\"_self\">View More<\/a>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][vc_column width=&#8221;1\/4&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-vertical\" style=\"height:1px; height:400px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-color: #9b59b6;\" > <div class=\"hb-flipbox-content\"><div class=\"front-icon\"><img decoding=\"async\" src=\"\" alt=\"Unlimited colors\" \/><\/div>       <h4 class=\"modern\" style=\"font-size:16px; color:#ffffff;\">Unlimited colors<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:#ffffff;\">Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br \/>\nDuis porta lacinia ullamcorper. Nulla eleifend, elit eu laoreet.<\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #333333;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:14px; color:#ffffff;\">Mauris ullamcorper<\/h4>        <div class=\"back-desc\" style=\"font-size:inherit; color:#ffffff; \">Sed sodales sapien in enim facilisis pharetra. Aenean sed diam diam. Sed venenatis quam id euismod. <\/div><a href=\"#\" class=\"hb-button no-three-d hb-wisteria\" target=\"_self\">View More<\/a>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][vc_column width=&#8221;1\/4&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-vertical\" style=\"height:1px; height:400px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-color: #34495e;\" > <div class=\"hb-flipbox-content\"><div class=\"front-icon\"><img decoding=\"async\" src=\"\" alt=\"Infinite options\" \/><\/div>       <h4 class=\"modern\" style=\"font-size:16px; color:#ffffff;\">Infinite options<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:#ffffff;\">Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br \/>\nDuis porta lacinia ullamcorper. Nulla eleifend, elit eu laoreet.<\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #333333;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:14px; color:#ffffff;\">Mauris ullamcorper<\/h4>        <div class=\"back-desc\" style=\"font-size:inherit; color:#ffffff; \">Sed sodales sapien in enim facilisis pharetra. Aenean sed diam diam. Sed venenatis quam id euismod. <\/div><a href=\"#\" class=\"hb-button no-three-d hb-wisteria\" target=\"_self\">View More<\/a>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][\/vc_row][vc_row][vc_column]<div class=\"shortcode-wrapper shortcode-title clearfix\"><h4 class=\"modern aligncenter\">As a background as well<span class=\"bottom-line\"><\/span><\/h4><\/div>[\/vc_column][\/vc_row][vc_row top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445011922811{padding-top: 60px !important;padding-bottom: 40px !important;}&#8221;][vc_column width=&#8221;2\/3&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-vertical\" style=\"height:1px; height:380px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-image: url('');\" > <div class=\"hb-flipbox-content\"> <div class=\"front-icon\"><i class=\"icon-cogs\" style=\"font-size:72px; color:#000000;\"><\/i><\/div>       <h4 class=\"modern\" style=\"font-size:28px; color:#000000;\">Flexible options<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:inherit;\"><\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #03033f;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:inherit; color:#ffffff;\"><\/h4>        <div class=\"back-desc\" style=\"font-size:16px; color:#ffffff; \">In the <strong>Description<\/strong> field,you can use any <em>HTML Tag<\/em>.<\/div>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class=\"shortcode-wrapper shortcode-blog-boxes\"><div class=\"hb-flipbox-container flip-vertical\" style=\"height:1px; height:380px\">      <div class=\"hb-flipbox-flipper\"><div class=\"hb-flipbox-front \" style=\"background-image: url('');\" > <div class=\"hb-flipbox-content\"> <div class=\"front-icon\"><i class=\"hb-moon-quill\" style=\"font-size:72px; color:#ffffff;\"><\/i><\/div>       <h4 class=\"modern\" style=\"font-size:28px; color:#ffffff;\">Class aptent<\/h4>       <div class=\"front-desc\" style=\"font-size:inherit; color:inherit;\"><\/div> <\/div><\/div><div class=\"hb-flipbox-back\" style=\"background-color: #03033f;\">  <div class=\"hb-flipbox-content\">        <h4 class=\"modern\" style=\"font-size:inherit; color:#ffffff;\"><\/h4>        <div class=\"back-desc\" style=\"font-size:16px; color:#ffffff; \">In the <strong>Description<\/strong> field,<br \/>\nyou can use any <em>HTML Tag<\/em>.<\/div>  <\/div><\/div>            <div class=\"clearboth\"><\/div>      <\/div><\/div><\/div>[\/vc_column][\/vc_row]\n<\/div>","protected":false},"excerpt":{"rendered":"<p>[vc_row fullwidth=&#8221;yes&#8221; top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445011776967{margin-top: -80px !important;margin-bottom: -10px !important;padding-top: 80px !important;padding-bottom: 10px !important;}&#8221; background_color=&#8221;#ffffff&#8221;][vc_column][\/vc_column][\/vc_row][vc_row fullwidth=&#8221;yes&#8221; top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445007393286{padding-top: 70px !important;padding-bottom: 80px !important;}&#8221; background_color=&#8221;#ffffff&#8221;][vc_column width=&#8221;1\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][\/vc_row][vc_row top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445007498078{padding-top: 40px !important;}&#8221;][vc_column][\/vc_column][\/vc_row][vc_row top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445011932061{padding-top: 60px !important;padding-bottom: 60px !important;}&#8221;][vc_column width=&#8221;1\/4&#8243;][\/vc_column][vc_column width=&#8221;1\/4&#8243;][\/vc_column][vc_column width=&#8221;1\/4&#8243;][\/vc_column][vc_column width=&#8221;1\/4&#8243;][\/vc_column][\/vc_row][vc_row][vc_column][\/vc_column][\/vc_row][vc_row top_margin=&#8221;0&#8243; bottom_margin=&#8221;0&#8243; css=&#8221;.vc_custom_1445011922811{padding-top: 60px !important;padding-bottom: 40px !important;}&#8221;][vc_column width=&#8221;2\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][\/vc_row]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"nf_dc_page":"","om_disable_all_campaigns":false,"footnotes":""},"class_list":["post-5165","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/turnkeylawfirm.com\/demo\/wp-json\/wp\/v2\/pages\/5165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/turnkeylawfirm.com\/demo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/turnkeylawfirm.com\/demo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/turnkeylawfirm.com\/demo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/turnkeylawfirm.com\/demo\/wp-json\/wp\/v2\/comments?post=5165"}],"version-history":[{"count":0,"href":"https:\/\/turnkeylawfirm.com\/demo\/wp-json\/wp\/v2\/pages\/5165\/revisions"}],"wp:attachment":[{"href":"https:\/\/turnkeylawfirm.com\/demo\/wp-json\/wp\/v2\/media?parent=5165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}