/* Theme Name: TizianaHouse Theme URI: https://www.portotheme.com/wordpress/porto Author: P-THEMES Author URI: https://www.portotheme.com/ Description: Porto Responsive WordPress + eCommerce Theme. Version: 1.1 Template: porto License: Commercial License URI: http://themeforest.net/licenses/regular_extended Tags: woocommerce, corporate, ecommerce, responsive, blue, black, green, white, light, dark, red, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready */ .comment-respond { display: none;} @media only screen and (min-width:100px) and (max-width:500px) { .col-comfort-th.vc_column_container.col-md-3 { width: 50%; } } .page-top > .container { padding-top: 25px; padding-bottom: 25px; } /*************** ADD YOUR CUSTOM CSS HERE ***************/ /*** MENU **/ #header .header-main .header-left, .fixed-header #header .header-main .header-left {padding-top:0px; padding-bottom:0px;} #header .header-main .header-left {padding-top: 10px;padding-bottom: 10px;} .page-top .page-title::before {top: 60px;} #header .main-menu .popup a { color: #fff; font-weight: 600;} /**MOBILE**/ #nav-panel .accordion-menu li.menu-item.active > a{background:#bd966f;} /*** TAB RAGGIUNGERE**/ .vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab.vc_active > a { border-color: #bd966f!important; border-right-color: rgb(189, 150, 111); background-color: #bd966f!important; color: #fff!important; } .vc_tta-color-grey.vc_tta-style-classic.vc_tta-tabs .vc_tta-panels {border: #bd966f solid 3px!important;} /**MOBILE**/ .vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel.vc_active .vc_tta-panel-title > a { color: #fff!important; background: #bd966f;} /***FINE TAB RAGGIUNGERE***/ /***TOP GALLERY***/ .wpb_heading.wpb_singleimage_heading { font-weight: normal; font-size: 16px; margin-bottom: 0; background: #bd966f; color: #fff; padding: 5px; } /****************************MOBILE RESPONSIVE **************************************/ @media only screen and (max-width:600px) { .page-top .page-title::before {top: 90px;} /*** MENU MOBILE***/ div#nav-panel { background: #384045!important;} .accordion-menu li.menu-item > a { padding: 15px 6px;} #nav-panel .accordion-menu .arrow { line-height: 65px;} #nav-panel .accordion-menu li { border-bottom-color: #bd966f;} /***FINE MENU MOBILE ***/ } .dt-sc-ribbon-title { display:inline-block; text-align:center; font-size:30px; background:url(../../images/ribbon.png) no-repeat; width:500px; height:106px; letter-spacing:1px; text-transform:uppercase; line-height:55px; color: #fff; } .dt-sc-animated-heading h2 { -webkit-text-fill-color: transparent; background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; background-position: center; -webkit-animation: moving 15s linear infinite; -moz-animation: moving 15s linear infinite; -moz-animation: moving 15s linear infinite; -o-animation: moving 15s linear infinite; text-transform: uppercase; word-wrap: break-word; } @-webkit-keyframes moving { 0% { background-position: right bottom; } 100% { background-position: left top; } } @-moz-keyframes moving { 0% { background-position: right bottom; } 100% { background-position: left top; } } .text-overlap { position: absolute; left: 9%; top: -13%; line-height: normal; z-index: 1; } @-webkit-keyframes moving { 0% { background-position: right bottom; } 100% { background-position: left top; } } @-moz-keyframes moving { 0% { background-position: right bottom; } 100% { background-position: left top; } } .dt-sc-ribbon-title { display:inline-block; text-align:center; font-size:30px; background:url(../../images/ribbon.png) no-repeat; width:500px; height:106px; letter-spacing:1px; text-transform:uppercase; line-height:55px; color: #fff; } .dt-sc-animated-heading h2 { -webkit-text-fill-color: transparent; background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; background-position: center; -webkit-animation: moving 15s linear infinite; -moz-animation: moving 15s linear infinite; -moz-animation: moving 15s linear infinite; -o-animation: moving 15s linear infinite; text-transform: uppercase; word-wrap: break-word; } /*.dt-sc-animated-heading h2 { -webkit-text-fill-color: transparent; background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; background-position: center; -webkit-animation: moving 15s linear infinite; -moz-animation: moving 15s linear infinite; -moz-animation: moving 15s linear infinite; -o-animation: moving 15s linear infinite; text-transform: uppercase; word-wrap: break-word; }*/ /* Table of Content ================================================== 1.0 - Title 1.1 - Default Colors 1.2 - Responsive*/ /*-------------------------------------------------------------- 1.0 - Title --------------------------------------------------------------*/ .dt-sc-title { position:relative; clear:both; float:left; } .aligncenter .dt-sc-title { text-align:center; width:100%; } .dt-sc-title.with-two-color-bg { margin-bottom:60px; } .dt-sc-title.with-two-color-bg:before { content:""; position:absolute; left:-20px; top:0px; width:100%; height:100%; -webkit-transform:skewX(-30deg); transform:skewX(-30deg); -ms-transform:skewX(-30deg); } .dt-sc-title.with-two-color-bg:after { content: ""; height: 100%; top: 0; right: 100%; position: absolute; -ms-transform: skewX(-30deg) translateX(-30px); -webkit-transform: skewX(-30deg) translateX(-30px); transform: skewX(-30deg) translateX(-30px); width: 9000px; } .dt-sc-title.with-two-color-bg h2 { padding:25px 30px 23px 10px; position:relative; z-index:1; margin:0px; left:10px; } .dt-sc-title.script-with-sub-title h2 { font-weight:normal; margin-bottom:0px; letter-spacing:normal; } .dt-sc-title.with-two-border h2 { position:relative; display:inline-block; } .dt-sc-title.with-two-border h2:before, .dt-sc-title.with-two-border h2:after { content: ""; position: absolute; top: 50%; width: 80px; height: 2px; transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); } .dt-sc-title.with-two-border h2:before { left:-100px; } .dt-sc-title.with-two-border h2:after { right:-99px; } .dt-sc-title.with-sub-title h2 { margin-bottom:10px; } .dt-sc-title.with-sub-title h3 { font-size:16px; letter-spacing:1px; } .dt-sc-title.script-with-sub-title { float: none; } .dt-sc-title.with-two-color-stripe { position:relative; width:100%; margin:0px 0px 50px; } .dt-sc-title.with-two-color-stripe:before, .dt-sc-title.with-two-color-stripe:after { content:""; height:100%; position:absolute; top: 0; width:9000px; } .dt-sc-title.with-two-color-stripe:before { right: 100%; transform:skewX(-30deg) translateX(-30px); -webkit-transform: skewX(-30deg) translateX(-30px); -ms-transform: skewX(-30deg) translateX(-30px); } .dt-sc-title.with-two-color-stripe:after { left: 100%; transform:skewX(-30deg) translateX(30px); -webkit-transform:skewX(-30deg) translateX(30px); -ms-transform:skewX(-30deg) translateX(30px); } .dt-sc-title.with-two-color-stripe h3 { font-size:20px; margin:40px 0px -5px; letter-spacing:1px; float:left; } .dt-sc-title.with-two-color-stripe h2 { font-size:34px; font-weight:900; letter-spacing:2px; float:left; clear:both; margin-bottom:0px; } .dt-sc-title.with-two-color-stripe h5 { float:left; position:relative; padding:50px 0px 40px 100px; margin:-50px 0px 0px; } .dt-sc-title.with-two-color-stripe h5:before { content:""; position:absolute; left:57px; height:100%; width:1px; top:-5px; -webkit-transform:skewX(-30deg); transform:skewX(-30deg); -ms-transform:skewX(-30deg); } .dt-sc-title.with-right-border-decor { float:left; clear:both; width:100%; margin: 0; padding: 0 0 20px 70px; } .dt-sc-title.with-right-border-decor:before { content:""; position:absolute; bottom: 0; left:21px; top: 35px; height: auto; width:1px; } .dt-sc-title.with-right-border-decor:after { content:""; position:absolute; left:15px; bottom: 0; width:13px; height:13px; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); border-radius:2px; } .dt-sc-title.with-right-border-decor h2 { margin:-7px 0 30px; line-height:40px; position:relative; font-size: 35px; } .dt-sc-title.with-right-border-decor p { font-size:14px; } .dt-sc-title.with-right-border-decor .dt-sc-button { margin-top:30px; clear:both; } .dt-sc-title.with-right-border-decor h2:before { content:""; position:absolute; left:-62px; top: 10px; width:28px; height:28px; border:4px solid; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); border-radius:3px; } .dt-sc-title.with-right-border-decor > h4:first-child { color: #cacaca; margin-bottom: 10px; font-weight: 300; font-size: 20px; text-transform: uppercase; padding-bottom: 20px; } .dt-sc-title.with-right-border-decor > h5:first-child { color: #cacaca; margin-bottom: 5px; font-weight: 400; font-size: 18px; text-transform: uppercase; padding-bottom: 10px; } .dt-sc-title.with-right-border-decor > h6:first-child { color: #cacaca; margin-bottom: 0; font-weight: 400; font-size: 16px; text-transform: uppercase; padding-bottom: 10px; } .aligncenter .dt-sc-title.with-right-border-decor > *:first-child:after, .dt-sc-title.with-right-border-decor.aligncenter > *:first-child:after { right: 0; margin: 0 auto; } .alignright .dt-sc-title.with-right-border-decor > *:first-child:after, .dt-sc-title.with-right-border-decor.alignright > *:first-child:after { left: auto; right: 0; } .dt-sc-title.with-right-border-decor.alignright > * { text-align: right; float: right; } .dt-sc-title.with-right-border-decor.aligncenter > * { text-align: center; float: none; display: inline-block; } .dt-sc-title.with-boxed { width:100%; height:100%; text-align:center; text-transform:uppercase; } .dt-sc-title.with-boxed h2 span { font-size:48px; display:block; padding-bottom:20px; margin-bottom:0px; } .dt-sc-title.with-boxed h2 { position:absolute; left:0px; right:0px; bottom:0px; top:0px; margin:auto; height:120px; } .dt-sc-photography-style:before { content:""; position:absolute; left:-20px; top:-20px; width:100%; height:100%; z-index:-1; } .dt-sc-photography-style.alter:before { left:inherit; right:-20px; bottom:-20px; top:inherit; } .dt-sc-triangle-title { float:left; clear:both; width:370px; height:500px; text-align:center; position:relative; } .dt-sc-triangle-title:before { content:""; position:absolute; left:0px; right:0px; margin:auto; top:100px; width:310px; height:310px; transform:rotate3d(1, 1, 5, 47deg) skew(10deg, 10deg); -webkit-transform:rotate3d(1, 1, 5, 47deg) skew(10deg, 10deg); -ms-transform:rotate3d(1, 1, 5, 47deg) skew(10deg, 10deg); } .dt-sc-triangle-title:after { content:""; position:absolute; left:0px; right:0px; margin:auto; top:111px; width:290px; height:290px; transform:rotate3d(1, 1, 5, 47deg) skew(10deg, 10deg); -webkit-transform:rotate3d(1, 1, 5, 47deg) skew(10deg, 10deg); -ms-transform:rotate3d(1, 1, 5, 47deg) skew(10deg, 10deg); } .dt-sc-triangle-title h2 { margin:215px 0px 10px; position:relative; z-index:9; } .dt-sc-triangle-title p { font-size:12px; line-height:24px; position:relative; z-index:9; } .dt-sc-triangle-title h2, .dt-sc-triangle-title p { color:#fff; } .dt-sc-ribbon-title { display:inline-block; text-align:center; font-size:30px; background:url(../../images/ribbon.png) no-repeat; width:500px; height:106px; letter-spacing:1px; text-transform:uppercase; line-height:55px; color: #fff; } .dt-sc-animated-heading h2 { -webkit-text-fill-color: transparent; background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; background-position: center; -webkit-animation: moving 15s linear infinite; -moz-animation: moving 15s linear infinite; -moz-animation: moving 15s linear infinite; -o-animation: moving 15s linear infinite; text-transform: uppercase; word-wrap: break-word; } @-webkit-mes moving { 0% { background-position: right bottom; } 100% { background-position: left top; } } @-moz-keyframeing { 0% { background-position: right bottom; } 100% { background-position: left top; } } .dt-sc-special-heading { display: inline-block; } .dt-sc-special-heading h2 { font-size: 50px; margin-bottom: 0; z-index: 9; position: relative; } .dt-sc-special-heading p { position: relative; display: inline-block; padding: 0 20px; text-transform: uppercase; font-weight: 500; letter-spacing: 2px; margin: 0; } .dt-sc-special-heading p:before, .dt-sc-special-heading p:after { content: ""; position: absolute; width: 5px; height: 5px; background-color: #000; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); left: 0; top: 0; bottom: 0; margin: auto; } .dt-sc-special-heading p:after { right: 0; left: auto; } .dt-sc-special-heading h5 { font-size: 80px; color: #f2ede7; z-index: -1; margin-top: -70px; } .dt-sc-special-heading.alignleft p:before, .dt-sc-special-heading.alignright p:after { display: none; } .dt-sc-special-heading.alignleft p { padding-left: 0; } .dt-sc-special-heading.alignright p { padding-right: 0; } .dt-sc-special-heading h5:empty { display: none; } .dt-sc-dark-bg.dt-sc-special-heading, .dt-sc-dark-bg.dt-sc-special-heading h2 { color: #fff; } .dt-sc-dark-bg.dt-sc-special-heading h5 { color: rgba(255, 255, 255, 0.1); } .mz-title { overflow: hidden; float: left; width: 100%; } .mz-title .mz-title-content { margin-bottom: 30px; position: relative; clear: both; float: left; } .mz-title .mz-title-content:before { content:""; position:absolute; right:-16px; top:0px; width:100%; height:100%; -webkit-transform:skewX(30deg); transform:skewX(30deg); -ms-transform:skewX(30deg); } .mz-title .mz-title-content:after { content:""; height:100%; top:0px; left:114%; left:-webkit-calc(100% - -26px); left:-moz-calc(100% - -26px); left:calc(100% - -26px); position:absolute; -ms-transform:skewX(30deg); -webkit-transform:skewX(30deg); transform:skewX(30deg); width:9000px; background:#f3f3f3; } .dt-sc-title.mz-title .mz-title-content h2 { padding:17px 10px 15px 20px; position:relative; z-index:1; margin:0px; left:0px; font-size:16px; text-transform:uppercase; } .dt-sc-title.mz-title .mz-title-content h2 { color:#fff; } .dt-sc-title.split2-title { overflow: hidden; float: left; width: 100%; } .dt-sc-title.split2-title .split2-title-content { margin-bottom:30px; position: relative; clear: both; float: left; } .dt-sc-title.split2-title .split2-title-content:after { background:url(../../images/title-pattern.png) repeat; content:""; height:100%; top:0px; left:100%; position:absolute; width:9000px; } .dt-sc-title.split2-title .split2-title-content h2 { background:#000; padding:12px 15px; position:relative; z-index:1; margin:0px; left:0px; font-size:16px; text-transform:uppercase; } .dt-sc-title.split2-title .split2-title-content * { color:#fff; } /*-------------------------------------------------------------- 1.1 - Default Colors --------------------------------------------------------------*/ .dt-sc-title.with-two-color-stripe h5 { color:rgba(0, 0, 0, 0.8); } .dt-sc-dark-bg.skin-color .dt-sc-title.script-with-sub-title h2, .dt-sc-title.with-two-color-bg h2, .dt-sc-title.with-boxed h2, .dt-sc-title.with-boxed h2 a { color:#ffffff; } .dt-sc-title.with-boxed h2 a:hover { color:rgba(0, 0, 0, 0.2); } .dt-sc-title.with-two-color-stripe:after { background:rgba(0, 0, 0, 0.1); } .dt-sc-title.with-two-color-stripe h5:before { background:rgba(0, 0, 0, 0.2); } .dt-sc-title.with-two-color-stripe:after { background:#e6e6e8; } .dt-sc-title.with-two-border h2:before, .dt-sc-title.with-two-border h2:after { background:#000000; } .dt-sc-dark-bg .dt-sc-title.with-two-border h2:before, .dt-sc-dark-bg .dt-sc-title.with-two-border h2:after { background:#ffffff; } .dt-sc-title.with-two-color-bg:before, .dt-sc-title.with-two-color-bg h2 { background:#000000; } .dt-sc-photography-style:before { background:#000000; } @media all and (min-width:0\0) and (min-resolution:.001dpcm) { .dt-sc-triangle-title::before, .dt-sc-triangle-title::after { transform: rotate(45deg) skew(10deg, 10deg); -ms-transform: rotate(45deg) skew(10deg, 10deg); } } /*-------------------------------------------------------------- 1.2 - Responsive --------------------------------------------------------------*/ @media only screen and (min-width:992px) and (max-width:1199px) { /** Headings - Titles **/ .dt-sc-title.with-two-color-stripe:before { transform:skewX(-30deg) translateX(-45px); -webkit-transform: skewX(-30deg) translateX(-45px); -ms-transform: skewX(-30deg) translateX(-45px); } .dt-sc-title.with-two-color-stripe:after { transform:skewX(-30deg) translateX(45px); -webkit-transform:skewX(-30deg) translateX(45px); -ms-transform:skewX(-30deg) translateX(45px); } .dt-sc-title.with-two-color-stripe h5 { padding: 50px 0px 40px 70px; } .dt-sc-title.with-two-color-stripe h5:before { left: 50px; } .dt-sc-triangle-title { height: 450px; width: 100%; } .dt-sc-triangle-title:before { height: 250px; top: 100px; width: 250px; } .dt-sc-triangle-title:after { height: 230px; top: 110px; width: 230px; } .dt-sc-triangle-title h2 { margin: 155px 0 0; font-size: 20px; } .dt-sc-photography-style.vc_col-md-12 { padding-bottom: 0; } .dt-sc-title.with-two-color-stripe h1, .dt-sc-title.with-two-color-stripe h2, .dt-sc-title.with-two-color-stripe h3, .dt-sc-title.with-two-color-stripe h4, .dt-sc-title.with-two-color-stripe h5, .dt-sc-title.with-two-color-stripe h6 { float: none; } .dt-sc-title.with-two-color-stripe { text-align: center; } .dt-sc-title.with-two-color-stripe h5 { margin: 0; padding-left: 0; } .dt-sc-title.with-two-color-stripe h5 { padding: 50px 0px 40px 70px; padding-left: 70px; } .dt-sc-title.with-two-color-stripe h5::before { height: 1px; left: 0; top: 25px; width: 100%; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } } /** WHATSAPP **/ .whatsapp-float { position: fixed; width: 60px; height: 60px; bottom: 125px; right: 50px; background: #25d366; color: #ffffff; border-radius: 50px; text-align: center; box-shadow: 2px 2px 3px #999; z-index: 100; padding: 7px; } .whatsapp-float:after { content: ''; font-size: 15px; } .icona-whatsapp { fill: white; width: 40px; height: 45px; } .fa.fa-whatsapp.whatsapp-my-float { font-size: 35px; margin-top:5px } #whatsapp_ak svg { width: 35px; position: absolute; top: -21px; left: 14px; fill:#fff; } .whatsapp-float:hover { background: #25d366; color: #252525; box-shadow: none; bottom: 123px; } /***mobile***/ @media screen and (max-width: 600px) { .whatsapp-float { bottom: 125px; left: 10px; } .whatsapp-float:hover { bottom: 123px; } } /** FINE WHATSAPP **/