sweedy/style.css

498 lines
11 KiB
CSS

/*
Theme Name: Sweedy
Theme URI: https://kumig.it/kumisystems/sweedy/
Author: Kumi Systems e.U.
Author URI: https://kumi.systems/
Description: Theme for Sweedy - Original Swedish Candyshop
Template: specia
Version: 1.0.32
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sweedy
Tags: one-column, two-columns, left-sidebar, right-sidebar, flexible-header, custom-background, custom-colors, custom-header, custom-menu, custom-logo, featured-image-header, featured-images, footer-widgets, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, blog, e-commerce, education, entertainment, food-and-drink, photography, portfolio, editor-style, grid-layout
*/
/*---------------------------------------
Header Social Icons
-----------------------------------------*/
.header-top-info-1 .social {
padding: 0px 0;
margin: 0;
line-height: 20px;
padding: 5px 0 4px;
}
.header-top-info-1 .social li {
font-family: 'Awesomefont';
margin-right: 4px;
display: inline-block;
}
.header-top-info-1 .social li {
position: relative;
}
.text-center .social li {
margin: 0 2px;
}
.social li a {
display: table;
position: relative;
-webkit-transition: .3s all;
transition: .3s all;
overflow: hidden;
}
.header-top-info-1 .social li a i {
background: #ffffff;
border-radius: 3px;
text-align: center;
display: table-cell;
vertical-align: middle;
color: #283645;
width: 25px;
height: 25px;
font-size: 12px;
-webkit-transition: all 200ms ease-out;
-moz-transition: all 200ms ease-out;
-o-transition: all 200ms ease-out;
transition: all 200ms ease-out;
}
.header-top-info-1 .social li a i:hover {
color: #ffffff;
-webkit-animation: socialFxD .3s forwards;
animation: socialFxD .3s forwards
}
@-webkit-keyframes socialFxD {
49% {
-webkit-transform: translateX(100%);
transform: translateX(100%)
}
50% {
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-webkit-transform: translateX(-100%);
transform: translateX(-100%)
}
51% {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}
}
@keyframes socialFxD {
49% {
-webkit-transform: translateX(100%);
transform: translateX(100%)
}
50% {
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-webkit-transform: translateX(-100%);
transform: translateX(-100%)
}
51% {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}
}
/*---------------------------------------
Header Contact Details
-----------------------------------------*/
.header-top-info-1{
float: none;
position: relative;
background: #283645;
border-bottom: 1px solid #e6e9ed;
z-index: 0;
padding: 4px 0;
}
.header-top-info-1 .info {
padding-left: 0;
margin: 0;
padding-top: 4px;
}
.header-top-info-1 .info li {
font-size: 13px;
padding-right: 0;
display: inline-block;
}
.header-top-info-1 .info li i {
margin-right: 6px;
font-size: 16px;
line-height: 20px;
}
.header-top-info-1 .info li a {
font-size: 13px;
margin-right: 10px;
color: #ffffff;
}
/*---------------------------------------
Header Menu
-----------------------------------------*/
.navbar {
padding: 10px 2px 9px;
}
.nav-fabify {
position: relative;
top: 32px;
border-radius: 3px;
z-index: 9;
}
.nav-fabify .navbar-nav li a {
color: #ffffff;
}
.nav-fabify .navbar-nav li a:hover {
color: #ffffff !important;
}
.nav-fabify .dropdown-menu > li > a {
color: #747474;
}
.nav-fabify ul {
float: left !important;
}
.header-fabify {
text-align: left;
padding-left: 0;
padding-right: 0;
color: blue;
}
.header-fabify .navbar-brand {
margin: 0;
padding-left: 0;
}
.header-fabify .navbar-brand p.site-description {
margin:0;
color: blue;
}
.site-description {
color: #0AA4E5;
font-style: normal;
font-weight: bold;
font-size: 26px;
}
@media (min-width: 768px) {
.nav-fabify .navbar-nav {
width: 100%;
}
.nav-fabify .navbar-nav > li {
float: none;
display: inline-block;
}
.nav-fabify .navbar-nav > li.navbar-right {
float: right !important;
}
}
/* .navbar-brand { display: block; } */
.navbar-custom .navbar-toggle {text-align: center;}
@media (min-width: 768px) {
.navbar-brand { display: block; }
.navbar-custom .navbar-toggle {text-align: left;}
}
@media only screen and (max-width: 767px) and (min-width: 240px) {
.navbar-toggle {
float: left;
margin: 0 auto;
position: relative;
left: 44%;
}
}
/*---------------------------------------
Service
-----------------------------------------*/
/* Effect 3 */
.specia-icon-effect-3 .specia-icon {
box-shadow: 0 0 0 4px #fff;
-webkit-transition: color 0.3s;
-moz-transition: color 0.3s;
transition: color 0.3s;
}
.specia-icon-effect-3 .specia-icon:after {
top: -2px;
left: -2px;
padding: 2px;
z-index: -1;
background: #1c314c;
-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
-moz-transition: -moz-transform 0.2s, opacity 0.3s;
transition: transform 0.2s, opacity 0.3s;
}
/* Effect 3a */
.specia-icon-effect-3a .specia-icon {
color: #ffffff;
}
.specia-icon-effect-3a .specia-icon:hover {
color: #ffffff;
}
.specia-icon-effect-3a .specia-icon:hover:after {
-webkit-transform: scale(1.3);
-moz-transform: scale(1.3);
-ms-transform: scale(1.3);
transform: scale(1.3);
opacity: 0;
}
.post_date h6 {
color: #ffffff !important;
}
.breadcrumb.fabify .background-overlay {
background: #283645;
opacity: 9;
}
.breadcrumb.fabify h2, .page-breadcrumb li {
color: #ffffff;
}
/*---------------------------------------
Service
-----------------------------------------*/
figure.effect-apollo {
background: #000000;
}
figure.effect-apollo img {
opacity: 0.95;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
-webkit-transform: scale3d(1.05,1.05,1);
transform: scale3d(1.05,1.05,1);
}
figure.effect-apollo figcaption::before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(255,255,255,0.1);
content: '';
-webkit-transition: -webkit-transform 0.6s;
transition: transform 0.6s;
-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
}
figure.effect-apollo p {
color: #ffffff;
font-size: 13px;
font-family: 'Open Sans', sans-serif;
font-weight: lighter;
position: absolute;
right: 0;
margin: 0;
padding: 0 30px;
border-left: 5px solid #1490d7;
text-align: center;
opacity: 0;
-webkit-transition: opacity 0.35s;
transition: opacity 0.35s;
}
figure.effect-apollo h2 {
margin-top: 40px;
}
figure.effect-apollo:hover img {
opacity: 0.6;
-webkit-transform: scale3d(1,1,1);
transform: scale3d(1,1,1);
}
figure.effect-apollo:hover figcaption::before {
-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
}
figure.effect-apollo:hover p {
opacity: 1;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
}
/*---------------------------------------
Header Search
-----------------------------------------*/
form.searchbox > input[type="search"], input[type="submit"] {
/* border: 0 !important; */
border-radius: 30px;
}
form.searchbox > input[type="submit"] {
border: none !important;
}
form.searchbox-open > input[type="search"] {
border: solid 1px #1490d7;
border-radius: 30px;
padding: 0 30px;
}
.searchbox{
position:relative;
min-width:52px;
width:0%;
height:50px;
float:right;
overflow:hidden;
border:0;
-webkit-transition: width 0.3s;
-moz-transition: width 0.3s;
-ms-transition: width 0.3s;
-o-transition: width 0.3s;
transition: width 0.3s;
}
.searchbox-input{
top:0;
right:0;
border:0;
outline:0;
background:#dcddd8;
width:100%;
height:50px;
margin:0;
padding:0px 55px 0px 20px;
font-size:20px;
color:red;
}
.searchbox-input::-webkit-input-placeholder {
color: #1490d7;
}
.searchbox-input:-moz-placeholder {
color: #1490d7;
}
.searchbox-input::-moz-placeholder {
color: #1490d7;
}
.searchbox-input:-ms-input-placeholder {
color: #1490d7;
}
.searchbox-icon,
.searchbox-submit,
.searchbox-open .searchbox-icon,
.searchbox-open .searchbox-submit{
width:50px;
height:50px;
display:block;
position:absolute;
top:0;
font-family:verdana;
font-size:22px;
right:0;
padding:0;
margin:0;
border:0;
outline:0;
line-height:50px;
text-align:center;
cursor:pointer;
color:#dcddd8;
background:#172b3c;
border-radius: 50%;
}
span.searchbox-icon:hover {
background: #1490d7;
}
.searchbox-open{
width:100%;
}
/*---------------------------------------
Header Cart
-----------------------------------------*/
ul.search-cart {
margin: 0;
}
ul.search-cart li {
display: inline-block;
margin-left: 6px;
}
.fabify-cart {
background: transparent;
width: 50px;
border: solid 1px #283645;
height: 50px;
position: relative;
right: 0;
border-radius: 50%;
}
.fabify-cart a.cart-icon {
position: relative;
left: 8px;
top: 14px;
}
.fabify-cart a.cart-icon i {
font-size: 20px;
color: #283645;
}
.fabify-cart a.cart-icon span {
position: relative;
font-size: 11px;
bottom: 20px;
left: -5px;
color: #ffffff;
padding: 2px 6px;
border-radius: 50%;
}
/*---------------------------------------
Header Button
-----------------------------------------*/
.fabify-button a {
padding: 16px 32px;
line-height: 49px;
border-radius: 30px;
color: #fff;
}
.fabify-button a:hover, .fabify-button a:focus {
color: #ffffff;
}
.features-version-six {
height: 100%;
overflow: hidden;
width: 100%;
background: #fbfbfb;
}
.features-version-six p {
color: #747474;
}
/*---------------------------------------
Top Scroller
-----------------------------------------*/
.top-scroll {
bottom: 2%;
display: none;
height: 40px;
opacity: 1;
overflow: hidden;
position: fixed;
right: 12px;
text-align: center;
width: 40px;
z-index: 9999;
border-radius: 3px;
border-width: 2px;
border-style: solid;
animation: none;
}
.top-scroll i {
color: #ffffff;
}
@media only screen and (min-device-width: 200px) and (max-device-width: 480px) {
.search-cart {
text-align: center;
}
.textwidget .woocommerce .products ul, .woocommerce ul.products {
padding: 0 17px;
}
}