| Current Path : /home/zieirix/www/templates/it_medical/scss/medical/ |
| Current File : /home/zieirix/www/templates/it_medical/scss/medical/_particle-overrides.scss |
// Override for Particles Title and Introtext that comes from "UIkit for Gantry5" atom
body {
.g-particle-intro {
margin-bottom: 3rem;
text-align: center;
.g-particle-intro {
margin-bottom: 3rem;
}
.g-main-title {
margin-bottom: 0;
}
.g-title-separator {
height: 4px;
width: 50px;
margin: 25px auto;
border-radius: 4px;
background: $accent-color-1;
&.no-intro-text {
margin: 2.5rem auto 0;
}
}
.g-introtext {
width: 75%;
margin: 0 auto;
}
}
}
body {
// Offcanvas Toggle
.offcanvas-toggle-particle {
&.g-offcanvas-toggle {
color: $header-text-color;
&:hover {
color: $accent-color-1;
}
}
}
// Slideshow particle
.g-slideshow {
.style3 {
.g-slideshow-title {
font-size: 2.5rem;
@include breakpoint(mobile-only) {
font-size: 1.2rem;
}
@include breakpoint(tablet-range) {
font-size: 1.6rem;
}
}
.g-slideshow-desc {
font-size: 18px;
line-height: 32px;
@include breakpoint(mobile-only) {
font-size: 16px;
}
@include breakpoint(tablet-range) {
font-size: 16px;
}
}
.g-slideshow-buttons {
margin: 30px 0 0;
@include breakpoint(mobile-only) {
margin: 20px 0 0;
}
.button {
font-size: 15px;
padding: 0.6rem 2.2rem;
border-radius: 50px;
@include breakpoint(mobile-only) {
padding: 0.5rem 1rem;
}
&.empty {
background: none;
border: 2px solid #ffffff;
color: #ffffff;
&:hover {
background: $accent-color-1;
border-color: $accent-color-1;
color: #ffffff;
}
}
}
}
}
&.pull-text-up {
.uk-flex {
.slideshow-caption {
margin-top: -80px;
}
}
}
}
// Gallery Feature particle
.g-gallery-feature {
&.uk-text-left {
.g-gallery-feature-title {
text-align: left;
&:after {
margin: 25px 0;
}
}
}
.uk-overlay-area:empty::before, .uk-overlay-icon::before {
font-size: 18px;
height: 50px;
width: 50px;
line-height: 50px;
margin-left: -25px;
margin-top: -25px;
}
}
// Custom Buttom for particles published in a section with colored background
.custom-button {
.button {
background: none;
border: 2px solid #ffffff;
color: #ffffff;
@include transition(all 0.2s);
&:hover {
background: $base-title-color;
border-color: $base-title-color;
color: #ffffff;
}
}
}
// Contacts (Footer)
.g-contacts {
&.footer {
background: #ffffff;
padding: 30px;
border-radius: 4px;
position: relative;
margin-top: -7.6rem;
color: $base-text-color;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
.g-contact-title {
color: $base-title-color !important;
}
&.style2 {
.g-contacts-item {
@include breakpoint(tablet-range) {
@include flex-grow(0);
@include flex-basis(100%);
display: block !important;
margin-bottom: 25px;
&:last-child {
margin-bottom: 0;
}
.g-contacts-icon {
margin-top: 0 !important;
}
}
}
}
}
}
// News PRO particle (Footer)
.g-news-pro {
&.footer {
.g-news-pro-item {
.g-news-pro-title {
margin-top: -5px;
}
.g-article-details {
color: $footer-text-color;
}
.uk-overlay-area:empty::before, .uk-overlay-icon::before {
font-size: 16px;
height: 45px;
width: 45px;
line-height: 45px;
margin-left: -22.5px;
margin-top: -22.5px;
background: $accent-color-1;
border-radius: 50%;
}
}
.uk-slidenav {
background: $accent-color-1;
color: #ffffff !important;
&:hover {
background: lighten($accent-color-1, 12%) !important;
}
}
.uk-slidenav-position {
.g-news-pro-nav {
top: -58px;
}
}
}
}
// Portfolio particle
.g-portfolio {
.g-portfolio-filter {
&.uk-subnav-pill > * > * {
border: 2px solid $base-border-color;
border-radius: 50px;
padding: 5px 20px;
&:focus, &:hover {
border: 2px solid $accent-color-1;
background: $accent-color-1;
color: #ffffff;
}
}
.uk-active {
> a {
background: $accent-color-1;
border: 2px solid $accent-color-1;
color: #ffffff;
box-shadow: none;
}
}
}
}
}
// 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: 20px;
height: 55px;
width: 55px;
line-height: 55px;
margin-left: -27.5px;
margin-top: -27.5px;
background: $accent-color-1;
border-radius: 50%;
}
//UIkit Slidenav
.uk-slidenav {
background: #ffffff;
color: $base-text-color;
font-size: 90%;
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-1;
color: #ffffff !important;
}
&:focus {
color: $base-text-color;
}
}
.uk-slidenav-previous {
&:before {
content: "\f060";
}
}
.uk-slidenav-next {
&:before {
content: "\f061";
}
}
.uk-slidenav-position {
.uk-slidenav {
margin-top: -20px;
@include transition(all 0.2s);
}
}
}