{"id":11301,"date":"2017-01-09T09:00:18","date_gmt":"2017-01-09T09:00:18","guid":{"rendered":"http:\/\/rnbtheme.com\/documentation\/?p=11301"},"modified":"2018-07-18T12:30:57","modified_gmt":"2018-07-18T12:30:57","slug":"row-options","status":"publish","type":"post","link":"https:\/\/rnbtheme.com\/documentation\/wpbackery\/row-options","title":{"rendered":"Row Options"},"content":{"rendered":"<section class=\"wpb-content-wrapper\"><p>[vc_row][vc_column css=&#8221;.vc_custom_1485959642071{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]Create a page, select the needed page template (we&#8217;d recommend you to use For Page Builder page template to build a page with VC elements) and navigate to the Visual Composer section.<\/p>\n<p>You may also edit the existing page, then simply scroll to the Visual Composer section to edit the content.<\/p>\n<p>All the elements are added inside the rows. Rows can be divided into columns to structure the content inside. You may find more information about Columns in <a href=\"http:\/\/rnbtheme.com\/documentation\/visual-composer\/column-options\" target=\"_blank\" rel=\"noopener noreferrer\">this post<\/a> of the theme documentation.<\/p>\n<p>Below you may find the details information about row settings section. By clicking on the <strong>Edit<\/strong>\u00a0button in the top right corner of each row you may\u00a0reveal the row settings window.<\/p>\n<h3>General\u00a0settings<\/h3>\n<h4>Select the general appearance and add some cool features to the row.<\/h4>\n<h5>Row sizing options<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13749\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-sizing-options-2.png\" alt=\"\" width=\"978\" height=\"396\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-sizing-options-2.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-sizing-options-2-300x121.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-sizing-options-2-768x311.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><strong><br \/>\n<\/strong><\/p>\n<ul>\n<li><strong>Content width<\/strong> &#8211; select the width of the row. You may set the row to <strong>boxed<\/strong> or<strong> full width<\/strong>.<\/li>\n<li><strong>Full height row<\/strong> &#8211; set it to <strong>Enable <\/strong>to set the row to full-screen.\n<ul>\n<li><strong>Enable custom columns offset<\/strong> &#8211; set it to <strong>Enable <\/strong>to add the offset from left and right sides for each column.<\/li>\n<li><strong>Columns offset<\/strong> &#8211; specify the offset value in px. If you set for example <strong>80px, <\/strong>the columns will have <strong>40px offset from the left<\/strong> and <strong>40px from the right side<\/strong>.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Force equal height columns<\/strong> &#8211; switch it to <strong>Enable <\/strong>to make the columns equal height and adjust the columns content to the height to the bigger one.<\/li>\n<\/ul>\n<p>[\/vc_column_text][vc_column_text]<\/p>\n<h5>Content and Row width<\/h5>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485528812678{padding-right: 35px !important;padding-left: 35px !important;background-color: #ededed !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;80&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<strong>Boxed content width<\/strong><\/p>\n<p>Background color is set for the column and the content is displayed inside\u00a01200px wide container (it&#8217;s default width\u00a0for the theme).[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;80&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;20&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row css=&#8221;.vc_custom_1485529237637{background-color: #e1e9eb !important;}&#8221;][vc_column css=&#8221;.vc_custom_1485529395962{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;80&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<strong>Boxed\u00a0content with full-width\u00a0background<\/strong><\/p>\n<p>Background color is set for the row and the content is displayed inside\u00a01200px wide container (it&#8217;s default width\u00a0for the theme).[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;80&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;20&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row dfd_row_config=&#8221;full_width_content&#8221; css=&#8221;.vc_custom_1485529421994{background-color: #efece1 !important;}&#8221;][vc_column css=&#8221;.vc_custom_1485529412427{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;80&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<strong>Full-width content<\/strong><\/p>\n<p>Background color is set for the row and the content is stretched to the full screen width.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;80&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]<\/p>\n<h5>Equal height columns<\/h5>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row force_equal_height_columns=&#8221;main_row&#8221;][vc_column width=&#8221;1\/2&#8243; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; css=&#8221;.vc_custom_1485530177715{padding: 30px !important;background-color: #e1e9eb !important;}&#8221;][vc_column_text]There&#8217;s a lot of content in this column.<\/p>\n<p>Phasellus quis arcu malesuada, tincidunt leo sed, porta diam. Pellentesque sed feugiat neque. Etiam luctus lacinia pulvinar. Praesent consequat nibh laoreet mi faucibus aliquet. In a magna lorem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.<br \/>\nMorbi ornare est eget mi auctor tristique.\u00a0Integer sed consequat arcu, ut elementum sapien. Etiam sit amet semper enim, vitae tincidunt eros. Proin interdum scelerisque risus sed semper.[\/vc_column_text][\/vc_column][vc_column width=&#8221;1\/2&#8243; css=&#8221;.vc_custom_1485530193835{padding: 30px !important;background-color: #efece1 !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]This column contains less content.<\/p>\n<p>However, its background is stretched to match the left column height.<br \/>\n<strong>Align content vertically<\/strong> option is enabled so the text is also aligned in the middle of the left column.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]<\/p>\n<h5>Disabled Equal height columns<\/h5>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/2&#8243; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_row_inner][vc_column_inner css=&#8221;.vc_custom_1485531070669{padding: 30px !important;background-color: #e1e9eb !important;}&#8221; col_inner_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_inner_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]There&#8217;s a lot of content in this column.<\/p>\n<p>Phasellus quis arcu malesuada, tincidunt leo sed, porta diam. Pellentesque sed feugiat neque. Etiam luctus lacinia pulvinar. Praesent consequat nibh laoreet mi faucibus aliquet. In a magna lorem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.<br \/>\nMorbi ornare est eget mi auctor tristique.\u00a0Integer sed consequat arcu, ut elementum sapien. Etiam sit amet semper enim, vitae tincidunt eros. Proin interdum scelerisque risus sed semper.[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][vc_column width=&#8221;1\/2&#8243; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; css=&#8221;.vc_custom_1485531128973{background-color: #ffffff !important;}&#8221;][vc_row_inner][vc_column_inner css=&#8221;.vc_custom_1485531095341{padding: 30px !important;background-color: #efece1 !important;}&#8221; col_inner_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_inner_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]This column contains less content.<\/p>\n<p>Its background isn&#8217;t stretched and adjusts only to the content amount.[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;0&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<h5>Row effect options<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13751\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-effects-options.png\" alt=\"\" width=\"978\" height=\"369\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-effects-options.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-effects-options-300x113.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-effects-options-768x290.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Row effect<\/strong> &#8211; select the effect when the row is on the top of the viewport. <strong>None<\/strong> and <strong>fade<\/strong> variants are available.<\/li>\n<li><strong>Content parallax effect<\/strong> &#8211; set it to\u00a0<strong>Enable\u00a0<\/strong>to have the parallax effect for the content.<\/li>\n<li><strong>Parallax speed<\/strong> &#8211;\u00a0control the speed of parallax. Values from 1 to 100 are acceptable.<\/li>\n<li><strong>Parallax limit<\/strong> &#8211; set the\u00a0parallax shift limit. Values from 50 to 400 are acceptable. Units should be set in px.<\/li>\n<\/ul>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13320\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-effect-options-2.png\" alt=\"\" width=\"978\" height=\"507\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-effect-options-2.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-effect-options-2-300x156.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-effect-options-2-768x398.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Remove CSS rule<\/strong> &#8211; control the responsive on mobile devices. Click on the checkbox to disable the rule on small screens.<\/li>\n<li><strong>Apply rules for device<\/strong> &#8211; select the device on which the rules should be applied.<\/li>\n<li><strong>Row delimiter style<\/strong> &#8211;\u00a0choose the delimiter style for the row. The delimiter will not be displayed if you set None style.<\/li>\n<\/ul>\n<p>[\/vc_column_text][vc_column_text]<\/p>\n<h5>Fade on scroll effect with Content parallax<\/h5>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row row_effect=&#8221;dfd-fade-on-scroll&#8221; dfd_row_parallax=&#8221;dfd-row-parallax&#8221; row_parallax_limit=&#8221;100&#8243; bg_check=&#8221;row-background-dark&#8221; css=&#8221;.vc_custom_1485788837286{padding-top: 50px !important;}&#8221;][vc_column css=&#8221;.vc_custom_1485788645836{padding-top: 50px !important;padding-right: 35px !important;padding-bottom: 50px !important;padding-left: 35px !important;background-color: #3b55e6 !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]The content slides up and down while you scroll. We&#8217;ve set 100px parallax limit so that it doesn&#8217;t overlap other page content.<br \/>\nThe content also becomes transparent as soon as the top of the row reaches the top of the viewport.<\/p>\n<p>Nulla vestibulum quam ac ultricies tristique. Quisque et lacus in sapien ultricies egestas. Nam leo libero, ultrices vehicula dolor eget, pretium consectetur enim. Donec mollis, ante vel ultricies egestas, nunc est malesuada lorem, ut sollicitudin mi dolor sed justo. Etiam tincidunt vitae nunc in finibus. Praesent lacinia ante felis, vel dictum quam porttitor sed. Sed posuere auctor justo, eget gravida arcu blandit quis.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]<\/p>\n<h5>Row heading options<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13752\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-heading-options-1.png\" alt=\"\" width=\"978\" height=\"265\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-heading-options-1.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-heading-options-1-300x81.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/row-heading-options-1-768x208.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Title for one page scroll navigation<\/strong> &#8211; add the title for the one page scroll dots navigation. For the pages with <strong>One page Scroll<\/strong> page templates selected.<\/li>\n<li><strong>Anchor<\/strong> &#8211; add the unique anchor name. The anchor can be used for the anchor navigation in the\u00a0menu. More details can be found in the <a href=\"http:\/\/rnbtheme.com\/documentation\/widgets-menus\/menu-creation\">Menu creation<\/a> post.<\/li>\n<\/ul>\n<h5>Extra features<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-2481 size-full\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/extra-features.jpg\" width=\"978\" height=\"350\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/extra-features.jpg 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/extra-features-300x107.jpg 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/extra-features-768x275.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Animation<\/strong> \u2013 choose between 14 preset animation effects.<\/li>\n<li><strong>Custom CSS class<\/strong> \u2013\u00a0enter our\u00a0own unique class name for the item \u2013 this is a useful option for those who want to create a specific style. E.g.: you can type <strong>custom-style<\/strong> class and then go to <del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">General options<\/del>\u00a0<del class=\"support-arrow-right\">Custom CSS\/JS<\/del> <del>Custom CSS<\/del> field and write your own CSS code with this class to get your own style.<\/li>\n<li><strong>Disable row<\/strong> &#8211; set it to <strong>Enable <\/strong>to hide the row on the public side of your website. You can switch it back when you need to show it.<\/li>\n<\/ul>\n<h3>Design settings<\/h3>\n<h4>Add any margin, border, and padding for the row. Both, pixels and percents are acceptable.<\/h4>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-2483\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/design-settings.jpg\" alt=\"\" width=\"978\" height=\"606\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/design-settings.jpg 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/design-settings-300x186.jpg 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/design-settings-768x476.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Margin<\/strong> &#8211; enter the needed value for the margins, negative values and percents can be accepted.<\/li>\n<li><strong>Border<\/strong> &#8211; enter the needed value for the border. Note, you also have to select its style and color to display it on the site.\n<ul>\n<li><strong>Border color<\/strong> &#8211; select the color for the border.<\/li>\n<li><strong>Border style<\/strong> &#8211; select the style of the border &#8211; solid, dotted, etc.<\/li>\n<li><strong>Border radius<\/strong> &#8211; set the value for border radius to have rounded corners of the border.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Padding<\/strong> &#8211; enter the needed values for the element&#8217;s padding.<\/li>\n<\/ul>\n<p>More information about margin, border and padding you\u00a0may find in <a href=\"http:\/\/rnbtheme.com\/documentation\/post-types\/column-options-examples#margin-border-padding\">this post<\/a>.<\/p>\n<ul>\n<li><strong>Background<\/strong> &#8211; select the color of the row.\n<ul>\n<li><strong>Image<\/strong> &#8211; select the image to be set as the row background.<\/li>\n<li><strong>Background attachment<\/strong> (in the\u00a0drop-down list) &#8211; select the background-attachment for the image.\n<ul>\n<li><strong>Theme defaults<\/strong> &#8211; the default image position &#8211; the full size aligned top left.<\/li>\n<li><strong>Cover<\/strong> &#8211; the image will fit it&#8217;s container: it&#8217;ll be resized to make the narrowest side fit the container so that there will be no blank spaces inside.<\/li>\n<li><strong>Contain<\/strong> &#8211; the image will have the biggest side that will fit the container: at least one side will fit the container and there may be gaps between the image and the row.<\/li>\n<li><strong>Repeat<\/strong> &#8211; the image will be repeated and create a pattern.<\/li>\n<li><strong>No Repeat<\/strong> &#8211; the image will be inserted full width, aligned top left, and with no repeat.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>More examples of background image attachment you may find in <a href=\"http:\/\/rnbtheme.com\/documentation\/post-types\/column-options-examples#bg-image-position\">this post<\/a>.<\/p>\n<ul>\n<li><strong>Box controls<\/strong> &#8211; set it to <strong>Enable\u00a0<\/strong>in case you want to set the same margins\/borders\/paddings for all four sides of the row. It&#8217;ll save our time, as the inserted value will be applied to the top, right, bottom and left elements.<\/li>\n<\/ul>\n<h3>Background options<\/h3>\n<h4>In this section, you can customize the row background according to your needs.<\/h4>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13754\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/background-settings-2.png\" alt=\"\" width=\"978\" height=\"470\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/background-settings-2.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/background-settings-2-300x144.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/background-settings-2-768x369.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Row background style<\/strong> &#8211; choose the background style for the row. The text colors will be changed according to the style you choose to make it more readable. <strong>Light<\/strong> and <strong>dark<\/strong> variants are available.<\/li>\n<li><strong>Background style<\/strong> &#8211;\u00a0select\u00a0the background style for the row.<\/li>\n<\/ul>\n<h4>Below you can find more detailed information about each style.<\/h4>\n<ul>\n<li><strong>None<\/strong> &#8211; no effect will be applied to the row.<\/li>\n<\/ul>\n<h5>Animated background style<\/h5>\n<h6>In this section, you can customize the colors for the row background\u00a0of the module.<\/h6>\n<h6>By clicking on the\u00a0arrow down icon you can reveal the whole section to adjust it to your needs. Here you are also able to duplicate the colors for the row, change\u00a0their order (simply drag-n-drop the blocks) and delete the unnecessary ones\u00a0as well.<\/h6>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-2486\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/animated-bg.jpg\" alt=\"\" width=\"978\" height=\"525\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/animated-bg.jpg 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/animated-bg-300x161.jpg 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/animated-bg-768x412.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Color values<\/strong> &#8211; select the color for the background row.<\/li>\n<li><strong>Animation duration<\/strong> &#8211; set the animation duration in ms.<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; bg_check=&#8221;row-background-dark&#8221; dfd_bg_style=&#8221;animated&#8221; dfd_anim_bg_duration=&#8221;6000&#8243; dfd_bg_colors=&#8221;%5B%7B%22dfd_bg_single_color%22%3A%22%233b55e6%22%7D%2C%7B%22dfd_bg_single_color%22%3A%22%23f42267%22%7D%5D&#8221;][vc_column css=&#8221;.vc_custom_1485762742421{padding-top: 100px !important;padding-right: 35px !important;padding-bottom: 100px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]Animated background style is applied to the row.<br \/>\nThe gradient is from dark blue to pink.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]<\/p>\n<h5>Canvas background style<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-2488\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Canvas.jpg\" alt=\"\" width=\"978\" height=\"812\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Canvas.jpg 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Canvas-300x249.jpg 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Canvas-768x638.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Background style<\/strong> &#8211; select one of the three canvas styles.<\/li>\n<li><strong>Animation size<\/strong> &#8211; select whether you&#8217;d like the animation to be applied to the <strong>Row Size<\/strong> or <strong>Window Size<\/strong>.<\/li>\n<li><strong>Background color<\/strong> &#8211; set\u00a0the background color for the row.<\/li>\n<li><strong>Animated lines color<\/strong> &#8211; select the color for the animation. For <strong>Style 2<\/strong> only.<\/li>\n<li><strong>Background image<\/strong> &#8211; upload the image to be used ad the row background.<\/li>\n<li><strong>Background image repeat<\/strong> &#8211; select the repeat for the selected image. You can select <strong>vertical<\/strong>, <strong>horizontal<\/strong>,<strong> repeat in both directions<\/strong> or <strong>disable<\/strong> repeat for the image.<\/li>\n<li><strong>Background image size<\/strong> &#8211;\u00a0select the background-attachment for the image. <strong>Cover<\/strong>, <strong>contain<\/strong> and <strong>initial<\/strong> values are available.<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; bg_check=&#8221;row-background-dark&#8221; dfd_bg_style=&#8221;canvas&#8221; dfd_bg_color_value=&#8221;#353535&#8243;][vc_column css=&#8221;.vc_custom_1485762742421{padding-top: 100px !important;padding-right: 35px !important;padding-bottom: 100px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]Canvas background Style 1 is applied to the row.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;20&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; bg_check=&#8221;row-background-dark&#8221; dfd_bg_style=&#8221;canvas&#8221; dfd_canvas_style=&#8221;style_2&#8243; dfd_bg_color_value=&#8221;#353535&#8243; dfd_canvas_color=&#8221;#ffffff&#8221;][vc_column css=&#8221;.vc_custom_1485762742421{padding-top: 100px !important;padding-right: 35px !important;padding-bottom: 100px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]Canvas background Style 2\u00a0is applied to the row.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;20&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; bg_check=&#8221;row-background-dark&#8221; dfd_bg_style=&#8221;canvas&#8221; dfd_canvas_style=&#8221;style_3&#8243; dfd_bg_color_value=&#8221;#353535&#8243;][vc_column css=&#8221;.vc_custom_1485762742421{padding-top: 100px !important;padding-right: 35px !important;padding-bottom: 100px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]Canvas background Style 3\u00a0is applied to the row.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]<\/p>\n<h5>Gradient background style<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-2490\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Gradient.jpg\" alt=\"\" width=\"978\" height=\"428\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Gradient.jpg 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Gradient-300x131.jpg 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Gradient-768x336.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Gradient type<\/strong> &#8211; select what gradient type you want to apply for the row. You may select <strong>horizontal<\/strong>, <strong>vertical<\/strong> or <strong>custom<\/strong> to be able to enter custom direction in degrees.<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; bg_check=&#8221;row-background-dark&#8221; dfd_bg_style=&#8221;gradient&#8221; dfd_bg_grad=&#8221;gradient_style:left|gradient_css:background%3A%20url(data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZ3JhZGllbnQiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojM0I1NEU2OyIgLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0eWxlPSJzdG9wLWNvbG9yOiNGNDIyNjg7IiAvPjwvbGluZWFyR3JhZGllbnQ%2BPC9kZWZzPjxyZWN0IGZpbGw9InVybCgjZ3JhZGllbnQpIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIiAvPjwvc3ZnPg%3D%3D)%3B%0Abackground%3A%20-webkit-gradient(linear%2C%20left%20top%2C%20left%20bottom%2C%20color-stop(0%25%2C%20%233B54E6)%2C%20color-stop(100%25%2C%20%23F42268))%3B%0Abackground%3A%20-moz-linear-gradient(left%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-webkit-linear-gradient(left%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-o-linear-gradient(left%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-ms-linear-gradient(left%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20linear-gradient(left%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B|gradient_value:0%25%20%233B54E6%2C100%25%20%23F42268&#8243;][vc_column css=&#8221;.vc_custom_1485762742421{padding-top: 100px !important;padding-right: 35px !important;padding-bottom: 100px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]Gradient background Horizontal style is applied to the row.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;20&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; bg_check=&#8221;row-background-dark&#8221; dfd_bg_style=&#8221;gradient&#8221; dfd_bg_grad=&#8221;gradient_style:top|gradient_css:background%3A%20url(data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZ3JhZGllbnQiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojM0I1NEU2OyIgLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0eWxlPSJzdG9wLWNvbG9yOiNGNDIyNjg7IiAvPjwvbGluZWFyR3JhZGllbnQ%2BPC9kZWZzPjxyZWN0IGZpbGw9InVybCgjZ3JhZGllbnQpIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIiAvPjwvc3ZnPg%3D%3D)%3B%0Abackground%3A%20-webkit-gradient(linear%2C%20left%20top%2C%20left%20bottom%2C%20color-stop(0%25%2C%20%233B54E6)%2C%20color-stop(100%25%2C%20%23F42268))%3B%0Abackground%3A%20-moz-linear-gradient(top%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-webkit-linear-gradient(top%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-o-linear-gradient(top%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-ms-linear-gradient(top%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20linear-gradient(top%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B|gradient_value:0%25%20%233B54E6%2C100%25%20%23F42268&#8243;][vc_column css=&#8221;.vc_custom_1485762742421{padding-top: 100px !important;padding-right: 35px !important;padding-bottom: 100px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]Gradient background Vertical style is applied to the row.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;20&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; bg_check=&#8221;row-background-dark&#8221; dfd_bg_style=&#8221;gradient&#8221; dfd_bg_grad=&#8221;gradient_style:custom|gradient_custom_direction:45|gradient_css:background%3A%20url(data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZ3JhZGllbnQiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojM0I1NEU2OyIgLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0eWxlPSJzdG9wLWNvbG9yOiNGNDIyNjg7IiAvPjwvbGluZWFyR3JhZGllbnQ%2BPC9kZWZzPjxyZWN0IGZpbGw9InVybCgjZ3JhZGllbnQpIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIiAvPjwvc3ZnPg%3D%3D)%3B%0Abackground%3A%20-webkit-gradient(linear%2C%20left%20top%2C%20left%20bottom%2C%20color-stop(0%25%2C%20%233B54E6)%2C%20color-stop(100%25%2C%20%23F42268))%3B%0Abackground%3A%20-moz-linear-gradient(45deg%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-webkit-linear-gradient(45deg%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-o-linear-gradient(45deg%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-ms-linear-gradient(45deg%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20linear-gradient(45deg%2C%233B54E6%200%25%2C%23F42268%20100%25)%3B|gradient_value:0%25%20%233B54E6%2C100%25%20%23F42268&#8243;][vc_column css=&#8221;.vc_custom_1485762742421{padding-top: 100px !important;padding-right: 35px !important;padding-bottom: 100px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]Gradient background Custom style with 45 degrees angle is applied to the row.<br \/>\nYou may set any angle for the gradient.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;20&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; bg_check=&#8221;row-background-dark&#8221; dfd_bg_style=&#8221;gradient&#8221; dfd_bg_grad=&#8221;gradient_style:custom|gradient_custom_direction:45|gradient_css:background%3A%20url(data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZ3JhZGllbnQiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojMzQ5OERCOyIgLz48c3RvcCBvZmZzZXQ9IjUwJSIgc3R5bGU9InN0b3AtY29sb3I6IzNCNTRFNjsiIC8%2BPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdHlsZT0ic3RvcC1jb2xvcjojRjQyMjY4OyIgLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCBmaWxsPSJ1cmwoI2dyYWRpZW50KSIgaGVpZ2h0PSIxMDAlIiB3aWR0aD0iMTAwJSIgLz48L3N2Zz4%3D)%3B%0Abackground%3A%20-webkit-gradient(linear%2C%20left%20top%2C%20left%20bottom%2C%20color-stop(0%25%2C%20%233498DB)%2C%20color-stop(50%25%2C%20%233B54E6)%2C%20color-stop(100%25%2C%20%23F42268))%3B%0Abackground%3A%20-moz-linear-gradient(45deg%2C%233498DB%200%25%2C%233B54E6%2050%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-webkit-linear-gradient(45deg%2C%233498DB%200%25%2C%233B54E6%2050%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-o-linear-gradient(45deg%2C%233498DB%200%25%2C%233B54E6%2050%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20-ms-linear-gradient(45deg%2C%233498DB%200%25%2C%233B54E6%2050%25%2C%23F42268%20100%25)%3B%0Abackground%3A%20linear-gradient(45deg%2C%233498DB%200%25%2C%233B54E6%2050%25%2C%23F42268%20100%25)%3B|gradient_value:0%25%20%233498DB%2C50%25%20%233B54E6%2C100%25%20%23F42268&#8243;][vc_column css=&#8221;.vc_custom_1485762742421{padding-top: 100px !important;padding-right: 35px !important;padding-bottom: 100px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]Gradient background Custom style with 45 degrees angle is applied to the row.<br \/>\nYou may also add multiple colors to the gradient. It&#8217;s light blue, dark blue and pink in the example.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;0&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<h5>Image background style<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-2492\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/image-bg.jpg\" alt=\"\" width=\"978\" height=\"880\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/image-bg.jpg 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/image-bg-300x270.jpg 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/image-bg-768x691.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Parallax style<\/strong> &#8211; choose the parallax style you would like to have for the background image. The following variants are available:\n<ul>\n<li><strong>Simple background image<\/strong> &#8211; no parallax effect is applied to the image.<\/li>\n<li><strong>Auto moving background<\/strong> &#8211; select this style to have the auto moving image on the row background.\n<ul>\n<li><strong>Background image<\/strong> &#8211; upload the image from the media library to be set as the\u00a0background image for the row.<\/li>\n<li><strong>Background color<\/strong> &#8211;\u00a0choose the\u00a0background color for the row.<\/li>\n<li><strong>Scroll effect<\/strong> &#8211; choose scroll effect for the image. It can be <strong>fixed<\/strong> or<strong> scroll with the content<\/strong>.<\/li>\n<li><strong>Parallax speed<\/strong> &#8211; control the speed of parallax. Values from 1 to 100 are acceptable.<\/li>\n<li><strong>Animation direction<\/strong> &#8211; \u0441hoose the animation direction for your moving parallax. <strong>To right, to left, to bottom, to top<\/strong> options are available.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; dfd_bg_style=&#8221;image&#8221; dfd_parallax_style=&#8221;dfd_animated_bg&#8221; dfd_bg_image_new=&#8221;11362&#8243; dfd_image_bg_color=&#8221;#ffffff&#8221; dfd_parallax_sense=&#8221;50&#8243; dfd_animation_direction=&#8221;left&#8221;][vc_column css=&#8221;.vc_custom_1485767384332{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;580&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<ul>\n<li class=\"first-before-hide\">\n<ul>\n<li><strong>Horizontal parallax on scroll<\/strong> &#8211; the background will move horizontally while scroll.\n<ul>\n<li><strong>Background image<\/strong> &#8211; upload the image from the media library to be set as the\u00a0background image for the row.<\/li>\n<li><strong>Background image repeat<\/strong> &#8211; select the repeat for the selected image. You can select <strong>vertical<\/strong>, <strong>horizontal<\/strong>,<strong> repeat in both directions<\/strong> or <strong>disable<\/strong> repeat for the image.<\/li>\n<li><strong>Scroll effect<\/strong> &#8211; choose scroll effect for the image. It can be <strong>fixed<\/strong> or<strong> scroll with the content<\/strong>.<\/li>\n<li><strong>Background image size<\/strong> &#8211;\u00a0select the background-attachment for the image. <strong>Cover<\/strong>, <strong>contain<\/strong> and <strong>initial<\/strong> values are available.<\/li>\n<li><strong>Background color<\/strong> &#8211;\u00a0choose the\u00a0background color for the row.<\/li>\n<li><strong>Scroll effect<\/strong> &#8211; choose scroll effect for the image. It can be <strong>fixed<\/strong> or<strong> scroll with the content<\/strong>.<\/li>\n<li><strong>Parallax speed<\/strong> &#8211; control the speed of parallax. Values from 1 to 100 are acceptable.<\/li>\n<li><strong>Parallax offset<\/strong>\u00a0&#8211; specify the parallax start offset value. Enter a\u00a0value between -500 to 500.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; dfd_bg_style=&#8221;image&#8221; dfd_parallax_style=&#8221;dfd_horizontal_parallax&#8221; dfd_bg_image_new=&#8221;11431&#8243; dfd_bg_image_size=&#8221;initial&#8221;][vc_column css=&#8221;.vc_custom_1485767982452{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;580&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<ul>\n<li class=\"first-before-hide\">\n<ul>\n<li><strong>Vertical parallax on scroll<\/strong> &#8211; set the parallax background while scrolling the layout.\n<ul>\n<li><strong>Background image<\/strong> &#8211; upload the image from the media library to be set as the\u00a0background image for the row.<\/li>\n<li><strong>Background image repeat<\/strong> &#8211; select the repeat for the selected image. You can select <strong>vertical<\/strong>, <strong>horizontal<\/strong>,<strong> repeat in both directions<\/strong> or <strong>disable<\/strong> repeat for the image.<\/li>\n<li><strong>Scroll effect<\/strong> &#8211; choose scroll effect for the image. It can be <strong>fixed<\/strong> or<strong> scroll with the content<\/strong>.<\/li>\n<li><strong>Background image size<\/strong> &#8211;\u00a0select the background-attachment for the image. <strong>Cover<\/strong>, <strong>contain<\/strong> and <strong>initial<\/strong> values are available.<\/li>\n<li><strong>Background color<\/strong> &#8211;\u00a0choose the\u00a0background color for the row.<\/li>\n<li><strong>Scroll effect<\/strong> &#8211; choose scroll effect for the image. It can be <strong>fixed<\/strong> or<strong> scroll with the content<\/strong>.<\/li>\n<li><strong>Parallax speed<\/strong> &#8211; control the speed of parallax. Values from 1 to 100 are acceptable.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; dfd_bg_style=&#8221;image&#8221; dfd_parallax_style=&#8221;dfd_vertical_parallax&#8221; dfd_bg_image_new=&#8221;11392&#8243; dfd_bg_image_size=&#8221;initial&#8221; dfd_parallax_sense=&#8221;50&#8243;][vc_column css=&#8221;.vc_custom_1485769830878{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;580&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<ul>\n<li class=\"first-before-hide\">\n<ul>\n<li><strong>Interactive parallax on mouse move<\/strong> &#8211; the images added will be displayed as layers creating one image with parallax effect following the mouse cursor.\n<ul>\n<li><strong>Layer images<\/strong> &#8211; upload or select background images from media gallery. To achieve the\u00a0best effect, we&#8217;d recommend you to use images of different size and bigger than the row size.<\/li>\n<li><strong>Background color<\/strong> &#8211;\u00a0allows you to choose the\u00a0background color for the row.<\/li>\n<li><strong>Parallax speed<\/strong> &#8211; control the speed of parallax. Values from 1 to 100 are acceptable.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; dfd_bg_style=&#8221;image&#8221; dfd_parallax_style=&#8221;dfd_mousemove_parallax&#8221; dfd_layer_image=&#8221;11464,11459&#8243;][vc_column css=&#8221;.vc_custom_1485779110280{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;580&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<ul>\n<li class=\"first-before-hide\">\n<ul>\n<li><strong>Multilayer vertical parallax<\/strong>\u00a0&#8211; select this type to have the images be displayed in layers with parallax on scroll.\n<ul>\n<li><strong>Layer images<\/strong> &#8211; upload or select background images from media gallery.<\/li>\n<li><strong>Background color<\/strong> &#8211;\u00a0allows you to choose the\u00a0background color for the row.<\/li>\n<li><strong>Parallax speed<\/strong> &#8211; control the speed of parallax. Values from 1 to 100 are acceptable.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; dfd_bg_style=&#8221;image&#8221; dfd_parallax_style=&#8221;dfd_multi_parallax&#8221; dfd_layer_image=&#8221;11473,11474,11475&#8243;][vc_column css=&#8221;.vc_custom_1485781488859{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;580&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<h5>Mobile background settings<\/h5>\n<h6>Available if Simple Background Image style is selected.<\/h6>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13755\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/mobile-background-settings.png\" alt=\"\" width=\"978\" height=\"557\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/mobile-background-settings.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/mobile-background-settings-300x171.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/mobile-background-settings-768x437.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Mobile background image<\/strong> &#8211; upload the image from the media library to be set as the\u00a0background image for the row on mobile devices. For <strong>Simple background image, Auto moving background, Vertical and Horizontal parallax styles<\/strong> only.<\/li>\n<li><strong>Mobile background screen resolution<\/strong> &#8211; allows you to specify screen resolution to apply settings from. Set the value in pixels. For <strong>Simple background image style<\/strong> only.<\/li>\n<li><strong>Mobile background image position<\/strong> &#8211; set the background image position on mobile devices. For <strong>Simple background image style<\/strong> only.<\/li>\n<li><strong>Mobile background image size<\/strong> &#8211; allows you to choose the image size on mobile devices. <strong>Initial<\/strong>, <strong>cover<\/strong>, <strong>contain<\/strong> and <strong>inherit from large<\/strong> variants are available. or <strong>Simple background image, Vertical and Horizontal parallax styles<\/strong> only.<\/li>\n<\/ul>\n<h5>Video background style<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13756\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/video-mobile-background-settings.png\" alt=\"\" width=\"978\" height=\"742\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/video-mobile-background-settings.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/video-mobile-background-settings-300x228.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/video-mobile-background-settings-768x583.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Video source<\/strong> &#8211; select the source of the video to be displayed as the background for the row.\n<ul>\n<li><strong>Self hosted<\/strong> &#8211; select this source if you need to upload the video from the\u00a0media library.\n<ul>\n<li><strong>Video in mp4 format<\/strong> &#8211; add the link to your video in mp4 format.<\/li>\n<li><strong>Video in webm\/ogg format<\/strong> &#8211; add the link to your video in WebM \/ Ogg format.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Youtube<\/strong> &#8211;\u00a0select this source if you need to upload the video from youtube.\n<ul>\n<li><strong>Youtube video ID<\/strong> &#8211; add the video ID. Look at the URL of that page, and at the end of it, you should see a combination of numbers and letters after an equal sign (=).<\/li>\n<\/ul>\n<\/li>\n<li><strong>Vimeo<\/strong> &#8211; select this type if you need to use the video for the row background\u00a0from Vimeo.\n<ul>\n<li><strong>Vimeo video ID<\/strong> &#8211; add the video ID. Copy the numeric code that appears at the end of its URL at the top of your browser window.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<li><strong>Extra options<\/strong>\u00a0&#8211; put the check marks in the corresponding fields to <strong>Loop<\/strong> the video or make it <strong>Muted<\/strong>.<\/li>\n<li><strong>Place holder image<\/strong> &#8211; upload the image to be displayed\u00a0in case background video is restricted. For example, on mobiles.<\/li>\n<\/ul>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; dfd_bg_style=&#8221;video&#8221; dfd_video_variant=&#8221;vimeo&#8221; dfd_vimeo_video_id=&#8221;134831602&#8243; dfd_video_opts=&#8221;loop,muted&#8221; dfd_video_poster=&#8221;11426&#8243;][vc_column css=&#8221;.vc_custom_1485781822111{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;580&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485528007218{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][vc_column_text]<\/p>\n<h5>Overlay settings<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13758\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/overlay.png\" alt=\"\" width=\"978\" height=\"587\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/overlay.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/overlay-300x180.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/overlay-768x461.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Overlay<\/strong> &#8211; set it to <strong>Enable\u00a0<\/strong>to add\u00a0the overlay for the row.<\/li>\n<li><strong>Color<\/strong> &#8211; choose the color for the overlay.<\/li>\n<li><strong>Pattern<\/strong> &#8211; select the most suitable the pattern for the overlay from the list of available ones.<\/li>\n<li><strong>Pattern opacity<\/strong> &#8211;\u00a0control the pattern&#8217;s opacity for the overlay. Enter value between 0 to 100 (0 is transparent).<\/li>\n<li><strong>Pattern size<\/strong> &#8211; specify the pattern&#8217;s size for the overlay.<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row el_class=&#8221;z-index-two&#8221; dfd_bg_style=&#8221;video&#8221; dfd_video_url_mp4=&#8221;http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/Mountains-7418.mp4&#8243; dfd_video_opts=&#8221;loop,muted&#8221; dfd_video_poster=&#8221;11425&#8243; dfd_enable_controls=&#8221;&#8221; dfd_enable_overlay=&#8221;yes&#8221; dfd_overlay_color=&#8221;#3b55e6&#8243; dfd_overlay_pattern=&#8221;09.png&#8221; dfd_overlay_pattern_opacity=&#8221;50&#8243;][vc_column css=&#8221;.vc_custom_1485781822111{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;580&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485527813236{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]More details about the <strong>Row Responsive options<\/strong> can be found in <a href=\"http:\/\/rnbtheme.com\/documentation\/visual-composer\/row-responsive-options\" target=\"_blank\" rel=\"noopener noreferrer\">this post<\/a>.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][\/vc_row]<\/p>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>Create a page, select the needed page template (we\u2019d recommend you to use For Page Builder page template to build a page with VC elements) and navigate to the Visual Composer section.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[5],"tags":[32,31,33],"_links":{"self":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts\/11301"}],"collection":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/comments?post=11301"}],"version-history":[{"count":117,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts\/11301\/revisions"}],"predecessor-version":[{"id":14650,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts\/11301\/revisions\/14650"}],"wp:attachment":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/media?parent=11301"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/categories?post=11301"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/tags?post=11301"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}