| Current Path : /home/antonen/poznajlitwe.lt/templates/it_startup/scss/startup/ |
| Current File : //home/antonen/poznajlitwe.lt/templates/it_startup/scss/startup/_particle-overrides.scss |
// Override for Particles Title and Introtext that comes from "UIkit for Gantry5" atom
body {
.g-particle-intro {
margin-bottom: 2.4rem;
text-align: center;
.g-particle-intro {
margin-bottom: 3rem;
}
.g-main-title {
margin-bottom: 0;
}
.g-title-separator {
display: none;
height: 2px;
width: 100px;
margin: 20px auto;
background: $accent-color-1;
&.no-intro-text {
margin: 2.5rem auto 0;
}
}
.g-introtext {
margin-top: 25px;
}
}
.g-flushed {
.g-particle-intro {
margin-top: 3.5rem;
margin-bottom: 3rem;
}
}
}
body {
// Offcanvas Toggle
.offcanvas-toggle-particle {
&.g-offcanvas-toggle {
color: $header-text-color;
width: 35px;
height: 35px;
line-height: 32px;
font-size: 0.9rem;
text-align: center;
border: 2px solid $base-border-color;
border-radius: 50%;
@include transition(all, 0.2s);
&:hover {
color: $accent-color-1;
border-color: $accent-color-1;
}
}
}
// Modal Search
.modal-search-container {
> a {
display: block;
width: 35px;
height: 35px;
line-height: 32px;
font-size: 0.9rem;
text-align: center;
border: 2px solid $base-border-color;
border-radius: 50%;
@include transition(all, 0.2s);
&:hover {
color: $accent-color-1;
border-color: $accent-color-1;
}
}
}
// Features Particle
.g-features-particle, .g-features2-particle {
.g-features-particle-title, .g-features2-particle-title {
font-size: 18px;
font-weight: 500;
}
}
// Content (PRO) and Content PRO (Joomla) Particles
.g-content-pro, .g-content-pro-slider, .g-content-pro-slideset {
&.gutter-enabled {
.uk-slider-container {
padding: 5px;
margin: -5px;
}
.g-content-pro-item {
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.07);
border: none;
}
}
.g-info-container {
padding: 25px;
}
.g-content-pro-desc {
margin-top: 0.8rem;
}
.g-item-details {
margin-top: 0.8rem;
color: $accent-color-1;
}
.g-content-pro-special {
color: $accent-color-1;
}
.g-info-container-style2 {
padding: 25px !important;
.g-content-pro-special, .g-item-details {
color: $accent-color-1;
}
}
.g-article-details {
color: $accent-color-1;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 12px;
&.details-showbottom {
padding-top: 15px;
margin-top: 25px;
margin-bottom: -10px;
border-top: 1px solid lighten($base-border-color, 4%);
}
}
}
// Animated Counter Particle
.g-animated-counter {
.g-animated-counter-number {
font-size: 390%;
margin-top: -25px;
}
.g-animated-counter-title {
color: $accent-color-1 !important;
font-size: $fontsizes-body-font-size;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: -5px;
}
}
// CTA Button Particle
.g-cta-button {
&.style2 {
.g-cta-inner {
.g-cta-right {
.button {
border-width: 1px;
border-color: inherit;
border-radius: 0;
color: inherit;
&:hover {
border-color: $accent-color-1;
}
}
}
.g-cta-left {
&.no-desc {
.g-cta-title {
margin-top: 10px;
}
}
}
}
&.cta-negative-margin {
margin: -20px 0;
}
}
&.button-icon-right {
.button {
i {
@include breakpoint(mobile-only) {
display: none;
}
@include breakpoint(tablet-range) {
display: none;
}
}
}
}
&.vertical-layout {
margin: 5px 0 25px;
.g-cta-inner {
.g-cta-left {
float: none;
text-align: center;
}
.g-cta-right {
float: none;
text-align: center;
display: block;
margin-top: 40px;
}
.g-cta-title {
font-size: 50px;
margin-bottom: 0;
}
}
}
}
// Video Feature Particle
.g-video-feature {
.g-video-feature-title {
&:after {
height: 3px;
display: block;
background: $accent-color-1;
content: "";
width: 75px;
margin: 7px auto;
}
}
&.uk-text-left {
.g-video-feature-title {
&:after {
margin: 7px 0;
}
}
}
}
// Gallery Feature Particle
.g-gallery-feature {
.g-gallery-feature-title {
&:after {
height: 3px;
display: block;
background: $accent-color-1;
content: "";
width: 75px;
margin-top: 7px;
}
}
&.uk-text-left {
.g-gallery-feature-title {
&:after {
margin: 7px 0;
}
}
}
}
// Main Feature Particle
.g-main-feature {
&.g-hero {
padding-top: 100px;
@include breakpoint(mobile-only) {
padding-top: 0;
}
@include breakpoint(tablet-range) {
padding-top: 0;
}
.g-main-feature-title {
font-size: 50px;
line-height: 1.3;
&:after {
display: none;
}
@include breakpoint(mobile-only) {
font-size: 40px;
}
}
.g-main-feature-link {
margin-top: 20px;
background: none;
border: 1px solid #ffffff;
@include transition(background 0.2s, border-color 0.2s);
&:hover {
background: $accent-color-1;
border-color: $accent-color-1;
}
@include breakpoint(small-mobile-range) {
margin-top: 25px;
}
}
.g-main-feature-buttons {
@include breakpoint(small-mobile-range) {
margin-top: 45px;
}
}
.g-custom-description {
line-height: 1.8;
}
&.button-icon-right {
.button {
i {
@include breakpoint(small-mobile-range) {
display: none;
}
}
}
}
}
.g-main-feature-title {
&:after {
height: 3px;
display: block;
background: $accent-color-1;
content: "";
width: 75px;
margin-top: 7px;
}
}
}
// Chart Particle
.g-chart {
.g-chart-feature-title {
&:after {
height: 3px;
display: block;
background: $accent-color-1;
content: "";
width: 75px;
margin-top: 7px;
}
}
}
// Memories Particle
.g-memories {
.g-memories-title {
&:after {
height: 3px;
display: block;
background: $accent-color-1;
content: "";
width: 75px;
margin-top: 7px;
}
}
&.uk-text-left {
.g-memories-title {
&:after {
margin: 7px 0;
}
}
}
}
// Pricing Tables Particle
.g-pricing-tables {
.g-small-top {
font-size: 24px !important;
vertical-align: top;
line-height: 3.8rem;
margin-right: 3px;
}
.g-small-bottom {
font-size: 24px !important;
}
.g-table-price {
font-size: 50px !important;
@include breakpoint(desktop-range) {
}
}
&.style1 {
.featured-table {
.g-table-title {
padding: 28px 20px;
}
}
}
&.style2 {
.g-table-head {
background: $accent-color-2;
}
.g-table-body {
padding: 25px 30px;
}
.g-table-title {
margin-bottom: -10px;
h4 {
text-transform: none;
font-size: 40px;
color: #ffffff !important;
}
}
.g-table-price {
font-weight: normal;
}
.g-table-item {
padding: 10px 20px;
border-color: lighten($base-border-color, 4%);
&:nth-child(even) {
background: none;
}
&:last-child {
border-bottom: none;
padding-bottom: 0;
}
}
.g-table-button {
padding-top: 10px;
padding-bottom: 40px;
.button {
border: none !important;
background: $accent-color-1;
color: #ffffff;
&:hover {
background: $accent-color-2;
}
}
}
.featured-table {
.g-table-head {
background: lighten($accent-color-2, 7%);
}
.g-table-price {
color: $accent-color-1;
}
}
&.gutter-disabled {
.g-pricing-table-inner {
border: none !important;
}
.g-grid {
border: none;
> .g-block {
&:first-child {
.g-table-body {
border-left: 1px solid $base-border-color;
}
.g-table-button {
border-left: 1px solid $base-border-color;
}
}
}
}
.g-table-body {
border-right: 1px solid $base-border-color;
@include breakpoint(mobile-only) {
border-left: 1px solid $base-border-color;
}
}
.g-table-button {
border-bottom: 1px solid $base-border-color;
border-right: 1px solid $base-border-color;
@include breakpoint(mobile-only) {
border-left: 1px solid $base-border-color;
}
}
}
}
}
// Feedback Particle
.g-feedback, .g-feedback-slider, .g-feedback-slideset {
&.custom-bg {
.g-grid, .uk-slidenav-position {
background: url(gantry-media://bg-pattern.png) repeat;
}
}
&.style3 {
.g-user-name {
color: $accent-color-1;
}
}
}
.g-flushed {
.g-feedback, .g-feedback-slider, .g-feedback-slideset {
margin: 0;
.uk-grid {
margin-left: 0;
> * {
padding-left: 0;
}
}
.g-feedback-item {
padding: 40px;
box-shadow: 4px 4px 2px rgba(0, 0, 0, 0.02) inset;
}
}
}
// Companies Particle
.g-companies, .g-companies-slider, .g-companies-slideset {
&.no-border {
.g-companies-item {
img {
border: none;
}
}
&.style2 {
.g-companies-item {
&:hover {
box-shadow: none !important;
}
}
}
}
}
// News Pro (Joomla) particle in the Footer
.g-news-pro {
&.footer {
.g-news-pro-item, .g-news-pro-link {
.g-news-pro-title {
font-family: get-font-family($fonts-body-font);
font-size: $fontsizes-body-font-size;
font-weight: normal;
line-height: inherit;
margin-bottom: 7px;
a {
color: $footer-text-color !important;
&:hover {
color: $accent-color-1 !important;
}
}
}
}
.uk-grid {
+ .uk-grid {
padding-top: 0;
margin-top: 0;
}
}
}
}
// Portfolio Particle
.g-portfolio {
.g-portfolio-filter {
margin-bottom: 40px;
&.uk-subnav {
> * > * {
color: #ffffff;
}
}
&.uk-subnav-pill > * > * {
border: none;
border-radius: 0;
padding: 3px 12px;
background: $accent-color-1;
@include transition(all, 0.2s);
&:focus, &:hover {
background: $accent-color-2;
box-shadow: none;
border: none;
color: #ffffff;
}
}
.uk-active {
> a {
background: $accent-color-2;
border: none;
color: #ffffff;
box-shadow: none;
}
}
}
&.gutter-enabled {
.g-portfolio-item {
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.07);
border: none;
}
}
.g-info-container {
padding: 25px;
}
.g-content-pro-desc {
margin-top: 0.8rem;
}
.g-item-details {
margin-top: 0.8rem;
color: $accent-color-1;
}
.g-portfolio-special {
color: $accent-color-1;
}
.g-info-container-style2 {
padding: 25px !important;
.g-portfolio-special, .g-item-details {
color: $accent-color-1;
}
}
&.style3 {
.g-info-container {
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.07);
border: none;
}
}
}
// Skill Bars Particle
.g-skill-bars {
div[class^="g-skill-bars-bar-container"] {
&:last-child {
.g-skill-bars-bar {
margin-bottom: 0;
}
}
}
.g-skill-bars-bar {
margin-bottom: 20px;
}
&.style1, &.style4 {
.g-skill-bars-bar {
border-radius: 50px;
.g-skill-bars-title {
border-radius: 50px;
font-weight: normal;
font-size: 1rem;
padding: 0 30px;
}
.g-skill-bars-background {
border-radius: 50px;
}
.g-skill-bars-percent {
font-size: 14px;
color: $base-text-color;
padding: 0 15px;
}
}
}
}
// Particles's Button Icon on the right
.button-icon-right {
.button {
i {
float: right;
margin: 5px 0 0 30px !important;
}
}
}
}
// Overrides for styles coming from "UIkit for Gantry5" atom
body {
// Lightbox hover magnifier icon size
.uk-overlay-area:empty::before, .uk-overlay-icon::before {
font-size: 30px;
height: 40px;
width: 40px;
line-height: 40px;
margin-left: -20px;
margin-top: -20px;
content: '\f0b2';
color: $accent-color-1;
}
//UIkit Slidenav
.uk-slidenav {
background: $accent-color-1;
color: #ffffff;
font-size: 20px;
border-radius: 50%;
height: 40px;
line-height: 40px;
width: 40px;
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.08);
&:hover {
background: $accent-color-2;
color: #ffffff !important;
}
&:focus {
color: #ffffff;
}
}
.uk-slidenav-previous {
&:before {
content: "\f104";
}
}
.uk-slidenav-next {
&:before {
content: "\f105";
}
}
.uk-slidenav-position {
.uk-slidenav {
margin-top: -20px;
@include transition(all 0.2s);
}
}
//UIkit Background Overlay
.uk-overlay-background {
background: transparentize(darken($accent-color-2, 20%), 0.2);
}
// Custom Arrows (always visible at the bottom of the particle)
.custom-arrows {
.uk-slidenav-position {
.g-particle-navigation {
text-align: center;
margin-top: 45px;
margin-bottom: -25px;
.uk-slidenav {
opacity: 1;
position: relative;
margin-top: 0;
display: inline-block;
width: 55px;
height: 55px;
line-height: 55px;
&.uk-slidenav-previous {
left: auto;
margin-right: 5px;
}
&.uk-slidenav-next {
right: auto;
margin-left: 5px;
}
}
}
.uk-dotnav {
margin: 50px 0 -25px -15px;
}
}
}
}