body,.et_pb_column_1_2 .et_quote_content blockquote cite,.et_pb_column_1_2 .et_link_content a.et_link_main_url,.et_pb_column_1_3 .et_quote_content blockquote cite,.et_pb_column_3_8 .et_quote_content blockquote cite,.et_pb_column_1_4 .et_quote_content blockquote cite,.et_pb_blog_grid .et_quote_content blockquote cite,.et_pb_column_1_3 .et_link_content a.et_link_main_url,.et_pb_column_3_8 .et_link_content a.et_link_main_url,.et_pb_column_1_4 .et_link_content a.et_link_main_url,.et_pb_blog_grid .et_link_content a.et_link_main_url,body .et_pb_bg_layout_light .et_pb_post p,body .et_pb_bg_layout_dark .et_pb_post p{font-size:14px}.et_pb_slide_content,.et_pb_best_value{font-size:15px}@media only screen and (min-width:1350px){.et_pb_row{padding:27px 0}.et_pb_section{padding:54px 0}.single.et_pb_pagebuilder_layout.et_full_width_page .et_post_meta_wrapper{padding-top:81px}.et_pb_fullwidth_section{padding:0}}@media only screen and (max-width:980px){.four-columns .et_pb_column{width:25%!important}}`
What is this code doing? The @media only screen and (max-width:980px) is dictating that when the viewport is less than 980 pixels,to display the 4 columns side-by-side and not stacked. 980 pixels is the dimension that typically is the breakpoint for tablets.
#bbpress-forums li.bbp-header{background:#eaeaea00}#bbpress-forums ul.bbp-forums,#bbpress-forums ul.bbp-lead-topic,#bbpress-forums ul.bbp-replies,#bbpress-forums ul.bbp-search-results,#bbpress-forums ul.bbp-topics{font-size:12px;overflow:hidden;border:1px solid #eeeeee00;margin-bottom:20px;clear:both}.bbp-pagination-count{float:left;border:1px solid transparent;color:#00000000}