File: /var/www/html/wppartneramazingsecret/wp-content/themes/themify-ultra/skins/horizontal/style.css
/*
Skin Name:Ultra Horizontal
Version:1.0
Demo URI:https://themify.me/demo/themes/ultra-horizontal/
Required Plugins:builder-contact, builder-woocommerce, themify-portfolio-post, woocommerce
*/
/************************************************************************************
GENERAL
*************************************************************************************/
body{
font:300 1.05em/1.5em 'Nunito',Arial,sans-serif
}
p:empty{
display:none
}
a{
color:#5984fe
}
a:hover{
text-decoration:none
}
/* HEADINGS
================================================ */
h1, h2, h3, h4, h5, h6{
font-family:'Rubik',Arial,sans-serif;
font-weight:400
}
h1{
font-size:2.8em;
letter-spacing:-.02em;
line-height:1.3em
}
h2{
font-size:2.2em
}
h3{
font-size:1.7em
}
h4{
letter-spacing:.1em
}
/* FORM
================================================ */
textarea, input[type=text], input[type=password], input[type=search], input[type=email], input[type=url], input[type=number], input[type=tel], input[type=date], input[type=datetime], input[type=datetime-local], input[type=month], input[type=time], input[type=week]{
background-color:rgb(255, 255, 255);
font-weight:inherit;
box-shadow:0 0 0 1px rgba(0,0,0,.05), 0 1px 6px 0 rgba(0, 0, 0, .1);
border-radius:3px;
border:none;
padding:.6em;
margin:0;
margin-bottom:1em;
max-width:none
}
textarea{
resize:vertical;
height:170px
}
input[type=reset], input[type=submit], button[type=submit]{
border-radius:3px;
border:none;
font-size:.9em;
font-weight:inherit;
padding:.7em 1.4em .7em 1.7em;
letter-spacing:.07em;
box-shadow:0 1px 6px 0 rgba(0, 0, 0, .17)
}
input[type=reset]:hover, input[type=submit]:hover, button[type=submit]:hover,
textarea:focus, input[type=text]:focus, input[type=password]:focus, input[type=search]:focus, input[type=email]:focus, input[type=url]:focus, input[type=number]:focus, input[type=tel]:focus, input[type=date]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=month]:focus, input[type=time]:focus, input[type=week]:focus{
box-shadow:0 6px 16px 0 rgba(0, 0, 0, .17)
}
/* comment form */
#commentform p{
position:relative
}
#commentform p label{
font-size:.85em;
font-weight:inherit
}
#review_form p label{
transform:none
}
/************************************************************************************
ACCENT
*************************************************************************************/
/* box shadow */
.search-option-tab li:hover a,
.search-option-tab li.active a{
box-shadow:inset 0 -3px 0 0 #5984fe
}
/* border color */
.view-all-button:after{
border-color:#5984fe
}
/* background color */
#slide-cart .button,.woocommerce ul.products li.product .button,.woocommerce a.button.disabled,.woocommerce button.button.disabled,
.woocommerce button.button.alt.disabled,.woocommerce button.button:disabled,.woocommerce button.button:disabled[disabled],.woocommerce input.button.disabled,.woocommerce input.button:disabled,.woocommerce input.button:disabled[disabled],.woocommerce #respond input#submit,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,input[type=reset], input[type=submit], button{
background-color:#5984fe;
box-shadow:0 1px 6px 0 rgba(0, 0, 0,.17);
border-radius:3px
}
#slide-cart .button:hover,.woocommerce ul.products li.product .button:hover,.woocommerce a.button.alt.disabled:hover,.woocommerce button.button.alt.disabled:hover,.woocommerce button.button.alt:disabled:hover,.woocommerce button.button.alt:disabled[disabled]:hover,.woocommerce input.button.alt.disabled:hover,.woocommerce input.button.alt:disabled:hover,.woocommerce input.button.alt:disabled[disabled]:hover,.woocommerce #respond input#submit:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce input.button.alt:hover,input[type=reset]:hover, input[type=submit]:hover, button[type=submit]:hover{
background-color:#000;
box-shadow:0 6px 16px 0 rgba(0, 0, 0,.17)
}
/************************************************************************************
HEADER
*************************************************************************************/
#headerwrap{
background-color:#fff;
border:none;
box-shadow:0 3px 30px rgba(0,0,0,.08)
}
.transparent-header #headerwrap{
background:linear-gradient(to bottom, rgba(0, 0, 0, .6) 0%, rgba(0, 0, 0, 0) 100%);
box-shadow:none
}
.fp-viewing-main-home.transparent-header #headerwrap,
.fp-viewing-main-home #headerwrap,
.fp-viewing-main-0.transparent-header #headerwrap,
.fp-viewing-main-0 #headerwrap{
background:0
}
/* SITE LOGO
================================================ */
#site-logo{
font-size:1.5em;
text-transform:uppercase;
letter-spacing:.06em
}
/* main level link */
#main-nav a{
font-family:'Rubik',Arial,sans-serif;
font-size:.95em;
position:relative;
padding-left:0;
padding-right:0;
margin:0 .9em
}
#main-nav .has-mega-column .widgettitle, #main-nav .has-mega-column > .sub-menu > .columns-sub-item > a{
font-weight:300
}
/* link hover */
#main-nav a:hover,
#main-nav ul a:hover,
#main-nav .mega-menu-posts a:hover,
#main-nav .current_page_item > a,
#main-nav .current-menu-item > a{
color:#5984fe
}
.transparent-header #main-nav > li > a:hover,
.transparent-header #main-nav .current_page_item > a,
.transparent-header #main-nav .current-menu-item > a{
color:#fff
}
/* mega menu */
#main-nav .mega-menu-posts .post a{
margin:0
}
.single .mega-menu-posts .post-title{
text-align:unset
}
/* HEADER TOP BAR
================================================ */
.header-top-bar #main-nav > li > a:after{
content:'';
display:block;
border-bottom:solid 2px;
width:0;
height:2px;
position:absolute;
bottom:6px;
left:0;
transition:width .7s
}
/* main level link :hover & current link */
.header-top-bar #main-nav > li:hover > a:after,
.header-top-bar #main-nav > .current_page_item > a:after,
.header-top-bar #main-nav > .current-menu-item > a:after{
width:100%
}
/* HEADER HORIZONTAL
================================================ */
.header-horizontal #site-logo{
line-height:1.8em
}
/* HEADER MINBAR
================================================ */
.header-minbar #headerwrap{
background-color:rgba(89, 132, 254, 1)
}
.header-minbar .header-icons,
.header-minbar .header-bar{
color:#fff
}
.header-minbar .cart-wrap a span{
background-color:rgba(0,0,0,.5)
}
.header-minbar .show-count + .cart-wrap{
margin-left:-10px
}
/* HEADER STRIPE
================================================ */
.header-stripe #site-logo{
background-color:rgba(89, 132, 254, 1);
padding:.65em .8em
}
/* HEADER CLASSIC
================================================ */
.header-classic .navbar-wrapper{
background-color:rgba(89, 132, 254, 1)
}
/* HEADER MAGAZINE
================================================ */
.header-magazine .navbar-wrapper{
border-bottom:none
}
/* HEADER BOTTOM
================================================ */
.header-bottom #main-nav a{
padding-left:0;
padding-right:0
}
/************************************************************************************
POST
*************************************************************************************/
.post-title{
font-size:2.6em
}
/* query section posts */
.query-section .loops-wrapper.no-gutter.grid4,
.query-section .loops-wrapper.no-gutter.grid3,
.query-section .loops-wrapper.no-gutter.grid2{
margin:0
}
.query-section .loops-wrapper .post{
height:100vh;
text-align:left
}
.query-section .loops-wrapper .post-image img{
height:100vh;
width:100%
}
.query-section .loops-wrapper .post-image img{
object-fit:cover
}
.query-section .loops-wrapper .post-content{
box-sizing:border-box;
position:absolute;
top:0;
bottom:0;
left:0;
padding:35px;
padding-bottom:15%;
width:100%;
color:#fff;
z-index:0;
overflow:hidden;
pointer-events:none;
line-height:1.5em;
transition:padding .3s ease
}
.query-section .loops-wrapper .post a{
color:#fff
}
.query-section .loops-wrapper .post-content-inner{
display:flex;
flex-direction:column;
justify-content:flex-end;
height:100%
}
.query-section .loops-wrapper .post-content:before{
content:"";
background-image:linear-gradient( 90deg, rgb(49,57,60) 0%, rgba(49,57,60,0) 100%);
opacity:.8;
position:absolute;
top:0;
bottom:0;
left:0;
right:-1px;
z-index:-1
}
.query-section .loops-wrapper .post-content .post-title{
font-size:1.4em;
letter-spacing:normal;
line-height:1.3em
}
.query-section .loops-wrapper .post:hover .post-content{
padding-bottom:25%
}
.query-section .loops-wrapper .post{
overflow:hidden
}
.query-section .loops-wrapper .post-image img{
transition:transform .3s;
transform:scale(1)
}
.query-section .loops-wrapper .post:hover .post-image img{
transform:scale(1.1)
}
/* post date */
.loops-wrapper.list-post .post-date,
.single .post-content .post-date{
background-color:rgba(89, 132, 254, .8)
}
.commentlist .comment-reply-link:hover{
background-color:#5984fe;
border-color:#5984fe
}
.post-title a:hover,
.post-nav .arrow{
color:#5984fe
}
.post-nav a:hover span{
color:#000
}
/* related posts */
.related-posts .related-title{
font-weight:400
}
/************************************************************************************
PORTFOLIO
*************************************************************************************/
.loops-wrapper.grid4 .disp-cell.valignmid,
.loops-wrapper.grid3 .disp-cell.valignmid,
.loops-wrapper.grid2 .disp-cell.valignmid{
vertical-align:bottom;
text-align:left
}
.project-date, .project-client,
.project-services, .project-view{
color:#5984fe
}
/************************************************************************************
SIDEBAR
*************************************************************************************/
#sidebar{
font-size:.95em
}
.widgettitle{
font-weight:400
}
/************************************************************************************
FOOTER
*************************************************************************************/
#footerwrap{
border:none;
background:#fff;
box-shadow:0 -3px 30px rgba(0,0,0,.08)
}
#footer{
font-size:.95em
}
#footerwrap .footer-tab,
#footerwrap .back-top{
background-color:#5984fe;
}
#footerwrap .back-top{
box-shadow:none
}
/************************************************************************************
SECTION SCROLLING
*************************************************************************************/
.query-section .fp-controlArrow{
background-color:transparent
}
.fp-controlArrow.fp-prev:hover{
animation:arrow-prev 1s infinite;
animation-timing-function:linear
}
.fp-controlArrow.fp-next:hover{
animation:arrow-next 1s infinite;
animation-timing-function:linear
}
.fp-controlArrow:before{
box-shadow:2px -3px 5px rgba(0,0,0,.15)
}
#fp-nav li .active span,
.fp-slidesNav li .active span{
border-color:rgba(89, 132, 254, .8) !important
}
.section_loader{
background-color:#5984fe
}
body:not(.transparent-header).footer-none.query-section .fp-slidesNav.bottom,
.query-section .fp-slidesNav.bottom{
bottom:30px
}
/* Prev/Next position */
#pagewrap .fp-controlArrow.fp-prev{
left:5px
}
#pagewrap .fp-controlArrow.fp-next{
right:5px
}
/************************************************************************************
BUILDER STYLING
*************************************************************************************/
.module-icon span{
margin-left:0
}
.query-section .themify_builder:not(.not_editable_builder) .row_inner{
align-content:unset
}
/************************************************************************************
WOOCOMMERCE STYLES
*************************************************************************************/
/* ARCHIVE PRODUCTS
================================================ */
/* Sale */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale{
background-color:#5984fe
}
/* SINGLE PRODUCTS
================================================ */
/* tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{
border-color:#5984fe;
color:#000
}
/* quantity */
.woocommerce .quantity .qty{
padding:.55em .5em
}
.woocommerce div.product form.cart .button{
padding:.75em 1.2em
}
/* related products */
.woocommerce .related h2,
.woocommerce .upsells h2{
font-weight:400
}
.related.products ul.products li.product .woocommerce-loop-product__title,
.related ul.products li.product .price{
font-weight:inherit
}
/* breadcrumb */
.woocommerce .woocommerce-breadcrumb{
font-size:.8em;
letter-spacing:.02em;
text-transform:uppercase
}
/* CART
================================================ */
.woocommerce-cart #content table.cart td.actions .coupon .input-text{
border-radius:0
}
/* CHECKOUT
================================================ */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--single .select2-selection__arrow{
height:47px
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
line-height:47px
}
.select2-results__option[aria-selected],
.select2-results__option[data-selected]{
margin:0 0 .2em
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected]{
background-color:#5984fe
}
.woocommerce form .form-row textarea,
.select2-container--default .select2-selection--single{
border:none;
box-shadow:0 1px 6px 0 rgba(0, 0, 0, .17)
}
.woocommerce form .form-row textarea:focus,
.select2-container--default .select2-selection--single:focus{
box-shadow:0 6px 16px 0 rgba(0, 0, 0, .17)
}
/* Cart Icon */
.cart-wrap a span{
background-color:rgba(89, 132, 254, .8);
font-weight:700;
line-height:1.1
}
#slide-cart{
font-size:.9em
}
/* woocommerce widget */
.woocommerce ul.product_list_widget li a,
.woocommerce ul.product_list_widget li .product-title{
font-weight:inherit
}
ul.product_list_widget li .post-image{
margin:0
}
/* section scroll products */
.query-section .woocommerce ul.products{
margin:0;
}
.query-section .module-products .wc-products .product{
margin:0;
}
.query-section .module-products .wc-products .post-image{
margin:0;
height:50vh
}
.query-section .module-products .wc-products .post-image img{
width:100%;
height:100%;
object-fit:cover;
border-radius:0
}
.query-section .module-products .wc-products .post-image + .post-content{
position:absolute;
top:0;
height:100%;
width:100%;
display:flex;
flex-direction:column;
justify-content:flex-end;
box-sizing:border-box;
padding:5%;
z-index:0;
pointer-events:none;
transition:background .3s ease,padding .3s ease
}
.query-section .module-products .wc-products .post-image + .post-content:before{
content:"";
display:block;
position:absolute;
top:0;
left:0;
width:101%;
height:101%;
background:linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 70%,rgba(0,0,0,.3) 100%);
z-index:-1;
transition:background .3s ease
}
.query-section .module-products .wc-products .product:hover .post-image + .post-content:before{
background:linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,.03) 40%,rgba(0,0,0,.6) 100%)
}
.query-section .module-products ul.products li.product a,
.query-section .module-products ul.products li.product .price{
color:#fff
}
.query-section .module-products .wc-products .product h3{
font-size:1em
}
.query-section .module-products .post-content .price{
font-weight:400;
font-size:1.1em;
margin:0 0 5px;
color:inherit
}
.query-section .module-products .star-rating{
margin-left:auto;
margin-right:auto
}
.query-section .module-products.woocommerce ul.products li.product .button{
background-color:transparent;
box-shadow:none;
text-transform:none;
font-size:1em;
font-weight:400;
letter-spacing:.05em;
padding:0
}
.query-section .module-products.woocommerce ul.products li.product .button.loading{
padding-right:1.6em;
opacity:1
}
.query-section .module-products.woocommerce ul.products li.product .button.loading:after{
top:0;
right:0
}
.query-section .module-products .button:before{
content:'';
border-radius:2px;
border:2px solid transparent;
border-top-color:inherit;
border-right-color:inherit;
min-width:.5em;
min-height:.5em;
transform:rotateZ(45deg);
text-decoration:none;
display:inline-block;
position:absolute;
right:0;
margin-right:-15px
}
.query-section .module-products .added.button:before{
display:none
}
.query-section .module-products .add-to-cart-button{
margin:0;
pointer-events:all
}
.query-section .module-products a.added_to_cart{
color:inherit
}
.query-section .module-products a.added_to_cart{
font-size:.9em;
padding:0
}
/* grid styles */
.query-section .module-products .loops-wrapper.products.grid2>.product,
.query-section .module-products .wc-products.grid2 .grid-sizer,
.query-section .module-products .wc-products.grid2 .product{
width:50%;
}
.query-section .module-products .loops-wrapper.products.grid3>.product,
.query-section .module-products .wc-products.grid3 .grid-sizer,
.query-section .module-products .wc-products.grid3 .product{
width:33.3333%;
}
.query-section .module-products .loops-wrapper.products.grid4>.product,
.query-section .module-products .wc-products.grid4 .grid-sizer,
.query-section .module-products .wc-products.grid4 .product{
width:25%;
}
.query-section .module-products ul.wc-products li.product{
height:50vh;
margin:0
}
.query-section .module-products .wc-products .gutter-sizer{
width:0
}
.query-section .loops-wrapper .product .post-image img{
height:50vh
}
.query-section .module-products .wc-products .product .price,
.query-section .loops-wrapper .post .price,
.query-section .module-products .wc-products .product .add-to-cart-button,
.query-section .loops-wrapper .post .add-to-cart-button{
opacity:0;
visibility:hidden;
max-height:0;
overflow:hidden;
transition:opacity .3s ease,visibility .3s ease,max-height .3s ease
}
.query-section .module-products .wc-products .product:hover .price,
.query-section .loops-wrapper .post:hover .price,
.query-section .module-products .wc-products .product:hover .add-to-cart-button,
.query-section .loops-wrapper .post:hover .add-to-cart-button{
opacity:1;
visibility:visible;
max-height:100px
}
.query-section .module-products .product:hover .post-image + .post-content{
padding-bottom:15%
}
/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
@media screen and (min-width:681px){
.header-minbar .fp-slidesNav{
transform:translateX(33px)
}
.loops-wrapper.grid4 .post:nth-of-type(2n+1){
clear:none
}
}
@media screen and (max-width:860px){
.query-section .module-products .woocommerce .wc-products .grid-sizer{
width:50% !important
}
.query-section .module-products .woocommerce .wc-products .gutter-sizer{
width:0 !important
}
}
@media screen and (max-width:680px){
.header-minbar .show-count + .cart-wrap{
margin-left:-5px
}
.header-minbar.no-fixed-header.slide-cart-visible.page-loaded #pagewrap #headerwrap,
.header-minbar.no-fixed-header.mobile-menu-visible.page-loaded #pagewrap #headerwrap{
left:0
}
.query-section .loops-wrapper.grid4 .post,
.query-section .loops-wrapper.grid3 .post,
.query-section .loops-wrapper.grid2 .post{
height:50vh
}
.post-title{
font-size:1.8em
}
.query-section .module-products ul.wc-products.products.grid2 li.product,
.query-section .module-products ul.wc-products.products.grid3 li.product,
.query-section .module-products ul.wc-products.products.grid4 li.product{
margin:0;
width: 50% !important;
}
.query-section .module-products .products.masonry-done .gutter-sizer{
width:0!important;
}
}