{"id":11138,"date":"2017-01-09T14:33:56","date_gmt":"2017-01-09T14:33:56","guid":{"rendered":"http:\/\/rnbtheme.com\/documentation\/?p=11138"},"modified":"2017-08-31T09:00:03","modified_gmt":"2017-08-31T09:00:03","slug":"column-options","status":"publish","type":"post","link":"https:\/\/rnbtheme.com\/documentation\/wpbackery\/column-options","title":{"rendered":"Column Options"},"content":{"rendered":"<section class=\"wpb-content-wrapper\"><p>[vc_row][vc_column css=&#8221;.vc_custom_1485959753312{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]The columns are alwsays added inside the rows. You may find more information about Row in <a href=\"http:\/\/rnbtheme.com\/documentation\/visual-composer\/row-options\" target=\"_blank\" rel=\"noopener\">this post<\/a>\u00a0and 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\">this post<\/a>.\u00a0of the theme documentation.<\/p>\n<p>After you create a row, you may divide it into columns to structure the content. Find the columns icon in the top left corner of the row and divide the row into the preset columns. You may also select Custom columns settings and insert the needed values.<\/p>\n<p>You may use fractions or span tags to specify columns. Note, the page consists of 12 columns &#8211; keep that in mind while dividing the row.<\/p>\n<p>As an example, you may divide the row into 4 columns with 1st and 3rd smaller ones using such division: span2 + span4 + span2 + span4 or 1\/6 + 1\/3 + 1\/6 + 1\/3.<\/p>\n<p>Similarly, you may divide the row into 5 equal columns. However, you&#8217;ll have to set 1 column as left and right paddings: span1 + span2 + span2 + span2 + span2 + span2 + span1 or 1\/12 + 1\/6 + 1\/6 + 1\/6 + 1\/6 + 1\/6 + 1\/12.[\/vc_column_text][vc_column_text]<\/p>\n<h5>Default 12 columns grid<\/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; mobile_destroy_equal_heights=&#8221;&#8221;][vc_column][vc_row_inner][vc_column_inner width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485436777539{background-color: #fafafa !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;][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column_inner][vc_column_inner width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485436790621{background-color: #f2f2f2 !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485436802372{background-color: #ededed !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485436820659{background-color: #e7e7e7 !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485436833996{background-color: #e0e0e0 !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485436848185{background-color: #d8d8d8 !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner el_class=&#8221;dfd-background-dark&#8221; width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485437659428{background-color: #d1d1d1 !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner el_class=&#8221;dfd-background-dark&#8221; width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485437686139{background-color: #cccccc !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner el_class=&#8221;dfd-background-dark&#8221; width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485437692085{background-color: #c4c4c4 !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner el_class=&#8221;dfd-background-dark&#8221; width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485437696566{background-color: #bcbcbc !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner el_class=&#8221;dfd-background-dark&#8221; width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485437701076{background-color: #b5b5b5 !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner el_class=&#8221;dfd-background-dark&#8221; width=&#8221;1\/12&#8243; css=&#8221;.vc_custom_1485437651154{background-color: #afafaf !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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row force_equal_height_columns=&#8221;main_row&#8221; mobile_destroy_equal_heights=&#8221;&#8221;][vc_column 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_1485532583710{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221;][vc_column_text]<\/p>\n<h5>4 columns with smaller 1st and 3rd 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; mobile_destroy_equal_heights=&#8221;&#8221;][vc_column][vc_row_inner][vc_column_inner width=&#8221;1\/6&#8243; css=&#8221;.vc_custom_1485438417179{background-color: #f2f2f2 !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;][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<p style=\"text-align: center;\">1\/6 or span\u00a02<\/p>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column_inner][vc_column_inner width=&#8221;1\/3&#8243; css=&#8221;.vc_custom_1485438431858{background-color: #ededed !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]<\/p>\n<p style=\"text-align: center;\">1\/3 or span\u00a04<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/6&#8243; css=&#8221;.vc_custom_1485438560459{background-color: #e7e7e7 !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]<\/p>\n<p style=\"text-align: center;\">1\/6 or span\u00a02<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/3&#8243; css=&#8221;.vc_custom_1485438576169{background-color: #e0e0e0 !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]<\/p>\n<p style=\"text-align: center;\">1\/3 or span\u00a04<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row force_equal_height_columns=&#8221;main_row&#8221; mobile_destroy_equal_heights=&#8221;&#8221;][vc_column 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_1485532592684{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221;][vc_column_text]<\/p>\n<h5>5\u00a0columns with\u00a0side paddings<\/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; mobile_destroy_equal_heights=&#8221;&#8221;][vc_column 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_1485532600062{background-color: #ffffff !important;}&#8221;][vc_row_inner][vc_column_inner width=&#8221;1\/12&#8243; 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;][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column_inner][vc_column_inner width=&#8221;1\/6&#8243; css=&#8221;.vc_custom_1485436790621{background-color: #f2f2f2 !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]<\/p>\n<p style=\"text-align: center;\">1\/6 or span\u00a02<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/6&#8243; css=&#8221;.vc_custom_1485436802372{background-color: #ededed !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]<\/p>\n<p style=\"text-align: center;\">1\/6 or span\u00a02<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/6&#8243; css=&#8221;.vc_custom_1485436820659{background-color: #e7e7e7 !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]<\/p>\n<p style=\"text-align: center;\">1\/6 or span\u00a02<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/6&#8243; css=&#8221;.vc_custom_1485436833996{background-color: #e0e0e0 !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]<\/p>\n<p style=\"text-align: center;\">1\/6 or span\u00a02<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/6&#8243; css=&#8221;.vc_custom_1485436848185{background-color: #d8d8d8 !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]<\/p>\n<p style=\"text-align: center;\">1\/6 or span\u00a02<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/12&#8243; 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]<\/p>\n<p style=\"text-align: center;\">1\/12 or span 1<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row force_equal_height_columns=&#8221;main_row&#8221; mobile_destroy_equal_heights=&#8221;&#8221;][vc_column 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_1485504663587{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;50&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]After you create a column, you may proceed to its customization. Click on the <strong>Edit<\/strong> column button at the top of it to open the settings.<\/p>\n<h3>General settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13746\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/columns.png\" alt=\"\" width=\"978\" height=\"561\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/columns.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/columns-300x172.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/columns-768x441.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<h5>Main column settings<\/h5>\n<ul>\n<li><strong>Column background style<\/strong> &#8211; choose the background style for the column. 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>Content parallax effect<\/strong> &#8211; switch it to Enable to have the parallax effect for the content.\n<ul>\n<li><strong>Parallax speed<\/strong> &#8211; control the speed of parallax. Values from 1 to 100 are acceptable.<\/li>\n<li><strong>Parallax limit<\/strong> &#8211; set\u00a0the parallax shift limit. Values from 50 to 400 are acceptable. Units should be set in px.<\/li>\n<li><strong>Resolution to disable parallax<\/strong> &#8211; set the width of the device from which the parallax should be deactivated.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][vc_column_text]<\/p>\n<h5>Column background style and Parallax effect<\/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\/3&#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_1485440758139{padding-right: 20px !important;padding-left: 20px !important;background-color: #f2f2f2 !important;}&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;90&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]Column with <strong>Light Background style<\/strong><\/p>\n<p>Text color is dark by default and it&#8217;s properly visible on light background. <span style=\"color: #3498db;\">Custom text color can be applied to the text.<\/span>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;90&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][vc_column column_bg_check=&#8221;column-background-dark&#8221; width=&#8221;1\/3&#8243; css=&#8221;.vc_custom_1485523695366{padding-right: 20px !important;padding-left: 20px !important;background-color: #3c3c3c !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;90&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]Column with <strong style=\"color: #ffffff;\">Dark\u00a0Background style<\/strong><\/p>\n<p>Text color is changed to white so that it could be properly visible on dark background. <span style=\"color: #3498db;\">Custom text color isn&#8217;t changed to white.<\/span>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;90&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][vc_column column_parallax_sense=&#8221;40&#8243; column_parallax_limit=&#8221;50&#8243; width=&#8221;1\/3&#8243; css=&#8221;.vc_custom_1485440776220{padding-right: 20px !important;padding-left: 20px !important;background-color: #e0e0e0 !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; column_parallax=&#8221;dfd-column-parallax&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;90&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]Column with <strong>Content parallax effect<\/strong><\/p>\n<p>The column and is content slide up and down while one is scrolling the page. Parallax speed and vertical shift limit can be set in the options.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;90&#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; mobile_destroy_equal_heights=&#8221;&#8221;][vc_column 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_1485504991747{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221;][vc_column_text]<\/p>\n<h5>Extra features<\/h5>\n<ul>\n<li><strong>Custom CSS class<\/strong>\u00a0\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\u00a0<strong>custom-style\u00a0<\/strong>class and then go to\u00a0<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>\u00a0<del>Custom CSS<\/del>\u00a0field and write your own CSS code with this class to get your own style.<\/li>\n<\/ul>\n<h3>Design settings<\/h3>\n<h4>Add any margin, border, and padding for the column. 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\" sizes=\"(max-width: 978px) 100vw, 978px\" srcset=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/design-settings.jpg 978w, http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/design-settings-300x186.jpg 300w, http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/design-settings-768x476.jpg 768w\" alt=\"\" width=\"978\" height=\"606\" \/><\/p>\n<ul>\n<li><strong>Margin<\/strong> \u2013 enter the needed value for the margins, negative values and percents can be accepted.<\/li>\n<li><strong>Border<\/strong> \u2013 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> \u2013 select the color for the border.<\/li>\n<li><strong>Border style<\/strong> \u2013 select the style of the border \u2013 solid, dotted, etc.<\/li>\n<li><strong>Border radius<\/strong> \u2013 set the value for border radius to have rounded corners of the border.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Padding<\/strong> \u2013 enter the needed values for the element\u2019s padding.<\/li>\n<li><strong>Background<\/strong> \u2013 select the color of the column.\n<ul>\n<li><strong>Image<\/strong> \u2013 select the image to be set as the column background.<\/li>\n<li><strong>Background attachment<\/strong> (in the\u00a0drop-down list) \u2013 select the background-attachment for the image.\n<ul>\n<li><strong>Theme defaults<\/strong> \u2013 the default image position \u2013 the full size aligned top left.<\/li>\n<li><strong>Cover<\/strong> \u2013 the image will fit it\u2019s container: it\u2019ll 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> \u2013 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 column.<\/li>\n<li><strong>Repeat<\/strong> \u2013 the image will be repeated and create a pattern.<\/li>\n<li><strong>No Repeat<\/strong> \u2013 the image will be inserted full width, aligned top left, and with no repeat.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<li><strong>Box controls<\/strong> \u2013 set it to <strong>Enable\u00a0<\/strong>in case you want to set the same margins\/borders\/paddings for all four sides of the column. It\u2019ll save our time, as the inserted value will be applied to the top, right, bottom and left elements.<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_column][\/vc_row][vc_row force_equal_height_columns=&#8221;main_row&#8221; mobile_destroy_equal_heights=&#8221;&#8221; anchor=&#8221;margin-border-padding&#8221;][vc_column 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_1485504991747{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221;][vc_column_text]<\/p>\n<h5>Margin, border and padding<\/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 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_1485521370636{padding-right: 0px !important;padding-left: 0px !important;background-color: #3498db !important;}&#8221;][vc_row_inner css=&#8221;.vc_custom_1485521573079{margin-top: 50px !important;margin-right: 60px !important;margin-bottom: 50px !important;margin-left: 60px !important;padding-right: 0px !important;padding-left: 0px !important;}&#8221;][vc_column_inner css=&#8221;.vc_custom_1485521563415{border-top-width: 50px !important;border-right-width: 50px !important;border-bottom-width: 50px !important;border-left-width: 50px !important;padding-top: 50px !important;padding-right: 50px !important;padding-bottom: 50px !important;padding-left: 50px !important;background-color: #ffffff !important;border-left-color: #3b55e6 !important;border-left-style: solid !important;border-right-color: #3b55e6 !important;border-right-style: solid !important;border-top-color: #3b55e6 !important;border-top-style: solid !important;border-bottom-color: #3b55e6 !important;border-bottom-style: solid !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 css=&#8221;.vc_custom_1485522019898{padding-top: 100px !important;padding-right: 50px !important;padding-bottom: 100px !important;padding-left: 50px !important;background-color: #e3e3e3 !important;}&#8221;]<\/p>\n<p style=\"text-align: center;\"><strong>Margin<\/strong> is a space between the element and its container. It&#8217;s <span style=\"color: #3498db;\">blue<\/span> in the example. In this case, margin is set for the inner row (and it indicates the space to the containing column).<\/p>\n<p style=\"text-align: center;\"><strong>Border<\/strong> is a frame of the column. It&#8217;s <span style=\"color: #3b55e6;\">dark blue<\/span>\u00a0in the example.<\/p>\n<p style=\"text-align: center;\"><strong>Padding<\/strong> is an inner space in the column &#8211; from the border to the content. It&#8217;s <span style=\"color: #ffffff; background-color: #353535;\">\u00a0white\u00a0<\/span> in the example.<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row force_equal_height_columns=&#8221;main_row&#8221; mobile_destroy_equal_heights=&#8221;&#8221; anchor=&#8221;bg-image-position&#8221;][vc_column 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_1485508329988{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221;][vc_column_text]<\/p>\n<h5>Background image position<br \/>\nTheme default, Cover and Contain<\/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 column_bg_check=&#8221;column-background-dark&#8221; width=&#8221;1\/3&#8243; cus_bg_position=&#8221;center center&#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; css=&#8221;.vc_custom_1485942886487{padding-right: 30px !important;padding-left: 30px !important;background-image: url(http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/08\/col-big.jpg?id=11612) !important;}&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text css=&#8221;.vc_custom_1485870386818{padding-top: 20px !important;padding-right: 20px !important;padding-bottom: 20px !important;padding-left: 20px !important;background-color: rgba(0,0,0,0.4) !important;*background-color: rgb(0,0,0) !important;}&#8221;]Background image is bigger than the column.<\/p>\n<p><strong style=\"color: #ffffff;\">Theme default<\/strong> style displays the image at its original size. You can set the background image position within a certain option. It&#8217;s set to <strong style=\"color: #ffffff;\">center center<\/strong> in this example.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][vc_column column_bg_check=&#8221;column-background-dark&#8221; width=&#8221;1\/3&#8243; css=&#8221;.vc_custom_1485942903454{padding-right: 30px !important;padding-left: 30px !important;background-image: url(http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/08\/col-big.jpg?id=11612) !important;background-position: center !important;background-repeat: no-repeat !important;background-size: cover !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;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text css=&#8221;.vc_custom_1485870374596{padding-top: 20px !important;padding-right: 20px !important;padding-bottom: 20px !important;padding-left: 20px !important;background-color: rgba(0,0,0,0.4) !important;*background-color: rgb(0,0,0) !important;}&#8221;]Background image is bigger than the column.<\/p>\n<p><strong style=\"color: #ffffff;\">Cover<\/strong>\u00a0style shrinks the image so that its smaller side fits the column size, i.e., it covers the column background completely.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][vc_column column_bg_check=&#8221;column-background-dark&#8221; width=&#8221;1\/3&#8243; css=&#8221;.vc_custom_1485942921781{padding-right: 30px !important;padding-left: 30px !important;background: #ffffff url(http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/08\/col-big.jpg?id=11612) !important;background-position: center !important;background-repeat: no-repeat !important;background-size: contain !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;40&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text css=&#8221;.vc_custom_1485870422538{padding-top: 20px !important;padding-right: 20px !important;padding-bottom: 20px !important;padding-left: 20px !important;background-color: rgba(0,0,0,0.4) !important;*background-color: rgb(0,0,0) !important;}&#8221;]Background image is bigger than the column.<\/p>\n<p><strong style=\"color: #ffffff;\">Contain<\/strong>\u00a0style shrinks the image so that it&#8217;s largest side fits the column size, i.e., it may leave gaps in the column background.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;40&#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; mobile_destroy_equal_heights=&#8221;&#8221;][vc_column 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_1485508338285{padding-right: 35px !important;padding-left: 35px !important;background-color: #ffffff !important;}&#8221;][vc_column_text]<\/p>\n<h5>Background image position<br \/>\nNo Repeat and Repeat<\/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 column_bg_check=&#8221;column-background-dark&#8221; width=&#8221;1\/2&#8243; cus_bg_position=&#8221;center center&#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; css=&#8221;.vc_custom_1485942938854{padding-right: 30px !important;padding-left: 30px !important;background: #ffffff url(http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/08\/col-small.jpg?id=11613) !important;background-position: 0 0 !important;background-repeat: no-repeat !important;}&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;60&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text css=&#8221;.vc_custom_1485871740327{padding-top: 20px !important;padding-right: 20px !important;padding-bottom: 20px !important;padding-left: 20px !important;background-color: rgba(0,0,0,0.4) !important;*background-color: rgb(0,0,0) !important;}&#8221;]Background image is smaller than the column.<\/p>\n<p><strong style=\"color: #ffffff;\">No Repeat<\/strong>\u00a0style displays the image at its original size and it won&#8217;t be duplicated to fill the column background. You can set the background image position within a certain option. It&#8217;s set to <strong style=\"color: #ffffff;\">center center<\/strong> in this example.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;60&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][\/vc_column][vc_column column_bg_check=&#8221;column-background-dark&#8221; width=&#8221;1\/2&#8243; cus_bg_position=&#8221;center center&#8221; css=&#8221;.vc_custom_1485942954911{padding-right: 30px !important;padding-left: 30px !important;background: #ffffff url(http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/08\/col-small.jpg?id=11613) !important;background-position: 0 0 !important;background-repeat: repeat !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;60&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text css=&#8221;.vc_custom_1485871754912{padding-top: 20px !important;padding-right: 20px !important;padding-bottom: 20px !important;padding-left: 20px !important;background-color: rgba(0,0,0,0.4) !important;*background-color: rgb(0,0,0) !important;}&#8221;]Background image is smaller than the column.<\/p>\n<p><strong style=\"color: #ffffff;\">Repeat<\/strong>\u00a0style displays the image at its original size and it duplicates to fill the column background. You can set the background image position within a certain option. It&#8217;s set to <strong style=\"color: #ffffff;\">center center<\/strong> in this example.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;60&#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_1485436211347{padding-right: 25px !important;padding-left: 25px !important;}&#8221;][vc_column css=&#8221;.vc_custom_1485506501300{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>Responsive options<\/h5>\n<h4>You may check more information in the official Visual Composer tutorials. Please, check <a href=\"https:\/\/vc.wpbakery.com\/video-academy\/responsive-column-control-width-offset-param-usage-explained\/\">this video<\/a> on the Responsive Controls for Width and Offset.<\/h4>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-10680\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/column-responsive-1.jpg\" alt=\"\" width=\"978\" height=\"622\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/column-responsive-1.jpg 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/column-responsive-1-300x191.jpg 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/column-responsive-1-768x488.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Width<\/strong> &#8211; set the column width from the list of the available options.<\/li>\n<\/ul>\n<h5>Responsiveness<\/h5>\n<h6>Adjust column for different screen sizes. Control width, offset and visibility settings.<br \/>\nDevice allows you to set different column behavior on different screen sizes:<\/h6>\n<ul>\n<li><strong>Large<\/strong> &#8211; for screen sizes bigger than 1280px.<\/li>\n<li><strong>Medium<\/strong> &#8211; for screen sizes from 1280px to 1024px.<\/li>\n<li><strong>Small<\/strong> &#8211; for screen sizes from 1024px to 800px.<\/li>\n<li><strong>Extra-small<\/strong> &#8211; for screen sizes smaller than 800px.<\/li>\n<li><strong>Offset<\/strong> &#8211; allows you to set the offset for the column. You may use columns to specify the offset value.<\/li>\n<li><strong>Width<\/strong> &#8211; allows you to set the\u00a0different width for the column on different screen sizes to restructure the content properly.<\/li>\n<li><strong>Hide on device?<\/strong> &#8211; set it to <strong>Enable<\/strong> to hide the elements on certain screen sizes.<\/li>\n<\/ul>\n<h5>Responsive settings<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-10684\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/responsive-2.jpg\" alt=\"\" width=\"978\" height=\"630\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/responsive-2.jpg 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/responsive-2-300x193.jpg 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/01\/responsive-2-768x495.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Responsive options<\/strong>\u00a0\u2013 switch it to <strong>Enable<\/strong> to customize the column settings for different devices.<\/li>\n<li><strong>Desktop<\/strong> \u2013 set the desired margins, borders, and paddings for the column for the screen resolutions from 1280px to 1025px.<\/li>\n<li><strong>Tablet<\/strong> \u2013 set the desired margins, borders, and paddings for the column for the screen resolutions from 1024px to 800px.<\/li>\n<li><strong>Mobile<\/strong> \u2013 set the desired margins, borders, and paddings for the column for the screen resolutions less than 800px.<\/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]<\/p>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>The columns are always added inside the rows. You may find more information about Row in this post and more details about the Row Responsive options can be found in this post. of the theme documentation. Also, more examples can be found following Rows&#038;Columns page.<\/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\/11138"}],"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=11138"}],"version-history":[{"count":179,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts\/11138\/revisions"}],"predecessor-version":[{"id":14066,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts\/11138\/revisions\/14066"}],"wp:attachment":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/media?parent=11138"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/categories?post=11138"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/tags?post=11138"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}