.be-wrap { max-width: 1160px; margin: 0 auto; position: relative; z-index: 2; } .layout-box{ position: relative; width:1280px; margin: 0px auto; box-shadow: 1px 1px 10px rgba(0,0,0,0.4); } /* ====================== Content ====================== */ #page-content.content-single-sidebar{ width:820px; } #left-sidebar, #right-sidebar{ width: 260px; } #left-sidebar, #right-sidebar{ float: left; } .left-sidebar-page #page-content,.dual-sidebar-page #page-content { float: right; } .right-sidebar-page #page-content{ float: left; } #left-sidebar, .right-sidebar-page #page-content { margin-right: 80px; } #left-sidebar, #right-sidebar{ margin-bottom: 50px; } #content { position: static; z-index: 2; } .no-page-builder { padding: 70px 0px; } .page #comments { padding: 50px 0; } /* ====================== Column Block ====================== */ .column-block { float: left; margin-left: 5%; margin-bottom: 60px; } .one-col.column-block { margin-left: 0px; float: none; } .one-third { width:30%; } .one-fourth { width:21.25%; } .one-fifth { width:16%; } .one-half { width:47.5%; } .two-third { width:65%; } .three-fourth { width:73.75%; } .be-no-space .one-third { width:33.33%; } .be-no-space .one-fourth { width: 25%; } .be-no-space .one-fifth { width: 20%; } .be-no-space .one-half { width: 50%; } .be-no-space .two-third { width: 66.68%; } .be-no-space .three-fourth { width: 75%; } .be-no-space { display: table; margin-bottom: 60px; } .be-no-space.zero-bottom { margin-bottom: 0; } .be-no-space .column-block { display: table-cell; margin-left: 0px; float: none; vertical-align: top; } .be-column-pad { padding: 100px 5%; } .one-third.be-column-pad, .one-fourth.be-column-pad, .one-col.be-column-pad, .two-third.be-column-pad, .three-fourth.be-column-pad { padding: 100px 5%; } .one-half.be-column-pad { padding: 100px 15% 100px 5%; } .one-half.be-column-pad:first-child { padding: 100px 5% 100px 15%; } .column-block *:last-child { margin-bottom: 0 !important; } .be-last-child { margin-bottom: 0 !important; } .be-row .column-block:first-child{ margin-left: 0; } .be-row.zero-bottom .column-block { margin-bottom: 0; } .be-section .be-row:last-child .column-block { margin-bottom: 0; } .be-section .be-row:last-child .column-block h1:last-child, .be-section .be-row:last-child .column-block h2:last-child, .be-section .be-row:last-child .column-block h3:last-child, .be-section .be-row:last-child .column-block h4:last-child, .be-section .be-row:last-child .column-block h5:last-child, .be-section .be-row:last-child .column-block h6:last-child { margin-bottom: 0 !important; } .be-section .be-row:not(:last-child) .column-block h1:last-child, .be-section .be-row:not(:last-child) .column-block h2:last-child, .be-section .be-row:not(:last-child) .column-block h3:last-child, .be-section .be-row:not(:last-child) .column-block h4:last-child, .be-section .be-row:not(:last-child) .column-block h5:last-child, .be-section .be-row:not(:last-child) .column-block h6:last-child { margin-bottom: 30px !important; } html body .be-section .be-row .column-block .be-notification *:last-child { margin-bottom: 0px !important; } .two-third .column-block, .three-fourth .column-block { margin-bottom: 0; } /* ==================================== Section Parallax & Video Background ==================================== */ .be-section.be-video-section .be-section-pad, .be-section.be-bg-overlay { position: relative; } .be-section { overflow: hidden; } .be-row { z-index: 3; position: relative; } .be-row.be-no-space { width: 100%; } .be-bg-video { display: none; position: absolute; width: 100%; z-index: 1; top: 0; left: 0; } .be-animate { visibility: hidden; margin-bottom: 30px; } #be-pb-main .be-animate { visibility: visible; } .be-bg-parallax { background-attachment: fixed; } .be-bg-cover { background-size: cover !important; -webkit-background-size:cover !important; -moz-background-size:cover !important; } .be-bg-mousemove-parallax.be-bg-cover { background-size: initial !important; -webkit-background-size: initial !important; -moz-background-size:initial !important; } .section-overlay { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 2; background: #000; opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); } .be-shortcode { margin-bottom: 60px; } html.section-scroll.csstransforms, html.csstransforms body.section-scroll html.csstransforms body.section-scroll #main-wrapper { overflow: hidden; height: 100%; } html.csstransforms body.section-scroll #footer { display: none; } html.csstransforms body.section-scroll #content { opacity: 0; } html.csstransforms body.section-scroll section#content { -webkit-transition: -webkit-transform 800ms ease; -moz-transition: -moz-transform 800ms ease; -o-transition: -o-transform 800ms ease; transition: transform 800ms ease; position: relative; z-index: 9; } .fullscreen-nav-wrap { display: none; } html.csstransforms body.section-scroll .fullscreen-nav-wrap { display: table; height: 100%; position: fixed; bottom: 0px; left: 35px; top: 0px; z-index: 10; } html.csstransforms body.section-scroll.left-header .fullscreen-nav-wrap{ left: auto; right: 35px; } html.csstransforms body.section-scroll .fullscreen-nav-wrap-inner { display: table-cell; zoom: 1; vertical-align: middle; } .fullscreen-nav { margin-bottom: 0px; list-style-type: none; padding: 0px; } .fullscreen-nav-item, .fullscreen-nav-item-hero-section { width: 7px; height: 7px; border: 1px solid #fff; background: transparent; border-radius: 50%; cursor: pointer; margin: 5px 0px 5px 0px; } .fullscreen-nav-item.current-item, .fullscreen-nav-item-hero-section.current-item { background: #fff; } body.section-scroll .be-section * { -webkit-transform: translateZ(0); } @media only screen and (min-width: 1280px) and (max-width: 1360px) { .left-header .sb-slidebar { width: 240px; } .left-header #main-wrapper { margin-left: 240px; } } @media only screen and (min-width: 1280px) and (max-width: 1440px) { .left-header .be-wrap { max-width: 980px; margin: 0 auto; } .left-header #page-content.content-single-sidebar { width:700px; } .left-header #left-sidebar, .left-header #right-sidebar { width:220px; } .left-header #left-sidebar, .left-header .right-sidebar-page #page-content { margin-right: 50px; } } /* ========================================================================= Small Desktop ========================================================================= */ @media only screen and (min-width: 960px) and (max-width: 1279px) { .be-wrap { max-width: 980px; margin: 0 auto; } .layout-box { width:100%; } #page-content.content-single-sidebar{ width:700px; } #left-sidebar, #right-sidebar{ width:220px; } #left-sidebar, .right-sidebar-page #page-content { margin-right: 50px; } } /* ========================================================================= TABLET ========================================================================= */ @media only screen and (max-width: 1024px) { .be-bg-cover { background-attachment: scroll !important; background-position: center center !important; } } @media only screen and (min-width: 768px) and (max-width: 959px) { .be-wrap { max-width: 740px; margin: 0 auto; } .layout-box { width:100%; } #page-content.content-single-sidebar{ width:500px; } #left-sidebar, #right-sidebar{ width:200px; } #left-sidebar, .right-sidebar-page #page-content, .dual-sidebar-page #left-sidebar, #dual-sidebar-wrap { margin-right: 40px; } .content-single-sidebar .column-block { width: 100%; margin-left: 0; float: none; } } @media only screen and (min-width: 960px) { .full-screen-section-wrap { display: table; width: 100%; height: 100%; } .full-screen-section-wrap .be-section-pad { padding: 0px !important; display: table-cell; vertical-align: middle; } } html.touch.section-scroll, html.touch body.section-scroll{ overflow: auto !important; height: auto !important; } @media only screen and (max-width: 960px) { html.section-scroll, body.section-scroll { overflow: auto !important; height: auto !important; } html.csstransforms body.section-scroll .fullscreen-nav-wrap { display: none !important; } body.section-scroll #footer { display: block; } #content { -webkit-transform: translateY(0px) !important; -moz-transform: translateY(0px) !important; -ms-transform: translateY(0px) !important; -o-transform: translateY(0px) !important; transform: translateY(0px) !important; } } /* ========================================================================= MOBILE 320 ========================================================================= */ @media only screen and (max-width: 767px) { .be-wrap { max-width: 300px; margin: 0 auto; } .layout-box { width:100%; margin: 0; } #right-sidebar, #left-sidebar { float: none; margin-right: 0; margin-left: 0; margin-top: 50px; width: 100%; } #page-content.content-single-sidebar, .right-sidebar-page #page-content { float: none; margin-right: 0px; width:100%; margin-left: 0px; } .column-block { float: none; margin-left: 0; width: 100%; } .column-block .column-block{ margin-bottom: 60px; } .be-section .be-row:last-child .column-block { margin-bottom: 60px; } .be-section .be-row.be-no-space:last-child .column-block { margin-bottom: 0px; } .be-section .be-row:last-child .column-block:last-child { margin-bottom: 0; } .be-no-space .column-block { width: 100%; min-height: 300px; display: block; } .be-no-space .column-block.be-column-pad { padding: 80px 15% 80px 5%; width:90%; } #bottom-widgets .column-block { margin-bottom: 60px; } } /* ========================================================================= MOBILE 480 ========================================================================= */ @media only screen and (min-width: 480px) and (max-width: 767px) { .be-wrap { max-width: 440px; margin: 0 auto; } }