/* ---------------------------------------------------------------- Canvas: Interior Design -----------------------------------------------------------------*/ :root { --themecolor: #1c85e8; } p { font-weight: 300; } .menu-container > .menu-item > .menu-link { font-size: 16px; font-weight: 400; color: #525975; letter-spacing: 1px; text-transform: capitalize; } .sub-menu-container .menu-item > .menu-link { font-size: 15px !important; font-weight: 400 !important; color: #525975; text-transform: capitalize; background-color: transparent !important; } #side-panel { background-color: #FFF; } body.side-panel-open #side-panel { -webkit-box-shadow: -5px 0px 20px -6px rgba(0,0,0,0.15); -moz-box-shadow: -5px 0px 20px -6px rgba(0,0,0,0.15); box-shadow: -5px 0px 20px -6px rgba(0,0,0,0.15); } .emphasis-title h2 { font-size: 48px; } .emphasis-title p { font-size: 18px; font-weight: 400; color: #525975; } /* ----- Hero Widget ----- */ #widget-subscribe-form { display: block; padding: 8px; background-color: #FFF; border: 1px solid #EEE; border-radius: 3px; box-shadow: 0 0 30px 4px rgba(0,0,0,0.15); transition: box-shadow .4s linear; } #widget-subscribe-form:hover { box-shadow: 0 0 42px 4px rgba(0,0,0,.3) !important; } .input-lg { height: 50px; } @media (min-width: 992px) { .sub-menu-container:not(.mega-menu-column) { width: 260px; padding: 20px; border: transparent !important; box-shadow: 0px 20px 41px 1px rgba(0,0,0,0.1); } .toggle-bg .toggle-icon i { width: 1.25rem; font-size: 1.25rem; } .toggle-bg .toggle-header { background-color: #F2F6FA; padding: 1rem 1.5rem; align-items: center; } .toggle-bg .toggle-content { background-color: #F2F6FA; font-weight: 400; font-size: 1rem; padding: 0 1.5rem 1.5rem; color: #888; line-height: 1.7; } .toggle-bg .toggle-header .toggle-icon { -webkit-transition: transform .25s ease; -o-transition: transform .25s ease; transition: transform .25s ease; } .toggle-bg.toggle-active .toggle-header .toggle-icon { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); color: var(--themecolor); } } .portfolio.gutter-interior-design { margin-right: -8px; margin-left: -8px; margin-bottom: -16px; } .portfolio.gutter-interior-design > .col, .portfolio.gutter-interior-design > [class*="col-"] { padding-right: 8px; padding-left: 8px; padding-bottom: 16px; } .customers-count { border-right: 1px solid rgba(0, 0, 0, 0.1); } .customers-count .counter { font-family: 'Playfair Display', serif; font-weight: 700; color: #1d2c4c; font-size: 64px; line-height: 1.2; } .customers-count p { font-size: 20px; margin: 8px 0 0; } .quote p { font-size: 20px; } .heading-block h2 + span { font-size: 18px; color: #999 !important; } /* ----- | Story-Box | ----- */ .story-box { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; cursor: pointer; } .story-box .story-box-image { width: 70%; height: 500px; z-index: 2; overflow: hidden; -ms-flex-preferred-size: auto; flex-basis: auto; } .story-box .story-box-image img { display: block; height: auto; width: 100%; opacity: 1; transition: opacity .3s ease; } .story-box:hover .story-box-image img { opacity: .9; } .story-box .story-box-info { box-sizing: border-box; width: 50%; height: 430px; padding: 60px; margin: 35px 0 0 -20%; background: #fff; z-index: 4; box-shadow: 0 10px 45px rgba(0,0,0,.1); transition: all ease-in .3s; -ms-flex-preferred-size: auto; flex-basis: auto; } .story-box.description-left .story-box-info { -ms-flex-order: -1; order: -1; margin: 35px -20% 0 0; } .story-box .story-box-info .story-title { font-family: 'Playfair Display'; font-size: 26px; line-height: 1.4; font-weight: 700; letter-spacing: 0; color: #1d2c4c; } .story-box .story-box-info .story-box-content p { font-size: 15px; font-weight: 300; color: #666; line-height: 16px; } .story-box .story-box-info .story-box-content a { font-size: 16px; text-decoration: underline !important; } /* ----- Story-Box Responsive ----- */ @media (max-width: 991px) { .story-box .story-box-image { height: auto; width: 100%; height: 400px; -ms-flex-order: -1; order: -1; } .story-box.description-left .story-box-info { -ms-flex-order: -1; order: -1; margin: 35px -20% 0 0; } .story-box.description-left .story-box-info { margin: -40px 5% 0; } .story-box .story-box-info { max-width: 90%; height: auto; -ms-flex-preferred-size: 90%; flex-basis: 90%; margin: -40px 5% 0; } } @media (max-width: 767px) { .story-box.description-left .story-box-info { margin: -100px 5% 0; } .story-box .story-box-info { padding: 35px; text-align: center; margin: -100px 5% 0; } .customers-count { border-right: none } } @media (max-width: 479px) { .story-box .story-box-info { width: 100%; padding: 15px; text-align: center; margin: -200px 5% 0; } .story-box.description-left .story-box-info { margin: -200px 5% 0; } ul.tab-nav:not(.tab-nav-lg) li a i {display: none;} } /* ----- Tab ----- */ ul.tab-nav:not(.tab-nav-lg) { border-bottom: none; } ul.tab-nav:not(.tab-nav-lg) li { float: left; border: none; height: auto; text-align: center; } .tabs.tabs-alt ul.tab-nav li.ui-tabs-active a { border: none; } ul.tab-nav:not(.tab-nav-lg) li a { color: #1d2c4c; height: auto; line-height: 1; background-color: transparent; font-size: 15px; font-weight: 400; padding: 0 0 20px 0; } ul.tab-nav:not(.tab-nav-lg) li a i { display: block; font-size: 42px; margin: 0 0 17px 0; color: var(--themecolor); } ul.tab-nav:not(.tab-nav-lg) li.ui-tabs-active a { top: 0; } ul.tab-nav:not(.tab-nav-lg) li.ui-tabs-active a::after { content: ''; position: absolute; width: 6px; height: 6px; bottom: 0; left: 50%; margin-left: -3px; border-radius: 50%; background: var(--themecolor); } .tab-container { margin: 30px 0 0; } /* ----- Tab Responsive ----- */ .acctitle { line-height: 30px; font-size: 16px; font-weight: 500; color: #444; border-top: 1px dotted #DDD; padding: 12px 0 12px 24px; } .acc_content { padding: 10px 0 25px; } .acctitle i { color: var(--themecolor); font-size: 16px; top: 3px; } .acctitle i.icon-ok-circle, .acctitle i.icon-remove-circle { display: none; } /* ----- Review ----- */ .review-row { padding-bottom: 24px; border-bottom: 1px solid #EEE; } .review-row h6 { font-size: 18px; font-weight: 400; color: #1d2c4c; margin-bottom: 0; } .review { border-bottom: 1px solid hsla(60,1%,75%,.3); padding-bottom: 52px; padding-top: 52px; } .review-company { display: block; font-size: 17px; font-weight: 500; color: #1d2c4c; } .review-id { color: #AAA; font-weight: 300; font-size: 16px; } .rating-stars { margin: 20px 0; } .rating-stars i { font-size: 24px; margin: 0 2px; color: gold; } .review-date { font-size: 16px; font-weight: 300; line-height: 1.6; margin-bottom: 10px; } .review-title h3::before { content: "\e7ad"; font-family: 'font-icons'; position: absolute; top: -5px; left: -70px; height: 60px; font-size: 60px; color: #525975; line-height: 60px; opacity: .1; } .review-title h3 { font-family: 'PlayFair Display'; font-size: 28px; color: #1d2c4c; margin-bottom: 20px; } .owl-item .review-content { position: relative; max-height: 140px; overflow: hidden; transition: all 1s linear; } .owl-item .review-content::after { position: absolute; content: ''; width: 100%; height: 50px; bottom: 0; left: 0; z-index: 9; transition: all .3s linear; background: linear-gradient(180deg,hsla(0,0%,100%,0) -1%,hsla(0,0%,100%,.01) 0,#fff); } .owl-item .review-content:hover { max-height: 500px; } .owl-item .review-content:hover::after { background: transparent; } .review-content p { margin: 0; color: #888; font-size: 16px; white-space: pre-line; } /* ----- Footer ----- */ .widget h4 { font-weight: 500; letter-spacing: 0; font-size: 16px; text-transform: none; } .widget_links li, .widget_links li a { background-image: none !important; padding-left: 0; color: #525975; opacity: .9; padding-top: 5px; } .app-links::before { content: ""; display: block; width: 20px; height: 3px; border-top: 2px solid #DDD; } .app-links p { margin: 20px 0 5px 0; } .app-links a span { color: #888; margin-left: 2px; font-weight: 300; font-size: 14px; } .app-links a i { position: relative; top: 1px; font-size: 16px; } .app-links a:not(:first-child) { margin-top: 5px; } #copyrights span { font-weight: 300; color: #BBB; }