mirror of
https://github.com/Dvorinka/reklik.git
synced 2026-06-03 20:02:57 +00:00
first commit
This commit is contained in:
Tomas Dvorak
Vendored
+23
File diff suppressed because one or more lines are too long
Vendored
+2
File diff suppressed because one or more lines are too long
+305
@@ -0,0 +1,305 @@
|
||||
/* ===================================
|
||||
Crafto - Web agency
|
||||
====================================== */
|
||||
/* font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
|
||||
/* variable */
|
||||
:root {
|
||||
--base-color: #3da0d5;
|
||||
--medium-gray:#6F7071;
|
||||
--dark-gray:#1C1D1F;
|
||||
--alt-font: 'Inter', sans-serif;
|
||||
--primary-font: 'Inter', sans-serif;
|
||||
}
|
||||
body {
|
||||
font-size: 17px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
/* Social Icons */
|
||||
.social-icon-style-10 ul.small-icon li a.globe::before {
|
||||
content: "\f0ac";
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.social-icon-style-10 ul.small-icon li a.camera::before {
|
||||
content: "\f030";
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.social-icon-style-10 ul.small-icon li a.instagram::before {
|
||||
content: "\f16d";
|
||||
font-family: 'Font Awesome 5 Brands';
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* Text highlight effect for overlapping with reklik element */
|
||||
.highlight-text {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
color: inherit;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.highlight-text::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--base-color);
|
||||
mix-blend-mode: screen;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.highlight-text.overlapping {
|
||||
color: white;
|
||||
text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.highlight-text.overlapping::before {
|
||||
opacity: 1;
|
||||
}
|
||||
.top-space-margin {
|
||||
margin-top: 120px;
|
||||
}
|
||||
/* header */
|
||||
.navbar .navbar-nav .nav-link {
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
}
|
||||
header .navbar-brand img {
|
||||
max-height:56px;
|
||||
}
|
||||
header .btn.btn-switch-text.btn-medium > span {
|
||||
padding: 11px 30px;
|
||||
}
|
||||
.navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a img {
|
||||
border-radius: 0;
|
||||
}
|
||||
/* btn */
|
||||
.btn.btn-base-color {
|
||||
color: var(--dark-gray);
|
||||
}
|
||||
.btn.btn-box-shadow.btn-base-color:hover, .btn.btn-box-shadow.btn-base-color:active {
|
||||
color: var(--dark-gray);
|
||||
}
|
||||
/* letter spacing */
|
||||
.bg-base-color-transparent {
|
||||
background-color: #3da0d5f4;
|
||||
}
|
||||
/* banner title */
|
||||
.banner-title {
|
||||
font-size: 650px;
|
||||
word-break: normal;
|
||||
letter-spacing: -40px;
|
||||
}
|
||||
/* letter spacing */
|
||||
.ls-minus-20px {
|
||||
letter-spacing: -20px;
|
||||
}
|
||||
.ls-minus-13px {
|
||||
letter-spacing: -13px;
|
||||
}
|
||||
.mt-minus-12 {
|
||||
margin-top: -12%;
|
||||
}
|
||||
/* word break normal */
|
||||
.word-break-normal {
|
||||
word-break: normal;
|
||||
}
|
||||
/* bg color */
|
||||
.bg-sherpa-blue {
|
||||
background-color: #333436;
|
||||
}
|
||||
/* page title */
|
||||
.page-title-extra-large h1 {
|
||||
font-size: 5rem;
|
||||
line-height: 5rem;
|
||||
}
|
||||
/* team style */
|
||||
.team-style-05 img {
|
||||
filter: grayscale(100%);
|
||||
-webkit-filter: grayscale(100%);
|
||||
-moz-filter: grayscale(100%);
|
||||
}
|
||||
.team-style-05:hover img {
|
||||
filter: grayscale(0%);
|
||||
-webkit-filter: grayscale(0%);
|
||||
-moz-filter: grayscale(0%);
|
||||
}
|
||||
.team-style-08 figure img {
|
||||
filter: grayscale(100%);
|
||||
-webkit-filter: grayscale(100%);
|
||||
-moz-filter: grayscale(100%);
|
||||
}
|
||||
.team-style-08:hover figure img {
|
||||
filter: grayscale(0%);
|
||||
-webkit-filter: grayscale(0%);
|
||||
-moz-filter: grayscale(0%);
|
||||
}
|
||||
.team-style-08 figure figcaption .social-icon a {
|
||||
background-color: var(--base-color);
|
||||
}
|
||||
.team-style-08 figure figcaption .social-icon a:hover {
|
||||
color: var(--dark-gray);
|
||||
}
|
||||
/* blog comment */
|
||||
.blog-classic .card .blog-image img {
|
||||
filter: grayscale(100%);
|
||||
-webkit-filter: grayscale(100%);
|
||||
-moz-filter: grayscale(100%);
|
||||
}
|
||||
.blog-comment li .btn-reply:hover {
|
||||
color: var(--text-dark-gray);
|
||||
}
|
||||
/* tag */
|
||||
.tag-cloud a {
|
||||
background-color: var(--white);
|
||||
}
|
||||
/* portfolio-image */
|
||||
.portfolio-simple .grid-item .portfolio-image img {
|
||||
filter: grayscale(100%);
|
||||
-webkit-filter: grayscale(100%);
|
||||
-moz-filter: grayscale(100%);
|
||||
}
|
||||
.portfolio-simple .portfolio-box:hover .portfolio-image img {
|
||||
opacity: 1;
|
||||
filter: grayscale(0%);
|
||||
-webkit-filter: grayscale(0%);
|
||||
-moz-filter: grayscale(0%);
|
||||
}
|
||||
/* popular post sidebar */
|
||||
.popular-post-sidebar li figure {
|
||||
width: 190px;
|
||||
height: auto;
|
||||
}
|
||||
.popular-post-sidebar li .media-body {
|
||||
padding-left: 40px;
|
||||
}
|
||||
/* social icon style 06 */
|
||||
.social-icon-style-06 li {
|
||||
position: relative;
|
||||
}
|
||||
.social-icon-style-06 li:before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 100%;
|
||||
background-color: var(--medium-gray);
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: -15px;
|
||||
transform: translateY(-50%);
|
||||
opacity: .5;
|
||||
}
|
||||
.social-icon-style-06 li:last-child:before {
|
||||
display: none;
|
||||
}
|
||||
/* footer */
|
||||
footer .footer-logo img {
|
||||
max-height: 56px;
|
||||
}
|
||||
footer .nav-link {
|
||||
color: var(--dark-gray);
|
||||
}
|
||||
.footer-navbar li a:hover {
|
||||
color: var(--dark-gray);
|
||||
}
|
||||
/* media query responsive */
|
||||
@media (min-width: 992px) {
|
||||
.navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
/* heading tag */
|
||||
h1 {
|
||||
font-size: 5rem;
|
||||
line-height: 5rem;
|
||||
}
|
||||
h2 {
|
||||
font-size: 3.75rem;
|
||||
line-height: 3.75rem;
|
||||
}
|
||||
h3 {
|
||||
font-size: 3.125rem;
|
||||
line-height: 3.125rem;
|
||||
}
|
||||
}
|
||||
@media (max-width: 1399px) {
|
||||
.banner-title {
|
||||
font-size: 500px;
|
||||
}
|
||||
header .btn.btn-switch-text.btn-medium > span {
|
||||
padding: 11px 22px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 1199px) {
|
||||
.banner-title {
|
||||
font-size: 380px;
|
||||
letter-spacing: -25px;
|
||||
}
|
||||
.ls-minus-20px {
|
||||
letter-spacing: -15px;
|
||||
}
|
||||
header .btn.btn-switch-text.btn-medium > span {
|
||||
padding: 6px 11px;
|
||||
}
|
||||
.navbar .navbar-nav .nav-link {
|
||||
padding: 10px 12px;
|
||||
}
|
||||
footer .nav-link {
|
||||
padding: 2px 8px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 991px) {
|
||||
.banner-title {
|
||||
font-size: 270px;
|
||||
letter-spacing: -15px;
|
||||
}
|
||||
.ls-minus-20px {
|
||||
letter-spacing: -10px;
|
||||
}
|
||||
.top-space-margin {
|
||||
margin-top: 100px;
|
||||
}
|
||||
header .btn.btn-switch-text.btn-medium > span {
|
||||
padding: 9px 24px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.banner-title {
|
||||
font-size: 200px;
|
||||
letter-spacing: -15px;
|
||||
}
|
||||
.process-step-style-10.hover-box:hover .hover-content {
|
||||
bottom: 0;
|
||||
}
|
||||
.ls-minus-20px {
|
||||
letter-spacing: -4px;
|
||||
}
|
||||
.ls-minus-13px {
|
||||
letter-spacing: -5px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 575px) {
|
||||
.banner-title {
|
||||
font-size: 110px;
|
||||
letter-spacing: -3px;
|
||||
}
|
||||
.popular-post-sidebar li figure {
|
||||
width: 100%;
|
||||
}
|
||||
.popular-post-sidebar li .media-body {
|
||||
padding-left: 0;
|
||||
padding-top: 25px;
|
||||
}
|
||||
}
|
||||
Vendored
+2
File diff suppressed because one or more lines are too long
Vendored
+42
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user