/*
Theme Name: Bridge Child
Theme URI: http://bridgelanding.qodeinteractive.com/
Description: A child theme of Bridge Theme
Author: Qode Interactive
Author URI: https://qodeinteractive.com
Version: 1.0.0
Text Domain: bridge
Template: bridge
*/

/* ============================================
   MARIJA RATKOVIĆ — DESIGN SYSTEM
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=Raleway:ital,wght@0,200;0,300;0,400;0,600;0,700;1,300&display=swap');

/* ============================================
   CSS VARIJABLE
   ============================================ */
:root {
  --violet:   #BB44DD;
  --ink:      #111110;
  --charcoal: #2C2C2A;
  --slate:    #7A7672;
  --greige:   #E8E6E1;
  --chalk:    #ECEAE4;
  --white:    #FFFFFF;
}

/* ============================================
   SELEKCIJA
   ============================================ */
::selection      { background: var(--violet); color: var(--white); }
::-moz-selection { background: var(--violet); color: var(--white); }

/* ============================================
   BODY / POZADINA
   ============================================ */
body {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 400 !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  color: var(--charcoal) !important;
  background-color: var(--chalk) !important;
  -webkit-font-smoothing: antialiased;
}

.wrapper,
.content,
.full_width,
.overlapping_content .content > .container,
.more_facts_holder,
.content .container {
  background-color: var(--chalk) !important;
}

.angled-section polygon { fill: var(--chalk) !important; }

/* ============================================
   LINKOVI — zamjena #ff4e24
   ============================================ */
a, p a {
  color: var(--violet) !important;
  font-style: normal;
  font-weight: 400;
}

a:hover, p a:hover,
h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover,
.portfolio_share .social_share_holder a:hover,
.breadcrumb .current,
.breadcrumb a:hover,
.q_icon_with_title .icon_with_title_link,
.q_counter_holder span.counter,
.q_font_awsome_icon i,
.q_font_awsome_icon span,
.q_dropcap,
nav.mobile_menu ul li a:hover,
nav.mobile_menu ul li.active > a,
.footer_top .q_social_icon_holder:hover .simple_social,
.title .text_above_title,
.qode-comparative-features-table .qode-cft-link:hover,
.qode-blog-carousel-titled .qode-bct-post .qode-bct-post-date,
.side_menu a.close_side_menu.qode-side-menu-close-svg:hover {
  color: var(--violet) !important;
}

h1 a:hover,
.filter_holder ul li.active span,
.filter_holder ul li:hover span,
.q_tabs .tabs-nav li.active a:hover,
.q_tabs .tabs-nav li a:hover,
.q_accordion_holder.accordion .ui-accordion-header:hover,
.testimonials .testimonial_text_inner p.testimonial_author span.author_company,
.testimonial_content_inner .testimonial_author .company_position,
.q_social_icon_holder:hover .simple_social,
.social_share_list_holder ul li i:hover,
.latest_post_inner .post_infos a:hover,
.blog_holder article:not(.format-quote):not(.format-link) .post_info a:hover,
.blog_holder article .post_description a:hover,
.blog_like a:hover i,
.blog_like a.liked i,
.comment_holder .comment .text .replay,
.comment_holder .comment .text .comment-reply-link,
aside .widget a:hover,
aside .widget.posts_holder li:hover,
.wpb_widgetised_column .widget a:hover,
.elementor-widget.elementor-widget-sidebar .widget a:hover,
.qode_portfolio_related .projects_holder article .portfolio_description .project_category,
.blog_compound .post_title .category a,
.q_team .q_team_social_holder .q_social_icon_holder:hover .simple_social,
.qode-owl-slider .owl-nav .owl-next:hover .qode-next-icon,
.qode-owl-slider .owl-nav .owl-prev:hover .qode-prev-icon,
.qode-horizontal-timeline .qode-timeline-navigation a.qode-prev,
.qode-horizontal-timeline .qode-timeline-navigation a.qode-next {
  color: var(--violet) !important;
}

/* border-color zamjena */
.qbutton:hover,
.load_more a:hover,
.blog_load_more_button a:hover,
#submit_comment:hover,
.qbutton.white:hover,
input.wpcf7-form-control.wpcf7-submit:not([disabled]):hover,
.box_image_with_border:hover,
.tt_tabs .tt_tabs_navigation .ui-tabs-active a,
.tt_tabs .tt_tabs_navigation li a:hover,
.tt_tabs .tt_tabs_navigation li a,
.tabs_box_navigation.sf-timetable-menu .tabs_box_navigation_selected {
  border-color: var(--violet) !important;
}

/* background-color zamjena */
.q_icon_list i,
.q_progress_bar .progress_content,
.q_progress_bars_vertical .progress_content_outer .progress_content,
.qbutton:hover,
.load_more a:hover,
.blog_load_more_button a:hover,
#submit_comment:hover,
.qbutton.white:hover,
.qbutton.green,
.call_to_action,
.highlight,
.q_dropcap.circle,
.q_dropcap.square,
.q_message,
.q_price_table.active .active_text,
.social_share_dropdown ul li.share_title,
.latest_post_holder .latest_post_date .post_publish_day,
#wp-calendar td#today,
.animated_icon_inner span.animated_icon_back i,
body:not(.search-results) .blog_holder article.format-link .post_text:hover .post_text_inner,
body:not(.search-results) .blog_holder article.format-quote .post_text:hover .post_text_inner,
input.wpcf7-form-control.wpcf7-submit:not([disabled]):hover,
.qode-icon-holder.qode-icon-circle,
.qode-icon-holder.qode-icon-square,
.qode-advanced-tabs .qode-advanced-tabs-nav li,
.qode-accordion-holder .qode-title-holder.ui-state-active,
.qode-accordion-holder .qode-title-holder.ui-state-hover,
.qode-horizontal-timeline .qode-events-wrapper .qode-events .qode-filling-line,
.qode-horizontal-timeline .qode-events-wrapper .qode-events a .circle-outer,
.no-touch .qode-horizontal-timeline .qode-events-wrapper .qode-events a:hover .circle-outer,
.qode-horizontal-timeline .qode-events-wrapper .qode-events a.selected .circle-outer,
.footer_top_holder {
  background-color: var(--violet) !important;
}

/* fill zamjena */
.qode-lazy-preloader svg circle { stroke: var(--violet) !important; }
#qode-portfolio-list-stacked .qode-pls-scroll-note .qode-pls-down svg path { fill: var(--violet) !important; }

/* title border */
.title:not(.title_bottom_border_in_grid) { border-bottom-color: var(--violet) !important; }
.title_border_in_grid_holder { background-color: var(--violet) !important; }
.title .separator { background-color: var(--violet) !important; }

/* interactive project list */
.qode-interactive-project-list .qode-ipl-inner .qode-ipl-left article .qode-ipl-item-inner .qode-ipl-item-text .qode-ipl-title,
.qode-interactive-project-list .qode-ipl-inner .qode-ipl-left article .qode-ipl-item-inner .qode-ipl-item-text .qode-ipl-title-aux { color: var(--violet) !important; -webkit-text-stroke-color: var(--violet) !important; }
.qode-interactive-project-list .qode-ipl-inner .qode-ipl-left article .qode-ipl-item-inner .qode-ipl-item-text .qode-ipl-category-holder a { color: var(--violet) !important; }
.qode-interactive-project-list .qode-ipl-inner .qode-ipl-left article .qode-ipl-item-inner .qode-ipl-item-text .qode-ipl-item-number-holder span { color: var(--violet) !important; border-color: rgba(187,68,221,.2) !important; }
.latest_post_holder.image_on_the_left_boxed .date_hour_holder,
.latest_post_holder.image_on_the_left_boxed .featured .read_more:before { background-color: var(--violet) !important; }
.qode-portfolio-carousel .qode-pc-custom-cursor { color: var(--violet) !important; border-color: var(--violet) !important; }
#qode-portfolio-list-stacked .qode-pls-end-of-scroll .qode-eos-title * { color: var(--violet) !important; -webkit-text-stroke-color: var(--violet) !important; }
#qode-pls-info .qode-pls-title-holder .qode-pls-title a { color: var(--violet) !important; }

/* ============================================
   NASLOVI
   ============================================ */
h1, .h1, h1 a,
.title h1 {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 300 !important;
  font-size: 52px !important;
  line-height: 1.1 !important;
  letter-spacing: 0.02em !important;
  color: var(--ink) !important;
  font-style: normal !important;
  text-transform: none !important;
}

h2, .h2, h2 a {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 300 !important;
  font-size: 36px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.02em !important;
  color: var(--ink) !important;
  font-style: normal !important;
  text-transform: none !important;
}

h3, .h3, h3 a,
body.qode-overridden-elementors-fonts .elementor-widget-heading h3.elementor-heading-title {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 400 !important;
  font-size: 24px !important;
  line-height: 1.3 !important;
  letter-spacing: 0.02em !important;
  color: var(--ink) !important;
  font-style: normal !important;
  text-transform: none !important;
}

h4, .h4, h4 a,
body.qode-overridden-elementors-fonts .elementor-widget-heading h4.elementor-heading-title {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  letter-spacing: 0.14em !important;
  color: var(--ink) !important;
  font-style: normal !important;
  text-transform: lowercase !important;
}

h5, .h5, h5 a,
body.qode-overridden-elementors-fonts .elementor-widget-heading h5.elementor-heading-title,
.q_icon_with_title .icon_text_holder h5.icon_title {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  letter-spacing: 0.22em !important;
  color: var(--violet) !important;
  font-style: normal !important;
  text-transform: uppercase !important;
}

h6, .h6, h6 a,
body.qode-overridden-elementors-fonts .elementor-widget-heading h6.elementor-heading-title {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 400 !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  letter-spacing: 0.06em !important;
  color: var(--charcoal) !important;
  font-style: normal !important;
  text-transform: none !important;
}

p,
body.qode-overridden-elementors-fonts .elementor-widget-heading p.elementor-heading-title {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 400 !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  color: var(--charcoal) !important;
}

.filter_holder ul li span,
blockquote h5,
.q_social_icon_holder .simple_social,
aside .widget a,
aside .widget p,
aside .widget li,
aside .widget span {
  font-family: 'Raleway', sans-serif !important;
  color: var(--slate) !important;
}

/* ============================================
   HEADER / NAV
   ============================================ */
.header_bottom,
.header_top,
.fixed_top_header .bottom_header {
  background-color: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

nav.main_menu > ul > li > a {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300 !important;
  font-size: 12px !important;
  line-height: 107px !important;
  letter-spacing: 0.06em !important;
  text-transform: lowercase !important;
  color: var(--ink) !important;
  font-style: normal !important;
  padding: 0 28px !important;
}

nav.main_menu ul li:hover a,
nav.main_menu ul li a:hover {
  color: var(--violet) !important;
}

nav.main_menu ul li.active > a {
  color: var(--violet) !important;
  text-decoration: line-through !important;
  text-decoration-thickness: 1px !important;
}

nav.main_menu ul li a span.underline_dash,
nav.main_menu ul li.active a span.underline_dash,
nav.main_menu ul li:hover a span.underline_dash {
  background-color: var(--violet) !important;
}

/* Mobile */
nav.mobile_menu ul li a,
nav.mobile_menu ul li h3 {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300 !important;
  font-size: 14px !important;
  letter-spacing: 0.06em !important;
  text-transform: lowercase !important;
  color: var(--ink) !important;
}

nav.mobile_menu ul li span.mobile_arrow i { color: var(--violet) !important; }
nav.mobile_menu ul li a:hover,
nav.mobile_menu ul li.active > a,
nav.mobile_menu ul li.current-menu-item > a { color: var(--violet) !important; }

@media only screen and (max-width: 1000px) {
  .header_bottom,
  nav.mobile_menu,
  header.fixed_top_header .top_header {
    background-color: var(--chalk) !important;
  }
}

/* Side menu button */
.side_menu_button > a,
.mobile_menu_button span,
.fixed_top_header .side_menu_button > a,
.popup_menu .line { color: var(--violet) !important; }
.popup_menu .line,
.popup_menu .line:after,
.popup_menu .line:before { background-color: var(--violet) !important; }

/* ============================================
   LOGO ANIMACIJA
   ============================================ */
.q_logo a { text-decoration: none !important; }

.mr-logo-wrap { display: flex; flex-direction: column; }

.mr-logo-text {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 300;
  font-size: 20px;
  letter-spacing: 0.04em;
  color: var(--ink);
  display: flex;
  align-items: baseline;
  white-space: nowrap;
}

.mr-cursor {
  display: inline-block;
  width: 1.5px;
  height: 0.72em;
  background: var(--violet);
  margin-left: 1px;
  vertical-align: baseline;
  position: relative;
  top: 0.05em;
  animation: mr-blink 0.6s step-end infinite;
}

@keyframes mr-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

/* ============================================
   DUGMAD
   ============================================ */
.qbutton,
.qbutton.medium,
#submit_comment,
.load_more a,
.blog_load_more_button a,
.post-password-form input[type='submit'],
input.wpcf7-form-control.wpcf7-submit,
input.wpcf7-form-control.wpcf7-submit:not([disabled]) {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300 !important;
  font-size: 11px !important;
  line-height: normal !important;
  height: auto !important;
  letter-spacing: 0.18em !important;
  text-transform: lowercase !important;
  color: var(--ink) !important;
  border-color: var(--greige) !important;
  background-color: transparent !important;
  border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  -webkit-border-radius: 0 !important;
  border-width: 1px !important;
  padding: 10px 22px !important;
}

.qbutton:hover,
.qbutton.medium:hover,
#submit_comment:hover,
.load_more a:hover,
.blog_load_more_button a:hover,
.post-password-form input[type='submit']:hover,
input.wpcf7-form-control.wpcf7-submit:not([disabled]):hover {
  color: var(--white) !important;
  background-color: var(--violet) !important;
  border-color: var(--violet) !important;
}

/* ============================================
   FOOTER
   ============================================ */
.footer_top_holder,
footer #lang_sel > ul > li > a,
footer #lang_sel_click > ul > li > a {
  background-color: var(--ink) !important;
}

.footer_top,
.footer_top.footer_top_full {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

.footer_top .column_inner > div h2,
.footer_top .column_inner > div h3,
.footer_top .column_inner > div h4,
.footer_top .column_inner > div h5,
.footer_top .column_inner > div h6 {
  color: var(--white) !important;
  font-family: 'Raleway', sans-serif !important;
}

.footer_top,
.footer_top p,
.footer_top span,
.footer_top li,
.footer_top .textwidget,
.footer_top .widget_recent_entries > ul > li > span {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300 !important;
  font-size: 10px !important;
  letter-spacing: 0.08em !important;
  line-height: 1.7 !important;
  color: var(--slate) !important;
  text-transform: none !important;
  font-style: normal !important;
}

.footer_top a:not(.qbutton) { color: var(--slate) !important; }
.footer_top a:not(.qbutton):hover { color: var(--violet) !important; }
.footer_top .q_social_icon_holder .simple_social { color: var(--slate) !important; }
.footer_top .q_social_icon_holder:hover .simple_social { color: var(--violet) !important; }

.footer_bottom_holder { background-color: var(--white) !important; }

/* ============================================
   PORTFOLIO
   ============================================ */
.portfolio_single a,
.portfolio_navigation .portfolio_next a,
.portfolio_navigation .portfolio_prev a,
.portfolio_navigation .portfolio_next a:hover,
.portfolio_navigation .portfolio_prev a:hover {
  color: var(--violet) !important;
  background-color: transparent !important;
}

.portfolio_navigation {
  padding: 0 0 80px !important;
}

.portfolio_navigation.navigation_title .post_info span.categories {
  color: var(--violet) !important;
}