/* Document : Avenue Stylesheet Created on : May 14, 2014, 8:23:39 PM Author : Bilal Description: Purpose of the stylesheet follows. */ root { display: block; } body{ font-family: 'Source Sans Pro', sans-serif; } h1{ font-size: 30px;line-height: 34px;} h2{ font-size: 26px;line-height: 30px;} h3{ font-size: 22px;line-height: 26px;} .hidden{display: none;} .row{ margin: 0 auto; overflow: hidden; width: 100%; } .center{ text-align: center;} .text-right{ text-align: right;} .text-left{ text-align: left;} .left{ float: left;} .right{ float: right;} .mt20{ margin-top: 20px;} .scale125{ transform: scale(1.25); -moz-transform: scale(1.25); -webkit-transform: scale(1.25); } .scale11{ transform: scale(1.1); -moz-transform: scale(1.1); -webkit-transform: scale(1.1); } .transition{ transition: 0.4s all ease; -moz-transition: 0.4s all ease; -webkit-transition: 0.4s all ease; } .btn-primary{ border-radius: 0; } /*-- Logo --*/ #sc_logo{ max-height: 100px; } /*-- Toolbar --*/ #site-toolbar{ background: #222222; color: #d0d0d0; overflow: hidden; position: fixed; left: 0; /*top: 0;*/ width: 100%; z-index: 999; /*height: 40px;*/ } #site-toolbar .contact-bar a{ height: 30px; margin: 7px 5px; display: inline-block; text-align: center; line-height: 30px; transition: 0.2s all ease; -webkit-transition: 0.2s all ease; -moz-transition: 0.2s all ease; } #site-toolbar .contact-bar a:hover{ } #site-toolbar .contact-bar a .fa{ margin-right: 5px; } #site-toolbar .contact-bar a span{ color: #e0e0e0; } #site-toolbar .social-bar a{ width: 30px; height: 30px; margin: 7px 5px; display: inline-block; text-align: center; line-height: 30px; border: 1px solid #e0e0e0; color: #e0e0e0; border-radius: 100%; transition: 0.2s all ease; -moz-transition: 0.2s all ease; -webkit-transition: 0.2s all ease; } #site-toolbar .row .social-bar{ text-align: right; } .site-branding{ border-top: 8px solid #f5f5f5; border-bottom: 5px solid #f5f5f5; margin-top: 40px; } .site-branding .search-bar{ text-align: right; } .site-branding .search-bar .search-form{ margin-top: 20px; line-height: 20px; } .site-branding .search-bar .search-field{ border-top: 0; border-left: 0; border-right: 0; border-radius: 0; outline-color: #fff; transition: 0.2s all ease-in-out; -moz-transition: 0.2s all ease-in-out; -webkit-transition: 0.2s all ease-in-out; } .site-branding .search-bar .search-field:focus{ padding-right: 20px; color: #222; } .site-branding .col-sm-6{ min-height: 70px; line-height: 70px; } .main-navigation{ border-bottom: 8px solid #f5f5f5; } #site-navigation.main-navigation > .row{ overflow: visible; } /*-- Social --*/ #site-toolbar .row .social-bar a.icon-twitter:hover{ color: #00abdc; border-color: #00abdc; box-shadow: 0 0 2px #00abdc; -moz-box-shadow: 0 0 2px #00abdc; -webkit-box-shadow: 0 0 2px #00abdc; } #site-toolbar .row .social-bar a.icon-facebook:hover{ color: #3b5998; border-color: #3b5998; box-shadow: 0 0 2px #3b5998; -moz-box-shadow: 0 0 2px #3b5998; -webkit-box-shadow: 0 0 2px #3b5998; } #site-toolbar .row .social-bar a.icon-linkedin:hover{ color: #007bb6; border-color: #007bb6; box-shadow: 0 0 2px #007bb6; -moz-box-shadow: 0 0 2px #007bb6; -webkit-box-shadow: 0 0 2px #007bb6; } #site-toolbar .row .social-bar a.icon-gplus:hover{ color: #dd4b39; border-color: #dd4b39; box-shadow: 0 0 2px #dd4b39; -moz-box-shadow: 0 0 2px #dd4b39; -webkit-box-shadow: 0 0 2px #dd4b39; } /*-- 404 --*/ .icon404{ font-size: 54px; line-height: 90px; } /*-- Header --*/ .site-header{ width: 100%; } .site-title{ margin: 0; } .site-description{ font-size: 14px; } /*-- Slider --*/ .sc-slider-wrapper{ margin: 0 auto; overflow: hidden; } .sc-slider-wrapper .camera_caption{ width: 100%; } .sc-slider-wrapper .camera_caption > div{ min-height: 100px; background: rgba(0, 0, 0, 0.4); text-align: center; line-height: 100px; } .sc-slider-wrapper .cameraContent{ } /*-- Menu --*/ #site-navigation{ /*background: #222222;*/ } .nav-menu > li a{ margin-right: 15px; padding: 8px 10px; background: #fff; color: #222222; } .main-navigation ul ul{ top: initial; background: #fff; } .menu-toggle{ margin: 0 auto; } /*-- CTA boxes --*/ #site-cta{ overflow: visible; } #site-cta .site-cta{ } .site-cta{ border-left: 1px solid #444; } #site-cta .col-md-12{ margin-top: 55px; } .site-cta .fa{ font-size: 28px; border: 1px solid; width: 50px; height: 50px; text-align: center; line-height: 50px; border-radius: 100%; position: absolute; left: -40px; top: 0; background: #fff; transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; -webkit-transition: 0.3s all ease-in-out; } .site-cta .col-md-10 > div{ position: relative; padding-bottom: 20px; } .site-cta h3{ font-size: 20px; transition: 0.3s all ease; -moz-transition: 0.3s all ease; -webkit-transition: 0.3s all ease; position: relative; font-weight: 600; } .site-cta .col-md-10{ position: relative; } .site-cta .btn{ display: none; } /*-- Top Banner --*/ #top-banner{ padding: 15px 0 0 0; background: #222222 url('../images/left-cross.png'); min-height: 100px; color: #ffffff; box-shadow: 0px 0px 15px 1px #000 inset; -moz-box-shadow: 0px 0px 15px 1px #000 inset; -webkit-box-shadow:0px 0px 15px 1px #000 inset; } #top-banner .top-banner-text{ font-size: 20px; line-height: 26px; margin-bottom: 20px; font-weight: 200; } #top-banner .date, #top-banner .author{ font-size: 16px; } #top-banner .top-banner-text h2{ font-size: 36px; margin-bottom: 10px; } #top-banner #sc_avenue_recent_posts > div { margin-bottom: 30px; } #top-banner #sc_avenue_recent_posts img{ width: 100%; } #top-banner #sc_avenue_recent_posts img:hover{ } #top-banner #sc_avenue_recent_posts .col-sm-3{ overflow: hidden; } #top-banner #sc_avenue_recent_posts .col-sm-3 > div{ position: relative; /* transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; -webkit-transition: 0.3s all ease-in-out;*/ /*overflow: hidden;*/ } #top-banner #sc_avenue_recent_posts .col-sm-3 > div:hover{ /* transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); */ } #top-banner #sc_avenue_recent_posts .col-sm-3 > div img{ /*height: 100%;*/ } #top-banner #sc_avenue_recent_posts .col-sm-3 > div img:hover{ } #top-banner .top-banner-text .overlay{ position: absolute; width: 100%; height: 100%; padding-top: 10%; top: 0; left: 0; background: rgba(0,0,0,0.5); transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; -webkit-transition: 0.3s all ease-in-out; } #top-banner .top-banner-text .overlay:hover{ background: rgba(0,0,0,0); } /*-- site content --*/ .site-content-wrapper{ } /*-- sidebar recent posts --*/ #secondary .widget_sc_recent_posts_widget #sc_avenue_recent_posts .col-sm-3{ width: 100%; } #secondary .widget_sc_recent_posts_widget #sc_avenue_recent_posts .col-sm-3 img{ float: left; width: 75px; } #secondary #sc_avenue_recent_posts .date, #secondary #sc_avenue_recent_posts .author{ display: none; } #secondary #sc_avenue_recent_posts .overlay{ padding-left: 80px; } #secondary #sc_avenue_recent_posts .col-sm-3{ margin-bottom: 10px; } /*#top-banner #sc_avenue_recent_posts*/ /*-- Site Footer --*/ .site-footer{ border-top: 1px solid #2e2e2e; color: #e0e0e0; } .site-footer .site-info{ background: #222222; } .site-footer .footer-boxes{ background: #303030 url('../images/left-cross.png'); box-shadow: 0px 0px 5px 1px #000; -moz-box-shadow: 0px 0px 5px 1px #000; -webkit-box-shadow: 0px 0px 5px 1px #000; } .site-footer .footer-boxes .widget:first-child{ padding-left: 0; } .site-footer .col-md-6{ padding: 20px 10px 20px 0; } .scroll-top{ /*font-size: 26px;*/ width: 30px; height: 30px; margin: 7px 5px; display: inline-block; text-align: center; line-height: 30px; border: 1px solid #e0e0e0; color: #e0e0e0; border-radius: 100%; cursor: pointer; transition: 0.2s all ease-in-out; -moz-transition: 0.2s all ease-in-out; -webkit-transition: 0.2s all ease-in-out; } .scroll-top:hover{ transform: scale(1.2); -moz-transform: scale(1.2); -webkit-transform: scale(1.2); } /*-- page --*/ .page-content{ padding-top: 20px; padding-bottom: 20px; } .page-title{ background: #222222 url('../images/left-cross.png'); margin-left: -15px; margin-right: -15px; font-size: 32px; color: #e0e0e0; padding: 30px 0; padding-left: 20px; } .page .entry-content{ } .item-page{ /* margin-bottom: 15px; box-shadow: 1px 1px 3px #CACACA; -moz-box-shadow: 1px 1px 3px #CACACA; -webkit-box-shadow: 1px 1px 3px #CACACA; background: #ffffff; padding-bottom: 10px;*/ } .item-page.col1{ width: 100%; } .item-post .col-sm-8.featured_none { width: 100%; } .page-content > col-md-9{ overflow: hidden; } .page-container.sidebar-off{ width: 100%; } /*-- Blog --*/ .blogroll{ margin-top: 20px; } .item-post{ border-bottom: 1px solid rgb(228, 228, 228); padding-bottom: 10px; } .item-post .post-title{ font-size: 32px; margin-top: 15px; } .item-post .post-thumb{ padding-top: 15px; } .item-post .post-thumb img{ width: 100%; width: 100%; } .single-title{ } .single-title > div.row{ } .single .wp-post-image{ margin: 0 20px 20px 0; max-width: 250px; } .wp-post-image{ float: left; } /*-- sidebar --*/ .avenue-sidebar .widget{ /* background: #ffffff; margin: 0 0 15px 0; box-shadow: 1px 1px 3px #CACACA; -moz-box-shadow: 1px 1px 3px #CACACA; -webkit-box-shadow: 1px 1px 3px #CACACA; */ border-bottom: 1px solid #e9e9e9; padding-bottom: 10px; } .widget-area .search-field{ width: 100%; padding-left: 5px; } .widget-title{ margin-bottom: 0; font-weight: 400; margin-top: 5px; } .widget-area ul{ margin: 0; } .widget-area ul li{ list-style-type: none; padding-left: 0; border-bottom: 1px solid #E6E6E6; } .widget-area ul li a{ font-size: 16px; padding: 7px 0; transition: 0.2s all ease; -moz-transition: 0.2s all ease; -webkit-transition: 0.2s all ease; display: block; } .widget-area ul li a:hover{ } /*-- Responsive --*/ @media(min-width: 1060px){ .row{ width: 1060px; } .row.row1060{ width: 1060px; } .sc-slider-wrapper .camera_caption > div{ font-size: 36px; } #top-banner .top-banner-text .overlay .title{ font-size: 26px; font-weight: 400; } } @media(min-width: 1200px){ .row.row1200{ width: 1200px; } } @media(min-width: 992px) and (max-width: 1059px){ .sc-slider-wrapper .camera_caption > div{ font-size: 24px; } } @media(min-width: 601px) and (max-width: 991px){ #site-cta{ margin-top: 0; } #site-cta .site-cta{ margin-left: 30px; } .site-cta .col-md-10 > div{ padding-left: 20px; } #top-banner .top-banner-text{ font-size: 20px; line-height: 26px; } #top-banner .top-banner-text h2{ font-size: 26px; } .sc-slider-wrapper .camera_caption > div{ font-size: 24px; } } @media(min-width: 401px) and (max-width: 600px){ #site-cta{ margin-top: 0; } #site-cta .site-cta{ margin-left: 30px; } .site-cta .col-md-10 > div{ padding-left: 20px; } .site-branding{ margin-top: 90px; } #top-banner .top-banner-text{ font-size: 18px; line-height: 24px; } #top-banner .top-banner-text h2{ font-size: 24px; } .sc-slider-wrapper .camera_caption > div{ font-size: 20px; } } @media(max-width: 525px){ #site-toolbar .row .social-bar, #site-toolbar .row .contact-bar{ width: 100%; text-align: center; } /* .site-branding{ margin-top: 90px; } */ } @media(min-width: 400px) and (max-width: 526px){ .site-footer{ margin-bottom: 88px; } } @media(min-width: 527px) and (max-width: 600px){ .site-footer{ margin-bottom: 44px; } } @media(max-width: 400px){ .site-branding{ margin-top: 90px; } #top-banner .top-banner-text{ font-size: 22px; line-height: 24px; } .site-footer{ margin-bottom: 88px; } } @media(max-width: 600px){ .site-description{ display: none; } .main-navigation li{ float: none; } .main-navigation ul ul{ display: block; float: none; position: initial; } .main-navigation ul ul a{ width: 100%; padding-left: 30px; } .nav-menu > li a{ background: #222; margin: 0; color: #fff; text-align: center; } #site-navigation .row > div.col-md-12{ padding: 0; } #menu-main{ margin-top: 5px; } #site-toolbar{ /*bottom: 0;*/ display: none; } .site-branding{ margin-top: 0; } }